<template>
  <div>
    <!-- <p-card title="复核员业务关系">

     </p-card> -->
    <search-table
      ref="searchTable"
      :searchItems="searchItems"
      tableTitle="复核人员安排表"
      tableRowKey="workId"
      :tableColumns="columns"
      :tableRemoteUrl="{ url: upcloud_base_wh_control + '/checkWorkGroup/page', method: 'get' }"
      :tableRemoteParams="remoteParams"
      :tableExtraBtns="tableEtraBtns"
      :tableOperators="tableOperators"
    >
    </search-table>

    <p-modal v-model="visible" :title="detailItem ? '编辑' : '新增'" width="80%" @ok="handleOk" @cancel="handleCancel">
      <p-grid-form ref="form" :span="6" :items="formItems" />

      <a-row style="margin-top: 20px">
        <a-col :span="8" style="padding: 0 10px">
          <p-table
            ref="table1"
            :bordered="true"
            :filterDropdownColum="false"
            :colorTransformRow="false"
            dragle
            auto-width
            :pagination="false"
            :hasRowSelectCheck="true"
            :scroll="{ y: 400 }"
            :rowSelectType="2"
            :row-key="'dictCode'"
            :columns="tableCols1"
            :data-source.sync="tableData1"
            :selectedRowKeys.sync="selectedRowKeys1"
            @selectChange="
              (selectedRowKeys, selectedRows) => selectedChange('itemCategoryCodes', selectedRowKeys, selectedRows)
            "
          />
        </a-col>
        <a-col :span="16" style="padding: 0 10px">
          <p-table
            ref="table2"
            :bordered="true"
            :filterDropdownColum="false"
            :colorTransformRow="false"
            dragle
            auto-width
            :pagination="false"
            :hasRowSelectCheck="true"
            :autoLoad="false"
            :scroll="{ y: 400 }"
            :rowSelectType="2"
            :row-key="'stationId'"
            :columns="tableCols2"
            :data-source.sync="tableData2"
            :selectedRowKeys.sync="selectedRowKeys2"
            @selectChange="
              (selectedRowKeys, selectedRows) => selectedChange('stationIds', selectedRowKeys, selectedRows)
            "
          >
            <span slot="stationType" slot-scope="text">
              <span>{{ remoteDataFun(text, 'stationtype') }}</span>
            </span>
            <span slot="stageGroup" slot-scope="text">
              <span>{{ remoteDataFun(text, 'stationattr1') }}</span>
            </span>
            <span slot="stageType" slot-scope="text">
              <span>{{ remoteDataFun(text, 'stationattr2') }}</span>
            </span>
          </p-table>
        </a-col>
      </a-row>
    </p-modal>
  </div>
</template>

<script>
import SearchTable from '../../components/search-table'
import { searchItems } from './config/searchItems'
import { formItems, tableCols1, tableCols2 } from './config/modalConfig'
import { columns } from './config/columns'
import { addItem, updateItem, delItems, queryItemCategoryList, queryWorkstationList, dict_listbytype } from './api'
import { sorter } from '../../utils/sort'
import { diffOption, forSelectText } from '@/views/kzyWMS/utils/index.js'
import { warehouse } from '../../SearchModal/warehouse'
import { upcloud_base_wh_control } from '@/config/serviceSettings'

