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">
              <el-input v-model="scope.row.volume" @change="updateField(scope.row, 'volume')" size="mini" :disabled="index === 0">
                <span slot="append">m³</span>
              </el-input>
            </template>
          </el-table-column>
          <el-table-column :label="$t('收费体积')" align="center" >
            <template slot-scope="scope">
              <el-input v-model="scope.row.chargeVolume" @change="updateField(scope.row, 'chargeVolume')" size="mini" :disabled="index === 0">
                <span slot="append">m³</span>
              </el-input>
            </template>
          </el-table-column>
          <el-table-column :label="$t('入仓重量')" align="center">
            <template slot-scope="scope">
              <el-input v-model="scope.row.weight" @change="updateField(scope.row, 'weight')" size="mini" :disabled="index === 0">
                <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.chargeWeight" @change="updateField(scope.row, 'chargeWeight')" size="mini" :disabled="index === 0">
                <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" :disabled="index === 0">
                <span slot="append">{{ $t('美元') }}</span>
              </el-input>
            </template>
          </el-table-column>
          <el-table-column :label="$t('箱数')" align="center">
            <template slot-scope="scope">
              <span>{{scope.row.num}}</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="500px" append-to-body>
      <el-form ref="shopForm" :model="shopForm" :rules="shopRules" label-width="150px">
        <el-row>
          <el-form-item :label="$t('中文品名')+'：'" prop="orderItemId">
            <el-select v-model="shopForm.orderItemId" :placeholder="$t('请选择中文品名')" @change="onProdChange">
              <el-option v-for="item in orderItems" :label="item.prodTitleZh" :value="item.orderItemId" :key="item.id" :disabled="itemDisabled(item)"></el-option>
            </el-select>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item :label="$t('英文品名')+'：'" prop="orderItemId">
            <el-select v-model="shopForm.orderItemId" :placeholder="$t('请选择英文品名')" @change="onProdChange">
              <el-option v-for="item in orderItems" :label="item.prodTitleEn" :value="item.orderItemId" :key="item.id" :disabled="itemDisabled(item)"></el-option>
            </el-select>
          </el-form-item>
          <el-row>
            <el-col :span="12">
              <el-form-item :label="$t('剩余箱数')+'：'">
                {{shopForm.leftNum||0}}
              </el-form-item>
            </el-col>
            <!--剩余数量计算不出来，显示没意义-->
            <!--<el-col :span="12" v-show="isQuantity">
              <el-form-item :label="$t('剩余数量(个)')+'：'">
                {{shopForm.leftQuantity||0}}
              </el-form-item>
            </el-col>-->
          </el-row>
          <el-form-item :label="$t('放入箱数')+'：'">
            <el-input-number v-model="shopForm.num" controls-position="right"  :min="0" :max="+shopForm.leftNum" @change="calcAverg"></el-input-number>
          </el-form-item>


          <el-form-item v-if="mainOrderItem.orderItemId" label-width="0">
            {{ $t('剩余入仓方数') }}：{{ mainOrderItem.volume || 0 }}m³，
            {{$t('剩余收费方数')}}：{{ mainOrderItem.chargeVolume || 0 }}m³
          </el-form-item>

          <el-form-item :label="$t('入仓体积')">
            <el-input-number v-model="shopForm.volume" controls-position="right"  :min="0" :max="mainOrderItem.volume"></el-input-number>
          </el-form-item>
          <el-form-item :label="$t('收费体积')">
            <el-input-number v-model="shopForm.chargeVolume" controls-position="right"  :min="0" :max="mainOrderItem.chargeVolume"></el-input-number>
          </el-form-item>
          <el-form-item v-if="mainOrderItem.orderItemId" label-width="0">
            {{ $t('剩余入仓重量') }}：{{ mainOrderItem.weight || 0 }}kg，
            {{$t('剩余收费重量')}}：{{ mainOrderItem.chargeWeight || 0 }}kg
          </el-form-item>
          <el-form-item :label="$t('入仓重量')">
            <el-input-number v-model="shopForm.weight" controls-position="right"  :min="0" :max="mainOrderItem.weight"></el-input-number>
          </el-form-item>
          <el-form-item :label="$t('收费重量')">
            <el-input-number v-model="shopForm.chargeWeight" controls-position="right"  :min="0" :max="mainOrderItem.chargeWeight"></el-input-number>
          </el-form-item>
          <el-form-item v-if="mainOrderItem.orderItemId" label-width="0">
            {{ $t('剩余货值') }}：{{ mainOrderItem.worth || 0 }}{{ $t('美元') }}
          </el-form-item>
          <el-form-item :label="$t('放入货值')">
            <el-input-number v-model="shopForm.worth" controls-position="right"  :min="0" :max="mainOrderItem.worth"></el-input-number>
          </el-form-item>
          <!--按照原型这里需要显示剩余数量，但是事实无法计算剩余数量，因为已装数量是未知的-->
          <el-form-item :label="$t('放入数量(个)')+'：'" prop="quantity" v-if="isQuantity">
            <el-input-number v-model="shopForm.quantity" controls-position="right" :min="0" :max="mainOrderItem.quantity || undefined"></el-input-number>
          </el-form-item>
          <el-form-item :label="$t('备注信息')+'：'">
            <el-input v-model="shopForm.remarks"></el-input>
          </el-form-item>
        </el-row>
      </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>
  </div>
