Просмотр исходного кода

新增 修改卸货港;删除卸货港

王智慧 3 лет назад
Родитель
Сommit
cffa3df263
2 измененных файлов с 188 добавлено и 20 удалено
  1. 10 0
      src/apis/fetch.js
  2. 178 20
      src/views/voyage/voyageDetail.vue

+ 10 - 0
src/apis/fetch.js

@@ -362,6 +362,16 @@ export default {
     return $http("/voyage/addNewPort", data);
   },
 
+  // 修改卸货港
+  updateDischargePort(data) {
+    return $http("/voyage/updatePort", data);
+  },
+
+  // 删除卸货港
+  deleteDischargePort(data) {
+    return $http("/voyage/deletePort", data);
+  },
+
   // 代理子账户列表
   getAgencySubAccountList(data) {
     return $http("/proxy/account/list", data);

+ 178 - 20
src/views/voyage/voyageDetail.vue

@@ -144,6 +144,7 @@
         ></el-input>
         <el-button
           v-if="voyage.voyageStatus != 2"
+          @click="showUpdateDischargePort(item)"
           class="ml20"
           type="primary"
           size="mini"
@@ -152,6 +153,7 @@
         </el-button>
         <el-button
           v-if="voyage.voyageStatus != 2"
+          @click="deleteDischargePort(item)"
           class="ml20"
           type="danger"
           size="mini"
@@ -190,7 +192,7 @@
             v-model="dischargeFormPortName"
             value-key="value"
             :fetch-suggestions="getCol"
-            @blur="clear('toInsertDiscPortId')"
+            @blur="clearNewDischargePort"
             placeholder="选择卸货港"
             @select="selectToInsertDiscProt($event)"
             style="width: 197px !important"
@@ -217,6 +219,57 @@
         </el-form-item>
       </el-form>
     </el-dialog>
+    <el-dialog
+      v-model="updateDischargePortVisable"
+      title="修改卸货港"
+      width="450px"
+      @close="cancelUpdateDiscPort"
+    >
+      <el-form
+        :model="updateDischargeForm"
+        ref="updateDischargeFormRef"
+        label-width="120px"
+        :show-message="false"
+      >
+        <el-form-item label="当前卸货港" required>
+          <el-input
+            v-model="currentUpdateDischargePort.portName"
+            disabled
+            style="width: 200px"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="修改卸货港" prop="newPortId" required>
+          <el-autocomplete
+            v-model="updateDischargeFormPortName"
+            value-key="value"
+            :fetch-suggestions="getCol"
+            placeholder="选择卸货港"
+            @blur="clearUpdateDischargePort"
+            @select="selectUpdateDiscProt($event)"
+            style="width: 197px !important"
+          />
+        </el-form-item>
+        <el-form-item>
+          <div class="df jcfe pr30 mt20">
+            <el-button
+              class="mr20"
+              type="default"
+              size="small"
+              @click="cancelUpdateDiscPort(updateDischargeFormRef)"
+            >
+              取消
+            </el-button>
+            <el-button
+              type="primary"
+              size="small"
+              @click="updateDischargePort(updateDischargeFormRef)"
+            >
+              确定
+            </el-button>
+          </div>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
     <div class="line">
       <div class="info-line">
         <div class="info-line-title">货种</div>
@@ -2513,7 +2566,6 @@ async function cancelVoyage() {
     type: "warning",
   })
     .then(async (e) => {
-      console.log(e);
       let res = await api.cancelVoyage({
         id: route.query.id,
       });
@@ -2661,7 +2713,6 @@ function showTruckRecord(item, index, text) {
   truckRecordForm.value = { ...item };
 }
 async function deleteTruckRecord(id, index) {
-  console.log(id);
   ElMessageBox.confirm("确认删除装货记录?", "Warning", {
     confirmButtonText: "删除",
     cancelButtonText: "取消",
@@ -2762,7 +2813,6 @@ async function submitDistribute() {
     recordIds: recordIds.value,
     type,
   });
-  console.log(res);
   distributeModalClose();
   getVoyageDetail();
   if (2 == type) getDischargeList();
@@ -2770,7 +2820,6 @@ async function submitDistribute() {
 }
 
 async function deleteOcrRecord(index) {
-  console.log(index);
   ocrTruckRecordTableData.value.splice(index, 1);
 }
 
@@ -2918,7 +2967,6 @@ function showLab(item, index, text) {
   labForm.value = { ...item };
 }
 async function deleteLab(id, index) {
-  console.log(id);
   ElMessageBox.confirm("确认删除装货记录?", "Warning", {
     confirmButtonText: "删除",
     cancelButtonText: "取消",
@@ -3003,14 +3051,12 @@ let getCol = _.debounce(
   1000,
   { leading: true }
 );
-function clear(type) {
-  dischargeForm.value.portId = "";
-  // toInsertDiscPortId.value = "";
-  // toInsertDiscPortValue.value = "";
-}
 
 let dischargeFormPortName = ref("");
 let selectToInsertDiscProt = (item, index) => {
+  if (checkPort(item.value, beforePorts.value, "portName")) {
+    dischargeFormPortName.value = "";
+  }
   dischargeForm.value.portId = item.key;
 };
 
@@ -3080,7 +3126,6 @@ async function getAccidentList() {
 }
 let accidentList = ref([]);
 async function addUpdateAccident() {
-  // console.log("accidentForm", accidentForm.value);
   let { accidentTime, remark, files, id } = accidentForm.value;
   let arr = [];
   for (let i of files) {
@@ -3094,7 +3139,7 @@ async function addUpdateAccident() {
     voyageFileIds: arr.join(","),
     id,
   };
-  // console.log("postData", postData);
+
   let res = await api[id ? "updateAccident" : "addAccident"](postData);
   if (res.data.status == 0) {
     resetAccidentForm();
@@ -3109,7 +3154,6 @@ function resetAccidentForm() {
   };
 }
 function accidentUploadSuccess(e) {
-  console.log(e);
   accidentForm.value.files.push(e.result);
 }
 function accidentPageChange(e) {
@@ -3167,12 +3211,13 @@ let addDischargeVisable = ref(false);
 let dischargeForm = ref({});
 let dischargeFormRef = ref(null);
 let beforePorts = ref([]);
-function showAddDischargePortModal() {
-  addDischargeVisable.value = true;
-  beforePorts.value[0] = {
-    portName: voyage.value.loadPort,
-    previousPortId: 0,
-  };
+function initBefortPorts() {
+  beforePorts.value = [
+    {
+      portName: voyage.value.loadPort,
+      previousPortId: 0,
+    },
+  ];
   for (const i of voyage.value.voyageDetails) {
     beforePorts.value.push({
       portName: i.portName,
@@ -3180,6 +3225,119 @@ function showAddDischargePortModal() {
     });
   }
 }
+function showAddDischargePortModal() {
+  addDischargeVisable.value = true;
+  initBefortPorts();
+}
+
+function clearNewDischargePort() {
+  dischargeForm.value.portId = "";
+}
+
+function clearUpdateDischargePort() {
+  updateDischargeFormPortName.value = "";
+  updateDischargeForm.value = {};
+}
+let updateDischargePortVisable = ref(false);
+let currentUpdateDischargePort = ref({});
+function showUpdateDischargePort(item) {
+  updateDischargePortVisable.value = true;
+  currentUpdateDischargePort.value = item;
+  initBefortPorts();
+}
+
+function deleteDischargePort(item) {
+  ElMessageBox.confirm(
+    `
+  <div style='color:#333;margin-bottom:5px'>确认删除卸货港 : ${item.portName}? </div><div style='font-size:12px'>此操作会同时删除当前港口下的记录</div>
+  `,
+    "提示",
+    {
+      confirmButtonText: "确认",
+      cancelButtonText: "取消",
+      type: "warning",
+      dangerouslyUseHTMLString: true,
+    }
+  )
+    .then(async () => {
+      let res = await api.deleteDischargePort({
+        voyageId: route.query.id,
+        portId: item.portId,
+      });
+      if (res.data.status == 0) {
+        ElMessage({
+          message: "删除卸货港成功!",
+          type: "success",
+        });
+        getVoyageDetail();
+      } else {
+        ElMessage({
+          message: res.data.msg,
+          type: "error",
+        });
+      }
+    })
+    .catch(() => {});
+}
+
+let updateDischargeForm = ref({});
+let updateDischargeFormRef = ref(null);
+let updateDischargeFormPortName = ref("");
+function selectUpdateDiscProt(item) {
+  if (checkPort(item.value, beforePorts.value, "portName")) {
+    updateDischargeFormPortName.value = "";
+  }
+  updateDischargeForm.value.newPortId = item.key;
+}
+
+async function updateDischargePort(formEl) {
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      let postData = {
+        voyageId: route.query.id,
+        portId: currentUpdateDischargePort.value.portId,
+        ...updateDischargeForm.value,
+      };
+      let res = await api.updateDischargePort(postData);
+      if (res.data.status == 0) {
+        ElMessage({
+          message: "修改卸货港成功!",
+          type: "success",
+        });
+        getVoyageDetail(true);
+        cancelUpdateDiscPort();
+      } else {
+        ElMessage({
+          message: res.data.msg,
+          type: "error",
+        });
+      }
+    } else {
+      console.log("error submit!", fields);
+    }
+  });
+}
+
+function cancelUpdateDiscPort() {
+  updateDischargePortVisable.value = false;
+  updateDischargeForm.value = {};
+  updateDischargeFormPortName.value = "";
+}
+
+function checkPort(portName = -1, ports = [], attr) {
+  let b = ports.some((item) => {
+    return item[attr] == portName;
+  });
+  if (b) {
+    ElMessage({
+      message: "港口已存在!",
+      type: "error",
+    });
+  }
+  return b;
+}
+
 onMounted(() => {
   getVoyageDetail(true);
 });