更新 航次列表

src/views/voyage/voyageList.vue

@@ -5,26 +5,47 @@
         <div
           @click="changeVoyageType(1)"
           :class="
-            currentbtn
+            currentbtn == 1
               ? 'currentbtn radio-btns left-radius'
               : 'radio-btns left-radius'
           "
         >
-          执行中航次
+          装货中
         </div>
         <div
+          style="border-left: none"
           @click="changeVoyageType(2)"
+          :class="currentbtn == 2 ? 'currentbtn radio-btns' : 'radio-btns'"
+        >
+          运输中
+        </div>
+        <div
+          style="border-left: none"
+          @click="changeVoyageType(3)"
+          :class="currentbtn == 3 ? 'currentbtn radio-btns' : 'radio-btns'"
+        >
+          卸货中
+        </div>
+        <div
+          style="border-left: none"
+          @click="changeVoyageType(4)"
+          :class="currentbtn == 4 ? 'currentbtn radio-btns' : 'radio-btns'"
+        >
+          未签单
+        </div>
+        <div
+          @click="changeVoyageType(5)"
           :class="
-            currentbtn
-              ? ' radio-btns right-radius'
-              : 'radio-btns right-radius currentbtn'
+            currentbtn == 5
+              ? 'currentbtn radio-btns right-radius'
+              : 'radio-btns right-radius '
           "
-          style="margin-right: 40px"
+          style="margin-right: 40px; border-left: none"
         >
           历史航次
         </div>
         <el-input
-          placeholder="请输入货主名称/联系人/联系人手机号"
+          placeholder="请输入货主名称/船名/MMSi"
           prefix-icon="el-icon-search"
           v-model="term"
           clearable
@@ -50,13 +71,13 @@
             <el-input v-model="voyageForm.voyageName"></el-input>
           </el-form-item>
           <el-form-item label=""></el-form-item>
-          <el-form-item prop="shipOwnerId" label="船东">
+          <el-form-item prop="shipName" label="船舶">
             <!-- <el-input v-model="voyageForm.shipOwnerId"></el-input> -->
             <el-autocomplete
-              v-model="voyageForm.shipOwnerName"
-              :fetch-suggestions="seachShipOwner"
-              placeholder="选择船东"
-              @select="selectShipOwner"
+              v-model="voyageForm.shipName"
+              :fetch-suggestions="searchShip"
+              placeholder="选择船舶"
+              @select="selectShip"
             />
           </el-form-item>
           <el-form-item prop="cargoOwnerId" label="货主">
@@ -81,6 +102,7 @@
               type="date"
               value-format="YYYY/MM/DD"
               placeholder="航次结束时间"
+              disabled
             ></el-date-picker>
           </el-form-item>
           <el-form-item prop="loadPort" label="装货港">
@@ -124,8 +146,8 @@
         align="center"
       ></el-table-column>
       <el-table-column
-        prop="startEndTime"
-        label="开始时间-结束时间"
+        prop="setSailTime"
+        label="开航时间"
         min-width="200"
         align="center"
       ></el-table-column>
@@ -217,7 +239,7 @@ export default {
     function changeVoyageType(s) {
       term.value = "";
       currentPage.value = 1;
-      currentbtn.value = s == 1;
+      currentbtn.value = s;
       status.value = s;
       getVoyageList();
     }
@@ -245,18 +267,13 @@ export default {
         voyageName: [
           { required: true, message: "请填写航次名称", trigger: "blur" },
         ],
-        shipOwnerId: [
-          { required: true, message: "请选择船东", trigger: "blur" },
-        ],
+        shipName: [{ required: true, message: "请选择船舶", trigger: "blur" }],
         cargoOwnerId: [
           { required: true, message: "请选择货主", trigger: "blur" },
         ],
         startTime: [
           { required: true, message: "请填写开始时间", trigger: "blur" },
         ],
-        endTime: [
-          { required: true, message: "请填写结束时间", trigger: "blur" },
-        ],
         loadPort: [
           { required: true, message: "请填写装货港", trigger: "blur" },
         ],
@@ -304,6 +321,7 @@ export default {
               type: "success",
             });
             resetAddVoyageForm();
+            getVoyageList();
           } else {
             console.log(res);
             ElNotification({
@@ -315,21 +333,21 @@ export default {
       });
     }
 
-    async function seachShipOwner(queryString, cb) {
+    async function searchShip(queryString, cb) {
       if (!queryString) return;
-      let res = await api.getUserInfoAndShipInfo({
+      let res = await api.searchShip({
         term: queryString,
       });
-      let shipOwners = [];
+      let ships = [];
       if (res.data.status == 0) {
-        shipOwners = res.data.result;
-        for (let i of shipOwners) {
-          i.value = `${i.shipOwnerName}-${i.shipName}`;
+        ships = res.data.result;
+        for (let i of ships) {
+          i.value = `${i.shipName}`;
         }
-        cb(shipOwners);
+        cb(ships);
       }
     }
-    const selectShipOwner = (item) => {
+    const selectShip = (item) => {
       voyageForm.voyageForm.shipOwnerId = item.shipOwnerId;
       voyageForm.voyageForm.shipId = item.shipId;
     };
@@ -380,8 +398,8 @@ export default {
       addVoyageForm,
       ...toRefs(rules),
       ...toRefs(voyageForm),
-      seachShipOwner,
-      selectShipOwner,
+      searchShip,
+      selectShip,
       seachCargoOwner,
       selectCargoOwner,
       resetAddVoyageForm,
@@ -524,7 +542,4 @@ export default {
 :deep() .el-autocomplete {
   width: 220px;
 }
-:deep() .el-input__inner {
-  text-align: center;
-}
 </style>