<template>
  <div style="padding: 0 20px">
    <h1>调拨出仓</h1>
    <el-divider content-position="left">
      订单信息
    </el-divider>
    <ordeDetailsForm :details="orderDetails"></ordeDetailsForm>
    <el-divider content-position="left">
      货物信息
    </el-divider>
    <el-table :data=" orderDetails.orderItemVOList &&  orderDetails.orderItemVOList.length > 0  ? orderDetails.orderItemVOList : [] ">
      <el-table-column type="index" label="序号"></el-table-column>
      <el-table-column label="品名">
        <template v-slot="{row}">
          <div>{{ row.prodTitleZh }}</div>
          <div>{{ row.prodTitleEn }}</div>
        </template>
      </el-table-column>
      <el-table-column label="填单货物属性">
        <template v-slot="{row}">
          <el-descriptions size="mini" :column="1">
            <el-descriptions-item label="品牌">{{ row.brand }}</el-descriptions-item>
            <el-descriptions-item label="箱数">{{ row.num }}</el-descriptions-item>
            <el-descriptions-item label="体积">{{ row.volume }}</el-descriptions-item>
            <el-descriptions-item label="重量">
            </el-descriptions-item>
          </el-descriptions>
        </template>
      </el-table-column>
      <el-table-column label="入库货物属性">
        <template v-slot="{row}">
          <el-descriptions size="mini" :column="4">
            <el-descriptions-item label="品牌">{{ row.brand }}</el-descriptions-item>
            <el-descriptions-item label="箱数"> {{  row.warehouseInInfoVO ? row.warehouseInInfoVO.cartonsNum :'' }}</el-descriptions-item>
            <el-descriptions-item label="体积">{{  row.warehouseInInfoVO ? row.warehouseInInfoVO.volume :'' }}</el-descriptions-item>
            <el-descriptions-item label="重量"> {{row.warehouseInInfoVO ? row.warehouseInInfoVO.weight : '' }}</el-descriptions-item>
          </el-descriptions>
        </template>
      </el-table-column>
      <el-table-column label="最后操作时间">
           <template v-slot="{row}">
             {{parseTime(row.createTime)}}
           </template>
      </el-table-column>
      <el-table-column label="状态">
        <template v-slot="{row}">
          <dict-tag :value=" row.warehouseInInfoVO ? row.warehouseInInfoVO.diffType :''" :type="DICT_TYPE.ORDER_WAREHOUSE_IN_STATUS"/>
        </template>
      </el-table-column>
    </el-table>
    <el-divider content-position="left" v-if="type == 2">
      调仓明细
    </el-divider>
    <el-table :data="warehouseList" v-if="type == 2">
      <el-table-column label="调仓编号" prop="id"></el-table-column>
      <el-table-column label="调出仓库" prop="warehouseOutName" ></el-table-column>
      <el-table-column label="调入仓库" prop="warehouseInName"></el-table-column>
      <el-table-column label="申请人" prop="creator"></el-table-column>
      <el-table-column label="申请时间">
        <template v-slot="{row}">
         {{parseTime(row.createTime)}}
        </template>
      </el-table-column>
      <el-table-column label="状态">
        <template v-slot="{row}">
            {{STATUS[row.status]}}
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template v-slot="{row}">
          <el-button v-if="row.status === 4" type="text">
            撤销
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-descriptions style="margin-top: 20px" :column="4" border>
      <el-descriptions-item label="集运仓库">{{ warehouseDetails && warehouseDetails.warehouseOutName  ?  warehouseDetails.warehouseOutName : '' }}</el-descriptions-item>
      <el-descriptions-item label="储位">
         <div v-for="item in storageSpaceList"  style="display: flex;"><div>{{item.warehouseName ? item.warehouseName : ''}}</div><div>{{item.warehouseName ? item.regionName :''}} 区</div></div>
      </el-descriptions-item>
      <el-descriptions-item label="调拨目标仓">{{ warehouseDetails && warehouseDetails.warehouseInName ? warehouseDetails.warehouseInName : '' }}</el-descriptions-item>
      <el-descriptions-item label="物流公司">
        <el-select v-model="params.logisticsCompany" >
          <el-option v-for="(item,index) in expressList " :key="index"  :value="item.id" :label="item.companyZh"></el-option>
        </el-select>
      </el-descriptions-item>
      <el-descriptions-item label="物流单号">
        <el-input v-model="params.logisticsNo"></el-input>
      </el-descriptions-item>
      <el-descriptions-item label="联系电话">
        <el-input v-model="params.phone"></el-input>
      </el-descriptions-item>
      <el-descriptions-item label="出仓日期">
        <el-date-picker
          v-model="params.deliveryDate"
          type="date"
          placeholder="选择日期">
        </el-date-picker>
      </el-descriptions-item>
