订舱拖车修改功能开发

src/api/ecw/boxSea.js

@@ -8,6 +8,14 @@ import request from "@/utils/request";
  * @return {*}
  */
 export function booking(data) {
+  if (data.id) {
+    return request({
+      url: "/ecw/box-book-sea/update",
+      method: "put",
+      data,
+    });
+  }
+
   return request({
     url: "/ecw/box-book-sea/create",
     method: "post",
@@ -23,6 +31,13 @@ export function booking(data) {
  * @return {*}
  */
 export function trailer(data) {
+  if (data.id) {
+    return request({
+      url: "/ecw/box-trailer/update",
+      method: "put",
+      data,
+    });
+  }
   return request({
     url: "/ecw/box-trailer/create",
     method: "post",

src/views/ecw/box/shippingSea/nodePage/booking.vue

@@ -89,6 +89,7 @@ import { booking, serviceMsg } from "@/api/ecw/boxSea";
 import supplierSelect from "./common/supplierSelect.vue";
 import dockSelect from "./common/dockSelect.vue";
 import userSelect from "./common/userSelect.vue";
+import { formatStringNumber, formatDateStr } from "../utils";
 /**
  * 订舱
  */
@@ -114,7 +115,13 @@ export default {
       },
     };
   },
-  created() {},
+  created() {
+    const voName = this.$attrs.currNode.voName;
+    let oldData = { ...this.shipmentObj[voName] };
+    oldData = formatStringNumber(oldData, ["shipCompanyType", "spaceCompany"]);
+    oldData = formatDateStr(oldData, ["sailTime", "bargeTime"]);
+    this.bookingObj = oldData;
+  },
   methods: {
     /** 提交 */
     onSubmit() {
@@ -126,15 +133,15 @@ export default {
             operateType: 2,
           }).then((res) => {
             serviceMsg(res, this).then(() => {
-              this.cancel();
+              this.cancel("submit");
             });
           });
         }
       });
     },
     /** 取消 */
-    cancel() {
-      this.$emit("closeDialog");
+    cancel(type) {
+      this.$emit("closeDialog", type);
     },
   },
 };

src/views/ecw/box/shippingSea/nodePage/trailer.vue

@@ -39,6 +39,11 @@
 <script>
 import { trailer, serviceMsg } from "@/api/ecw/boxSea";
 import supplierSelect from "./common/supplierSelect.vue";
+import {
+  formatStringNumber,
+  formatDateStr,
+  formatNumberString,
+} from "../utils";
 /**
  * 拖车
  */
@@ -56,6 +61,15 @@ export default {
       },
     };
   },
+  created() {
+    const { currNode, shipmentObj } = this.$attrs;
+    const voName = currNode.voName;
+    let oldData = { ...shipmentObj[voName] };
+    oldData = formatNumberString(oldData, ["tlContainerStatus"]);
+    oldData = formatStringNumber(oldData, ["tlCompanyId"]);
+    oldData = formatDateStr(oldData, ["tlTime"]);
+    this.trailerObj = oldData;
+  },
   methods: {
     /** 提交 */
     onSubmit(operateType) {
@@ -67,15 +81,15 @@ export default {
             operateType,
           }).then((res) => {
             serviceMsg(res, this).then(() => {
-              this.cancel();
+              this.cancel("submit");
             });
           });
         }
       });
     },
     /** 取消 */
-    cancel() {
-      this.$emit("closeDialog");
+    cancel(type) {
+      this.$emit("closeDialog", type);
     },
   },
 };

src/views/ecw/box/shippingSea/seaProcess.vue

@@ -22,8 +22,8 @@
     </el-scrollbar>
 
     <!-- 弹窗 -->
-    <el-dialog custom-class="shipping-dialog" :title="dialogConfig.title" :visible.sync="dialogConfig.dialogVisible" :width="dialogConfig.width" :fullscreen="dialogConfig.fullscreen" :close-on-click-modal=false :modal-append-to-body=false append-to-body destroy-on-close>
-      <component v-bind:is="currentComponent" @closeDialog="closeDialog" v-bind="$attrs" :shipmentObj="shipmentObj"></component>
+    <el-dialog custom-class="shipping-dialog" :title="dialogConfig.title" :visible.sync="dialogConfig.dialogVisible" :width="dialogConfig.width" :fullscreen="dialogConfig.fullscreen" :close-on-click-modal=false :modal-append-to-body=false append-to-body>
+      <component v-bind:is="currentComponent" v-if="dialogConfig.dialogVisible" @closeDialog="closeDialog" v-bind="$attrs" :shipmentObj="shipmentObj" :currNode="currNode"></component>
     </el-dialog>
   </div>
 </template>
