更新 航次列表

src/views/voyage/voyageList.vue

@@ -381,6 +381,11 @@
       <el-table-column
         prop="abnormalStatus"
         label="航次状态"
+        :filters="[
+          { text: '正常', value: 0 },
+          { text: '异常', value: 1 },
+        ]"
+        :filter-method="filterHandler"
         min-width="80"
         align="center"
       >
@@ -451,11 +456,18 @@
       <el-table-column
         prop="hasInsurance"
         label="保险状态"
-        min-width="70"
+        min-width="80"
+        :filters="[
+          { text: '未购买', value: 0 },
+          { text: '已购买', value: 1 },
+        ]"
+        :filter-method="filterHandler"
         align="center"
       >
         <template v-slot="scope">
-          {{ scope.row.hasInsurance == 0 ? "未购买" : "已购买" }}
+          <span :style="scope.row.hasInsurance == 0 ? 'color:red' : ''">
+            {{ scope.row.hasInsurance == 0 ? "未购买" : "已购买" }}
+          </span>
         </template>
       </el-table-column>
       <!-- <el-table-column
@@ -494,12 +506,15 @@
       style="width: 100%; text-align: right; margin-top: 43px"
     >
       <el-pagination
+        v-model:current-page="currentPage"
+        v-model:page-size="pageSize"
+        :page-sizes="[50, 100, 200]"
         background
-        layout="prev, pager, next"
+        layout="sizes, prev, pager, next"
         :total="total"
-        :page-size="pageSize"
+        @size-change="sizeChange"
         @current-change="pageChange"
-      ></el-pagination>
+      />
     </div>
   </div>
 </template>
@@ -515,7 +530,7 @@ import _ from "lodash";
 import url from "../../apis/config";
 
 let currentPage = ref(1);
-let pageSize = ref(20);
+let pageSize = ref(50);
 let term = ref("");
 let tableData = ref([]);
 let total = ref(0);
@@ -553,6 +568,11 @@ function pageChange(e) {
   getVoyageList();
 }
 
+function sizeChange() {
+  currentPage.value = 1;
+  getVoyageList();
+}
+
 function goToVoyageAdd() {
   router.push({
     path: "/voyage/voyageAdd",
@@ -756,7 +776,7 @@ function FYDIModalClose() {
 function rowStyle({ row }) {
   let rowStyle = {};
   if (row.daysInPort >= 30) {
-    rowStyle.color = "red";
+    rowStyle.color = "#e6a23c";
     return rowStyle;
   }
 }
@@ -868,6 +888,11 @@ function removeDischargePort(index) {
   dischargePorts.value.splice(index, 1);
 }
 
+function filterHandler(value, row, column) {
+  const property = column["property"];
+  return row[property] === value;
+}
+
 onMounted(() => {
   getVoyageList();
 });