优化

src/views/home/components/provincial/Top2.vue

@@ -82,12 +82,13 @@ export default {
         configuration: 0, // 配置率
         mechanization: 0, // 机械化率
       },
-      checkList:[],
+      checkList: [],
       checkList2: [],
       checkList3: [],
       radio: 1,
       // 机械化率总数
       mechanizationTotal: 0,
+      requestId: 0,
     }
   },
   created() {
@@ -109,75 +110,68 @@ export default {
       this.getInfo()
     },
     async getInfo() {
+      const currentId = ++this.requestId // 记录本次请求 id
+
       try {
+        this.cityData = []
+
         const { data } = await getTotalEquipmentApi()
+        if (currentId !== this.requestId) return
+
         this.equipData.total = data.totalEquipmentQuantity || 0
         this.equipData.totalPrice = data.totalValue || 0
         this.equipData.configuration = data.configuration || 0
         this.equipData.mechanization = data.mechanization || 0
+
         let res = null
+
         if (this.btnIndex == 1) {
           res = await getUnitEquipmentConfigurationApi()
-          if (!res.data) return
-          res.data = res.data.filter((item) => item.location)
-          this.cityData = res.data.map((item) => {
-            let value = item.location.split(',')
-            value.push(item.totalValue)
-            // console.log('🚀 ~ getInfo ~ value:', value)
-            return {
+          if (currentId !== this.requestId || !res.data) return
+
+          this.cityData = res.data
+            .filter((item) => item.location)
+            .map((item) => ({
               ...item,
-              value,
-            }
-          })
+              value: [...item.location.split(','), item.totalValue],
+            }))
         }
-        if (this.btnIndex == 4) {
-          let type = ''
-          switch (this.radio) {
-            case 1:
-              type = '线路'
-              break
-            case 2:
-              type = '变电'
-              break
-            case 3:
-              type = '电缆'
-              break
-          }
-          res = await getMechanizationRateApi({ type })
-          if (!res.data) return
-          this.mechanizationTotal = res.data.find((item) => item.dataType == 'total')?.mechanizationRate
-          res.data = res.data.filter((item) => item.cityName)
-          this.cityData = res.data.map((item) => {
-            return {
-              cityName: item.cityName,
-              mechanizationRate: item.mechanizationRate,
-              dataType: item.dataType,
-              companyName: item.companyName,
-            }
-          })
-        } else if (this.btnIndex == 2 || this.btnIndex == 3) {
-          // res = await getEquipmentNumberApi()
+
+        if (this.btnIndex == 2 || this.btnIndex == 3) {
           res = await getUnitEquipmentConfigurationApi()
-          if (!res.data) return
-          res.data = res.data.filter((item) => item.location)
-          this.cityData = res.data.map((item) => {
-            let value = item.location.split(',')
-            value.push(item.num)
-            // console.log('🚀 ~ getInfo ~ value:', value)
-            return {
+          if (currentId !== this.requestId || !res.data) return
+
+          this.cityData = res.data
+            .filter((item) => item.location)
+            .map((item) => ({
               ...item,
-              value,
-            }
-          })
+              value: [...item.location.split(','), item.num],
+            }))
         }
+
+        if (this.btnIndex == 4) {
+          const typeMap = {
+            1: '线路',
+            2: '变电',
+            3: '电缆',
+          }
+
+          res = await getMechanizationRateApi({ type: typeMap[this.radio] })
+          if (currentId !== this.requestId || !res.data) return
+
+          this.mechanizationTotal = res.data.find((item) => item.dataType === 'total')?.mechanizationRate
+
+          this.cityData = res.data.filter((item) => item.cityName)
+        }
+
         this.$nextTick(() => {
-          console.log('🚀 ~ 地图数据 ~ this.cityData:', this.cityData)
+          if (currentId !== this.requestId) return
           this.initChart()
         })
-        console.log('🚀 ~ 地图数据 ~ res:', res)
       } catch (error) {
-        console.log('🚀 ~ 地图数据 ~ error:', error)
-        // this.initChart()
+        if (currentId === this.requestId) {
+          console.error(error)
+        }
       }
     },
     initChart(jsonData = mapJson) {