<template>
  <div class="Inbound">
    <p-card title="入库界面" :style="{ borderBottom: 'none' }">
      <div class="plg-inner-form-mb">
        <p-grid-form
          ref="search"
          :span="6"
          :label-col="{ span: 6 }"
          :items="items"
          @submit="hanlderSubmit"
        ></p-grid-form>
      </div>
      <p-table
        ref="table"
        rowKey="id"
        :bordered="true"
        :autoLoad="true"
        :scroll="{ x: 1200 }"
        :has-row-count="true"
        :row-selection="rowSelection"
        :filterDropdownColum="false"
        :colorTransformRow="false"
        :remoteUrl="remoteUrl"
        :columns="columns"
        :data-source.sync="data"
        :remoteData="remoteParams"
        :remoteParams="remoteParams"
        :selectedRowKeys.sync="selectedRowKeys"
      >
        <template slot="action" slot-scope="text, record">
          <a @click="Initialize(record)">初始化</a>
          <a-divider type="vertical" />
          <a @click="cancelTask(record)">取消任务</a>
        </template>
      </p-table>
    </p-card>
  </div>
</template>

<script>
import { items, columns,remoteUrl } from './config'
import { initialize, cancelTask } from './api'
export default {
  name: 'index',
  data(){
    return{
      items: items(this),
      columns,
      remoteUrl,
      data: [],
      selectedRowKeys: [],
      remoteParams: {}
    }
  },
  computed: {
    rowSelection() {
      let _this = this
      return {
        selectedRowKeys: _this.selectedRowKeys,
        onSelectAll(selected, selectedRows, changeRows) {
          var checked = selected
          var key = changeRows.map(item => item.id)
        },
        onSelect(record, selected, selectedRows, nativeEvent) {
          var checked = selected
          var key = record.id
        },
        onChange(selectedRowKeys, selectedRows) {
          _this.selectedRows = selectedRows
          _this.selectedRowKeys = selectedRowKeys
        }
      }
    }
  },
  methods: {
    getData(params) {
      this.$refs.table.reload()
    },
    hanlderSubmit(event, form) {
      event.preventDefault()
      form.validateFields((err, values) => {
        if (!err) {
          this.remoteParams = values
        }
      })
    },
    Initialize(data){
      let _this = this
      this.$confirm({
        title: '您确定要初始化吗?',
        onOk() {
          initialize(data).then(res=>{
            let msg = res.data
            if (res.success) {
              _this.$message.success(msg || '操作成功')
            } else {
              _this.$exception(res)
            }
            _this.getData()
          })
        },
        onCancel() { },
      });
    },
    cancelTask(data){
      let _this = this
      this.$confirm({
        title: '您确定要取消任务吗?',
        onOk() {
          cancelTask(data).then(res=>{
            let msg = res.data
            if (res.success) {
              _this.$message.success(msg || '操作成功')
            } else {
              _this.$exception(res)
            }
            _this.getData()
          })
        },
        onCancel() { },
      });
    }
  }
}
</script>

<style scoped>

</style>