空运-出仓增加标签扫码、批量输入、纠错、批量纠错、箱号未完成出仓接口拦截

src/api/ecw/boxAir.js

@@ -493,3 +493,18 @@ export function searchLoadOrderByBoxNo(data) {
     data: data
   });
 }
+
+/**
+ * 确认出仓
+ *
+ * @export
+ * @param {*} data
+ * @return {*}
+ */
+export function confirmAirCheckout(params) {
+  return request({
+    url: `/ecw/box-air-checkout/confirmAirCheckout`,
+    method: "get",
+    params
+  });
+}
\ No newline at end of file

src/views/ecw/box/shippingAir/nodePage/checkout.vue

@@ -71,16 +71,23 @@
 
     </el-form>
 
+    <!-- 开始出仓 -->
+    <el-dialog :title="$t('开始出仓')" :visible.sync="dialogVisible" fullscreen :modal-append-to-body=false append-to-body>
+      <startCheckout v-bind="$attrs" v-if="dialogVisible" v-on="$listeners" @closeDialog1="closeDialog1" />
+    </el-dialog>
+
     <el-row class="operate-button">
       <el-button type="primary" @click="onSubmit(1)">{{$t('保存')}}</el-button>
       <el-button :disabled="$attrs.shipmentObj.approvaling" type="success" @click="onSubmit(2)">{{$t('提交')}}</el-button>
       <el-button @click="cancel">{{$t('关闭')}}</el-button>
+      <el-button @click="startCheckout">{{$t('确认出仓')}}</el-button>
     </el-row>
   </div>
 </template>
 
 <script>
 import { airCheckoutCreate } from "@/api/ecw/boxSea";
+import startCheckout from "./checkout/startCheckout.vue";
 import userSelect from "./common/userSelect.vue";
 import ImageUpload from "@/components/ImageUpload";
 import { constantDict, formatDateStr, formatNumberString, serviceMsg } from "../utils";
