运单

src/views/securityCheck/components/securityCheckTable.vue

@@ -14,6 +14,9 @@
       "
       :rowClassName="rowClassName"
       bordered
+      :pagination = "pagination"
+       @change="handleTableChange"
+       :loading="loading"
     >
       <template
         v-if="withOperateColumn"
@@ -55,10 +58,18 @@ export default {
       type: Boolean,
       default: false,
     },
+    loading: {
+      type: Boolean,
+      default: false,
+    },
     showSummary: {
       type: Boolean,
       default: false,
     },
+    pagination:{
+      type:Object,
+      default: null,
+    }
   },
   data() {
     return {
@@ -123,6 +134,9 @@ export default {
     clickHandler(index) {
       console.log(index);
     },
+    handleTableChange(pagination, filters, sorter){
+      this.$emit("handleTableChange",pagination)
+    }
   },
 };
 </script>

src/views/securityCheck/views/waybillTable.vue

@@ -18,6 +18,9 @@
         row-key="index"
         :height="tableHeight"
         show-summary
+        :pagination="pagination"
+        :loading="loading"
+        @handleTableChange="handleTableChange"
       />
     </main>
   </div>
@@ -26,10 +29,23 @@
 <script>
 import SecurityCheckHeader from "../components/securityCheckHeader.vue";
 import SecurityCheckTable from "../components/securityCheckTable.vue";
+import { waybill } from "@/api/statistics/statistics.js";
 export default {
   components: { SecurityCheckHeader, SecurityCheckTable },
   data() {
     return {
+      loading:false,
+      pagination: {
+        showSizeChanger: true,
+        showQuickJumper: true,
+        total:0, //数据总数
+        pageSize: 10,
+        current: 1,
+        showTotal: (total) => {
+          return `共${total}条`;
+        },
+      },
+      total:0,
       tableHeight: "50vh",
       tableCols: [
         {
@@ -51,13 +67,14 @@ export default {
           width: 125,
         },
         {
-          dataIndex: "cargoName",
-          key: "cargoName",
+          dataIndex: "goodsName",
+          key: "goodsName",
           title: "品名描述",
+          width: 125,
         },
         {
-          dataIndex: "agent",
-          key: "agent",
+          dataIndex: "agentCode",
+          key: "agentCode",
           title: "交货发货代理人",
           width: 140,
         },
@@ -68,13 +85,13 @@ export default {
           width: 125,
         },
         {
-          dataIndex: "originAirport",
-          key: "originAirport",
+          dataIndex: "origin",
+          key: "origin",
           title: "始发站",
         },
         {
-          dataIndex: "destinationAirport",
-          key: "destinationAirport",
+          dataIndex: "destination",
+          key: "destination",
           title: "目的地机场",
         },
         {
@@ -83,13 +100,13 @@ export default {
           title: "航班号",
         },
         {
-          dataIndex: "dangerLevel",
-          key: "dangerLevel",
+          dataIndex: "riskRating",
+          key: "riskRating",
           title: "综合风险等级",
         },
         {
-          dataIndex: "cargoDangerLevel",
-          key: "cargoDangerLevel",
+          dataIndex: "riskClassification",
+          key: "riskClassification",
           title: "货物风险等级",
         },
         {
@@ -108,29 +125,39 @@ export default {
           title: "重量",
         },
       ],
-      tableData: [
-        {
-          waybillNo: "784-33818776",
-          mainWaybillNo: "000",
-          subWaybillNo: "111",
-          cargoName: "手机保护套",
-          agent: "ETA2013031000",
-          agentLevel: "B",
-          originAirport: "PEK",
-          destinationAirport: "CTU",
-          flightNo: "CZ8023",
-          dangerLevel: "普通",
-          cargoDangerLevel: "普通",
-          securityChannel: "1",
-          count: 10,
-          weight: 10,
-        },
-      ],
+      FormData: {
+        destination: "", // 目的站
+        agentCode: "", // 代理人ID
+        agentLevel: "", // 代理人信用等级 A\B\C\D
+        riskRating: "", // 综合风险等级评估 低风险\优先\普通\高风险\严控
+        startTime: "", //开始时间
+        endTime: "", // 结束时间
+        openResult: "", //  开箱结果
+        pageNum: "1", //** 当前记录起始索引 */
+        pageSize: "10", // /** 每页显示记录数 */
+      },
+      tableData: [],
     };
   },
+  created(){
+    let queryData = this.$route.query;
+    const { destination, agentCode,agentLevel,riskRating,startTime,endTime,openResult } = queryData;
+    this.FormData = {
+      destination:destination,
+      agentCode:agentCode,
+      agentLevel:agentLevel,
+      riskRating:riskRating,
+      startTime:startTime,
+      endTime:endTime,
+      openResult:openResult,
+      pageNum: "1",
+      pageSize: "10",
+    }
+  },
   mounted() {
     this.setTableHeight();
     window.addEventListener("resize", this.setTableHeight);
+    this.getData();
   },
   beforeDestroy() {
     window.removeEventListener("resize", this.setTableHeight);
@@ -147,6 +174,29 @@ export default {
         topBarHeight + headerHeight + footerBlackHeight
       }px)`;
     },
+    async getData() {
+      try {
+        this.loading = true;
+        console.log(this.FormData);
+        const result = await waybill(this.FormData);
+        if (result.code === 200) {
+          const pagination = { ...this.pagination };
+          pagination.total = result.data.total;
+          this.pagination = pagination;
+          this.tableData = result.data.list;
+          this.loading = false;
+        }
+      } catch (error) {
+        console.log(error);
+      }
+    },
+    handleTableChange(data) {
+      this.pagination.current = data.current;
+      this.pagination.pageSize = data.pageSize;
+      this.FormData.pageNum = data.current+"";
+      this.FormData.pageSize = data.pageSize+"";
+      this.getData();
+    },
   },
 };
 </script>