splitOrder.vue

<template>
  <div class="app-container shipping-split-order">
    <el-card>
      <div slot="header" class="card-title">{{$t('拆单申请')}}-{{orderData.orderNo||''}}</div>
      <div class="btn-header">
        <span class="card-title">{{$t('原单信息')}}</span>
      </div>
      <el-descriptions :column="4">
        <el-descriptions-item :label="$t('唛头')">
          {{orderData.marks?orderData.marks:$t('无')}}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('已实装箱数/总箱数')">
          <span>{{currRow.installNum||0}}/{{currRow.num||0}}</span>
        </el-descriptions-item>
        <el-descriptions-item :label="$t('订单状态')">
          {{orderData.status==99? $t('异常'):$t('正常')}}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('送货日期')">
          {{orderData.deliveryDate}}
        </el-descriptions-item>
      </el-descriptions>
      <el-descriptions :column="4">
        <el-descriptions-item :label="$t('运输方式')">
          <dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="orderData.transportId" />
        </el-descriptions-item>
        <el-descriptions-item :label="$t('始发地')">
          {{orderData.logisticsInfoDto?$l(orderData.logisticsInfoDto, 'startTitle'):$t('无')}}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('目的地')">
          {{orderData.logisticsInfoDto?$l(orderData.logisticsInfoDto, 'destTitle'):$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.phone?("+"+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.phone?"+"+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 id='table' v-loading="loading" border :data="orderData.orderItemVOList" :summary-method="getSummaries" show-summary>
        <el-table-column :label="$t('序号')" align="center" prop="id" type="index" width="60">
          <template slot-scope="scope">
            <span>{{scope.$index + 1}}</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('品名')" align="center">
          <template slot-scope="scope">
            <el-row>{{scope.row.prodTitleZh}}</el-row>
            <el-row>{{scope.row.prodTitleEn}}</el-row>
          </template>
        </el-table-column>
        <el-table-column :label="$t('装柜货物属性')" align="center" width="600">
          <template slot-scope="scope">
            <el-row style="text-align:left;">
              <el-row>
                <span>{{$t('规格')}}：{{scope.row.warehouseInInfoVO ? scope.row.warehouseInInfoVO.boxGauge : ''}}</span>
              </el-row>
              <el-row>
                <span>{{$t('品牌')}}：
                  <template v-if="scope.row.brandName">{{scope.row.brandName}}</template>
                  <dict-tag v-else :type="DICT_TYPE.ECW_IS_BRAND" :value="scope.row.brandType" />
                </span>
                <span style="margin-left: 10px;">{{$t('箱数')}}：{{scope.row.warehouseInInfoVO ? scope.row.warehouseInInfoVO.cartonsNum : 0 }}</span>
                <span style="margin-left: 10px;">{{$t('体积')}}：{{scope.row.warehouseInInfoVO ? scope.row.warehouseInInfoVO.volume : 0 }}m³</span>
                <span style="margin-left: 10px;">{{$t('重量')}}：{{scope.row.warehouseInInfoVO ? scope.row.warehouseInInfoVO.weight : 0 }}kg</span>
              </el-row>
              <el-row>
                <span>{{$t('计划装柜')}}：{{planCabinet}}</span>
              </el-row>
            </el-row>
          </template>
        </el-table-column>
        <el-table-column :label="$t('最后操作时间')" align="center">
          <template slot-scope="scope">
            <span>{{parseTime(scope.row.updateTime)}}</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('状态')" align="center">
          {{orderData.abnormalState!=0?$t('异常'):$t('正常')}}
          <!-- <template slot-scope="scope">
            <dict-tag :type="DICT_TYPE.ORDER_STATUS" :value="scope.row.status" />
          </template> -->
        </el-table-column>
      </el-table>
    </el-card>

    <el-card class="card" v-if="splitData.id">
      <!-- 列表 -->
      <div slot="header" class="card-title">{{$t('拆单信息')}}</div>
      <div>
        <div class="btn-header">
          <div>
            <p class="card-info">
              <span class="card-title">
                {{splitData.orderNo}}
              </span>
              <span>{{orderData.logisticsInfoDto?$l(orderData.logisticsInfoDto, 'startTitle'):$t('无')}}</span>
              <span>{{$t('发往')}}：{{splitData.dstWarehouseName}}</span>
            </p>
          </div>
          <div>
            <el-button type="primary" :disabled="isAudit" @click="addShop">{{$t('放入')}}</el-button>
          </div>
        </div>
        <el-table border :data="splitData.orderSplitItemBackVOList">
          <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('品名')" align="center">
            <template slot-scope="scope">
              <el-row>{{scope.row.prodTitleZh}}</el-row>
              <el-row>{{scope.row.prodTitleEn}}</el-row>
            </template>
          </el-table-column>
          <el-table-column :label="$t('品牌')" align="center">
            <template slot-scope="scope">
              <dict-tag :type="DICT_TYPE.ECW_IS_BRAND" :value="scope.row.brandType" />
            </template>
          </el-table-column>
          <el-table-column :label="$t('入仓体积')" align="center" >
            <template slot-scope="scope">
              {{scope.row.volume}}m³
              <!--<el-input v-model="scope.row.volume" @change="updateField(scope.row, 'volume')" size="mini" disabled>
                <span slot="append">m³</span>
              </el-input>-->
            </template>
          </el-table-column>
          <el-table-column :label="$t('收费体积')" align="center" >
            <template slot-scope="scope">
              {{scope.row.chargeVolume}}m³
              <!--<el-input v-model="scope.row.chargeVolume" @change="updateField(scope.row, 'chargeVolume')" size="mini" disabled>
                <span slot="append">m³</span>
              </el-input>-->
            </template>
          </el-table-column>
          <el-table-column :label="$t('入仓重量')" align="center">
            <template slot-scope="scope">
              {{scope.row.weight}}kg
              <!--<el-input v-model="scope.row.weight" @change="updateField(scope.row, 'weight')" size="mini" disabled>
                <span slot="append">kg</span>
              </el-input>-->
            </template>
          </el-table-column>
          <el-table-column :label="$t('收费重量')" align="center">
            <template slot-scope="scope">
              {{scope.row.chargeWeight}}kg
              <!--<el-input v-model="scope.row.chargeWeight" @change="updateField(scope.row, 'chargeWeight')" size="mini" disabled>
                <span slot="append">kg</span>
              </el-input>-->
            </template>
          </el-table-column>
          <el-table-column :label="$t('货值')" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.worth" @change="updateField(scope.row, 'worth')" size="mini">
                <span slot="append">{{ $t('元') }}</span>
              </el-input>
            </template>
          </el-table-column>
          <el-table-column :label="$t('箱数')" align="center">
            <template slot-scope="scope">
              <el-button type="text" @click="showWarehouse(scope.row)">{{scope.row.num}}</el-button>
            </template>
          </el-table-column>
          <el-table-column :label="$t('数量(个)')" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.quantity}}</span>
            </template>
          </el-table-column>

          <el-table-column :label="$t('计划装柜')" align="center">
            {{planCabinet}}
          </el-table-column>
          <el-table-column :label="$t('操作')" align="center">
            <template slot-scope="scope">
              <el-button size="mini" :disabled="isAudit" type="text" icon="el-icon-delete" @click="removeShop(scope.row.id)">{{$t('移出')}}</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-card>

    <el-row style="marginTop:15px;">
      <work-flow xmlkey="split_order" v-model="selectedUsers"></work-flow>
    </el-row>

    <div slot="footer" class="card footer_btn">
      <el-button v-if="!isAudit" type="primary" @click="submitForm">{{$t('提交申请')}}</el-button>
      <el-button v-if="!isAudit" plain type="primary" @click="$emit('closeDialog2')">{{$t('取消')}}</el-button>
      <el-button v-if="isAudit" type="primary" @click="jumpReviewDetail">{{$t('审核中')}}</el-button>
      <el-button v-if="isAudit" plain type="primary" @click="cancelSplit">{{$t('取消审核')}}</el-button>
      <el-button v-if="isAudit" plain type="primary" @click="$emit('closeDialog2')">{{$t('返回')}}</el-button>
    </div>

    <!-- 对话框(添加 / 修改) -->
    <el-dialog :title="$t('放入品名')" :visible.sync="shopOpen" width="1500px" append-to-body>
      <el-form ref="shopForm" :model="shopForm" :rules="shopRules" label-width="150px" inline>
        <el-form-item :label="$t('中文品名')+'：'" prop="orderItemId">
          <el-select v-model="shopForm.orderItemId" :placeholder="$t('请选择中文品名')">
            <el-option v-for="item in orderItems" :label="item.prodTitleZh" :value="item.orderItemId" :key="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item :label="$t('英文品名')+'：'" prop="orderItemId">
          <el-select v-model="shopForm.orderItemId" :placeholder="$t('请选择英文品名')">
            <el-option v-for="item in orderItems" :label="item.prodTitleEn" :value="item.orderItemId" :key="item.id"></el-option>
          </el-select>
        </el-form-item>

        <div class="page-title">{{$t('品名可拆数据')}}</div>
        <div class="pl-20">
          <span class="mr-10">{{$t('箱数')}}：{{ Math.min(mainOrderItem.num, maxNum) || 0 }}</span>
          <span class="mr-10">{{ $t('入仓方数') }}：{{ mainOrderItem.volume || 0 }}m³</span>
          <span class="mr-10">{{ $t('收费方数') }}：{{ mainOrderItem.chargeVolume || 0 }}m³</span>
          <span class="mr-10">{{ $t('入仓重量') }}：{{ mainOrderItem.weight || 0 }}kg</span>
          <span class="mr-10">{{ $t('收费重量') }}：{{ mainOrderItem.chargeWeight || 0 }}kg</span>
          <span class="mr-10">{{ $t('数量(个)') }}：{{ mainOrderItem.quantity || 0 }}</span>
          <span class="mr-10">{{ $t('剩余可拆货值') }}：{{ leftWorth}}{{ $t('元') }}</span>
        </div>
        <div class="page-title">{{$t('可拆入仓记录')}}</div>
        <el-table
          :data="getOrderItemWarehouseIn(shopForm.orderItemId)"
          style="width: 100%">
          <el-table-column :label="$t('箱数')">
            <template v-slot="{row,$index}">
              {{Math.min(getWarehouseLeftData(row, 'num'), leftSplitNum)}}
              <dict-tag :type="DICT_TYPE.WAREHOUSING_SPECIFICATION_TYPE" v-model="row.specificationType"></dict-tag>
            </template>
          </el-table-column>
          <el-table-column :label="$t('包装类型')">
            <template v-slot="{row,$index}">
              <dict-tag :type="DICT_TYPE.ECW_PACKAGING_TYPE" v-model="row.unit"></dict-tag>
            </template>
          </el-table-column>
          <el-table-column label="长(cm)">
            <template v-slot="{row,$index}">
              {{row.boxGauge1}}
            </template>
          </el-table-column>
          <el-table-column label="宽(cm)">
            <template v-slot="{row,$index}">
              {{ row.boxGauge2 }}
            </template>
          </el-table-column>
          <el-table-column label="高(cm)">
            <template v-slot="{row,$index}">
              {{ row.boxGauge3 }}
            </template>
          </el-table-column>
          <el-table-column label="入仓体积(m³)">
            <template v-slot="{row,$index}">
              {{getWarehouseLeftData(row, 'volume')}}
            </template>
          </el-table-column>
          <el-table-column label="入仓重量(Kg)" prop="weight">
            <template v-slot="{row,$index}">
              {{getWarehouseLeftData(row, 'weight')}}
            </template>
          </el-table-column>
          <el-table-column :label="$t('数量')" prop="quantity">
            <template v-slot="{row,$index}">
              {{getWarehouseLeftData(row, 'quantity')}}
            </template>
          </el-table-column>
          <el-table-column :label="$t('快递单号')" prop="expressNo"></el-table-column>
          <el-table-column :label="$t('储位')" prop="orderLocationBackVOList">
            <template v-slot="{ row, column, $index }">
              <warehouse-area-select
                v-model="row.orderLocationBackVOList"
                readonly
                :warehouse-id="currentWarehouseId"
              ></warehouse-area-select>
            </template>
          </el-table-column>
          <el-table-column :label="$t('操作')">
            <template v-slot="{ row, column, $index}">
              <el-tag v-if="getWarehouseInSplitData(row.id,'num') >= row.cartonsNum" disabled size="mini" type="primary" >{{$t('已拆完')}}</el-tag>
              <el-button v-else size="mini" type="primary" @click="putInRecord(row)" :disabled="leftSplitNum <= 0">{{$t('放入')}}</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="flex-between mt-20 mb-10">
          <div class="page-title" style="margin: 0">
            {{$t('已放入入仓记录')}}
          </div>
          <el-button type="danger" size="mini" @click="clearAll">{{$t('清空放入数据')}}</el-button>
        </div>

        <el-table
          :data="shopForm.specsRecordVOList"
          style="width: 100%">
          <el-table-column :label="$t('箱数')" width="200px">
            <template v-slot="{row,$index}">
              {{row.num}}
              <dict-tag :type="DICT_TYPE.WAREHOUSING_SPECIFICATION_TYPE" v-model="row.specificationType"></dict-tag>
            </template>
          </el-table-column>
          <el-table-column :label="$t('包装类型')" width="100px">
            <template v-slot="{row,$index}">
              <dict-tag :type="DICT_TYPE.ECW_PACKAGING_TYPE" v-model="row.unit"></dict-tag>
            </template>
          </el-table-column>
          <el-table-column label="长(cm)">
            <template v-slot="{row,$index}">
              {{row.boxGauge1}}
            </template>
          </el-table-column>
          <el-table-column label="宽(cm)">
            <template v-slot="{row,$index}">
              {{ row.boxGauge2 }}
            </template>
          </el-table-column>
          <el-table-column label="高(cm)">
            <template v-slot="{row,$index}">
              {{ row.boxGauge3 }}
            </template>
          </el-table-column>
          <el-table-column label="入仓体积(m³)">
            <template v-slot="{row,$index}">
              {{row.volume}}
            </template>
          </el-table-column>
          <!--<el-table-column label="收费体积(m³)" prop="chargeVolume"></el-table-column>-->
          <el-table-column label="入仓重量(Kg)" prop="weight"></el-table-column>
          <!--<el-table-column label="收费重量(Kg)" prop="chargeWeight"></el-table-column>-->
          <el-table-column :label="$t('数量')" width="130px" prop="quantity"></el-table-column>
          <el-table-column :label="$t('快递单号')" prop="expressNo"></el-table-column>
          <el-table-column :label="$t('储位')" prop="orderLocationBackVOList">
            <template v-slot="{ row, column, $index }">
              {{getLocationName(row.orderLocationList)}}
            </template>
          </el-table-column>
          <el-table-column :label="$t('操作')">
            <template v-slot="{ row, column, $index}">
              <el-button size="mini" type="primary" @click="deleteRow($index)">{{$t('删除')}}</el-button>
            </template>
          </el-table-column>
        </el-table>

        <div class="page-title">{{$t('放入数据')}}</div>
        <div class="pl-20 mb-10">
          <span class="mr-10">{{$t('箱数')}}：{{ putin.num || 0 }}，</span>
          <span class="mr-10">{{ $t('数量(个)') }}：{{ putin.quantity || 0 }}，</span>
          <span class="mr-10">{{ $t('入仓方数') }}：{{ putin.volume || 0 }}m³， </span>
          <span class="mr-10">{{ $t('入仓重量') }}：{{ putin.weight || 0 }}kg</span>
        </div>
        <el-form-item :label="$t('收费方数')" prop="chargeVolume">
          <el-input-number v-model="shopForm.chargeVolume" controls-position="right"></el-input-number>m³
        </el-form-item>
        <el-form-item :label="$t('收费重量')" prop="chargeWeight">
          <el-input-number v-model="shopForm.chargeWeight" controls-position="right"></el-input-number>kg
        </el-form-item>

        <el-form-item :label="$t('放入货值')">
          <el-input-number v-model="shopForm.worth" controls-position="right"  :min="0" :max="leftWorth">
            <template slot="append">{{ $t('元') }}</template>
          </el-input-number>
        </el-form-item>
        <el-form-item :label="$t('备注信息')">
          <el-input v-model="shopForm.remark"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="shopAdd">{{$t('确定')}}</el-button>
        <el-button @click="shopCancel">{{$t('取消')}}</el-button>
      </div>
    </el-dialog>

    <warehouse-record v-if="currentWarehouseRecord" :list="currentWarehouseRecord" append-to-body></warehouse-record>
    <put-in
      v-if="currentPutIn"
      :warehouse-record="currentPutIn"
      @close="currentPutIn=null"
      @submit="handlePutin"
      :warehouse-id="currentWarehouseId"
      :maxNum="leftSplitNum"
      append-to-body
    ></put-in>
  </div>
</template>

<script>
import {
  getSplitList,
  // quantitycheck,
  createSplitItem,
  deleteSplitItem, splitItemWorthCheck,
} from "@/api/ecw/orderHandle";
import  {quantityRequired} from "@/api/ecw/warehouse";
import { getTradeCityList } from "@/api/ecw/region";
import WorkFlow from "@/components/WorkFlow";
import {getOrder, getOrderWarehouseIn, splitItemUpdate} from "@/api/ecw/order";
import { serviceMsg, toReviewDetail } from "../../utils";
import { createApproval, approvalCancel, splitList } from "@/api/ecw/boxSea";
import Decimal from "decimal.js";
import Warehouse from "@/views/ecw/order/warehousing/components/Warehouse";
import WarehouseRecord from "@/views/ecw/order/splitApply/components/WarehouseRecord";
import WarehouseAreaSelect from "@/components/WarehouseAreaSelect";
import PutIn from "@/views/ecw/order/splitApply/components/PutIn.vue";

export default {
  name: "splitOrder",
  inheritAttrs: false,
  components: {
    PutIn,
    WarehouseAreaSelect,
    WarehouseRecord,
    Warehouse,
    WorkFlow
  },
  props: {
    currRow: Object,
  },
  data() {
    return {
      orderData: {},
      splitData: {},
      detail: {},
      loading: false,
      selectedUsers: [],
      tradeCityList: [],
      planCabinet: "",

      shopOpen: false,
      orderItems: [],
      shopForm: {},
      // 表单校验
      shopRules: {
        zhId: [
          {
            required: true,
            message: this.$t("请选择中文品名"),
            trigger: "change",
          },
        ],
        enId: [
          {
            required: true,
            message: this.$t("请选择英文品名"),
            trigger: "change",
          },
        ],
      },
      queryParams: {
        orderId: 0,
        lang: 0,
      },
      isQuantity: false,

      // 主单数据
      mainOrder: {orderSplitItemBackVOList: {}},
      // 当前查看的入仓记录
      currentWarehouseRecord: null,
      // 订单入仓记录
      warehouseInList: [],
      // 当前选择的入仓记录ID
      selectedWarehouseInId: null,
      // 当前正在放入的入仓记录
      currentPutIn: null,
      /*// 订单剩余数据
      orderLeftData: null*/
    };
  },
  created() {
    const { shipmentObj } = this.$attrs;
    this.planCabinet = `${shipmentObj.selfNo}-${this.currRow.sectionName}`;
    getTradeCityList().then((res) => (this.tradeCityList = res.data));
    this.queryParams.orderId = this.currRow.orderId;
    this.getOrderDetail();
    this.getSplit();

    // 获取入仓记录
    getOrderWarehouseIn(this.queryParams.orderId).then(res => {
      this.warehouseInList = res.data
    })

    this.$nextTick(() => {
      window.$vm = this
    })
  },
  watch: {
    //监听table这个对象
    tableData: {
      // 立即监听
      immediate: true,
      handler() {
        this.$nextTick(() => {
          const tds = document.querySelectorAll(
            "#table .el-table__footer-wrapper tr>td"
          );
          // colSpan合并列
          tds[1].colSpan = 5;
          tds[1].style.textAlign = "left";
          tds[2].style.display = "none";
          tds[3].style.display = "none";
          tds[4].style.display = "none";
        });
      },
    },
    // 切换放入品名
    'shopForm.orderItemId'(){
      // 默认取以前放入的品名
      this.shopForm.specsRecordVOList = []
      const splitItem = this.splitData.orderSplitItemBackVOList.find(item => item.orderItemId == this.shopForm.orderItemId)
      let specsRecordVOList = splitItem?.specsRecordVOList || []
      specsRecordVOList.forEach(item => {
        const [boxGauge1, boxGauge2, boxGauge3] = item.boxGauge.split('*')
        this.shopForm.specsRecordVOList.push({...item, boxGauge1, boxGauge2, boxGauge3})
      })

      // 显示原来默认的收费数据
      this.$set(this.shopForm, 'chargeVolume', splitItem.chargeVolume)
      this.$set(this.shopForm, 'chargeWeight', splitItem.chargeWeight)
      this.$set(this.shopForm, 'worth', splitItem.worth)
    }
  },
  computed: {
    isAudit() {
      const { shipmentObj } = this.$attrs;
      const { cabinetSplitInfo } = shipmentObj;
      if (cabinetSplitInfo) {
        /**
         * PROCESS(1, "处理中"),
         * APPROVE(2, "通过"),
         * REJECT(3, "不通过"),
         * CANCEL(4, "已取消");
         */
        const { approvalStatus } = cabinetSplitInfo;
        if (approvalStatus === 1) return true;
      }
      return false;
    },
    // 订单项数据，默认要返回一个如下的空json结构体，避免报错
    // 装柜拆单只能拆一个出来，所以直接用原单数据作为放入品名的最大值限制即可，跟订单操作中的拆单有所区别
    mainOrderItem(){
      if(!this.shopForm.orderItemId || !this.mainOrder.orderSplitItemBackVOList.length) return {}
      return this.mainOrder.orderSplitItemBackVOList.find(item => item.orderItemId == this.shopForm.orderItemId) || {}
    },
    // 放入数据
    putin(){
      let data = {
        num: new Decimal(0),
        volume: new Decimal(0),
        chargeVolume: new Decimal(0),
        weight: new Decimal(0),
        chargeWeight: new Decimal(0),
        quantity: new Decimal(0)
      }
      this.shopForm.specsRecordVOList && this.shopForm.specsRecordVOList.forEach(item => {
        data.num = data.num.plus(new Decimal(item.num || 0))
        data.volume = data.volume.plus(new Decimal(item.volume || 0))
        data.chargeVolume = data.chargeVolume.plus(new Decimal(item.chargeVolume || 0))
        data.weight = data.weight.plus(new Decimal(item.weight || 0))
        data.chargeWeight = data.chargeWeight.plus(new Decimal(item.chargeWeight || 0))
        data.quantity = data.quantity.plus(new Decimal(item.quantity || 0))
      })
      return {
        num: data.num.toNumber(),
        volume: data.volume.toNumber(),
        chargeVolume: data.chargeVolume.toNumber(),
        weight: data.weight.toNumber(),
        chargeWeight: data.chargeWeight.toNumber(),
        quantity: data.quantity.toNumber()
      }
    },
    // 当前仓库ID
    currentWarehouseId(){
      return this.orderData.adjustToDestWarehouseId || this.orderData.logisticsInfoDto.startWarehouseId
    },
    // 当前选择的入仓记录
    /*currentWarehouseItem(){
      return this.getOrderItemWarehouseIn(this.shopForm.orderItemId).find(item => item.id === this.selectedWarehouseInId)
    },*/
    // 根据orderItemId获取入仓记录
    getOrderItemWarehouseIn() {
      return orderItemId => {
        const list = this.warehouseInList.find(item => item.orderItemId == orderItemId)?.orderWarehouseInBackItemDoList || []
        return list.map(item => {
          let [boxGauge1, boxGauge2, boxGauge3] = item.boxGauge.split('*')
          item.boxGauge1 = boxGauge1
          item.boxGauge2 = boxGauge2
          item.boxGauge3 = boxGauge3
          return item
        })
      }
    },
    // 根据入仓记录ID筛选出他的全部拆出记录(不含主单的)
    getWarehouseInspecsRecordVOList(){
      return warehouseInId => {
        let specsRecordVOList = []
        // 这里是正在操作放入，但是还没确定提交的
        this.shopForm.specsRecordVOList.forEach(item => {
          if(item.warehouseInId == warehouseInId)specsRecordVOList.push(item)
        })
        return specsRecordVOList
      }
    },
    // 根据入仓ID获取拆出数据
    getWarehouseInSplitData(){
      return (warehouseInId, field) => {
        let total = new Decimal(0)
        this.getWarehouseInspecsRecordVOList(warehouseInId).forEach(item => {
          total = total.plus(new Decimal(item[field] || 0))
        })
        return total.toNumber()
      }
    },
    // 获取入仓记录的剩余数据
    getWarehouseLeftData(){
      return (warehouseRecord, field) => {
        let warehouseField = field
        if(field === 'num'){
          warehouseField = 'cartonsNum'
        }
        if(field === 'quantity'){
          warehouseField = 'quantityAll'
        }
        let total = new Decimal(warehouseRecord[ warehouseField ] || 0)
        this.getWarehouseInspecsRecordVOList(warehouseRecord.id).forEach(item => {
          total = total.minus(new Decimal(item[field] || 0))
        })
        return total.toNumber()
      }
    },
    // 最大可装箱数 原单箱数 - 已装箱数
    maxNum(){
      return this.currRow.num - this.currRow.installNum
    },
    // 剩余可拆箱数
    leftSplitNum(){
      let num = this.maxNum - this.putin.num
      /*this.splitData.orderSplitItemBackVOList.forEach(item =>{
        num -= item.num
      })*/
      return num
    },
    // 订单剩余可拆货值
    leftWorth(){
      if(!this.orderData?.costVO?.totalWorth)return 0;
      let worth = new Decimal(this.orderData.costVO.totalWorth)
      this.splitData.orderSplitItemBackVOList.forEach(item =>{
        worth = worth.minus(item.worth || 0)
      })
      // 包当前选择的品名之前填写的货值包含进去
      if(this.shopForm.orderItemId){
        let splitItem = this.splitData.orderSplitItemBackVOList.find(item => item.orderItemId == this.shopForm.orderItemId)
        if(splitItem){
          worth = worth.plus(splitItem.worth || 0)
        }
      }
      return worth.toNumber()
    },
  },
  methods: {
    /*检查并提交字段(体积，重量)修改*/
    updateField(row, field){
      let val = parseFloat(row[field])
      if(!val || val < 0){
        this.$message.error(this.$t('数据无效'))
        return this.getList()
      }
      splitItemUpdate(row).then(() => {
        this.$message.success(this.$t('修改成功'))
      }).catch(() => {
        this.getList()
      })
    },
    /* 拆箱总数,默认计算箱数，传递quantity可计算个数 */
    totalSplit(field = 'num') {
      let _total = 0;
      const { orderSplitItemBackVOList = [] } = this.splitData;
      orderSplitItemBackVOList.forEach((v) => {
        _total = Decimal.add(_total, Number(v[field])).toNumber();
      });
      return _total;
    },
    /* 打开拆单 */
    getSplit() {
      this.orderItems = this.currRow.goodsList ?? [];
      const { shipmentObj } = this.$attrs;
      splitList({
        orderId: this.currRow.orderId,
        shipmentId: shipmentObj.id,
      }).then((res) => {
        const data = res.data;
        // 取拆单项
        this.splitData = data.filter((item) => !item.isMaster)?.[0] ?? {};
        // 取主单，用语判断放入品名的数据上限
        this.mainOrder = data.find(item => item.isMaster)
      });
    },
    /*itemDisabled(data) {
      const { orderSplitItemBackVOList = [] } = this.splitData;
      const isExist = orderSplitItemBackVOList.find(
        (item) => item.orderItemId === data.orderItemId
      );
      return isExist ? true : false;
    },*/
    /* 查询拆单项 */
    querySplitGoods() {
      getSplitList({
        lang: 0,
        orderId: this.currRow.orderId,
        shipmentType: 1,
      }).then((res) => {
        const { orderSplitBackVOList } = res.data; // 取拆单项
        const list =
          orderSplitBackVOList.filter((item) => !item.isMaster)?.[0] ?? {};

        this.splitData.orderSplitItemBackVOList =
          list.orderSplitItemBackVOList ?? [];
      });
    },
    getOrderDetail() {
      this.loading = true;
      getOrder(this.queryParams.orderId).then((response) => {
        this.orderData = response.data;
        this.loading = false;
      });
    },
    getSummaries() {
      const sums = [];

      sums[0] = this.$t("小计");
      if (
        !this.orderData ||
        !this.orderData.orderItemVOList ||
        this.orderData.length == 0
      ) {
        return sums;
      }
      let orderSum = 0;
      let orderV = 0;
      let orderW = 0;
      let leviteSum = 0;
      let leviteV = 0;
      let leviteW = 0;
      this.orderData.orderItemVOList.forEach((column, index) => {
        orderSum = Decimal.add(orderSum, column.num ?? 0).toNumber();
        orderV = Decimal.add(orderV, column.volume ?? 0).toFixed(2);
        orderW = Decimal.add(orderW, column.weight ?? 0).toFixed(2);
        leviteSum = Decimal.add(
          leviteSum,
          column.warehouseInInfoVO?.cartonsNum ?? 0
        ).toNumber();
        leviteV = Decimal.add(
          leviteV,
          column.warehouseInInfoVO?.volume ?? 0
        ).toFixed(2);
        leviteW = Decimal.add(
          leviteW,
          column.warehouseInInfoVO?.weight ?? 0
        ).toFixed(2);
      });
      sums[1] = this.$t(
        "下单统计：{orderSum} 箱 {orderV} m³ {orderW} kg 入仓统计：{leviteSum} 箱 {leviteV} m³ {leviteW} kg",
        {
          orderSum,
          orderV,
          orderW,
          leviteSum,
          leviteV,
          leviteW,
        }
      );
      return sums;
    },
    importCityName(id) {
      let arr = this.tradeCityList.filter((item) => item.id == id);
      return arr.length > 0 ? this.$l(arr[0], "title") : this.$t("无");
    },
    submitForm() {
      const { shipmentObj } = this.$attrs;
      // 创建拆单审核
      createApproval({
        applyReason: this.$t("拆单审核"),
        approvalStatus: 0,
        approvalType: 8,
        copyUserId: this.selectedUsers,
        orderId: this.currRow.orderId,
        shipmentId: shipmentObj.id,
      }).then((res) => {
        serviceMsg(res, this).then((res) => {
          this.$emit("getBoxInfo");
          this.querySplitGoods();
        });
      });
    },
    addShop() {
      this.shopForm = {};
      this.shopOpen = true;
      this.isQuantity = false;
      // 重置表单数据
      this.shopForm = {specsRecordVOList:[]}
    },
    shopAdd() {
      this.$refs["shopForm"].validate((valid) => {
        if (valid) {
          if (this.putin.num === 0) {
            this.$message.error(this.$t("放入箱数不能为0"));
            return;
          }
          if (this.putin.quantity === 0 && this.isQuantity) {
            this.$message.error(this.$t("放入数量(个)不能为0"));
            return;
          }
          this.shopForm.specsRecordVOList.forEach(item => {
            item.boxGauge = `${item.boxGauge1}*${item.boxGauge2}*${item.boxGauge3}`
          })
          let params = {
            num: this.putin.num,
            // quantity: this.shopForm.quantity,
            orderItemId: this.shopForm.orderItemId,
            orderSplitId: this.splitData.id,
            remarks: this.shopForm.remarks,
            volume: this.putin.volume,
            weight: this.putin.weight,
            chargeWeight: this.shopForm.chargeWeight,
            chargeVolume: this.shopForm.chargeVolume,
            worth: this.shopForm.worth || 0,
            specsRecordVOList:this.shopForm.specsRecordVOList,
            shipmentSplit: true
          };
          // 按数量计费的才需要传递数量
          if(this.isQuantity){
            params.quantity = this.putin.quantity
          }
          // 货值不能超过剩余货值
          if(params.worth > this.leftWorth){
            return this.$message.error(this.$t("货值不能超过剩余货值"));
          }
          createSplitItem(params).then((res) => {
            this.$message.success(this.$t("放入成功"));
            this.querySplitGoods();
            this.$refs["shopForm"].resetFields();
            this.shopOpen = false;
          });
        }
      });
    },
    removeShop(id) {
      let that = this;
      that.$confirm(this.$t("是否移除货物吗?")).then(function () {
        deleteSplitItem(id).then((res) => {
          that.$message.success(that.$t("移除成功"));
          that.querySplitGoods();
        });
      });
    },
    cancelSplit() {
      const { shipmentObj } = this.$attrs;
      approvalCancel({
        applyReason: this.$t("取消审核"),
        id: shipmentObj["cabinetSplitInfo"].id,
        shipmentId: shipmentObj.id,
      }).then((res) => {
        serviceMsg(res, this).then(() => {
          this.$emit("getBoxInfo");
          this.querySplitGoods();
        });
      });
    },
    shopCancel() {
      this.$refs["shopForm"].resetFields();
      this.shopOpen = false;
      this.shopForm = {};
    },
    jumpReviewDetail() {
      const { cabinetSplitInfo } = this.$attrs.shipmentObj;
      toReviewDetail.apply(this, [cabinetSplitInfo.bpmProcessId]);
      this.$emit("closeDialog2", "close");
    },
    // 添加一行
    addRow(){
      if(!this.shopForm.specsRecordVOList){
        this.$set(this.shopForm,'specsRecordVOList',[])
      }
      if(!this.currentWarehouseItem){
        return this.$message.info(this.$t("请选择入仓记录"))
      }
      let { specificationType, boxGauge1, boxGauge2, boxGauge3, volume, weight } = this.currentWarehouseItem
      let num = this.currentWarehouseItem.cartonsNum
      // 根据入仓记录添加一行
      this.shopForm.specsRecordVOList.push({
        specificationType, boxGauge1, boxGauge2, boxGauge3, volume, weight,num,
        orderLocationList: this.currentWarehouseItem.orderLocationBackVOList
      })
    },
    // 删除一行，可选参数index表上行号，参数不是数字则删除最后一行
    deleteRow(index){
      const spliceIndex = typeof index !== 'number' ? this.shopForm.specsRecordVOList.length - 1 : index
      this.shopForm.specsRecordVOList.splice(spliceIndex, 1)
      this.calcDefaultData()
    },
    // 计算体积
    calcVolume(row){
      let volume = Decimal(row.boxGauge1 || 0)
        .times(Decimal(row.boxGauge2 || 0))
        .times(Decimal(row.boxGauge3 || 0)).div(1000000)
      // 如果是箱的单位要乘以箱数
      if(row.specificationType === 1) {
        row.volume = volume.times(Decimal(row.num || 0))
      }

      // 最低0.01
      volume = Math.max(0.01, volume.toNumber().toFixed(2))
      this.$set(row, 'volume', volume)
      this.$set(row, 'chargeVolume', volume)
    },
    // 显示入库记录
    showWarehouse(row){
      if(!row.specsRecordVOList){
        return this.$message.info(this.$t('暂无入仓记录'))
      }
      this.currentWarehouseRecord = row.specsRecordVOList
    },
    // 获取储位名称
    getLocationName(locationArr){
      if(!locationArr || !locationArr.length) return ''
      let arr = []
      locationArr.forEach(item => {
        arr.push(`${item.areaName || ''}${item.locationName || ''}`)
      })
      return Array.from(new Set(arr)).join(",")
    },
    // 根据入仓记录打开放入弹层
    putInRecord(row){
      this.currentPutIn = row
      // 此条入仓记录已拆出的入仓记录，这样在放入的时候可以确保不超过此入仓记录的数量
      this.currentPutIn.specsRecordVOList = this.getWarehouseInspecsRecordVOList(row.id)
    },
    // 放入回调
    handlePutin(list){
      if(!list.length){
        return this.$message.error(this.$t("请至少放入一条数据"))
      }
      list.forEach(item => {
        this.shopForm.specsRecordVOList.push({...item})
      })
      this.currentPutIn = null

      this.calcDefaultData()
    },
    // 清空放入记录
    clearAll(){
      this.$confirm(this.$t("确定要清空放入数据么?")).then(res => {
        this.shopForm.specsRecordVOList = []
        this.calcDefaultData()
      })
    },
    // 计算默认的收费数据
    calcDefaultData() {
      // 根据比例计算默认的收费方数和收费重量
      const orderItem = this.orderData.orderItemVOList.find(item => item.orderItemId == this.shopForm.orderItemId)
      const rate = this.putin.num / orderItem.warehouseInInfoVO.cartonsNum

      /*
      * 1 普货 2 重货 3 泡货
      * 普货 收费数据=入仓数据
      * 泡货 收费方数=入仓方数 收费重量 = 品名收费重量*比例
      * 重货 收费方数=品名收费方数*比例 收费重量 = 入仓重量
      * */
      const chargeVolume = orderItem.itemType === 2 ? (orderItem.chargeVolume*rate).toFixed(2) : this.putin.volume
      const chargeWeight = orderItem.itemType === 3 ? (orderItem.chargeWeight*rate).toFixed(2) : this.putin.weight
      this.$set(this.shopForm, 'chargeVolume', chargeVolume)
      this.$set(this.shopForm, 'chargeWeight', chargeWeight)

      // 货值按照主单的总货值*订单的箱数比例
      let worth = (this.orderData.costVO.totalWorth * this.putin.num / this.orderData.sumNum).toFixed(2)
      this.$set(this.shopForm, 'worth', worth)
    },
    // 查询订单剩余数据
    /*getOrderLeftData(){
      splitItemWorthCheck(this.orderData.orderId).then(res => {
        this.orderLeftData = res.data
      })
    }*/
  }
};
</script>

<style lang="scss">
.shipping-split-order {
  .card-title {
    font-size: 18px;
    font-weight: bold;
    margin-top: 10px;
  }
  .card-info {
    font-size: 16px;
    > span {
      margin-right: 10px;
    }
  }
  .card {
    margin-top: 20px;
  }
  .btn-header {
    width: 90%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 20px 0;
  }
  .red {
    color: #ff3430;
    font-size: 15px;
  }
  .footer_btn {
    padding-bottom: 60px;
  }
}
</style>