diff --git a/src/utils/inject.js b/src/utils/inject.js index 252e728..d4b3eba 100644 --- a/src/utils/inject.js +++ b/src/utils/inject.js @@ -65,7 +65,7 @@ window.evenRowBGC = (color = "#09265B") => `transparent;background-image: linear Vue.prototype.$marketBoard = Vue.observable({ screenId: '5b1849ac-4fc3-451a-844c-3362b47341ef', - goodsCategoryId: "", + thirdGoods: {}, search: {"groupCodeList": [], "currentDate": "20240701", "compareDate": "20240630", "hourNum": "18"} }) Vue.prototype.$multipleStoreBoard = Vue.observable({ diff --git a/src/views/AppKeyGoods.vue b/src/views/AppKeyGoods.vue index 689bff8..d7e6038 100644 --- a/src/views/AppKeyGoods.vue +++ b/src/views/AppKeyGoods.vue @@ -41,6 +41,9 @@ export default { this.tableData = res.data?.records || [] } }) + }, + relevanceMapData(selectGoods) { + this.$set(this.$marketBoard, 'thirdGoods', selectGoods) } }, watch: { @@ -49,6 +52,17 @@ export default { this.getTableData() } } + }, + mounted() { + document.addEventListener('click', evt => { + const mapElement = document.querySelector('.AppMap') + if (!this.$el.contains(evt.target) && !mapElement.contains(evt.target)) { + this.relevanceMapData() + } + }) + }, + beforeDestroy() { + document.removeEventListener('click', this.relevanceMapData) } } @@ -62,7 +76,7 @@ export default { - + @@ -72,6 +86,7 @@ export default { color: #fff; box-sizing: border-box; } + .AppKeyGoods .dv-scroll-board, .AppKeyGoods .scrollTable { height: calc(100% - 60px) !important; } diff --git a/src/views/AppMap.vue b/src/views/AppMap.vue index 5041508..b7dcb62 100644 --- a/src/views/AppMap.vue +++ b/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}
现烤库存金额:${bakeStockAmt}
现烤销售机会:${preSaleNum}` + const {name, marker, value} = params + return `${marker} ${name}
${this.getContent(value).join("
")}` }, }, }) @@ -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([