新增 合并航次

src/apis/fetch.js

@@ -211,4 +211,8 @@ export default {
   getIndexSelect(data) {
     return $http("/pc/index/select", data);
   },
+  // 合并航次
+  mergeVoyage(data) {
+    return $http("/voyage/merge", data);
+  },
 };

src/views/voyage/voyageList.vue

@@ -35,15 +35,22 @@
           卸货中
         </div>
         <div
+          style="border-left: none"
           @click="changeVoyageType(4)"
+          :class="status == 4 ? 'currentbtn radio-btns' : 'radio-btns'"
+        >
+          历史航次
+        </div>
+        <div
+          @click="changeVoyageType(5)"
           :class="
-            status == 4
+            status == 5
               ? 'currentbtn radio-btns right-radius'
               : 'radio-btns right-radius '
           "
           style="margin-right: 40px; border-left: none"
         >
-          历史航次
+          合并航次
         </div>
         <!-- <div style="color: #333; margin-right: 10px; font-size: 14px">
           预计到港时间:
@@ -54,7 +61,9 @@
           <el-radio :label="1">升序</el-radio>
         </el-radio-group> -->
         <el-input
-          placeholder="请输入船名/MMSI"
+          :placeholder="
+            status != 5 ? '请输入船名/MMSI' : '船名/MMSI/合同编号/客户'
+          "
           prefix-icon="el-icon-search"
           v-model="term"
           clearable
@@ -66,52 +75,115 @@
       <!-- <div class="cargo-owner-add" @click="voyageAddDialogVisible = true">
         添加航次
       </div> -->
-      <el-popover placement="bottom" :width="100" trigger="hover">
-        <template #reference>
-          <el-button size="medium" type="primary">导出</el-button>
-        </template>
-        <div
-          style="
-            display: flex;
-            flex-direction: column;
-            height: 180px;
-            justify-content: space-between;
-          "
+      <div>
+        <el-button
+          v-if="cacheList.length > 1"
+          class="mr20"
+          @click="mergeVisable = true"
+          size="medium"
+          type="primary"
         >
-          <el-button
-            type="primary"
-            size="medium"
-            v-auth="'DOWNLOADVOYAGELIST'"
-            @click="showExportModal('航次列表')"
-          >
-            导出航次列表
-          </el-button>
-          <el-button
-            type="primary"
-            size="medium"
-            v-auth="'MULTDOWNLOADSHIPTRACK'"
-            @click="showExportModal('航次跟踪')"
+          合并航次
+        </el-button>
+        <el-popover placement="bottom" :width="100" trigger="hover">
+          <template #reference>
+            <el-button size="medium" type="primary">导出</el-button>
+          </template>
+          <div
+            style="
+              display: flex;
+              flex-direction: column;
+              height: 180px;
+              justify-content: space-between;
+            "
           >
-            导出航次跟踪
+            <el-button
+              type="primary"
+              size="medium"
+              v-auth="'DOWNLOADVOYAGELIST'"
+              @click="showExportModal('航次列表')"
+            >
+              导出航次列表
+            </el-button>
+            <el-button
+              type="primary"
+              size="medium"
+              v-auth="'MULTDOWNLOADSHIPTRACK'"
+              @click="showExportModal('航次跟踪')"
+            >
+              导出航次跟踪
+            </el-button>
+            <el-button
+              type="primary"
+              size="medium"
+              @click="showExportModal('卸货记录')"
+              v-auth="'MULTDOWNLOADDISCHARGE'"
+            >
+              导出卸货记录
+            </el-button>
+            <el-button
+              v-auth="'DOWNLOADFYDI'"
+              type="primary"
+              size="medium"
+              @click="downloadFYDI"
+            >
+              下载FYDI指数
+            </el-button>
+          </div>
+        </el-popover>
+      </div>
+      <el-dialog v-model="mergeVisable" title="合并航次">
+        <el-table :data="cacheList" border stripe>
+          <el-table-column
+            prop="voyageName"
+            label="航次名称"
+            min-width="140"
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="dischargePort"
+            label="卸货港"
+            min-width="80"
+            align="center"
+          ></el-table-column>
+          <el-table-column
+            prop="cargo"
+            v-if="cargoVisable"
+            label="货种"
+            min-width="70"
+            align="center"
+          ></el-table-column>
+        </el-table>
+        <el-form
+          class="mt20"
+          ref="mergeFormRef"
+          label-width="100px"
+          :inline="true"
+          :rules="mergeRules"
+          :model="mergeForm"
+        >
+          <el-form-item label="合同编号">
+            <el-input v-model="mergeForm.contractNum" />
+          </el-form-item>
+          <el-form-item label="客户名称">
+            <el-input v-model="mergeForm.clientName" />
+          </el-form-item>
+        </el-form>
+        <div class="df jcfe mt30">
+          <el-button class="mr20" @click="mergeVisable = false" size="medium">
+            取消
           </el-button>
           <el-button
