<template>
<div>
  <h1>
    申请信息【订单信息】
  </h1>
  <el-table :data="list"  v-if="type === 1">
    <el-table-column
      prop="orderNo"
      label="订单编号">
    </el-table-column>
    <el-table-column
      prop="marks"
      label="唛头">
    </el-table-column>
    <el-table-column
      label="已到箱数/总箱数">
       <template v-slot="{row}">
        {{row.sumNum}}/{{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="入仓统计">
       <template v-slot="{row}">
         <div>总箱数：{{row.totalNum}}</div>
         <div>体积：{{row.sumVolume}}CBM </div>
         <div>重量：{{row.sumWeight}}kg</div>
       </template>
    </el-table-column>
    <el-table-column
      label="入仓时间">
      <template  v-slot="{row}">
        {{parseTime(row.rucangTime)}}
      </template>
    </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="发货人">
      <template v-slot="{row}">
        <p>
          {{row.consignorName}}
        </p>
        <p>
         {{row.consignorCountryCode}}  {{row.consignorPhone}}
        </p>
      </template>
  </el-table-column>
      <el-table-column label="收货人">
    <template v-slot="{row}">
        <p>
          {{row.consigneeName}}
        </p>
        <p>
          {{row.consigneeCountryCode}} {{row.consigneePhone}}
        </p>
      </template>
    </el-table-column>
  </el-table>
  <el-descriptions  v-else-if="type === 2" :column="4" border>
    <el-descriptions-item label="订单号">{{FeeDetails.orderBackVO.orderNo}}</el-descriptions-item>
    <el-descriptions-item label="运输方式">
      <dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="FeeDetails.orderBackVO.transportId"></dict-tag>
    </el-descriptions-item>
    <el-descriptions-item label="出货方式">
      {{selectChannel(FeeDetails.channelId)}}
    </el-descriptions-item>
    <el-descriptions-item label="订单状态">
      <dict-tag :type="DICT_TYPE.ORDER_ABNORMAL_STATE" :value="FeeDetails.orderBackVO.abnormalState"></dict-tag>
    </el-descriptions-item>
    <el-descriptions-item label="唛头">
      {{FeeDetails.orderBackVO.marks}}
    </el-descriptions-item>
    <el-descriptions-item label="始发仓">{{FeeDetails.startWarehouse}}</el-descriptions-item>
    <el-descriptions-item label="目的仓">{{FeeDetails.destWarehouse}}</el-descriptions-item>
  </el-descriptions>
  <el-descriptions  v-else-if="type === 3 || type === 4" :column="4" border>
    <el-descriptions-item label="订单号">{{FeeDetails.orderNo}}</el-descriptions-item>
    <el-descriptions-item label="运输方式">
      <dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="FeeDetails.transportId"></dict-tag>
    </el-descriptions-item>
    <el-descriptions-item label="出货方式">
      {{selectChannel(FeeDetails.channelId)}}
    </el-descriptions-item>
    <el-descriptions-item label="订单状态">
      <dict-tag :type="DICT_TYPE.ORDER_ABNORMAL_STATE" :value="FeeDetails.abnormalState"></dict-tag>
    </el-descriptions-item>
    <el-descriptions-item label="唛头">
      {{FeeDetails.marks}}
    </el-descriptions-item>
    <el-descriptions-item label="始发仓">{{FeeDetails.logisticsInfoDto.startTitleZh}}</el-descriptions-item>
    <el-descriptions-item label="目的仓">{{FeeDetails.logisticsInfoDto.destTitleZh}}</el-descriptions-item>
  </el-descriptions>
  <div v-if="type === 1">
    <p>
      申请说明
    </p>
    <div >
      从 【{{selectWarehouse(FeeDetails.details && FeeDetails.details.warehouseOutId ? FeeDetails.details.warehouseOutId : '' )}}】 调到
      【{{selectWarehouse(FeeDetails.details && FeeDetails.details.warehouseInId ? FeeDetails.details.warehouseInId : '' )}}】
    </div>
  </div>
  <div v-if="type === 2">
    <p>申请理由</p>
    <div>
      {{FeeDetails.remarks}}
    </div>
  </div>
  <div v-if="type === 3">
    <p>申请理由</p>
    <div>
      {{ FeeDetails.details && FeeDetails.details.reason ? FeeDetails.details.reason :''}}
    </div>
  </div>
  <div v-if="type === 4">
    <p>申请理由</p>
    <div>
      {{ FeeDetails.details || '' }}
    </div>
  </div>
</div>
</template>

<script>
import {
  warehouseApprovalGetByFormId,
  warehouseApprovalGetById,
  warehouseAreaPositionList
} from "@/api/ecw/batchSingleApplication";
import {
  applicationGetOrderByProcessId,
  feeApplicationGet,
  getOrder,
  getOrderPage,
  getWarehouseUpdateApprovalInfo
} from '@/api/ecw/order'
import { getChannelList } from '@/api/ecw/channel';
import Template from "@/views/cms/template";
import {getSupplierPage} from "@/api/ecw/supplier";
export default {
  components: {Template},
  props:{
    type:{
      type: Number,
       default:1,
    },
    processId:{
      type:[Number,String],
    }
  },
  name: "warehouseDetails",
  data(){
    return{
      FeeDetails:{
        orderBackVO:{},
        logisticsInfoDto:{}
      },
      transfer:{},
      warehouseList:[],
      channelList:[],
      processInstanceID:undefined,
      list:[]
    }
  },
  created() {
    getChannelList().then(r => this.channelList = r.data);
    warehouseAreaPositionList().then(r => this.warehouseList = r.data)
       if(this.type === 2){
         feeApplicationGet({id:this.processId}).then(r => {
           if(r.code === 0){
             this.processInstanceID = r.data.bpmProcessId;
             this.getDetails()
           }
         })
       }else {
         warehouseApprovalGetById({id:this.processId}).then(r => {
           if(r.code === 0){
             this.processInstanceID = r.data.formId;
             this.getDetails()
           }
         })
       }
  },
  methods:{
    selectWarehouse(val){
      if(this.warehouseList.length > 0 && !!val){
       return  this.warehouseList.find(e => e.id === val).titleZh
      }
        return ''
    },
    selectChannel(val){
      if(this.channelList.length > 0 && !!val) return this.channelList.find(e => e.channelId === val).nameEn
      return ''
    },
    getDetails(){
      switch (this.type){
        case 1:
          //调仓
          warehouseApprovalGetByFormId({formId:this.processInstanceID}).then( r => {
            this.FeeDetails = r.data
            this.FeeDetails.details = JSON.parse(r.data.details)
              getOrderPage({orderIdList:r.data.adjustActualOrderIds}).then(res=>{
              this.list = res.data.list
            })

          });
          break;
        case 2:
          // 费用申请
          applicationGetOrderByProcessId({processId:this.processInstanceID}).then(r => {
            this.FeeDetails = r.data
            console.log(this.FeeDetails,'FeeDetails')
          })
          break;
        case 3:
          //退仓
          warehouseApprovalGetByFormId({formId:this.processInstanceID}).then( res => {
            getOrder(res.data.orderIds).then(r =>{
              this.FeeDetails = r.data
              this.FeeDetails.details = JSON.parse(res.data.details)
            })
          });
          break;
        case 4:
          // 入仓修改
          getWarehouseUpdateApprovalInfo(this.processInstanceID).then(r => {
            this.FeeDetails.details = r.data.details
          })
          break
      }
    }

  }
}
</script>

<style scoped>

</style>