@@ -89,13 +89,18 @@ export default {
       currIndex: 0,
       // 当前步骤节点状态
       currNodeStatus: "",
+      // 当前节点
+      currNode: {},
     };
   },
   created() {},
   methods: {
     /** 关闭弹窗 */
-    closeDialog() {
+    closeDialog(type) {
       this.$set(this.dialogConfig, "dialogVisible", false);
+      if (type === "submit") {
+        this.$emit("getBoxInfo");
+      }
     },
     /** 节点点击 */
     nodeClick(currIndex, node) {
@@ -103,6 +108,7 @@ export default {
         this.$message.error("请先完成上一步");
         return;
       }
+      this.currNode = node;
       this.currentComponent = `${node.type}Widget`;
       this.$set(this.dialogConfig, "width", "500px");
       this.$set(this.dialogConfig, "title", node.title);

src/views/ecw/box/shippingSea/seaStepDetail.vue

@@ -3,7 +3,7 @@
     <el-scrollbar :vertical="true">
       <div class="shipping-step">
         <template v-for="(step, index) in flatSeaStep">
-          <div :key="index" v-if="shipmentObj[step.voName]" class="step-table">
+          <div :key="index" v-if="shipmentObj[step.voName] && columnsMapping[step.voName]" class="step-table">
             <div class="step-title">{{step.title}}</div>
             <div v-for="(data, index) in columnsMapping[step.voName]" :key="index" class="step-content">
               <p>{{data.title}}</p>
@@ -98,6 +98,7 @@ export default {
           {
             title: "拖车公司",
             key: "tlCompanyId",
+            type: "supplier",
           },
           {
             title: "拖车时间",
@@ -116,10 +117,6 @@ export default {
             title: "联系方式",
             key: "tlDriverContact",
           },
-          {
-            title: "联系方式",
-            key: "tlDriverContact",
-          },
           {
             title: "业务员",
             key: "operator",

src/views/ecw/box/shippingSea/shippingSea.vue

@@ -26,7 +26,7 @@
         </el-card>
 
         <!-- 海运流程图 -->
-        <seaProcess :seaBaseData="seaBaseData" :shipmentObj="shipmentObj" :allSupplier="allSupplier" :allDocks="allDocks" :allUsers="allUsers" @setStatus="setStatus" />
+        <seaProcess :seaBaseData="seaBaseData" :shipmentObj="shipmentObj" :allSupplier="allSupplier" :allDocks="allDocks" :allUsers="allUsers" @setStatus="setStatus" @getBoxInfo="getBoxInfo" />
 
         <!-- 海运步骤图 -->
         <seaStepDetail :seaBaseData="seaBaseData" :shipmentObj="shipmentObj" :allSupplier="allSupplier" :allDocks="allDocks" :allUsers="allUsers" />
@@ -43,7 +43,7 @@ import { getWarehouseList } from "@/api/ecw/warehouse";
 import { getSupplierPage } from "@/api/ecw/supplier";
 import { getDockPage } from "@/api/ecw/dock";
 import { listUser } from "@/api/system/user";
-import { statusName, seaBaseData } from "./constant";
+import { statusName, seaBaseData } from "./utils";
 
 /**
  * 海运操作主页面
@@ -74,11 +74,7 @@ export default {
     };
   },
   created() {
-    // 出货
-    getbox(this.shipmentId).then((res) => {
-      const { data } = res;
-      this.shipmentObj = data ?? {};
-    });
+    this.getBoxInfo();
     // 仓库
     getWarehouseList().then((r) => {
       this.warehouseList = r.data;
@@ -114,6 +110,13 @@ export default {
     setStatus(status) {
       this.statusLabel = statusName.get(status);
     },
+    // 出货
+    getBoxInfo() {
+      getbox(this.shipmentId).then((res) => {
+        const { data } = res;
+        this.shipmentObj = data ?? {};
+      });
+    },
   },
 };
 </script>

src/views/ecw/box/shippingSea/constant.js → src/views/ecw/box/shippingSea/utils.js

+import dayjs from "dayjs";
+
 const statusName = new Map();
 
 statusName.set(11, "未订舱");
@@ -377,4 +379,37 @@ const seaBaseData = [
   ],
 ];
 
-export { statusName, seaBaseData };
+function formatStringNumber(obj, keys) {
+  for (const [key, value] of Object.entries(obj)) {
+    if (keys.includes(key) && !Number.isNaN(Number(value))) {
+      obj[key] = Number(value);
+    }
+  }
+  return obj;
+}
+
+function formatNumberString(obj, keys) {
+  for (const [key, value] of Object.entries(obj)) {
+    if (keys.includes(key) && value) {
+      obj[key] = String(value);
+    }
+  }
+  return obj;
+}
+
+function formatDateStr(obj, keys) {
+  for (const [key, value] of Object.entries(obj)) {
+    if (keys.includes(key) && dayjs(value).isValid()) {
+      obj[key] = dayjs(value).format("YYYY-MM-DD");
+    }
+  }
+  return obj;
+}
+
+export {
+  statusName,
+  seaBaseData,
+  formatStringNumber,
+  formatDateStr,
+  formatNumberString,
+};