<!--
@name: 已派车-运单组件
@author: 张泽贤
@time: 2022-04-29
-->
<template>
  <p-spin :spinning="spinning">
    <p-card>
      <a-space slot="extra" v-show="editType === 'edit'">

        <p-button type="primary" @click="onAdd" :disabled="!editData.loadingBillId || editData.status > 10">添加运单</p-button>
        <p-button type="danger" @click="onDel" :disabled="!waybillSelectedRowKeys.length || editData.status > 110">剔除运单</p-button>
        <p-button type="primary" @click="onMove" :disabled="!waybillSelectedRowKeys.length || editData.status > 10">移动</p-button>

      </a-space>

      <t-table
        ref="waybillTable"
        dragle
        bordered
        :extendedObjectCode="'15'"
        row-key="shipbillId"
        :id="$route.meta.menuId + '_waybillList'"
        :scroll="{ x: true}"
         :vScrollX="{enabled:true}"
         :vScrollY="{enabled:true,rows:4}"
        :columns="mx_columns"
        :data-source="waybillDataSource"
        :remote-url="waybillListRemoteUrl"
        :remoteData="waybillListParams"
        :rowSelectType="editType === 'edit' ? 2 : false"
        @selectChange="selectChange"
        :autoLoad="false"
      >
        <template slot="operation" slot-scope="text, record" v-if="editType === 'edit'">
          <p-input-number v-model="record.shippingOrder" :precision="0" style="width: 100%" :disabled="editData.status > 10" />
        </template>
      </t-table>

      <p-search-modal v-bind="setQueryFormItmes.waybillAttr" @change="(...args) => onFormBlur('waybill', ...args)" v-show="false" :open="waybillDialog" />
      <p-search-modal v-bind="setQueryFormItmes.dispatchAttr" @change="(...args) => onFormBlur('dispatch', ...args)" v-show="false" :open="dispatchDialog" />
    </p-card>
  </p-spin>
</template>

<script>
import { resultExtendedField } from '@/blocks/utils'
import { setMainColumns, setGoodsColums, setPackColums } from '@/blocks/components/scheduling/js/table/tableConfig.js'

import { setQueryFormItmes } from '../js/form'
import { waybillListRemoteUrl, sendcar_add_detail, sendcar_delete_detail, sendcar_mobile_detail } from '../js/api'

export default {
  props: {
    editType: {
      type: String,
      default: 'edit',
    },
    editData: {
      type: Object,
      default: () => ({}),
    },
    options: {
      type: Object,
      default: () => ({}),
    },
  },
  watch: {

    editData: {
      handler(nVal) {
        this.$nextTick(() => {
          if (nVal.loadingBillId) {
            this.waybillListParams = { loadingBillId: nVal.loadingBillId }
          }
        })
      },
      immediate: true,
    },
  },
  data() {
    return {
      spinning: false,

      setQueryFormItmes: setQueryFormItmes(this),
      waybillDialog: false,
      dispatchDialog: false,
      selectedRowKeys:[],
      // 运单表格
      waybillDataSource: [],
      waybillSelectedRowKeys: [],
      waybillListRemoteUrl,
      waybillListParams: {},
      mx_columns: [],
      tableExtendedField: [],
    }
  },
  mounted() {
    resultExtendedField({ extendedObjectCode: '15' }).then((res) => {
      if (res) {
        this.tableExtendedField = res.table
        let mx_columns = setMainColumns(this, this.tableExtendedField)
        mx_columns = mx_columns.splice(0, mx_columns.length - 3)
        if (this.editType === 'edit') {
          mx_columns.unshift({
            dataIndex: 'shippingOrder',
            key: 'operation',
            title: '配送顺序',
            width: 120,
            scopedSlots: { customRender: 'operation' },
            sorter: (a, b) => {
              return a.shippingOrder - b.shippingOrder
            },
          })
        } else {
          mx_columns.unshift({
            dataIndex: 'shippingOrder',
            title: '配送顺序',
            width: 120,
            sorter: (a, b) => {
              return a.shippingOrder - b.shippingOrder
            },
          })
        }
        mx_columns[1].customRender = null
        this.mx_columns = [...mx_columns]
      }
    })
  },
  methods: {
    selectChange(selectKey, selectData) {

      this.selectedRowKeys=selectKey
    },

    // 新增运单
    onAdd() {
      this.waybillDialog = false
      setTimeout(() => {
        this.waybillDialog = true
      }, 100)
    },
    // 删除运单
    onDel() {
      let request = {
        loadingBillId: this.editData.loadingBillId,
        shipbillIds: this.waybillSelectedRowKeys,
      }
      this.spinning = true
      sendcar_delete_detail(request)
        .then((res) => {
          this.spinning = false
          if (res.success) {
            this.$message.success(res.message)
            this.$refs.waybillTable.reload()
          } else {
            this.$exception(res)
          }
        })
        .finally(() => {
          this.spinning = false
        })
    },
    // 移动
    onMove() {
      this.dispatchDialog = false
      setTimeout(() => {
        this.dispatchDialog = true
      }, 100)
    },
    onFormBlur(name, ...args) {
      console.log(args)
      if (name === 'waybill') {
        this.sendcar_add_detail(args[1].split(','), args[2])
      } else if (name === 'dispatch') {
        this.sendcar_mobile_detail(args[1])
      }
    },

    // 配载运单添加
    sendcar_add_detail(shipbillIds, dataList) {
      let request = {
        loadingBillId: this.editData.loadingBillId,
        shipbillIds,
      }
      this.spinning = true
      sendcar_add_detail(request)
        .then((res) => {
          this.spinning = false
          if (res.success) {
            this.$message.success(res.message)
            this.$refs.waybillTable.reload()
          } else {
            this.$exception(res)
          }
        })
        .finally(() => {
          this.spinning = false
        })
    },

    // 配载运单移动
    sendcar_mobile_detail(nowLoadingBillId) {
      let request = {
        nowLoadingBillId,
        originalLoadingBillId: this.editData.loadingBillId,
        shipbillIds: this.waybillSelectedRowKeys,
      }
      this.spinning = true
      sendcar_mobile_detail(request)
        .then((res) => {
          this.spinning = false
          if (res.success) {
            this.$message.success(res.message)
            this.$refs.waybillTable.reload()
          } else {
            this.$exception(res)
          }
        })
        .finally(() => {
          this.spinning = false
        })
    },

    reload() {
      this.waybillDataSource = [];
      this.$refs.waybillTable.reload({ data: { loadingBillId: this.editData.loadingBillId } });
    },
  },
}
</script>