新增 loading

src/views/voyage/voyageDetail.vue

@@ -1199,7 +1199,13 @@ import { useRoute } from "vue-router";
 import _ from "lodash";
 import router from "../../router";
 import store from "../../store";
-import { ElNotification, ElMessageBox, ElMessage } from "element-plus";
+import {
+  ElNotification,
+  ElMessageBox,
+  ElMessage,
+  ElLoadingService,
+  ElLoading,
+} from "element-plus";
 import downloadBlobFile from "../../utils/downloadBlobFile";
 import url from "../../apis/config";
 import { subTimeStr } from "utils/utils";
@@ -1222,59 +1228,70 @@ function showCerts() {
     certs.value.initCerts(shipAudits.value);
   });
 }
-
+let loading = ref({});
 async function getVoyageDetail(isInit) {
-  policyList.value = [];
-  voyageBill.value = [];
-  previewSrcList.value = [];
-  let res = await api.getVoyageDetail({
-    hhdVoyageCode: route.query.voyageCode,
-  });
-  if (res.data.errcode == 0) {
-    ElNotification({
-      type: "success",
-      title: res.data.errmsg,
+  try {
+    loading.value = ElLoading.service({
+      lock: true,
+      text: "正在加载...",
+      background: "rgba(0, 0, 0, 0.7)",
     });
-    blockchainInfo.value = res.data.data.blockChain;
-    coordinates.value = res.data.data.coordinates;
-    voyage.value = res.data.data.voyage;
-    voyage.value.startTime = voyage.value.startTime.substring(0, 16);
-    currentPortId.value = voyage.value.voyageDetails[0].portId + "";
-    currentDiscPortId.value = voyage.value.voyageDetails[0].portId + "";
-    medias.value = res.data.data.medias;
-    shipAudits.value = res.data.data.shipAudits;
-
-    for (let i of res.data.data.policys || []) {
-      policyList.value.push({
-        ...i,
-        url: i.viewUrl,
+
+    policyList.value = [];
+    voyageBill.value = [];
+    previewSrcList.value = [];
+    let res = await api.getVoyageDetail({
+      hhdVoyageCode: route.query.voyageCode,
+    });
+    if (res.data.errcode == 0) {
+      ElNotification({
+        type: "success",
+        title: res.data.errmsg,
       });
-    }
-    for (let i of res.data.data.waybills) {
-      voyageBill.value.push({
-        ...i,
-        url: i.viewUrl,
+      blockchainInfo.value = res.data.data.blockChain;
+      coordinates.value = res.data.data.coordinates;
+      voyage.value = res.data.data.voyage;
+      voyage.value.startTime = voyage.value.startTime.substring(0, 16);
+      currentPortId.value = voyage.value.voyageDetails[0].portId + "";
+      currentDiscPortId.value = voyage.value.voyageDetails[0].portId + "";
+      medias.value = res.data.data.medias;
+      shipAudits.value = res.data.data.shipAudits;
+
+      for (let i of res.data.data.policys || []) {
+        policyList.value.push({
+          ...i,
+          url: i.viewUrl,
+        });
+      }
+      for (let i of res.data.data.waybills) {
+        voyageBill.value.push({
+          ...i,
+          url: i.viewUrl,
+        });
+      }
+      for (let i of medias.value) {
+        previewSrcList.value.push(i.downloadUrl);
+      }
+      if (isInit) {
+        getDischargeList();
+        getTruckLoadRecord();
+        getLabList();
+        getPortWeatherList();
+        getAccidentList();
+        try {
+          initMap();
+        } catch (error) {}
+      }
+    } else {
+      console.log(res);
+      ElNotification({
+        type: "error",
+        title: res.data.errmsg,
       });
     }
-    for (let i of medias.value) {
-      previewSrcList.value.push(i.downloadUrl);
-    }
-    if (isInit) {
-      getDischargeList();
-      getTruckLoadRecord();
-      getLabList();
-      getPortWeatherList();
-      getAccidentList();
-      try {
-        initMap();
-      } catch (error) {}
-    }
-  } else {
-    console.log(res);
-    ElNotification({
-      type: "error",
-      title: res.data.errmsg,
-    });
+  } catch (error) {
+  } finally {
+    loading.value.close();
   }
 }
 let total = ref(0);