更新 Number组件数据渲染逻辑

src/apis/fetch.js

@@ -13,10 +13,15 @@ export default {
   },
 
   // 地图船舶状态总计
-  getShipCount() {
+  getShipStatusCount() {
     return $http("/ship/shipStatusStatistics");
   },
 
+  // 地图船轨迹总计
+  getShipTracksCount() {
+    return $http("/ship/shipTracksStatistics");
+  },
+
   // 智能交易中心-船舶详情
   getTradeShipDetail(data) {
     return $http("/ship/trade/detail", data);

src/store/index.js

@@ -148,19 +148,39 @@ const store = createStore({
         commit("setDamInfo", e.data.result);
       });
     },
-    GetNumbers({ commit, state }, type) {
-      return new Promise((resolve, reject) => {
-        let arr1 = [
-          { icon: "loading", title: "装货中船舶数量", num: 22033 },
-          { icon: "transit", title: "运输中船舶数量", num: 12312 },
-          { icon: "unloading", title: "卸货中船舶数量", num: 87655 },
-        ];
-        let arr2 = [
-          { icon: "ship-fill-2", title: "装货中船舶数量", num: 16090 },
-          { icon: "ship-line", title: "运输中船舶数量", num: 20090 },
-        ];
-        resolve(type ? arr1 : arr2);
-      });
+    GetNumbers({ commit, state }) {
+      let t = state.currentTabText == "运输安全管理中心";
+      if (t) {
+        api.getShipStatusCount().then((e) => {
+          console.log(e);
+          let { result } = e.data;
+          state.numbers = [
+            {
+              icon: "loading",
+              title: "装货中船舶数量",
+              num: result.loadingShipCount,
+            },
+            {
+              icon: "transit",
+              title: "运输中船舶数量",
+              num: result.transitShipCount,
+            },
+            {
+              icon: "unloading",
+              title: "卸货中船舶数量",
+              num: result.unloadingShipCount,
+            },
+          ];
+        });
+      } else {
+        api.getShipTracksCount().then((e) => {
+          let { result } = e.data;
+          state.numbers = [
+            { icon: "ship-fill-2", title: "船舶数量", num: result.shipNum },
+            { icon: "ship-line", title: "轨迹数量", num: result.trackNum },
+          ];
+        });
+      }
     },
     GetManageShipDetail({ commit }, shipId) {
       api.getManageShipDetail({ shipId }).then((e) => {

src/views/transportationSafetyCenter.vue

@@ -11,7 +11,7 @@
     <NumberVue
       class="z20"
       v-if="this.$store.state.currentTabText != '环境中心'"
-      :data="arr"
+      :data="this.$store.state.numbers"
       style="position: absolute; top: 0; left: 0"
     ></NumberVue>
     <SafetyModule
@@ -61,15 +61,10 @@ export default {
     watch(
       () => store.state.currentTabText,
       (a, b) => {
-        getNumbers(a == "运输安全管理中心");
+        store.dispatch("GetNumbers");
       }
     );
-    let arr = ref([]);
-    async function getNumbers(b) {
-      store.dispatch("GetNumbers", b).then((e) => {
-        arr.value = e;
-      });
-    }
+
     let shipStr = ref("");
 
     function selectShip(item) {
@@ -84,11 +79,10 @@ export default {
     onMounted(() => {
       // initMap();
       // store.dispatch("GetManageShipDetail", 51710);
-      getNumbers(store.state.currentTabText == "运输安全管理中心");
+      store.dispatch("GetNumbers");
     });
     return {
       initMap,
-      arr,
       shipStr,
       selectShip,
     };