<template>
  <div class="app-container">
    <!-- 搜索工作栏 -->
    <el-card>
        <div slot="header" class="card-title">{{$t('查看')}}</div>
        <el-descriptions :column="4">
            <el-descriptions-item :label="$t('唛头')">
                {{orderData.marks?orderData.marks:$t('无')}}
            </el-descriptions-item>
            <el-descriptions-item :label="$t('已到箱数/总箱数')">
                {{orderData.sumNum||0}}/{{orderData.costVO?orderData.costVO.totalNum:0}}
            </el-descriptions-item>
            <el-descriptions-item :label="$t('订单状态')">
              <dict-tag :type="DICT_TYPE.ORDER_STATUS" :value="orderData.status" />
            </el-descriptions-item>
            <el-descriptions-item :label="$t('送货日期')">
              <span>{{orderData.deliveryDate||$t('无')}}</span>
            </el-descriptions-item>
            <el-descriptions-item :label="$t('运输方式')">
                <dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="orderData.transportId" />
              </el-descriptions-item>
             <el-descriptions-item :label="$t('始发地')" :span="2">
                 {{orderData.logisticsInfoDto?orderData.logisticsInfoDto.startTitleZh:$t('无')}}
             </el-descriptions-item>
             <el-descriptions-item :label="$t('目的地')">
                {{orderData.logisticsInfoDto?orderData.logisticsInfoDto.destTitleZh:$t('无')}}
             </el-descriptions-item>
        </el-descriptions>
        <el-descriptions :column="4">
            <el-descriptions-item :label="$t('发货人')">
                {{orderData.consignorVO?orderData.consignorVO.name||$t('无'):$t('无')}}
            </el-descriptions-item>
            <el-descriptions-item :label="$t('发货公司')">
                {{orderData.consignorVO?orderData.consignorVO.company||$t('无'):$t('无')}}
            </el-descriptions-item>
            <el-descriptions-item :label="$t('发货电话')">
                {{orderData.consignorVO?((orderData.consignorVO.countryCode?checkCode(orderData.consignorVO.countryCode):'')+orderData.consignorVO.phone)||$t('无'):$t('无')}}
            </el-descriptions-item>
          </el-descriptions>
          <el-descriptions :column="4">
            <el-descriptions-item :label="$t('收货人')">
                {{orderData.consigneeVO?orderData.consigneeVO.name||$t('无'):$t('无')}}
            </el-descriptions-item>
            <el-descriptions-item :label="$t('收货公司')">
                {{orderData.consigneeVO?orderData.consigneeVO.company||$t('无'):$t('无')}}
            </el-descriptions-item>
            <el-descriptions-item :label="$t('收货电话')">
                {{orderData.consigneeVO?((orderData.consigneeVO.countryCode?checkCode(orderData.consigneeVO.countryCode):'')+orderData.consigneeVO.phone)||$t('无'):$t('无')}}
            </el-descriptions-item>
        </el-descriptions>
    </el-card>
    <el-card class="card">
      <!-- 列表 -->
      <div slot="header" class="card-title">{{$t('货物信息')}}</div>
      <el-table v-loading="loading" border :data="orderData.orderItemVOList" :summary-method="getSummaries" show-summary>
        <el-table-column :label="$t('序号')" align="center" prop="id" type="index">
          <template slot-scope="scope">
              <span>{{scope.$index + 1}}</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('品名')">
          <template slot-scope="scope">
            <p>{{scope.row.prodTitleEn||''}}</p>
            <p>{{scope.row.prodTitleZh||''}}</p>
          </template>
          </el-table-column>
          <el-table-column :label="$t('填单货物信息')">
            <template slot-scope="scope">
              <p>{{$t('品牌')}}：<dict-tag :value="scope.row.brandType" :type="DICT_TYPE.ECW_IS_BRAND" /></p>
              <p>{{$t('箱数')}}：{{scope.row.num||0}}</p>
              <p>{{$t('体积')}}：{{scope.row.volume||0}}CBM</p>
              <p>{{$t('重量')}}：{{scope.row.weight||0}}KG</p>
            </template>
            </el-table-column>
            <el-table-column :label="$t('入库货物属性')">
              <template slot-scope="scope">
                 <p>{{$t('箱规')}}：{{scope.row.warehouseInInfoVO?scope.row.warehouseInInfoVO.boxGauge:0}}</p>
                 <p>{{$t('品牌')}}：<dict-tag :type="DICT_TYPE.ECW_IS_BRAND" :value="scope.row.brandType" /></p>
                  <p>{{$t('箱数')}}：{{scope.row.warehouseInInfoVO?scope.row.warehouseInInfoVO.cartonsNum:0}}&nbsp;&nbsp;</p>
                  <p>{{$t('体积')}}：{{scope.row.warehouseInInfoVO?scope.row.warehouseInInfoVO.volume:0}}CBM&nbsp;&nbsp;</p>
                  <p>{{$t('重量')}}：{{scope.row.warehouseInInfoVO?scope.row.warehouseInInfoVO.weight:0}}KG
                </p>
              </template>
         </el-table-column>
        <el-table-column :label="$t('重货方数')"  v-if="type=='order_heavy_cargo_exception'">
          <template slot-scope="scope">
            <span>{{scope.row.weVolume||0}}CBM</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('泡货方数')" v-if="type!='order_heavy_cargo_exception'">
          <template slot-scope="scope">
            <span>{{scope.row.weVolume||0}}CBM</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('重货重量')"  v-if="type=='order_heavy_cargo_exception'">
          <template slot-scope="scope">
            <span>{{scope.row.voWeight||0}}KG</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('泡货重量')" v-if="type!='order_heavy_cargo_exception'" >
          <template slot-scope="scope">
            <span>{{scope.row.vweight||0}}KG</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('最后操作时间')" scope="handlerTime" />

      </el-table>

    </el-card>
      <div slot="footer" class="dialog-footer">
        <div>
          <el-button  type="primary" @click="submit('general_cargo')">{{$t('设为普货')}}</el-button>
          <el-button plain type="primary" @click="submit('process')">{{$t('设为已处理')}}</el-button>
        </div>
      </div>
      <el-form  :model="handlerParams" ref="queryForms" size="small" label-width="50px" class="card">
        <el-form-item :label="$t('备注')+':'" size="medium">
          <el-input style="width: 500px;"  type="textarea" v-model="handlerParams.orderExceptionHandlerRemark"  />
        </el-form-item>
      </el-form>

  </div>
