单店完成

src/views/AppStoreKeyGoods.vue

@@ -5,36 +5,50 @@ export default {
   data() {
     return {
       columns: [
-        {label: "重点单品", prop: "name"},
-        {label: "当日目标", prop: "targetNum", width: "70px"},
-        {label: "销售数量", prop: "saleNum", width: "70px"},
-        {label: "库存数量", prop: "stockNum", width: "70px"},
-        {label: "预计销售数量", prop: "preSaleNum", width: "70px"},
+        {label: "重点单品", prop: "goodsName"},
+        {label: "当日目标", prop: "targetNum", width: 70},
+        {label: "销售数量", prop: "saleNum", width: 70},
+        {label: "库存数量", prop: "stockNum", width: 70},
+        {label: "预计销售数量", prop: "preSaleNum", width: 70},
         {label: "提醒", custom: 1, width: 70, align: 'center', prop: "remind"},
       ]
     }
   },
   computed: {
-    refs: v => v.$parent.getItemRefs(),
     tableData: v => v.$storeBoard.storeKeyGoods || [],
     tableConfig: v => {
       return {
-        headerBGC: 'rgba(13, 48, 99, 0.6)',
+        headerBGC: 'rgba(13, 48, 99, 0.6)', rowNum: 9,
         oddRowBGC: window.evenRowBGC(), evenRowBGC: "transparent",
         header: v.columns.map(e => e.label),
         columnWidth: v.columns.map(e => e.width || "0;flex:1;min-width:0;"),
         align: v.columns.map(e => e.align || "left"),
-        data: v.tableData.map(e => v.columns.map(column => e[column.prop])),
+        data: v.tableData.map(e => v.columns.map(column => column.custom == 1 ? `<div class="pointer" style="color:${e.preSaleNum > e.stockNum ? 'red' : '#fff'}">周边库存</div>` :
+            column.format ? column.format(e) : e[column.prop])) || [],
       }
     },
   },
+  methods: {
+    openNearbyStores({rowIndex}) {
+      const {thirdGoodsCode} = this.tableData[rowIndex],
+          {storeCode, longitude, latitude} = this.$storeBoard.store
+      return $http.post("/data-boot/la/screen/multipleStoreBoard/aroundStock", {
+        type: "1", ...this.search, storeCode, longitude, latitude, thirdGoodsCode,
+      }).then(res => {
+        if (res?.data) {
+          this.$storeBoard.aroundStock = res.data
+          this.$nextTick(() => this.$storeBoard.dialog = true)
+        }
+      })
+    }
+  }
 }
 </script>
 
 <template>
   <section class="AppStoreKeyGoods">
     <div class="subTitle" v-text="'重点单品情况'"/>
-    <dv-scroll-board :config="tableConfig" @click=""/>
+    <dv-scroll-board :config="tableConfig" @click="openNearbyStores" @click.native.stop/>
   </section>
 </template>