-            type="primary"
+            v-if="mergeForm.contractNum && mergeForm.clientName"
+            class="mr20"
+            @click="mergeVoyage"
             size="medium"
-            @click="showExportModal('卸货记录')"
-            v-auth="'MULTDOWNLOADDISCHARGE'"
-          >
-            导出卸货记录
-          </el-button>
-          <el-button
-            v-auth="'DOWNLOADFYDI'"
             type="primary"
-            size="medium"
-            @click="downloadFYDI"
           >
-            下载FYDI指数
+            合并航次
           </el-button>
         </div>
-      </el-popover>
+      </el-dialog>
     </div>
     <el-dialog
       v-model="exportModalVisable"
@@ -422,16 +494,38 @@
     </div>
     <el-table
       :data="tableData"
+      ref="tableRef"
       stripe
       style="width: 100%; margin-top: 12px"
       :row-style="rowStyle"
+      @select="preSelect"
+      @select-all="preSelectAll"
+      @selection-change="preSelectionChange"
     >
+      <el-table-column v-if="status != 5" type="selection" width="55" />
+
       <!-- <el-table-column
         type="index"
         label="序号"
         min-width="80"
         align="center"
       ></el-table-column> -->
+      <el-table-column
+        prop="contractNum"
+        label="合同编号"
+        sortable
+        v-if="status == 5"
+        min-width="100"
+        align="center"
+      ></el-table-column>
+      <el-table-column
+        prop="clientName"
+        label="客户名称"
+        sortable
+        v-if="status == 5"
+        min-width="100"
+        align="center"
+      ></el-table-column>
       <el-table-column
         prop="voyageName"
         label="航次名称"
@@ -597,6 +691,7 @@
     <div style="width: 100%; text-align: right; margin-top: 43px">
       <el-pagination
         background
+        :page-size="pageSize"
         layout="prev, pager, next"
         :total="total"
         :current-page="currentPage"
@@ -618,10 +713,11 @@ import downloadBlobFile from "../../utils/downloadBlobFile";
 import url from "../../apis/config";
 
 let currentPage = ref(1);
+let pageSize = ref(10);
 let term = ref("");
 let tableData = ref([]);
 let total = ref(0);
-let status = ref(3);
+let status = ref(0);
 let loginAccountId = ref("");
 let voyageListPostData = ref({});
 let cargoOwnerId = localStorage.userId;
@@ -636,11 +732,12 @@ async function getVoyageList(type) {
     status: status.value,
     term: term.value,
     currentPage: currentPage.value,
-    size: 10,
+    size: pageSize.value,
   });
   if (res.data.status == 0) {
     tableData.value = res.data.result;
     total.value = res.data.total;
+    reSelect();
   } else {
     tableData.value = [];
     total.value = 0;
@@ -1094,6 +1191,7 @@ function resetFilter() {
   loadPortFilterStr.value = "";
   discPortFilterStr.value = "";
   cargoFilterStr.value = "";
+  cacheList.value = [];
   voyageListPostData.value = {};
   getVoyageList(1);
 }
@@ -1116,6 +1214,71 @@ async function getPortSelect() {
   });
   portOptions.value = res.data.result;
 }
+let isDelete = ref(false);
+let cacheList = ref([]);
+function preSelect(e, row) {
+  console.log(e);
+  for (let i in cacheList.value) {
+    if (cacheList.value[i].id == row.id) {
+      cacheList.value.splice(i, 1);
+      break;
+    }
+  }
+}
+function preSelectAll(e) {
+  console.log(e);
+  if (!e.length) {
+    let arr = tableData.value;
+    cacheList.value = cacheList.value.filter(
+      (x) => !arr.some((item) => x.id == item.id)
+    );
+  }
+}
+function preSelectionChange(e) {
+  console.log(e);
+
+  cacheList.value = cacheList.value.concat(e);
+  cacheList.value = _.uniqWith(cacheList.value, _.isEqual);
+}
+let tableRef = ref(null);
+function reSelect() {
+  for (let i of tableData.value) {
+    for (let j of cacheList.value) {
+      if (i.id == j.id) {
+        tableRef.value.toggleRowSelection(i, true);
+        continue;
+      }
+    }
+  }
+}
+
+let mergeVisable = ref(false);
+let mergeFormRef = ref(null);
+let mergeForm = ref({});
+let mergeRules = ref({});
+async function mergeVoyage() {
+  let arr = [];
+  for (let i of cacheList.value) {
+    arr.push(i.id);
+  }
+  let res = await api.mergeVoyage({
+    ...mergeForm.value,
+    voyageIds: arr.join(","),
+  });
+  if (res.data.status == 0) {
+    ElNotification({
+      title: res.data.msg,
+      type: "success",
+    });
+  }
+  cacheList.value = [];
+  clearMergeForm();
+  getVoyageList();
+}
+function clearMergeForm() {
+  mergeVisable.value = false;
+  mergeForm.value = {};
+}
 
 onMounted(() => {
   getVoyageList(1);