需求变更-3

src/views/AppGroupMonitorTable.vue

@@ -18,11 +18,14 @@ export default {
         {label: "现烤损货比", prop: "lossAmtRate", width: 60, align: 'right', headerAlign: 'left'},
         {label: "环比(目标完成比)", prop: "targetRate", align: 'right', headerAlign: 'left'},
       ],
-      summary: {}
+      summary: {},
+      filter: "",
+      options: []
     }
   },
   computed: {
     search: v => v.$marketBoard.search,
+    dicts: v => window.$dicts || {},
     tableConfig: v => {
       return {
         headerBGC: 'rgba(13, 48, 99, 0.6)',
@@ -52,8 +55,8 @@ export default {
   methods: {
     getTableData() {
       const {$http, $waitFor} = window
-      $waitFor($http).then(() => $http.post("/data-boot/la/screen/marketBoard/groupMonitor", {
-        ...this.search, limit: 999
+      return $waitFor($http).then(() => $http.post("/data-boot/la/screen/marketBoard/groupMonitor", {
+        ...this.search, limit: 999, groupCodeList: [this.filter].filter(Boolean)
       })).then(res => {
         if (res?.data) {
           this.summary = res.data.total
@@ -64,10 +67,17 @@ export default {
   },
   watch: {
     search: {
-      immediate: true, deep: true, handler() {
+      deep: true, handler() {
         this.getTableData()
       }
     }
+  },
+  created() {
+    this.getTableData().then(() => {
+      this.options = this.tableData.map(e => ({
+        label: e.groupName, value: e.groupCode
+      }))
+    })
   }
 }
 </script>
@@ -75,6 +85,13 @@ export default {
 <template>
   <section class="AppGroupMonitorTable">
     <!--<dv-scroll-board :config="tableConfig"/>-->
+    <app-sub-title text="课区运营监控表">
+      <template #right>
+        <el-select placeholder="全部" v-model="filter" size="small" clearable class="AppSelect" @change="getTableData">
+          <el-option v-for="(op,i) in options" :key="i" v-bind="op"/>
+        </el-select>
+      </template>
+    </app-sub-title>
     <scroll-table :table-data="tableData" :columns="columns"/>
     <div class="summary flex">
       <div class="item" v-for="(col,i) in summaryRow" :key="i" v-text="col.value" :style="col.style"/>
@@ -89,6 +106,9 @@ export default {
 }
 
 .AppGroupMonitorTable .dv-scroll-board, .AppGroupMonitorTable .scrollTable {
-  height: calc(100% - 30px) !important;
+  height: calc(100% - 80px) !important;
+}
+.AppGroupMonitorTable .el-select{
+  width: 140px!important;
 }
 </style>

src/views/AppMarketBoard.vue

@@ -12,7 +12,7 @@ import AppHourCount from "@/views/AppHourCount.vue";
 export default {
   name: "AppMarketBoard",
   label: "市场看板",
-  components: { AppHourCount, AppHourSale, AppStoreMonitor, AppGroupMonitorTable, AppKeyGoods, AppSalesPerformance, AppMap, AppNavbar, AppMarketBoardFilter}
+  components: {AppHourCount, AppHourSale, AppStoreMonitor, AppGroupMonitorTable, AppKeyGoods, AppSalesPerformance, AppMap, AppNavbar, AppMarketBoardFilter}
 }
 </script>
 
@@ -30,7 +30,7 @@ export default {
           </div>
           <app-map class="fill"/>
         </div>
-        <div class="flex gap">
+        <div class="flex gap" style="height: 394px">
           <app-group-monitor-table class="fill"/>
           <app-store-monitor class="fill"/>
         </div>
@@ -48,7 +48,8 @@ export default {
   width: 100%;
   height: 100%;
 }
-.gap{
+
+.gap {
   gap: 20px;
 }
 </style>