数据总览页面修改

src/api/kitchen/index.js

@@ -0,0 +1,30 @@
+import request from '@/utils/request'
+
+
+
+
+// 数据总览接口
+export function getHomePageInfoApi(data) {
+    return request({
+    url: '/smart-canteen/kitchen_home_page/information',
+    method: 'get',
+    headers: {
+        "merchant-id":"378915229716713472",
+    },
+    params: data
+    })
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+

src/views/kitchen/index.vue

@@ -10,13 +10,41 @@
           <div style="background: #fff;padding: 10px;margin: 5px;margin-bottom: 10px;border-radius: 4px;">
             <div style="display: flex;justify-content: space-between;align-items: center;">
               <div style="border-left: 4px solid #00594F;padding-left: 10px;font-weight: 600">设备状态数据分析</div>
-            </div>  
+            </div>
+            <div style="display: flex;flex-direction: row-reverse;">
+              <el-date-picker
+                  v-model="dateRange1"
+                  type="daterange"
+                  align="right"
+                  size="mini"
+                  unlink-panels
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  format="yyyy-MM-dd" style="width: 220px"
+                  :picker-options="pickerOptions" @change="changDate1">
+              </el-date-picker>
+            </div>
             <div id="barChartOne" style="width: 100%;height: 350px;margin-bottom: 20px;"></div>  
           </div>
           <div style="background: #fff;padding: 10px;margin: 5px;margin-bottom: 10px;border-radius: 4px;">
             <div style="display: flex;justify-content: space-between;align-items: center;">
               <div style="border-left: 4px solid #00594F;padding-left: 10px;font-weight: 600">留样数据分析</div>
-            </div>  
+            </div>
+            <div style="display: flex;flex-direction: row-reverse;">
+              <el-date-picker
+                  v-model="dateRange2"
+                  type="daterange"
+                  align="right"
+                  size="mini"
+                  unlink-panels
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  format="yyyy-MM-dd" style="width: 220px"
+                  :picker-options="pickerOptions" @change="changDate2">
+              </el-date-picker>
+            </div>
             <div id="barChartTwo" style="width: 100%;height: 350px;margin-bottom: 20px;"></div>  
           </div>
         </el-col>
@@ -58,12 +86,10 @@
 import PanelGroup from './dashboard/PanelGroup'
 import SubGroup from './dashboard/SubGroup'
 import * as echarts from 'echarts' 
-import {  getDataScreeningModelApi,
-          getCanteenOrdersAndSalesTrendsApi,
-          getSupermarketOrderAndSalesTrendApi,
-          getThisMonthSDishSalesRankingApi,
+import {  getThisMonthSDishSalesRankingApi,
           getProportionOfOrderTypesApi 
         } from "@/api/index";
+import {  getHomePageInfoApi } from "@/api/kitchen/index";
 export default { 
   name: 'Index',
   components: {
@@ -103,9 +129,35 @@ export default {
           "num3": 3, 
           "num4": 4, 
         },
-      type1:1,
-      type2:1,
-      type3:1,
+      dateRange1:[new Date(),new Date()],
+      dateRange2:[new Date(),new Date()],
+      pickerOptions: {
+        shortcuts: [{
+            text: '最近一周',
+            onClick(picker) {
+            const start = new Date();
+            const end = new Date();
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 6);
+            picker.$emit('pick', [start, end]);
+            }
+        },{
+            text: '最近一个月',
+            onClick(picker) {
+            const start = new Date();
+            const end = new Date();
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+            picker.$emit('pick', [start, end]);
+            }
+        },{
+            text: '最近三个月',
+            onClick(picker) {
+            const start = new Date();
+            const end = new Date();
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 91);
+            picker.$emit('pick', [start, end]);
+            }
+        }]
+      },
       myCharts1:null,
       myCharts2:null,
       myCharts3:null,
@@ -136,16 +188,16 @@ export default {
       }
     },
     getTopData(){ 
-    //   getDataScreeningModelApi({}).then((response) => {
-    //       this.topAreaOptions = response.data.data; 
-    //   }); 
+      getHomePageInfoApi({}).then((response) => {
+          // this.topAreaOptions = response.data.data; 
+      }); 
     },
-    changType1(e){
-      console.log(this.type1)
+    changDate1(){ 
       this.InitEChartsOne()
       this.myCharts1.resize();
     },
     InitEChartsOne() {
+      console.log(this.dateRange1)
       var chartData=[]
       // getProportionOfOrderTypesApi({type:this.type3}).then((response) => {
           // chartData = response.data;
@@ -282,12 +334,12 @@ export default {
           // });
       // });
     },
-    changType2(e){
-      console.log(this.type2)
+    changDate2(){
       this.InitEChartsTwo()
       this.myCharts2.resize();
     },
     InitEChartsTwo() {
+      console.log(this.dateRange2)
        var chartData=[]
       // getProportionOfOrderTypesApi({type:this.type3}).then((response) => {
           // chartData = response.data;