loading

src/views/init-speed-track/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="init-speed-track">
+  <div class="init-speed-track" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.5)">
     <EasyMapComponent
         class="map"
         :showBaseSwitch="true"
@@ -83,6 +83,7 @@ import { EventsKey } from 'ol/events';
 import { Coordinate } from 'ol/coordinate';
 import TrackStyle from './track-style'
 import axios from "axios";
+import {ElMessage} from "element-plus";
 
 export default defineComponent({
   name: 'App',
@@ -102,6 +103,7 @@ export default defineComponent({
       initTrackPointStartCount: 0,
       initTrackPointEndCount: 0,
       initTrackPointList: [],
+      loading: false
     });
     const mapLoad = (map: null, func: null) => {
       state.map = map
@@ -358,25 +360,32 @@ export default defineComponent({
         })
       }
       const result = JSON.parse(JSON.stringify(obj))
-      state.trackList.push(Object.assign(result, {show: false, ID: new Date().getTime()}))
-      state.trackPointList = []
-      that.$easyMap.initShape({
-        map: state.map,
-        layerName: "form-track-point-line",
-        layerZIndex: 9,
-        list: []
-      });
-      that.$easyMap.initShape({
-        map: state.map,
-        layerName: "form-track-point",
-        layerZIndex: 10,
-        list: []
-      });
       console.log(result)
+      state.loading = true
       axios.post("/init-speed-track-api/hujie-track-server/mock", [result], {
         contentType: "application/json"
       }).then(res => {
         console.log(res)
+        if (res.status === 200 && res.data) {
+          ElMessage.success('添加成功！')
+          state.trackList.push(Object.assign(result, {show: false, ID: new Date().getTime()}))
+          state.trackPointList = []
+          that.$easyMap.initShape({
+            map: state.map,
+            layerName: "form-track-point-line",
+            layerZIndex: 9,
+            list: []
+          });
+          that.$easyMap.initShape({
+            map: state.map,
+            layerName: "form-track-point",
+            layerZIndex: 10,
+            list: []
+          });
+        } else {
+          ElMessage.error('添加失败！')
+        }
+        state.loading = false
       })
     }
     const trackShowListCom = computed(() => {