生活添加卡片右上角筛选

src/api/life/apiLifeHealthyHome.js

@@ -9,7 +9,12 @@ const getHutAnalysis = (timeRange) => {
     return Request.post('/healthhome/getHutAnalysis', timeRange)
 }
 
+const getEnvironmentalDetection = (timeRange) => {
+    return Request.post('/healthhome/getEnvironmentalDetection', timeRange)
+}
+
 export default {
     getCoreData,
     getHutAnalysis,
+    getEnvironmentalDetection
 }

src/components/life/healthyHome/lifeHealthyHome.vue

@@ -10,6 +10,8 @@ export default {
   data() {
     let range = this.$util.dateUtil.getNearlyMonthRange();
     return {
+      today: this.$moment(range.endDate, 'YYYY/MM/DD'),
+      envData: [],
       queryData: {
         companyId: '0',
         deptId: '0',
@@ -63,7 +65,10 @@ export default {
   },
   methods: {
     init() {
-      this.$store.loadingStore().loadingWithApi(this.getCoreData(), 2000)
+      this.$util.asyncPromise(
+          this.getCoreData(),
+          this.getEnvInfo(),
+      );
     },
     reset() {
       console.log('reset')
@@ -85,6 +90,32 @@ export default {
         this.coreData[3].content = res.list[3].value
         this.coreData[4].content = res.worthAttention
       })
+    },
+    getEnvInfo(date) {
+      if (date) {
+        this.queryData['date'] = date;
+      } else {
+        this.queryData['date'] = this.today;
+      }
+
+      return apiLifeHealthyHome.getEnvironmentalDetection(this.queryData).then(res=>{
+        let envData = [];
+        res.forEach(item=>{
+          let obj = {};
+          obj['title'] = item.title.toUpperCase();
+          obj['value'] = item.value;
+          if (item.type == '1') {
+            obj['icon'] = 'life/'+item.key+'_green.png';
+          } else {
+            obj['icon'] = 'life/'+item.key+'_blue.png';
+          }
+          envData.push(obj)
+        });
+        this.envData = envData;
+      })
+    },
+    onEnvDateChange(val) {
+      this.getEnvInfo(val);
     }
   }
 }
@@ -123,6 +154,10 @@ export default {
         <div class="lifeHealthyHome-right">
           <div class="lifeHealthyHome-top ioc-card-content">
             <Card title="环境监测">
+              <template #title-extra>
+                <a-date-picker size="small" style="width: 120px" :default-value="today" :valueFormat="'YYYY/MM/DD'" @change="onEnvDateChange" />
+              </template>
+
               <a-row :gutter="[12,18]" style="padding: 12px">
                 <a-col style="color: #B3B3B3">
                   <div style="width: 50%;display: inline-block;text-align: center">
@@ -134,23 +169,8 @@ export default {
                     <span style="display: inline-block;vertical-align: text-bottom;margin-left: 12px">室外</span>
                   </div>
                 </a-col>
-                <a-col :span="12">
-                  <LifeHealthyHomeMonitor title="PM2.5" :value="'75'" icon="life/pm_green.png"></LifeHealthyHomeMonitor>
-                </a-col>
-                <a-col :span="12">
-                  <LifeHealthyHomeMonitor title="PM2.5" :value="'75'" icon="life/pm_blue.png"></LifeHealthyHomeMonitor>
-                </a-col>
-                <a-col :span="12">
-                  <LifeHealthyHomeMonitor title="湿 度" :value="'75'" icon="life/humidity_green.png"></LifeHealthyHomeMonitor>
-                </a-col>
-                <a-col :span="12">
-                  <LifeHealthyHomeMonitor title="湿 度" :value="'75'" icon="life/humidity_blue.png"></LifeHealthyHomeMonitor>
-                </a-col>
-                <a-col :span="12">
-                  <LifeHealthyHomeMonitor title="温 度" :value="'75'" icon="life/temperature_green.png"></LifeHealthyHomeMonitor>
-                </a-col>
-                <a-col :span="12">
-                  <LifeHealthyHomeMonitor title="温 度" :value="'75'" icon="life/temperature_blue.png"></LifeHealthyHomeMonitor>
+                <a-col :span="12" v-for="(item,index) in envData" :key="index" >
+                  <LifeHealthyHomeMonitor :title="item.title" :value="item.value" :icon="item.icon"></LifeHealthyHomeMonitor>
                 </a-col>
               </a-row>
             </Card>

src/components/life/parking/lifeParking.vue

@@ -13,6 +13,7 @@ export default {
   data() {
     let range = this.$util.dateUtil.getNearlyMonthRange();
     return {
+      topSelect: '5',
       queryData: {
         companyId: '0',
         deptId: '0',
@@ -107,13 +108,14 @@ export default {
     getEmptyPark() {
       return apiLifePark.getVacantParkingSpace(this.queryData).then(res=>{
         this.emptyParks = res
+        this.emptyParks = this.emptyParks.slice(0, this.topSelect)
       })
     },
     getParkDetail() {
       return apiLifePark.getParkingSpaceDetails(this.queryData).then(res=>{
         this.parkDetails = res
       })
-    }
+    },
   }
 }
 </script>
@@ -152,6 +154,13 @@ export default {
               <div style="height: 340px;overflow-y: auto">
                 <LifeParkingTopChart :tableData="emptyParks"></LifeParkingTopChart>
               </div>
+              <template #title-extra>
+                <a-select v-model="topSelect" default-value="5" style="width: 100px;" size="small" @change="getEmptyPark">
+                  <a-select-option value="5">TOP5</a-select-option>
+                  <a-select-option value="10">TOP10</a-select-option>
+                  <a-select-option value="15">TOP15</a-select-option>
+                </a-select>
+              </template>
             </Card>
           </div>
         </a-col>
@@ -230,4 +239,12 @@ export default {
   }
 
 }
+
+/deep/ .lifeParking-top .ant-select-selection {
+  background-color: #f8fafb;
+  border: none;
+  border-radius: 6px;
+  padding: 0px 12px;
+  color: #B2B2B2;
+}
 </style>

src/components/life/restaurant/lifeRestaurant.vue

@@ -14,6 +14,8 @@ export default {
   data() {
     let range = this.$util.dateUtil.getNearlyMonthRange();
     return {
+      topSelect: '5',
+      eatTimeSelect: '1',
       queryData: {
         companyId: '0',
         deptId: '0',
@@ -114,6 +116,7 @@ export default {
       })
     },
     getDailyMenu() {
+      this.queryData['type'] = this.eatTimeSelect;
       return apiLifeRestaurant.getTodayMenu(this.queryData).then(res=>{
         this.dailyMenu = res;
       })
@@ -121,6 +124,7 @@ export default {
     getTopMenu() {
       return apiLifeRestaurant.getWelcomeDishes(this.queryData).then(res=>{
         this.topMenu = res
+        this.topMenu = this.topMenu.slice(0,this.topSelect)
       })
     },
   }
@@ -177,6 +181,13 @@ export default {
               <div style="height: 300px;overflow-y: auto">
                 <LifeRestTopMenu :table-data="topMenu" ></LifeRestTopMenu>
               </div>
+              <template #title-extra>
+                <a-select v-model="topSelect" default-value="5" style="width: 100px;" size="small" @change="getTopMenu">
+                  <a-select-option value="5">TOP5</a-select-option>
+                  <a-select-option value="10">TOP10</a-select-option>
+                  <a-select-option value="15">TOP15</a-select-option>
+                </a-select>
+              </template>
             </Card>
           </div>
           <div class="lifeRestaurant-cookbook ioc-card-content">
@@ -185,6 +196,14 @@ export default {
                 <LifeRestDailyMenu :table-data="dailyMenu"  ></LifeRestDailyMenu>
               </div>
 
+              <template #title-extra>
+                <a-select v-model="eatTimeSelect" default-value="1" style="width: 100px;" size="small" @change="getDailyMenu">
+                  <a-select-option value="1">早餐</a-select-option>
+                  <a-select-option value="2">午餐</a-select-option>
+                  <a-select-option value="3">晚餐</a-select-option>
+                </a-select>
+              </template>
+
             </Card>
           </div>
         </div>
@@ -249,4 +268,12 @@ export default {
     }
   }
 }
+
+/deep/ .lifeRestaurant-right .ant-select-selection {
+  background-color: #f8fafb;
+  border: none;
+  border-radius: 6px;
+  padding: 0px 12px;
+  color: #B2B2B2;
+}
 </style>

src/components/life/supermarket/lifeSupermarket.vue

@@ -10,6 +10,7 @@ export default {
   data() {
     let range = this.$util.dateUtil.getNearlyMonthRange();
     return {
+      orderSelect: 'desc',
       queryData: {
         companyId: '0',
         deptId: '0',
@@ -99,9 +100,14 @@ export default {
     },
     getProductRanking() {
       return apiLifeSupermarket.getProductRanking(this.queryData).then(res=>{
-        this.productRanks = res
+        this.productRanks = res;
+        if (this.orderSelect == 'asc') {
+          this.productRanks = this.productRanks.sort((a,b)=>{
+            return Number(a.salesVolume)-Number(b.salesVolume);
+          })
+        }
       })
-    }
+    },
   }
 }
 </script>
@@ -141,6 +147,12 @@ export default {
               <div style="height: 440px;overflow-y: auto">
                 <LifeSupermarketTopTable :tableData="productRanks" style="padding: 0 8px;"></LifeSupermarketTopTable>
               </div>
+              <template #title-extra>
+                <a-select v-model="orderSelect" default-value="5" style="width: 100px;" size="small" @change="getProductRanking">
+                  <a-select-option value="asc">正序</a-select-option>
+                  <a-select-option value="desc">倒序</a-select-option>
+                </a-select>
+              </template>
             </Card>
           </div>
         </div>
@@ -188,4 +200,12 @@ export default {
 .lifeSupermarket-top {
   overflow-y: hidden;
 }
+
+/deep/ .lifeSupermarket-top .ant-select-selection {
+  background-color: #f8fafb;
+  border: none;
+  border-radius: 6px;
+  padding: 0px 12px;
+  color: #B2B2B2;
+}
 </style>