需求完成

src/views/AppMap.vue

@@ -6,18 +6,24 @@ export default {
     return {
       map: null,
       layers: [],
-      geoJson: null
+      geoJson: null,
     }
   },
   computed: {
-    search: v => v.$marketBoard.search
+    search: v => v.$marketBoard.search,
+    thirdGoods: v => v.$marketBoard.thirdGoods || {}
   },
   watch: {
     search: {
       deep: true, handler() {
         this.getData().then(() => this.refreshData())
       }
-    }
+    },
+    thirdGoods: {
+      deep: true, handler() {
+        this.getData().then(() => this.refreshData())
+      }
+    },
   },
   methods: {
     loadLib() {
@@ -25,13 +31,19 @@ export default {
         '/presource/datascreen/js/turf.min.js',
       ].map(e => $loadScript('js', e)))
     },
+    getContent([x, y, bakeStockAmt = 0, preSaleNum = 0, stockNum = 0] = []) {
+      if (this.thirdGoods.thirdGoodsCode) {
+        return [`库存数量：${stockNum}`]
+      }
+      return [`现烤库存金额：${bakeStockAmt}`, `现烤销售机会：${preSaleNum}`]
+    },
     getData() {
       const {$http, $waitFor} = window
-      const {groupCodeList, currentDate, hourNum} = this.search
+      const {search: {groupCodeList, currentDate, hourNum}, thirdGoods: {thirdGoodsCode}} = this
       const maps = []
       return $waitFor($http).then(() => Promise.all([
         $http.post("/data-boot/la/screen/marketBoard/storeReport", {
-          groupCodeList, currentDate, hourNum
+          groupCodeList, currentDate, hourNum, thirdGoodsCode
         }).then(res => {
           if (res?.data) {
             return this.layers = res.data || []
@@ -70,9 +82,9 @@ export default {
         borderRadius: 2,
         padding: 8,
         position: 'right',
-        formatter: params => {
-          const {name, value: [x, y, bakeStockAmt = 0, preSaleNum = 0]} = params
-          return `{a|${name}\n现烤库存金额：${bakeStockAmt}\n现烤销售机会：${preSaleNum}}`
+        formatter: (params) => {
+          const {name, value} = params
+          return `{a|${name}\n${this.getContent(value).join("\n")}}`
         },
         rich: {
           a: {color: '#fff', fontSize: 12, lineHeight: 14}
@@ -94,8 +106,8 @@ export default {
         ],
         tooltip: {
           trigger: 'item', formatter: params => {
-            const {name, marker, value: [x, y, bakeStockAmt = 0, preSaleNum = 0]} = params
-            return `${marker} ${name}<br/>现烤库存金额：${bakeStockAmt}<br/>现烤销售机会：${preSaleNum}`
+            const {name, marker, value} = params
+            return `${marker} ${name}<br/>${this.getContent(value).join("<br/>")}`
           },
         },
       })
@@ -111,8 +123,9 @@ export default {
     convertData(layers) {
       const result = {normal: [], abnormal: []}
       layers.forEach(e => {
-        const item = {name: e.storeName, storeCode: e.storeCode, value: [e.longitude, e.latitude, e.bakeStockAmt, e.preSaleNum]}
-        if (e.bakeStockAmt > 0) {
+        const item = {name: e.storeName, storeCode: e.storeCode, value: [e.longitude, e.latitude, e.bakeStockAmt, e.preSaleNum, e.stockNum]}
+        // 有库存或者有现烤库存金额 就算正常
+        if (e.bakeStockAmt > 0 || e.stockNum > 0) {
           result.normal.push(item)
         } else {
           result.abnormal.push(item)
@@ -121,8 +134,10 @@ export default {
       return Object.values(result).map(data => ({data}))
     },
     refreshData() {
-      this.map.setOption({series: this.convertData(this.layers)})
-    }
+      const {thirdGoods: {goodsName}} = this
+      const title = {left: 20, top: 20, text: goodsName ? `{sub|选择产品：}${goodsName}` : '', textStyle: {color: "#fff", rich: {sub: {color: "#fff", fontSize: 16}}}}
+      this.map.setOption({title, series: this.convertData(this.layers)})
+    },
   },
   mounted() {
     this.loadLib().then(() => Promise.all([