数据总览页面修改
This commit is contained in:
parent
f18cb1949f
commit
a664075dc1
|
|
@ -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
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -11,12 +11,40 @@
|
||||||
<div style="display: flex;justify-content: space-between;align-items: center;">
|
<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 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 id="barChartOne" style="width: 100%;height: 350px;margin-bottom: 20px;"></div>
|
||||||
</div>
|
</div>
|
||||||
<div style="background: #fff;padding: 10px;margin: 5px;margin-bottom: 10px;border-radius: 4px;">
|
<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="display: flex;justify-content: space-between;align-items: center;">
|
||||||
<div style="border-left: 4px solid #00594F;padding-left: 10px;font-weight: 600">留样数据分析</div>
|
<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 id="barChartTwo" style="width: 100%;height: 350px;margin-bottom: 20px;"></div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
@ -58,12 +86,10 @@
|
||||||
import PanelGroup from './dashboard/PanelGroup'
|
import PanelGroup from './dashboard/PanelGroup'
|
||||||
import SubGroup from './dashboard/SubGroup'
|
import SubGroup from './dashboard/SubGroup'
|
||||||
import * as echarts from 'echarts'
|
import * as echarts from 'echarts'
|
||||||
import { getDataScreeningModelApi,
|
import { getThisMonthSDishSalesRankingApi,
|
||||||
getCanteenOrdersAndSalesTrendsApi,
|
|
||||||
getSupermarketOrderAndSalesTrendApi,
|
|
||||||
getThisMonthSDishSalesRankingApi,
|
|
||||||
getProportionOfOrderTypesApi
|
getProportionOfOrderTypesApi
|
||||||
} from "@/api/index";
|
} from "@/api/index";
|
||||||
|
import { getHomePageInfoApi } from "@/api/kitchen/index";
|
||||||
export default {
|
export default {
|
||||||
name: 'Index',
|
name: 'Index',
|
||||||
components: {
|
components: {
|
||||||
|
|
@ -103,9 +129,35 @@ export default {
|
||||||
"num3": 3,
|
"num3": 3,
|
||||||
"num4": 4,
|
"num4": 4,
|
||||||
},
|
},
|
||||||
type1:1,
|
dateRange1:[new Date(),new Date()],
|
||||||
type2:1,
|
dateRange2:[new Date(),new Date()],
|
||||||
type3:1,
|
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,
|
myCharts1:null,
|
||||||
myCharts2:null,
|
myCharts2:null,
|
||||||
myCharts3:null,
|
myCharts3:null,
|
||||||
|
|
@ -136,16 +188,16 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
getTopData(){
|
getTopData(){
|
||||||
// getDataScreeningModelApi({}).then((response) => {
|
getHomePageInfoApi({}).then((response) => {
|
||||||
// this.topAreaOptions = response.data.data;
|
// this.topAreaOptions = response.data.data;
|
||||||
// });
|
});
|
||||||
},
|
},
|
||||||
changType1(e){
|
changDate1(){
|
||||||
console.log(this.type1)
|
|
||||||
this.InitEChartsOne()
|
this.InitEChartsOne()
|
||||||
this.myCharts1.resize();
|
this.myCharts1.resize();
|
||||||
},
|
},
|
||||||
InitEChartsOne() {
|
InitEChartsOne() {
|
||||||
|
console.log(this.dateRange1)
|
||||||
var chartData=[]
|
var chartData=[]
|
||||||
// getProportionOfOrderTypesApi({type:this.type3}).then((response) => {
|
// getProportionOfOrderTypesApi({type:this.type3}).then((response) => {
|
||||||
// chartData = response.data;
|
// chartData = response.data;
|
||||||
|
|
@ -282,12 +334,12 @@ export default {
|
||||||
// });
|
// });
|
||||||
// });
|
// });
|
||||||
},
|
},
|
||||||
changType2(e){
|
changDate2(){
|
||||||
console.log(this.type2)
|
|
||||||
this.InitEChartsTwo()
|
this.InitEChartsTwo()
|
||||||
this.myCharts2.resize();
|
this.myCharts2.resize();
|
||||||
},
|
},
|
||||||
InitEChartsTwo() {
|
InitEChartsTwo() {
|
||||||
|
console.log(this.dateRange2)
|
||||||
var chartData=[]
|
var chartData=[]
|
||||||
// getProportionOfOrderTypesApi({type:this.type3}).then((response) => {
|
// getProportionOfOrderTypesApi({type:this.type3}).then((response) => {
|
||||||
// chartData = response.data;
|
// chartData = response.data;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue