<template>
  <div>
    <!-- 入库任务单管理 -->
    <p-card title="入库任务单管理">
      <span slot="extra">
        <!-- <p-button type="primary" style="margin-right:10px" @click="showmodel()">添加</p-button> -->
      </span>
      <p-grid-form :label-col="{ span: 8 }" :span="8" :items="config.items" @submit="hanlderSubmitMaintable" />
      <p-table
        ref="table"
        row-key="id"
        bordered
        :columns="config.columns"
        :remoteUrl="config.remoteUrl"
        :remoteParams="remoteParams"
        :rowSelectType="false"
        :data-source="data"
        :scroll="{ x: 1000 }"
      >
        <!-- detailCount -->

        <template slot="detailSize" slot-scope="text, record">
          <a class="count" @click="showmodeldetailCount(text, record)">{{ text }}</a>
        </template>
        <template slot="operation" slot-scope="text, record">
          <!-- {{ text ? '禁用' : '启用' }} -->
          <a @click="showmodel(text)">调整优先级</a>
          <!-- <a-divider type="vertical" />
          <a @click="del(text)">删除</a> -->
        </template>
      </p-table>
    </p-card>

    <p-modal
      title="详情"
      width="50%"
      :visible="visible"
      :confirm-loading="confirmLoading"
      @ok="handleOk"
      @cancel="handleCancel"
    >
      <p-grid-form :label-col="{ span: 8 }" ref="model" :span="8" :items="config.Modelitems" @submit="hanlderSubmit" />
    </p-modal>

    <p-modal
      title="任务数明细"
      width="80%"
      :visible="visibledetailCount"
      :confirm-loading="confirmLoading"
      @ok="handleCancel"
      @cancel="handleCancel"
    >
      <!-- <p-grid-form  :label-col="{ span: 8 }":span="8" :items="detailCount.items" @submit="hanlderSubmit" /> -->
      <p-table
        row-key="id"
        bordered
        :columns="detailCount.columns"
        :rowSelectType="false"
        :data-source="detailCountdata"
        :scroll="{ x: 2500 }"
      >
        <template slot="subSize" slot-scope="text, record">
          <a @click="showmosubSize(text, record)">{{ text }}</a>
        </template>
        <!-- subSize -->
      </p-table>
    </p-modal>

    <p-modal
      title="子任务数明细"
      width="70%"
      :visible="inboundTaskDetailSubListvisible"
      :confirm-loading="confirmLoading"
      @ok="handleCancelsbu"
      @cancel="handleCancelsbu"
    >
      <!-- <p-grid-form  :label-col="{ span: 8 }":span="8" :items="detailCount.items" @submit="hanlderSubmit" /> -->
      <p-table
        row-key="id"
        bordered
        :columns="detailCount.inboundTaskDetailSubListcolumns"
        :rowSelectType="false"
        :data-source="inboundTaskDetailSubList"
        :scroll="{ x: 2500 }"
      >
        <template slot="subSize" slot-scope="text, record">
          <a @click="showmosubSize(text, record)">{{ text }}</a>
        </template>
        <!-- subSize -->
      </p-table>
    </p-modal>

    <!-- inboundTaskDetailSubListvisible -->
  </div>
</template>