export default {
  components: {
    'search-table': SearchTable,
  },

  data() {
    return {
      upcloud_base_wh_control,
      searchItems: searchItems,
      columns: null,
      remoteParams: { businesstype: '2016' },
      detailItem: null,
      tableEtraBtns: [
        {
          label: '新增',
          click: () => {
            this.showItem()
          },
        },
        {
          label: '批量删除',
          click: () => {
            this.deleteList()
          },
        },
      ],
      tableOperators: [
        {
          label: '修改',
          click: (record) => {
            this.showItem(record)
          },
        },
        {
          label: '删除',
          click: (record) => {
            this.deleteItem(record)
          },
        },
      ],
      // modal
      visible: false,
      formItems: formItems(this),
      tableCols1: tableCols1,
      tableCols2: tableCols2,
      tableData1: [],
      tableData2: [], // warehouseId=599581702716788736    isEnable=1
      selectedRowKeys1: [],
      selectedRowKeys2: [],
    }
  },

  created() {
    diffOption(columns(this)).then((res) => {
      console.log(res)
      this.columns = sorter(res)
    })
    queryItemCategoryList().then((res) => {
      if (!res.success) {
        this.$exception(res.message)
        return
      }
      this.tableData1 = res.data
    })
    this.dict_WH_TYPE() //数据字典 仓库类型
  },

  mounted() {
    this.$nextTick(() => {
      let warehouse = this.$store.state.user.warehouse
      this.$refs.searchTable.$refs.form.form.setFieldsValue(warehouse)
    })
  },

  methods: {
    dict_WH_TYPE() {
      dict_listbytype({ dicttypeCodes: 'stationattr1,stationattr2,stationtype' }).then((res) => {
        if (res.success) {
          this.dataType = res.data
        }
      })
    },
    remoteDataFun(text, dicttypeCode) {
      let temp = this.dataType[dicttypeCode].find((v) => v.dictCode == text)
      console.log(text, temp, this.dataType, 'this.dataTypethis.dataType')
      return temp ? temp.dictName : text
    },
    showItem(record) {
      this.detailItem = record || null
      this.visible = true
      if (record) {
        this.$nextTick(() => {
          // let warehouse = this.$store.state.user.warehouse;
          this.$refs.form.form.disableItem(['workercode', 'warehouseName'])
          this.$refs.form.form.setFieldsValue({
            ...record,
            jobnumber: record.workercode,
            locname: record.personName,
          })
          if (record.itemCategoryCodes) this.selectedRowKeys1 = record.itemCategoryCodes.split(',')
          if (record.stationIds) this.selectedRowKeys2 = record.stationIds.split(',')
          this.getTableDataList()
        })
      } else {
        this.$nextTick(() => {
          this.$refs.form.form.enableItem(['workercode', 'warehouseName'])
          this.$refs.form.form.resetFields()
        })
      }
    },

    selectedChange(key, selectedRowKeys, selectedRows) {
      this.$refs.form.form.setFieldsValue({
        [key]: selectedRowKeys && selectedRowKeys.length > 0 ? selectedRowKeys.join(',') : null,
      })
    },

    formWarehouseChange() {
      this.getTableDataList()
    },

    handleOk() {
      this.$refs.form.form.validateFields((err, value) => {
        if (err) {
          return
        }
        if (!value.itemCategoryCodes) {
          this.$message.warning('请选择商品大类')
          return
        }
        if (!value.stationIds) {
          this.$message.warning('请选择复核台')
          return
        }
        if (this.detailItem) {
          this.handleUpdate({ ...value, workId: this.detailItem.workId })
        } else {
          this.handleAdd(value)
        }
      })
      // this.$emit('input', false);
    },

    handleCancel() {
      this.detailItem = null
      this.selectedRowKeys1 = []
      this.selectedRowKeys2 = []
      this.visible = false
    },

    deleteItem(item) {
      this.$confirm({
        content: this.$lang('是否删除选中项?'),
        onOk: () => {
          return this.handleDelete([item.workId])
        },
      })
    },

    deleteList() {
      let list = this.$refs.searchTable.getSelectedItem()
      if (list.length == 0) {
        this.$message.error(this.$lang('请选择要删除的项'))
        return
      }
      let ids = []
      list.forEach((t) => ids.push(t.workId))
      this.$confirm({
        content: this.$lang('是否删除选中项?'),
        onOk: () => {
          return this.handleDelete(ids)
        },
      })
    },

    handleAdd(p) {
      return addItem(p).then((res) => {
        if (!res.success) {
          this.$exception(res.message)
          return
        }
        this.$refs.searchTable.reload()
        this.$message.success(this.$lang('新增成功'))
        this.handleCancel()
      })
    },

    handleUpdate(p) {
      return updateItem(p).then((res) => {
        if (!res.success) {
          this.$exception(res.message)
          return
        }
        this.$refs.searchTable.reload()
        this.$message.success(this.$lang('修改成功'))
        this.handleCancel()
      })
    },

    handleDelete(ids) {
      return delItems(ids).then((res) => {
        if (!res.success) {
          this.$exception(res.message)
          return
        }
        this.$refs.searchTable.reload()
        this.$message.success(this.$lang('删除成功'))
      })
    },

    getTableDataList() {
      let vals = this.$refs.form.form.getFieldsValue()
      console.log(vals, 'valsvalsvalsvalsvalsvalsvals')
      queryWorkstationList({ warehouseId: vals.warehouseId, isEnable: 1 }).then((res) => {
        if (!res.success) {
          this.$exception(res.message)
          return
        }
        this.tableData2 = res.data
      })
    },
  },
}
</script>

<style></style>
