清关文件开发

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

+<template>
+  <div>
+    <el-form ref="cDocForm" :model="cDocObj" label-width="100px">
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="出单方式">
+            <el-select v-model="cDocObj.method" placeholder="请选择出单方式">
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="电放时间">
+            <el-date-picker type="date" placeholder="请选择日期" v-model="cDocObj.dischargeTime"></el-date-picker>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="寄送时间">
+            <el-date-picker type="date" placeholder="请选择日期" v-model="cDocObj.deliveryTime"></el-date-picker>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="快递单号">
+            <el-input v-model="cDocObj.courierNumber" placeholder="请输入快递单号"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item label="电放凭证附件">
+        <el-upload action="" :file-list="cDocObj.fileList">
+          <el-button size="small" type="primary">选择文件</el-button>
+        </el-upload>
+      </el-form-item>
+
+      <el-form-item label="agent list">
+        <el-radio-group v-model="cDocObj.agent">
+          <el-radio v-for="item in status" :key="item.value" :label="item.value">{{item.label}}</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item>
+        <el-date-picker type="date" placeholder="请选择日期" v-model="cDocObj.agenTime"></el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-upload action="" :file-list="cDocObj.agentFileList">
+          <el-button size="small" type="primary">选择文件</el-button>
+        </el-upload>
+      </el-form-item>
+
+      <el-form-item label="soncap">
+        <el-radio-group v-model="cDocObj.soncap">
+          <el-radio v-for="item in status" :key="item.value" :label="item.value">{{item.label}}</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item>
+        <el-date-picker type="date" placeholder="请选择日期" v-model="cDocObj.soncapTime"></el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-upload action="" :file-list="cDocObj.soncapFileList">
+          <el-button size="small" type="primary">选择文件</el-button>
+        </el-upload>
+      </el-form-item>
+
+    </el-form>
+    <el-row class="operate-button">
+      <el-button type="primary" @click="onSubmit">保存</el-button>
+      <el-button type="success" @click="onSubmit">提交</el-button>
+      <el-button @click="cancel">关闭</el-button>
+    </el-row>
+  </div>
+</template>
+
+<script>
+/**
+ * 清关文件
+ */
+export default {
+  name: "clearanceDocument",
+  data() {
+    return {
+      // 清关文件对象
+      cDocObj: {
+        fileList: [],
+      },
+      // 出单方式
+      method: [
+        {
+          value: "1",
+          label: "正本",
+        },
+        {
+          value: "2",
+          label: "电放",
+        },
+      ],
+      // 选项
+      status: [
+        {
+          value: "1",
+          label: "无需",
+        },
+        {
+          value: "2",
+          label: "已做",
+        },
+      ],
+    };
+  },
+  methods: {
+    /** 提交 */
+    onSubmit() {
+      this.$refs["cDocForm"].validate((valid) => {
+        if (valid) {
+          alert("submit!");
+        }
+      });
+    },
+    /** 取消 */
+    cancel() {
+      this.$emit("closeDialog");
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

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

@@ -33,17 +33,19 @@
       <!-- 装柜 -->
       <cabinetWidget :boxId="boxId" @closeDialog="closeDialog" v-if="dialogConfig.type === 'cabinet'" />
       <!-- 报关 -->
-      <customsClearance @closeDialog="closeDialog" v-if="dialogConfig.type === 'customsDeclaration'" />
+      <customsClearanceWidget @closeDialog="closeDialog" v-if="dialogConfig.type === 'customsDeclaration'" />
       <!-- 配船 -->
-      <ship @closeDialog="closeDialog" v-if="dialogConfig.type === 'ship'" />
+      <shipWidget @closeDialog="closeDialog" v-if="dialogConfig.type === 'ship'" />
       <!-- 提单材料 -->
-      <subMaterial @closeDialog="closeDialog" v-if="dialogConfig.type === 'subMaterial'" />
+      <subMaterialWidget @closeDialog="closeDialog" v-if="dialogConfig.type === 'subMaterial'" />
       <!-- 驳船 -->
-      <barge @closeDialog="closeDialog" v-if="dialogConfig.type === 'barge'" />
+      <bargeWidget @closeDialog="closeDialog" v-if="dialogConfig.type === 'barge'" />
       <!-- 起运 -->
-      <departure @closeDialog="closeDialog" v-if="dialogConfig.type === 'departure'" />
+      <departureWidget @closeDialog="closeDialog" v-if="dialogConfig.type === 'departure'" />
       <!-- 提单copy -->
-      <blCopy @closeDialog="closeDialog" v-if="dialogConfig.type === 'blCopy'" />
+      <blCopyWidget @closeDialog="closeDialog" v-if="dialogConfig.type === 'blCopy'" />
+      <!-- 清关文件 -->
+      <clearanceDocumentWidget @closeDialog="closeDialog" v-if="dialogConfig.type === 'clearanceDocument'" />
     </el-dialog>
   </div>
 </template>
@@ -54,12 +56,13 @@ import trailerWidget from "./nodePage/trailer";
 import preinstallWidget from "./nodePage/preinstall";
 import agentWidget from "./nodePage/agent";
 import cabinetWidget from "./nodePage/cabinet";
-import customsClearance from "./nodePage/customsClearance";
-import ship from "./nodePage/ship";
-import subMaterial from "./nodePage/subMaterial";
-import barge from "./nodePage/barge";
-import departure from "./nodePage/departure";
-import blCopy from "./nodePage/blCopy";
+import customsClearanceWidget from "./nodePage/customsClearance";
+import shipWidget from "./nodePage/ship";
+import subMaterialWidget from "./nodePage/subMaterial";
+import bargeWidget from "./nodePage/barge";
+import departureWidget from "./nodePage/departure";
+import blCopyWidget from "./nodePage/blCopy";
+import clearanceDocumentWidget from "./nodePage/clearanceDocument";
 
 /**
  * 海运流程图
@@ -72,12 +75,13 @@ export default {
     preinstallWidget,
     agentWidget,
     cabinetWidget,
-    customsClearance,
-    ship,
-    subMaterial,
-    barge,
-    departure,
-    blCopy,
+    customsClearanceWidget,
+    shipWidget,
+    subMaterialWidget,
+    bargeWidget,
+    departureWidget,
+    blCopyWidget,
+    clearanceDocumentWidget,
   },
   props: {
     shippingType: String,
@@ -220,6 +224,8 @@ export default {
         case "booking":
         // 驳船
         case "barge":
+        // 清关文件
+        case "clearanceDocumentWidget":
           this.$set(this.dialogConfig, "width", "700px");
           this.$set(this.dialogConfig, "fullscreen", false);
           break;