</template>

<script>
import {
  getSplitList,
  // quantitycheck,
  createSplitItem,
  deleteSplitItem,
} from "@/api/ecw/orderHandle";
import  {quantityRequired} from "@/api/ecw/warehouse";
import { getTradeCityList } from "@/api/ecw/region";
import WorkFlow from "@/components/WorkFlow";
import {getOrder, splitItemUpdate} from "@/api/ecw/order";
import { serviceMsg, toReviewDetail } from "../../utils";
import { createApproval, approvalCancel, splitList } from "@/api/ecw/boxSea";
import Decimal from "decimal.js";

export default {
  name: "splitOrder",
  inheritAttrs: false,
  components: {
    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: {}}
    };
  },
  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();
  },
  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";
        });
      },
    },
  },
  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) || {}
    }
  },
  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;
    },
    // 更改放入品名后触发，计算重量体积等默认值
    onProdChange(){
      // 根据键值（中文名或者英文名）来获取对应商品的信息，注：这里应该可以采用orderItemId来获取更优，而不是商品名称,同名可能导致异常
      let orderItem = this.orderData.orderItemVOList.find(item => item.orderItemId == this.shopForm.orderItemId)
      console.log({orderItem})
      // 剩余可装箱数，订单入仓箱数 - 订单已装箱数 - 已拆箱数
      let leftNum = Decimal(this.currRow.num).minus(this.currRow.installNum).minus(this.totalSplit('num'))

      // 剩余箱数
      this.$set(this.shopForm, 'leftNum', leftNum)

      // 如果主单商品项的入仓箱数小于可装箱数，则取商品项数据
      leftNum = Math.min(leftNum, this.mainOrderItem.num)
      // 放入箱数
      this.$set(this.shopForm, 'num', leftNum)
      this.calcAverg()
    },
    // 按比例计算体积重量的默认值
    calcAverg(){
      // 装箱比例
      const rate = this.shopForm.num / this.mainOrderItem.num

      // 放入个数，剩余个数是算不出来的，因为不知道已装数量,所以放入数量只能按照总数的比例计算
      this.$set(this.shopForm, 'quantity',      Math.ceil(this.mainOrderItem.quantity*rate|| 0 * rate))
      // 数量，体积，重量等按照比例给默认值
      this.$set(this.shopForm, 'volume',        (this.mainOrderItem.volume * rate).toFixed(2))
      this.$set(this.shopForm, 'chargeVolume',  (this.mainOrderItem.chargeVolume * rate).toFixed(2))
      this.$set(this.shopForm, 'weight',        (this.mainOrderItem.weight * rate).toFixed(2))
      this.$set(this.shopForm, 'chargeWeight',  (this.mainOrderItem.chargeWeight * rate).toFixed(2))
      this.$set(this.shopForm, 'worth',  (this.mainOrderItem.worth * rate).toFixed(2))
    },
    /*async getSelectData(item) {
      await quantityRequired(this.orderData.lineId).then((res) => {
        if (res.data) {
          this.isQuantity = true;
          this.shopRules.putQuantity = [
            {
              required: true,
              message: this.$t("请输入数量(个)"),
              trigger: "change",
            },
          ];
        } else {
          this.isQuantity = false;
          delete this.shopRules.putQuantity;
        }
      });
    },*/
    shopAdd() {
      this.$refs["shopForm"].validate((valid) => {
        if (valid) {
          // 放入箱数自动计算出来的，所以不需要在做判断了
          /*
          // 输入箱数大于实装箱数
          const total = this.totalSplitNum();
          const canSplitNum = Decimal.sub(
            this.currRow.num,
            this.currRow.installNum
          ).toNumber();
          const remain = Decimal.sub(canSplitNum, total).toNumber();
          if (this.shopForm.num > remain) {
            this.$message.error(this.$t("放入箱数不能大于总箱数"));
            return;
          }*/
          if (this.shopForm.num === 0) {
            this.$message.error(this.$t("放入箱数不能为0"));
            return;
          }
          if (this.shopForm.quantity === 0 && this.isQuantity) {
            this.$message.error(this.$t("放入数量(个)不能为0"));
            return;
          }

          let params = {
            num: this.shopForm.num,
            // quantity: this.shopForm.quantity,
            orderItemId: this.shopForm.orderItemId,
            orderSplitId: this.splitData.id,
            remarks: this.shopForm.remarks,
            volume: this.shopForm.volume,
            weight: this.shopForm.weight,
            chargeWeight: this.shopForm.chargeWeight,
            chargeVolume: this.shopForm.chargeVolume,
            worth: this.shopForm.worth
          };
          // 按数量计费的才需要传递数量
          if(this.isQuantity){
            params.quantity = this.shopForm.quantity
          }
          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, true).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");
    },
  },
};
</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>