</template>

<script>
import {getExceptionById,handlerExceptionByExceptionId} from "@/api/ecw/orderException"
import {DICT_TYPE} from  '@/utils/dict'
import {getOrder} from '@/api/ecw/order'
import {getProductBrankPage} from '@/api/ecw/productBrank'

export default {
  name: "WeightDeal",
  components: {

  },
  data() {
    return {
      // 遮罩层
      loading: false,
      orderData:{},
      list: {},
      orderId:0,
      type:'',
      branklist:[],
      handlerParams:{
        orderExceptionHandlerRemark:''
      }
    };
  },
  created() {
    if(this.$route.query.id){
      this.id = this.$route.query.id
      this.getList()
    }
    if(this.$route.query.type){
      this.type = this.$route.query.type
    }
    getProductBrankPage({pageNo:1,pageSize:500}).then((data)=>{
      this.branklist=data.data.list
    })
  },
  methods: {
    /** 查询列表 */
    getList() {
      this.loading = true;
      // 执行查询
      getExceptionById(this.id).then(response => {
        this.list = response.data;
        this.loading = false;
        this.getOrders()
      });
    },
    getBrand(id){
      var brank = this.branklist.find(item=>item.id==id)
      return brank.titleZh||''
    },
    checkCode(data){
      if(data.indexOf('+')==-1){
      	return '+'+data
      }
      return data
    },
    getOrders(){
      getOrder(this.list.orderId).then(response => {
        this.orderData = response.data
      });
    },
    getSummaries(){
      const sums = [];
      if(!this.orderData || !this.orderData.list ||ths.orderData.length==0){
        return sums
      }
      sums[0] = this.$t('小计')
      var orderSum = 0
      var orderV = 0
      var orderW = 0
      var leviteSum = 0
      var leviteV = 0
      var leviteW = 0
      this.orderData.list.forEach((column, index) => {
          orderSum += column.orderSum
          orderV += column.volume
          orderW += column.weight
          leviteSum += column.orderSum
          leviteV += column.volume
          leviteW += column.weight
      });
      sums[1] = ''
      sums[2] = this.$t('下单统计：')+ orderSum+this.$t(' 箱 ')+ orderV +' m³ ' + orderW + ' kg'
      sums[3] = this.$t('入仓统计：')+ leviteSum+this.$t(' 箱 ')+ leviteV +' m³ ' + leviteW + ' kg'
      sums[4] = ''
      sums[5] = ''
      return sums;
    },
    submit(result){
      handlerExceptionByExceptionId({orderExceptionId:this.list.id,orderExceptionHandlerResult:result,orderExceptionHandlerRemark:this.handlerParams.orderExceptionHandlerRemark}).then(res=>{
          this.$modal.msgSuccess(this.$t("提交成功"));
          this.$router.back()
      })
    }
  }
}
</script>
<style scoped>
  .dialog-footer{
      margin-top: 10px;
  }
  .filelist{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .filelist span{
    width: 48%;
    margin-right: 2%;
    color: #1E98D7;
  }
  .card-title{
      font-size: 18px;
      font-weight: bold;
      margin-top: 10px;
  }
  .card{
    margin-top: 20px;
  }
  p{
    text-align: left;
     margin: 0 !important;
  }
</style>