<template>
  <el-dialog
    :visible.sync="dialogVisible"
    width="80%"
    :before-close="()=>{
      $emit('update:dialogVisible',false)
    }">
    <div class="batch-single-application">
      <h1 class="title">调仓申请</h1>
      <el-table :data="list">
        <el-table-column label="订单编号" prop="orderNo"></el-table-column>
        <el-table-column label="唛头" prop="marks"></el-table-column>
        <el-table-column label="已到箱数/总箱数">
          <template v-slot={row}>
            {{ row.sumQuantity || 0 }}/{{ row.totalNum }}
          </template>
        </el-table-column>
        <el-table-column label="下单统计">
          <template v-slot="{row}">
            <div v-if="row.costVO">
              箱数：{{ row.costVO.totalNum }}
              {{ row.costVO.totalVolume }}m³
              {{ row.costVO.totalWeight }}kg
            </div>
          </template>
        </el-table-column>
        <el-table-column label="入仓统计" width="150">
          <template v-slot="{row}">
            <div>总箱数：{{ row.sumNum || 0 }}</div>
            <div>体积：{{ row.sumVolume || 0 }}CBM</div>
            <div>重量：{{ row.sumWeight || 0 }}KG</div>
          </template>
        </el-table-column>
        <el-table-column label="入仓时间">

        </el-table-column>
        <el-table-column label="运输方式">
          <template v-slot={row}>
            <dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="row.transportId"></dict-tag>
          </template>
        </el-table-column>
        <el-table-column label="出货渠道">

        </el-table-column>
        <!--      <el-table-column label="始发仓" prop="startWarehouseName"></el-table-column>-->
        <el-table-column label="目的地" prop="objectiveName"></el-table-column>
        <el-table-column label="始发仓" prop="startWarehouseName">
        </el-table-column>
        <el-table-column label="发货人">
          <template v-slot="{row}">
            <div>
              <div>
                <p>
                  {{ row.consignorName }}
                </p>
                <p>
                  {{row.consignorPhone}}
                </p>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="收货人">
          <template v-slot="{row}">
            <div>
              <p>
                {{ row.consigneeName }}
              </p>
              <p>
                {{ row.consigneePhone}}
              </p>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <el-row style="margin-top: 30px">
        <el-col :span="8">
          <div style="text-align: right;">
            {{ list[0] && list[0].adjustToStartWarehouseName ? list[0].adjustToStartWarehouseName : list[0] && list[0].startWarehouseName ? list[0].startWarehouseName : '' }}
          </div>
        </el-col>
        <el-col :span="3"><div style="text-align:center">
          调至
        </div></el-col>
        <el-col :span="8"><el-select v-model="params.warehouseInId">
          <el-option v-for="(item ,index) in availableWarehouse" :value="item.id" :label="item.titleZh"
                     :key="index"></el-option>
        </el-select></el-col>
      </el-row>
      <div style="display: flex;justify-content:center; margin-top: 20px">
        <div style="width: 200px; margin: 0 10px">
        </div>
        <div>

        </div>
        <div style="width: 200px;">

        </div>
      </div>
      <el-divider></el-divider>
      <h1 class="title">
        审批流程
      </h1>
      <div style="padding: 20px">
        <work-flow xmlkey="warehouse_transfer" v-model="params.copyUserId"/>
      </div>
      <div style="text-align: center" v-if="!adjustmentBol">
        <el-button style="margin-right: 50px" @click="submit">提交申请</el-button>
        <el-button @click="$emit('update:dialogVisible',false)">取消</el-button>
      </div>
      <div style="text-align: center" v-else>
        <el-button @click="()=>{
          $router.push({path:'/bpm/process-instance/detail',query:{id:this.applyStatus.orderWarehouseApprovalBackVO.formId}})
        }">审核中</el-button>
        <el-button @click="cancellationOfOrder" >取消审核</el-button>
        <el-button @click="$emit('update:dialogVisible',false)" >取消</el-button>
      </div>
    </div>
  </el-dialog>
</template>

<script>
import {DICT_TYPE, getDictDatas} from "@/utils/dict";
import {
  adjustApplyStatus, adjustLastWithStatus, cancelAdjustApply,
  ecwOrderList,
  orderWarehouseInAdjustApply,
  warehouseAdjustmentList, warehouseApprovalCancel,
} from "@/api/ecw/batchSingleApplication";
import {getProcessDefinitionBpmnXMLByKey} from "@/api/bpm/definition";
import warehouseDetails from "@/views/ecw/order/components/warehouseDetails";
import {getOrderPage} from "@/api/ecw/order";
import workFlow from "@/components/WorkFlow";
import Template from "@/views/cms/template";

export default {
  name: "batchSingleApplication",
  props: {
    orderList: [String, Number],
    dialogVisible: {
      type: Boolean,
      default: false,
    }
  },
  components: {
    Template,
    warehouseDetails,
    workFlow
  },
  watch: {
    dialogVisible(val) {
      if (val) {
        this.getOrderListFn()
      } else {
        this.params = {
          orderIds: undefined,
          warehouseInId: undefined,
          warehouseOutId: undefined,
          copyUserId: [],
        }
      }
    }
  },
  computed: {
    adjustmentBol() {
      return this.applyStatus?.orderWarehouseAdjustBackVO?.status === 1
    }
  },
  data() {
    return {
      list: [],
      selectedUsers: [],
      availableWarehouse: [],
      DICT_TYPE,
      departureWarehouse: undefined,
      adjustment: undefined,
      params: {
        orderIds: undefined,
        warehouseInId: undefined,
        warehouseOutId: undefined,
        copyUserId: [],
      },
      applyStatus:{}//调仓-查看状态

    }
  },
  methods: {
    getOrderListFn() {
      getOrderPage({orderIdList: this.orderList}).then(r => {
        this.list = r.data.list
        warehouseAdjustmentList({id: this.list[0].startWarehouseId}).then(r => this.availableWarehouse = r.data)
        adjustLastWithStatus({orderId:this.list[0].orderId,lang:0}).then(r =>{
          this.applyStatus = r.data
          if(r.data?.orderWarehouseAdjustBackVO?.status === 1){
            this.params.warehouseInId = r.data.orderWarehouseAdjustBackVO?.warehouseInId
          }
        })
      })
    },
    submit() {
      let p = this.list.map(e => e.orderId).join(',');
      this.params.orderIds = p;
      this.params.warehouseOutId = this.list[0].adjustToStartWarehouseId ? this.list[0].adjustToStartWarehouseId : this.list[0].startWarehouseId;
      this.params.orderNo = this.list[0].orderNo
      orderWarehouseInAdjustApply(this.params).then(r => {
        if (r.code === 0) {
          this.$emit('update:dialogVisible', false)
          this.$message.success('调仓成功');
        }
      })
    },
    cancellationOfOrder(){
      this.$prompt('请输入审核调仓原因', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
      }).then(({ value }) => {
        warehouseApprovalCancel(this.applyStatus.orderWarehouseApprovalBackVO.id,value) .then(r => {
          if(r.data){
            this.$message.success('取消调仓成功')
            this.$emit('update:dialogVisible',false)

          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '取消成功'
        });
      });
    }
  }
}
</script>

<style scoped lang="scss">
.batch-single-application {
  padding: 20px;
  box-sizing: border-box;

  .title {
    font-weight: 600;
    text-align: left;
  }
}

.my-process-designer {
  height: calc(100vh - 200px);
}

.box-card {
  width: 100%;
  margin-bottom: 20px;
}
</style>