<script>
import { diffOption } from '@/views/kzyWMS/utils/index.js'
import config from './config.js'
import { add, deletes, update, findDetailById } from './api'
import { remote } from '@/views/EIS/remote/index.js'
const base = '/api/service-ai-eis-business-center-eistest'
export default {
  data() {
    return {
      config: config(this),
      data: [],
      inboundTaskDetailSubList: [],
      detailCount: {
        columns: [
          {
            dataIndex: 'id',
            key: 'id',
            align: 'center',
            width: 150,
            ellipsis: true,
            title: 'ID',
          },
          {
            title: '容器号',
            dataIndex: 'containerNo',
            ellipsis: true,
            align: 'center',
            width: 150,
            key: 'containerNo',
          },
          {
            title: '容器类型',
            dataIndex: 'containerType',
            ellipsis: true,
            align: 'center',
            width: 150,
            key: 'containerType',
            ...remote('eis_inv_container_store_container_type'),
          },
          {
            title: '任务单状态',
            key: '任务单明细状态',
            width: 150,
            ellipsis: true,
            dataIndex: 'detailStatus',
            align: 'center',
            ...remote('detailStatus'),
          },
          //   {
          //     title: '任务完成时间',
          //     dataIndex: 'finishTime',
          //     align: 'center',
          //     ellipsis: true,
          //     width: 150,
          //     key: 'finishTime'
          //     // customRender(text) {
          //     //   text == 0 && (text = '不索取')
          //     //   text == 1 && (text = '索取')
          //     //   return text
          //     // }
          //   },
          {
            title: '入库任务单id',
            key: 'inboundTaskId',
            width: 150,
            ellipsis: true,
            dataIndex: 'inboundTaskId',
            align: 'center',
          },
          {
            title: '入库口编号',
            dataIndex: 'portNo',
            align: 'center',
            width: 150,
            key: 'portNo',
          },
          {
            title: '起始区域',
            width: 150,
            dataIndex: 'sourceArea',
            align: 'center',
            key: 'sourceArea',
          },
          {
            title: '起始坐标',
            dataIndex: 'sourceLocation',
            width: 150,
            align: 'center',
            key: 'sourceLocation',
          },
          {
            title: '任务开始时间',
            dataIndex: 'startTime',
            width: 150,
            align: 'center',
            key: 'startTime',
          },
          {
            title: '子任务数量',
            dataIndex: 'subSize',
            width: 150,
            scopedSlots: { customRender: 'subSize' },
            align: 'center',
            key: 'subSize',
          },
          {
            title: '任务号',
            dataIndex: 'taskId',
            width: 150,
            align: 'center',
            key: 'taskId',
          },
          {
            title: '入库重量',
            dataIndex: 'weight',
            width: 150,
            align: 'center',
            key: 'weight',
          },
        ],
        inboundTaskDetailSubListcolumns: [
          {
            dataIndex: 'id',
            key: 'id',
            align: 'center',
            width: 150,
            ellipsis: true,
            title: 'ID',
          },
          {
            title: '子容器号',
            dataIndex: 'containerNoSub',
            ellipsis: true,
            align: 'center',
            width: 150,
            key: 'containerNoSub',
          },
          {
            title: '创建时间',
            dataIndex: 'createTime',
            ellipsis: true,
            align: 'center',
            width: 150,
            key: 'createTime',
          },
          {
            title: '入库任务单明细id',
            key: 'inboundTaskDetailId',
            width: 150,
            ellipsis: true,
            dataIndex: 'inboundTaskDetailId',
            align: 'center',
          },
          {
            title: '商品id',
            dataIndex: 'itemId',
            align: 'center',
            ellipsis: true,
            width: 150,
            key: 'itemId',
            // customRender(text) {
            //   text == 0 && (text = '不索取')
            //   text == 1 && (text = '索取')
            //   return text
            // }
          },
          {
            title: '批次id',
            key: 'lotId',
            width: 150,
            ellipsis: true,
            dataIndex: 'lotId',
            align: 'center',
          },
          {
            title: '数量',
            dataIndex: 'qty',
            align: 'center',
            width: 150,
            key: 'qty',
          },
        ],
      },
      detailCountdata: [],
      detailCountremoteParams: {
        containerNo: '',
        id: '',
      },
      type: true,
      remoteParams: {
        createTime: '',
        createTimeFrom: '',
        createTimeTo: '',
        detailCount: '',
        priority: '',
        status: '',
        taskFinishTime: '',
        taskStartTime: '',
        typeNo: '',
        upperSystemTaskId: '',
      },
      visible: false,
      visibledetailCount: false,
      inboundTaskDetailSubListvisible: false,
      confirmLoading: false,
    }
  },
  mounted() {
    // this.getinfo()
  },
  created() {
    diffOption(this.config.columns).then((res) => {
      this.config.columns = res
    })

    diffOption(this.detailCount.columns).then((res) => {
      this.detailCount.columns = res
    })
  },
  methods: {
    //查看子任务
    showmosubSize(text, record) {
      console.log(text, record.inboundTaskDetailSubList)
      this.inboundTaskDetailSubList = record.inboundTaskDetailSubList
      this.inboundTaskDetailSubListvisible = true
    },
    //查询任务数明细
    async showmodeldetailCount(text, record) {
      console.log(text, record)
      let data = record.inboundTaskDetailVoList
      this.detailCountdata = data
      //   this.detailCountremoteParams.id = record.id
      this.visibledetailCount = true
      //   this.detailCountremoteParams = { ...this.detailCountremoteParams }
    },
    hanlderSubmit(e, form) {
      e.preventDefault()
      form.validateFields((error, values) => {
        console.log(error, values, 'valuesvaluesvaluesvaluesvalues')
        // this.queryName = values.name
        // this.queryType = values.type
        // this.getlistCompanyByAuthId()
        if (!error) {
          this.detailCountremoteParams = { ...this.detailCountremoteParams, ...values }
        }
      })
    },
    hanlderSubmitMaintable(e, form) {
      e.preventDefault()
      form.validateFields((error, values) => {
        // console.log(error, values, 'valuesvaluesvaluesvaluesvalues')
        // this.queryName = values.name
        // this.queryType = values.type
        // this.getlistCompanyByAuthId()
        if (!error) {
          this.remoteParams = { ...this.remoteParams, ...values }
        }
      })
    },
    handleOk(e) {
      console.log(this.$refs.model)
      this.$refs.model.form.validateFields(async (err, value) => {
        if (!err) {
          console.log(value)
          this.confirmLoading = true
          if (this.type) {
            let res = await update(value)
            console.log(res)
            if (res.success) {
              this.$message.success(res.message)
              this.visible = false
              this.remoteParams = { ...this.remoteParams }
            } else {
              this.$exception(res)
            }
          } else {
            let res = await add(value)
            console.log(res)

            if (res.success) {
              this.$message.success(res.message)
              this.visible = false
              this.remoteParams = { ...this.remoteParams }
            } else {
              this.$exception(res)
            }
          }

          this.confirmLoading = false
          //
        }
      })
    },
    handleCancel(e) {
      console.log('Clicked cancel button')
      this.visible = false
      this.visibledetailCount = false
    },
    handleCancelsbu() {
      this.inboundTaskDetailSubListvisible = false
    },
    //点击弹出
    showmodel(data) {
      console.log(data)

      this.visible = true
      this.$nextTick(() => {
        this.$refs.model.form.setFieldsValue(data)
      })
      //   if (data) {
      //     this.config.Modelitems.forEach(item => {
      //       item.name == 'areaType' && (item.disabled = true)
      //       item.name == 'areaNo' && (item.disabled = true)
      //     })
      //     this.$nextTick(() => {
      //       this.$refs.model.form.setFieldsValue(data)
      //     })
      //     this.type = true
      //   } else {
      //     this.config.Modelitemsupdate.forEach(item => {
      //       item.disabled = false
      //     })
      //     this.config.Modelitems.forEach(item => {
      //       item.disabled = false
      //     })
      //     console.log(this.config.Modelitems)
      //     this.$nextTick(() => {
      //       this.$refs.model.form.resetFields()
      //     })
      //     this.type = false
      //   }
    },
    del(text) {
      let that = this
      console.log(text)
      this.$confirm({
        title: '确定是否要删除?',
        content: '',
        async onOk() {
          let res = await deletes({ areaNo: text.areaNo })
          if (res.success) {
            that.$message.success('删除成功')
            that.remoteParams = { ...that.remoteParams }
          } else {
            that.$exception(res)
          }
        },
        onCancel() {},
      })
    },
  },
}
</script>

<style lang="less" scoped>
.count {
  padding: 10px;
  padding-left: 25px;
  padding-right: 25px;
}
</style>