<!--      <el-descriptions-item label="到仓日期">-->
<!--        <el-date-picker-->
<!--          v-model="params.deliveryDate"-->
<!--          type="date"-->
<!--          placeholder="选择日期">-->
<!--        </el-date-picker>-->
<!--      </el-descriptions-item>-->
    </el-descriptions>
    <el-divider content-position="left">
      出仓影像
    </el-divider>
    <image-and-video-upload   :fileSize="50" :isShowTip="true" v-model="params.urls" ></image-and-video-upload>
    <el-form>
      <el-form-item label="备注">
        <el-input v-model="params.deliveryRemark" type="textarea"></el-input>
      </el-form-item>
    </el-form>
    <div>
      <el-button v-if="type == 1" @click="submit">确认出仓</el-button>
      <el-button v-else @click="submit2">确认到仓</el-button>
      <el-button @click="$router.back()">返回</el-button>
    </div>
  </div>
</template>

<script>
import ordeDetailsForm from "@/views/ecw/order/components/ordeDetailsForm";
import {
  getAdjustInfo,
  getOrder, listByOrderId,
  orderWarehouseInGetAdjustInfo,
  orderWarehousePicturePage, warehouseAdjustArrived, warehouseAdjustPage,
  warehouseAdjustSendOut
} from "@/api/ecw/order";
import Template from "@/views/cms/template";
import {DICT_TYPE} from '@/utils/dict';
import ImageAndVideoUpload from "@/components/ImageAndVideoUpload/index";
import {getSupplierPage} from "@/api/ecw/supplier";
import {getByWarehouseId} from "@/api/ecw/warehouseArea";
let STATUS = {1:'审核中', 2:'已通过', 3:'已拒绝', 4:'已出仓', 5:'已到仓'}
export default {
  name: "transferWarehousing",
  components: {
    ImageAndVideoUpload,
    Template,
    ordeDetailsForm,
  },
  props: {
    orderId: [String, Number],
    type: [String],
  },
  data() {
    return {
      STATUS,
      orderDetails: {},
      DICT_TYPE,
      warehouseDetails: {},
      warehouseList:[],
      params: {
        deliveryDate: "",
        deliveryRemark: "",
        id: undefined,
        logisticsCompany:undefined,
        logisticsNo: "",
        phone: "",
        urls: []
      },
      expressList:[],
      storageSpaceList:[],
    }
  },
  created() {

    getSupplierPage({ pageNo: 1, pageSize: 10000}).then(r => {
     this.expressList = r.data.list;
    })
    getOrder(this.orderId).then(r => {
      if (r.code === 0) {
        this.orderDetails = r.data;
      }
    })
    if(this.type == 2){
      getAdjustInfo({orderId:this.orderId,lang:0}).then(r => {
        this.warehouseList = r.data
      })
    }
    orderWarehouseInGetAdjustInfo({orderId: this.orderId, lang: 0}).then(r => {
      this.warehouseDetails = r.data[0]
      listByOrderId({orderId:this.orderId}).then(res => {
        if(res.code === 0){
          getByWarehouseId().then(r =>{
            let obj = [];
            res.data.forEach(item => {
              r.data.forEach(itemm => {
                if(item.wareId === itemm.id){
                  itemm.children.forEach(itemmm => {
                   if(itemmm.id === item.areaId){
                     obj.push({
                       warehouseName:itemm.name,
                       regionName:itemmm.name
                     })
                   }
                  })
                }
              })
            })
            this.storageSpaceList = obj;
          })
        }
      })
      this.params.phone = this.warehouseDetails.phone || '';
      this.params.logisticsNo = this.warehouseDetails.logisticsNo;
      this.params.id = this.warehouseDetails.id;
      this.params.deliveryDate = this.warehouseDetails.deliveryDate
      this.params.logisticsCompany = this.warehouseDetails.logisticsCompany ? parseInt(this.warehouseDetails.logisticsCompany) :undefined;
      orderWarehousePicturePage({rows:100,bizId:this.params.id,type:this.type == 1 ? 2 : 3 }).then(r => {
        if(r.code === 0){
          this.params.urls = r.data.list.map(e => e.url);
        }
      })
    })
  },
  methods:{
    submit(){
      warehouseAdjustSendOut(this.params).then(
        r => {
          if(r.code === 0){
            this.$message.success('调拨出仓成功');
            this.$router.back();
          }
        }
      )
    },
    submit2(){
      warehouseAdjustArrived(this.params).then(r => {
          if(r.code === 0){
            this.$message.success('调到仓成功');
            this.$router.back();
          }
      })
    }
  },
}
</script>

<style scoped>

</style>
