<template>
  <div>
    <search-table
      ref="table"
      :searchItems="searchItems"
      :tableTitle="'供应商列表'"
      :tableRowKey="'supplierId'"
      :tableColumns="columns"
      :tableRemoteParams="remoteParams"
      :tableExtraBtns="tableEtraBtns"
      :tableRemoteUrl="remoteUrl"
      :tableOperators="tableOperators"
    >
    </search-table>
  </div>
</template>

<script>
import SearchTable from '../../components/search-table'
import { dictTypeFormItems } from './config/formItems'
import { columns } from './config/columns'
import { dictTypeSearchItems } from './config/searchItems'
import API from './api/custom'
import { sorter } from '../../utils/sort'

columns.forEach(item => {
  item.ellipsis = true
})
export default {
  components: {
    'search-table': SearchTable
  },
  watch: {
    '$store.getters.warehouse': {
      handler(val) {
        this.remoteParams.warehouseId = val.warehouseId
      },
      deep: true
    }
  },

  data() {
    return {
      searchItems: dictTypeSearchItems(this),
      columns: null,
      data: null,
      selectedRowKeys: [],
      remoteUrl: {
        method: API.findAll.method,
        url: API.findAll.url
      },
      remoteParams: { warehouseId: this.$store.getters.warehouse.warehouseId },
      isShowModal: false,
      selectedItem: null,
      dictTypeFormItems: dictTypeFormItems,
      confirmLoading: false,
      error: '',

      tableEtraBtns: [
        {
          label: '新增',
          vaction: 'add',
          click: () => {
            this.$emit('changeStep', { step: 2, item: null })
          }
        },
        {
          label: '批量删除',
          vaction: 'batchdel',
          click: () => {
            let list = this.$refs.table.getSelectedItem()
            list = list.map(item => {
              return item.supplierId
            })
            if (list.length > 0) {
              this.$confirm({
                content: '是否删除选中项?',
                onOk: () => {
                  this.handleDelete(list.join(','))
                }
              })
            } else {
              this.$message.warning('请先勾选数据')
            }
          }
        }
        // { label: '导出', click: () => {} },
        // { label: '导入', click: () => {} },
        // { label: '下载模板', click: () => {} }
      ],
      tableOperators: [
        {
          label: '修改',
          vaction: 'update',
          click: record => {
            this.uploadItem(record)
          }
        },
        {
          label: '删除',
          vaction: 'del',
          click: record => {
            this.deleteItem(record)
          }
        }
      ]
    }
  },
  created() {
    this.columns = sorter(columns)
  },
  methods: {
    checkedChange(checked, item) {
      // item.isEnable = checked ? 1 : 0;
      // uploadItem(item).then(res => {
      //   if (!res.success) {
      //     this.$message.error(res.message);
      //     return;
      //   }
      //   this.$refs.table.reload();
      // });
    },

    uploadItem(item) {
      let columns = this.columns
      columns = columns.slice(1, this.columns.length - 1)
      let a = {}
      Object.keys(item).forEach(item1 => {
        a[item1] = item[item1]
      })
      this.$emit('changeStep', { step: 2, item: a })
    },

    deleteItem(item) {
      this.$confirm({
        content: '是否删除选中项?',
        onOk: () => {
          this.handleDelete(item.supplierId)
        }
      })
    },
    enterdetail(item) {
      this.$emit('changeStep', { step: 2, item: item })
    },
    handleOk() {
      this.$refs.editorForm.form.validateFields((errs, vals) => {
        if (errs) {
          return
        }
        // vals.isEnable = vals.isEnable ? 1 : 0;
        if (this.selectedItem) {
          vals.typeId = this.selectedItem.typeId
          this.handleUploadItem(vals)
        } else {
          this.handleAddItem(vals)
        }
      })
    },

    handleCancel() {
      this.isShowModal = false
      this.selectedItem = null
      this.$refs.editorForm.form.resetFields()
    },

    handleAddItem(params) {
      addItem(params).then(res => {
        if (!res.success) {
          this.$message.error(res.message)
          return
        }
        this.$refs.table.reload()
        this.$message.success('新增成功')
        this.handleCancel()
      })
    },

    handleUploadItem(params) {
      uploadItem(params).then(res => {
        if (!res.success) {
          this.$message.error(res.message)
          return
        }
        this.$refs.table.reload()
        this.$message.success('修改成功')
        this.handleCancel()
      })
    },

    async handleDelete(ids) {
      if (typeof ids === 'string') {
        ids = ids.split(',')
      }
      let res = await API.deleteCargoById(ids)
      if (res.success) {
        this.$refs.table.reload()
        this.$message.success('删除成功')
      } else {
        this.$message.error(res.message)
        return
      }
    }
  }
}
</script>

<style></style>