@@ -91,7 +98,7 @@ import { constantDict, formatDateStr, formatNumberString, serviceMsg } from "../
 export default {
   name: "checkout",
   inheritAttrs: false,
-  components: { userSelect, ImageUpload },
+  components: { userSelect, ImageUpload, startCheckout },
   data() {
     return {
       // 空运出仓对象
@@ -106,6 +113,7 @@ export default {
         //deliverType: [{ required: true, message: this.$t("必填"), trigger: "change" }],
         checkoutTime: [{ required: true, message: this.$t("必填"), trigger: "change" }]
       },
+      dialogVisible: false
     };
   },
   created() {
@@ -140,6 +148,13 @@ export default {
     cancel(type) {
       this.$emit("closeDialog", type);
     },
+    /** 开始出仓 */
+    startCheckout() {
+      this.dialogVisible = true;
+    },
+    closeDialog1() {
+      this.dialogVisible = false;
+    },
   },
 };
 </script>

src/views/ecw/box/shippingAir/nodePage/checkout/startCheckout.vue

+<template>
+  <div class="startPacking">
+    <el-card>
+          <el-row class="table-title">
+            <div><dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="shipmentObj.transportType" />：{{importCityName(shipmentObj.startWarehouseId)}}》{{importCityName(shipmentObj.destWarehouseId)}}【{{getShipChannelName(shipmentObj.channelRespVO.channelId)}}】</div>
+            <div>
+              <template>
+                <el-input v-model="qrCode" :placeholder="$t('请输入二维码/条码编号')" clearable></el-input>
+                <el-button type="primary" @click="handlerBatchCreate('single')">{{$t('确定')}}</el-button>
+                <el-button type="primary" @click="handlerClick('batchInput',$t('批量输入'))">{{$t('批量输入')}}</el-button>
+                <el-button type="primary" @click="handlerClick('correction',$t('出仓纠错'))">{{$t('出仓纠错')}}</el-button>
+                <el-button type="primary" @click="handlerClick('correctionOrder',$t('批量出仓纠错'))">{{$t('批量出仓纠错')}}</el-button>
+              </template>
+            </div>
+          </el-row>
+      
+
+          <!-- 表格 -->
+          <el-row class="table-content">
+            <el-table :data="tableData.sectionOrderList" border max-height="500px">
+              <el-table-column :label="$t('序号')" align="center" width="50" prop="tidanNum" />
+              <el-table-column :label="$t('订单号')" align="center" prop="orderNo">
+                <template slot-scope="scope">
+                  <div>
+                    <a href="javascript:void(0);" class="order-href" @click="orderClick(scope.row)">{{ scope.row.orderNo }}</a>
+                  </div>
+                  <div style="color:blue;fontWeight:bold;">
+                    {{ scope.row.isExternalWarehouse === 1 ? '(' + $t('外部仓') + ')' : ''}}
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column :label="$t('货物信息')" align="center" prop="goodsList">
+                <template slot-scope="scope">
+                  <section class="table-goodList">
+                    <div v-for="(item, index) in scope.row.goodsList" :key="index" class="goodList-div">
+                      <p>{{$t('品名')}}：{{$l(item,'prodTitle')}}</p>
+                      <p>{{$t('品牌')}}：【<template v-if="item.brandName">{{item.brandName}}</template>
+                        <dict-tag v-else :type="DICT_TYPE.ECW_IS_BRAND" :value="item.feeType" />{{ $t('】') }}</p>
+                      <p>{{$t('其他')}}：{{getTotlContent(item)}}</p>
+                    </div>
+                  </section>
+                </template>
+              </el-table-column>
+              <el-table-column :label="$t('报关方式')" align="center" prop="customsType">
+                <template slot-scope="scope">
+                  <div :class="scope.row.customsType !== 1 ? 'custom_type_red' : ''">
+                    <dict-tag :type="DICT_TYPE.ECW_CUSTOMS_TYPE" :value="scope.row.customsType" />
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column :label="$t('计划箱数')" align="center" prop="num">
+                <template slot-scope="scope">
+                  {{getTotlContent(scope.row,['num'])}}
+                </template>
+              </el-table-column>
+              <el-table-column :label="$t('实装箱数')" align="center" prop="installNum">
+                <template slot-scope="scope">
+                  {{ scope.row.installNum }}{{$t('箱')}}
+                </template>
+              </el-table-column>
+              <el-table-column :label="$t('体积')" align="center" prop="volume">
+                <template slot-scope="scope">
+                  {{getTotlContent(scope.row,['volume'])}}
+                </template>
+              </el-table-column>
+              <el-table-column :label="$t('重量')" align="center" prop="weight">
+                <template slot-scope="scope">
+                  {{getTotlContent(scope.row,['weight'])}}
+                </template>
+              </el-table-column>
+            </el-table>
+          </el-row>
+    </el-card>
+
+    <!-- 统计 -->
+    <el-row>
+      <el-col :span="6" class="totle-info">
+        <div class="count-info">
+          <p>{{$t('总计')}}：{{getSumData}}</p>
+        </div>
+        <!-- <div>
+          <p>{{$t('容量')}}：</p>
+          <p>{{calcCapacity}}</p>
+        </div>
+        <div>{{$t('已装')}} {{getInstallNumCount}} {{$t('箱')}}</div> -->
+      </el-col>
+    </el-row>
+    <el-row style="margin-top: 20px;">
+      <el-button type="primary" @click="submitCheckout">{{$t('确认出仓')}}</el-button>
+      <el-button @click="$emit('closeDialog1')">{{$t('取消')}}</el-button>
+    </el-row>
+
+
+    <!-- 对话框 -->
+    <el-dialog custom-class="shipping-dialog" :title="dialogConfig.title" :visible.sync="dialogConfig.dialogVisible" :fullscreen="dialogConfig.fullscreen" :width="dialogConfig.width" :modal-append-to-body=false append-to-body>
+      <!-- 已装未装订单 -->
+      <template v-if="dialogConfig.type === 'orderTable'">
+        <el-table :data="orderList" height="500px" border>
+          <el-table-column :label="$t('已出仓')" align="center" prop="loadTag" />
+          <el-table-column :label="$t('未出仓')" align="center" prop="unloadTag" />
+        </el-table>
+      </template>
+      <!-- 出仓纠错 -->
+      <template v-if="dialogConfig.type === 'correction' && dialogConfig.dialogVisible">
+        <el-form ref="correctionForm" :rules="rules" :model="correctionObj" label-position="top">
+          <el-form-item :label="$t('出仓纠错（二维码/条形码编号）')" prop="qrCode">
+            <el-input v-model="correctionObj.qrCode" :placeholder="$t('请输入二维码/条形码编号')" clearable />
+          </el-form-item>
+        </el-form>
+        <el-row class="operate-button">
+          <el-button type="primary" @click="onSubmit('correctionForm')">{{$t('提交')}}</el-button>
+          <el-button @click="closeDialog2">{{$t('取消')}}</el-button>
+        </el-row>
+      </template>
+      <!-- 批量出仓纠错（订单号） -->
+      <template v-if="dialogConfig.type === 'correctionOrder' && dialogConfig.dialogVisible">
+        <el-form ref="orderForm" :rules="rules" :model="orderObj" label-position="top">
+          <el-form-item :label="$t('出仓纠错') +'（' + $t('订单号') + '）'" prop="orderNo">
+            <el-input type="textarea" :rows="3" v-model="orderObj.orderNo" :placeholder="$t('请输入，多个以逗号分隔')" clearable />
+          </el-form-item>
+        </el-form>
+        <el-row class="operate-button">
+          <el-button type="primary" @click="onSubmit('orderForm')">{{$t('提交')}}</el-button>
+          <el-button @click="closeDialog2">{{$t('取消')}}</el-button>
+        </el-row>
+      </template>
+      <!-- 出仓批量输入 -->
+      <template v-if="dialogConfig.type === 'batchInput' && dialogConfig.dialogVisible">
+        <el-form ref="batchForm" :rules="rules" :model="batchObj">
+          <el-form-item label="" prop="qrCode" class="two-element">
+            <el-input v-model="batchObj.qrCode" :placeholder="$t('请输入订单号')" clearable />
+            <el-button style="marginLeft:10px;" type="primary" @click="queryOrderInfo">{{$t('确定')}}</el-button>
+          </el-form-item>
+
+          <el-row>
+            <el-col :span="12">
+              <el-form-item :label="$t('订单号')">
+                {{boxOrderInfo.orderNo}}
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item :label="$t('箱数')">
+                <el-input-number v-if="boxOrderInfo.isExternalWarehouse === 1" v-model="batchObj.boxNum" :min="0" :max="boxOrderInfo.num" />
+                <template v-else>
+                  {{boxOrderInfo.num}}
+                </template>
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="12">
+              <el-form-item :label="$t('方数')">
+                {{getTotlContent(boxOrderInfo, ['volume'])}}
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item :label="$t('重量')">
+                {{getTotlContent(boxOrderInfo, ['weight'])}}
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+        </el-form>
+        <el-row class="operate-button">
+          <el-button type="primary" :disabled="boxOrderInfo.orderId ? false : true" @click="batchLoad">{{$t('提交')}}</el-button>
+          <el-button @click="closeDialog2">{{$t('取消')}}</el-button>
+        </el-row>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import dayjs from "dayjs";
+import { getCabinetPage } from "@/api/ecw/cabinet";
+import { getbox } from "@/api/ecw/box";
+import { confirmAirCheckout } from "@/api/ecw/boxAir";
+import {
+  loadSecGoodsList,
+  orderTagList,
+  singleCreate,
+  batchCreate,
+  singleDelete,
+  batchDelete,
+  remove,
+  getOrderDetailByBoxNo,
+  externalLoad,
+} from "@/api/ecw/boxSea";
+import {
+  getTotlContent,
+  serviceMsg,
+  getCapacity,
+  sumStatistics,
+} from "../../utils";
+import Decimal from "decimal.js";
+import { getChannelList } from "@/api/ecw/channel";
+
+/**
+ * 开始出仓
+ */
+export default {
+  name: "startPacking",
+  inheritAttrs: false,
+  props: {
+    shipmentObj: Object,
+  },
+  data() {
+    return {
+      // 表格数据
+      listData: [],
+      // 表格数据
+      tableData: {},
+      // 弹窗配置
+      dialogConfig: {
+        title: "",
+        dialogVisible: false,
+        width: "30%",
+        type: "",
+        fullscreen: false,
+      },
+      // 已装/未装
+      orderList: [],
+      // 柜型
+      cabinetList: [],
+      // 二维码/条码编号
+      qrCode: "",
+      // 批量输入
+      batchObj: {
+        boxNum: 0,
+      },
+      // 批量纠错（订单号）
+      orderObj: {},
+      // 纠错
+      correctionObj: {},
+      // 修改柜信息
+      modifyCabinetObj: {},
+      // 修改柜信息校验
+      rules: {
+        startWarehouseId: [
+          { required: true, message: this.$t("必填"), trigger: "change" },
+        ],
+        cabinetId: [
+          { required: true, message: this.$t("必填"), trigger: "change" },
+        ],
+        qrCode: [
+          { required: true, message: this.$t("必填"), trigger: "change" },
+        ],
+        orderNo: [
+          { required: true, message: this.$t("必填"), trigger: "change" },
+        ],
+      },
+      // 当前行
+      currRow: {},
+      selectedUsers: [],
+      // 订单信息
+      boxOrderInfo: {},
+      newshipmentObj: {},
+      channelList: []
+    };
+  },
+  created() {
+    this.getLoadSecGoodsList();
+    // 柜型
+    getCabinetPage(null).then((response) => {
+      this.cabinetList = response.data.list;
+    });
+    // 查询渠道
+    getChannelList().then((res) => (this.channelList = res.data));
+    // this.getBoxInfo()
+  },
+  methods: {
+    getTotlContent,
+    getBoxInfo() {
+      getbox(this.shipmentObj.id).then((res) => {
+        const { data } = res;
+        this.newshipmentObj = data ?? {};
+      });
+    },
+    /* 获取城市 */
+    importCityName(id) {
+      var arr = this.$attrs.warehouseList.filter((item) => item.id == id);
+      return arr.length > 0 ? this.$l(arr[0], "title") : this.$t("无");
+    },
+    /* 出仓部分列表 */
+    getLoadSecGoodsList() {
+      loadSecGoodsList({ shipmentId: this.shipmentObj.id }).then((res) => {
+        const { data = [] } = res;
+        this.listData = data.map((item, index) => {
+          return {
+            ...item,
+            title: this.$t("第{index}部分", { index: 1 + index }),
+          };
+        });
+        if (this.listData.length) {
+          this.tableData = this.listData[0];
+        }
+      });
+    },
+    /** 点击事件统一入口 */
+    handlerClick(type, title) {
+      this.shwoDialog({ type, title });
+    },
+    /** 表格订单号点击 */
+    orderClick(row) {
+      orderTagList({ orderId: row.orderId }).then((res) => {
+        const { data = {} } = res;
+        this.orderList = [];
+        // 取最长的list
+        let dataLength = data.loadList.length;
+        if (data.unLoadList.length > dataLength) {
+          dataLength = data.unLoadList.length;
+        }
+
+        // 组装数据，用一个table组件渲染
+        for (let index = 0; index < dataLength; index++) {
+          this.orderList.push({
+            loadTag: data.loadList[index],
+            unloadTag: data.unLoadList[index],
+          });
+        }
+      });
+      this.shwoDialog({
+        type: "orderTable",
+        title: row.selfNo,
+      });
+    },
+    /** 弹窗事件 */
+    shwoDialog(config) {
+      this.$set(this.dialogConfig, "title", config.title);
+      this.$set(this.dialogConfig, "type", config.type);
+      switch (config.type) {
+        case "orderTable":
+          this.$set(this.dialogConfig, "fullscreen", false);
+          break;
+        case "supplementOrder":
+          this.$set(this.dialogConfig, "fullscreen", true);
+          break;
+        case "batchInput":
+          this.$set(this.dialogConfig, "fullscreen", false);
+          this.batchObj = { boxNum: 0 };
+          this.boxOrderInfo = {};
+          break;
+        case "correction":
+          this.$set(this.dialogConfig, "fullscreen", false);
+          this.correctionObj = {};
+          break;
+        case "correctionOrder":
+          this.$set(this.dialogConfig, "fullscreen", false);
+          this.orderObj = {};
+          break;
+        case "modifyCabinet":
+          this.$set(this.dialogConfig, "fullscreen", false);
+          this.modifyCabinetObj = {};
+          this.$set(this.modifyCabinetObj,'cabinetId',this.shipmentObj.cabinetId)
+          this.$set(this.modifyCabinetObj,'cubNo',this.shipmentObj.cubNo)
+          break;
+      }
+      this.$set(this.dialogConfig, "dialogVisible", true);
+    },
+    /** 关闭弹窗 */
+    closeDialog2() {
+      this.$set(this.dialogConfig, "dialogVisible", false);
+    },
+    /** 修改提交 */
+    onSubmit(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          if (formName === "batchForm") {
+            this.handlerBatchCreate("batch");
+          }
+          if (formName === "correctionForm") {
+            this.handlerBatchDelete(
+              {
+                orderNumCode: this.correctionObj.qrCode,
+              },
+              "single"
+            );
+          }
+          if (formName === "orderForm") {
+            this.handlerBatchDelete(
+              { orderNo: this.orderObj.orderNo },
+              "batch"
+            );
+          }
+          if (formName === "modifyForm") {
+            this.modifyBoxUpdate();
+          }
+        }
+      });
+    },
+    /* 部分点击 */
+    partClick(item) {
+      this.tableData = item;
+    },
+    /* 出仓 */
+    handlerBatchCreate(type) {
+      let params = {
+        shipmentId: this.shipmentObj.id,
+        secId: this.tableData.id,
+      };
+      if (type === "single") {
+        if (!this.qrCode) {
+          this.$message.error(this.$t("请输入二维码/条码编号"));
+          return;
+        }
+        params.orderNumCode = this.qrCode;
+        singleCreate(params).then((res) => {
+          serviceMsg(res, this).then(() => {
+            this.qrCode = "";
+            this.getLoadSecGoodsList();
+          });
+        });
+      } else {
+        params.orderNo = this.batchObj.qrCode;
+        batchCreate(params).then((res) => {
+          serviceMsg(res, this).then(() => {
+            this.closeDialog2();
+            this.getLoadSecGoodsList();
+          });
+        });
+      }
+    },
+    /* 删除已出仓 */
+    handlerBatchDelete(params, type) {
+      params = {
+        shipmentId: this.shipmentObj.id,
+        secId: this.tableData.id,
+        ...params,
+      };
+
+      if (type === "single") {
+        singleDelete(params).then((res) => {
+          serviceMsg(res, this).then(() => {
+            this.closeDialog2();
+            this.getLoadSecGoodsList();
+          });
+        });
+      } else {
+        batchDelete(params).then((res) => {
+          serviceMsg(res, this).then(() => {
+            this.closeDialog2();
+            this.getLoadSecGoodsList();
+          });
+        });
+      }
+    },
+    /* 移出 */
+    moveOut(row) {
+      let params = {
+        shipmentId: this.shipmentObj.id,
+        secId: this.tableData.id,
+        orderId: row.orderId,
+      };
+      remove(params).then((res) => {
+        serviceMsg(res, this).then(() => {
+          this.getLoadSecGoodsList();
+        });
+      }).catch((res) => {
+        if (res.code === 666) {
+              this.$confirm("<div style='max-height:500px;overflow:auto'>"+res.msg+this.$t('是否需要一起移出?')+"</div>", this.$t("提示"), {
+                dangerouslyUseHTMLString: true,
+                distinguishCancelAndClose: true,
+                confirmButtonText: '确定移出',
+                cancelButtonText: '仅移出当前订单'
+              })
+                .then((_) => {
+                  remove({ ...params, deleteType: 2 }).then((res) => {
+                    serviceMsg(res, this).then(() => {
+                      this.getLoadSecGoodsList();
+                    });
+                  });
+                })
+                .catch(action => {
+                  if(action =='cancel'){
+                    remove({ ...params, deleteType: 1 }).then((res) => {
+                      serviceMsg(res, this).then(() => {
+                        this.getLoadSecGoodsList();
+                      });
+                    });
+                  }
+                });
+            }
+      });
+    },
+    queryOrderInfo() {
+      this.$refs["batchForm"].validate((valid) => {
+        if (valid) {
+          getOrderDetailByBoxNo({
+            orderNumCode: this.batchObj.qrCode,
+            shipmentId: this.shipmentObj.id,
+          }).then((res) => {
+            const { data } = res;
+            this.boxOrderInfo = data;
+            this.batchObj.boxNum = Number(data.num);
+          });
+        }
+      });
+    },
+    batchLoad() {
+      if (!this.boxOrderInfo.orderId) {
+        this.$message.error(this.$t("请输入订单号"));
+        return;
+      }
+      if (this.batchObj.boxNum === 0) {
+        this.$message.error(this.$t("箱数不能为0"));
+        return;
+      }
+
+      let params = {
+        boxNum: this.boxOrderInfo.num,
+        orderId: this.boxOrderInfo.orderId,
+        orderNo: this.boxOrderInfo.orderNo,
+        shipmentId: this.shipmentObj.id,
+      };
+      if (this.boxOrderInfo.isExternalWarehouse === 1) {
+        params.boxNum = this.batchObj.boxNum;
+      }
+
+      externalLoad(params).then((res) => {
+        serviceMsg(res, this).then(() => {
+          this.closeDialog2();
+          this.boxOrderInfo = {};
+          this.getLoadSecGoodsList();
+        });
+      });
+    },
+    submitCheckout(){
+      confirmAirCheckout({shipmentId: this.shipmentObj.id}).then((res) => {
+          serviceMsg(res, this).then(() => {
+            this.$emit('closeDialog1')
+          });
+        });
+    }
+  },
+  computed: {
+    /* 容量 */
+    calcCapacity() {
+      const { cabinetRespVO } = this.shipmentObj;
+      return getCapacity(cabinetRespVO);
+    },
+    /* 总计 */
+    getSumData() {
+      return sumStatistics(this.listData);
+    },
+    /* 已装总数 */
+    getInstallNumCount() {
+      let count = 0;
+      if (Array.isArray(this.listData)) {
+        this.listData.forEach((item) => {
+          const { sectionOrderList = [] } = item;
+          sectionOrderList.forEach((item) => {
+            count = Decimal.add(count, item.installNum).toNumber();
+          });
+        });
+      }
+      return count;
+    },
+    /* 渠道 */
+    getShipChannelName() {
+      return (shippingChannelId) => {
+        for (const channelItem of this.channelList) {
+          if (channelItem.channelId == shippingChannelId) {
+            return this.$l(channelItem, "name");
+          }
+        }
+      };
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.startPacking {
+  display: flex;
+  flex-direction: column;
+  p {
+    margin: 0;
+  }
+  .table-title {
+  display: flex;
+  align-items: center;
+  margin-bottom: 10px;
+  > div:first-child {
+    flex: 1;
+    font-size: 16px;
+  }
+  > div:last-child {
+    display: flex;
+    > .el-input {
+      margin-right: 10px;
+    }
+  }
+}
+.table-content {
+  .table-goodList {
+    .goodList-div {
+      border-bottom: 1px solid #e6ebf5;
+      > p {
+        text-align: left;
+      }
+      > p:last-child {
+        > span {
+          margin-right: 5px;
+        }
+      }
+    }
+    > div:last-child {
+      border-bottom: none;
+    }
+  }
+
+  .el-table {
+    color: red;
+  }
+}
+  
+  .totle-info {
+    font-size: 20px;
+    margin-top: 15px;
+    > div {
+      display: flex;
+      margin-bottom: 5px;
+    }
+    .count-info {
+      > p > span {
+        margin-right: 5px;
+      }
+    }
+  }
+
+  .process-area {
+    margin-top: 15px;
+    padding-bottom: 30px;
+    .process {
+      display: flex;
+      flex-direction: column;
+      > :first-child {
+        color: #606266;
+        font-weight: bolder;
+        font-size: 16px;
+      }
+    }
+  }
+}
+</style>