|
|
@@ -15,49 +15,49 @@ export default {
|
|
|
let range = this.$util.dateUtil.getNearlyMonthRange();
|
|
|
return {
|
|
|
chartsHeight: 290,
|
|
|
- topSelect: '5',
|
|
|
- eatTimeSelect: '1',
|
|
|
+ topSelect: "5",
|
|
|
+ eatTimeSelect: "1",
|
|
|
queryData: {
|
|
|
- companyId: '0',
|
|
|
- deptId: '0',
|
|
|
- timeRange: range
|
|
|
+ companyId: "0",
|
|
|
+ deptId: "0",
|
|
|
+ timeRange: range,
|
|
|
},
|
|
|
coreData: [
|
|
|
{
|
|
|
- title: '当天就餐人数预测',
|
|
|
+ title: "当天就餐人数预测",
|
|
|
num: 0,
|
|
|
isHighLight: true,
|
|
|
- historyDesc: '同比',
|
|
|
+ historyDesc: "同比",
|
|
|
},
|
|
|
{
|
|
|
- title: '当天累计就餐人数(人)',
|
|
|
+ title: "当天累计就餐人数(人)",
|
|
|
num: 0,
|
|
|
- historyDesc: '环比',
|
|
|
- historyNum: 0
|
|
|
+ historyDesc: "环比",
|
|
|
+ historyNum: 0,
|
|
|
},
|
|
|
{
|
|
|
- title: '消费总额(万元)',
|
|
|
+ title: "消费总额(万元)",
|
|
|
num: 0,
|
|
|
- historyDesc: '同比',
|
|
|
- historyNum: 0
|
|
|
+ historyDesc: "同比",
|
|
|
+ historyNum: 0,
|
|
|
},
|
|
|
{
|
|
|
- title: '订单均价(元)',
|
|
|
+ title: "订单均价(元)",
|
|
|
num: 0,
|
|
|
- historyDesc: '同比',
|
|
|
- historyNum: 0
|
|
|
+ historyDesc: "同比",
|
|
|
+ historyNum: 0,
|
|
|
},
|
|
|
{
|
|
|
type: 1,
|
|
|
- title: '值得关注',
|
|
|
+ title: "值得关注",
|
|
|
showStar: true,
|
|
|
- content: ''
|
|
|
+ content: "",
|
|
|
},
|
|
|
],
|
|
|
oriDailyMenu: [],
|
|
|
dailyMenu: [],
|
|
|
topMenu: [],
|
|
|
- }
|
|
|
+ };
|
|
|
},
|
|
|
components: {
|
|
|
Query,
|
|
|
@@ -74,82 +74,88 @@ export default {
|
|
|
let app = this;
|
|
|
window.onresize = () => {
|
|
|
app.$forceUpdate();
|
|
|
- }
|
|
|
+ };
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.$nextTick(()=>{
|
|
|
- this.init()
|
|
|
- })
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.init();
|
|
|
+ });
|
|
|
},
|
|
|
methods: {
|
|
|
init() {
|
|
|
this.$util.asyncPromise(
|
|
|
- this.getCoreData(),
|
|
|
- this.getDailyMenu(),
|
|
|
- this.getTopMenu(),
|
|
|
- )
|
|
|
- },
|
|
|
- reset() {
|
|
|
+ this.getCoreData(),
|
|
|
+ this.getDailyMenu(),
|
|
|
+ this.getTopMenu()
|
|
|
+ );
|
|
|
},
|
|
|
+ reset() {},
|
|
|
search(data) {
|
|
|
this.$util.asyncPromise(
|
|
|
- this.getCoreData(),
|
|
|
- this.getDailyMenu(),
|
|
|
- this.getTopMenu(),
|
|
|
- this.$refs.LifeRestEatChart.getData(),
|
|
|
- this.$refs.LifeRestConsumeChart.getData(),
|
|
|
- this.$refs.LifeRestPayChart.getData(),
|
|
|
- this.$refs.LifeRestProfitChart.getData(),
|
|
|
+ this.getCoreData(),
|
|
|
+ this.getDailyMenu(),
|
|
|
+ this.getTopMenu(),
|
|
|
+ this.$refs.LifeRestEatChart.getData(),
|
|
|
+ this.$refs.LifeRestConsumeChart.getData(),
|
|
|
+ this.$refs.LifeRestPayChart.getData(),
|
|
|
+ this.$refs.LifeRestProfitChart.getData()
|
|
|
);
|
|
|
this.$forceUpdate();
|
|
|
},
|
|
|
getCoreData() {
|
|
|
- return apiLifeRestaurant.getCoreData(this.queryData).then(res=>{
|
|
|
- this.coreData[0].num = res.list[0].value
|
|
|
- this.coreData[0].historyNum = res.list[0].compare
|
|
|
- this.coreData[1].num = res.list[1].value
|
|
|
- this.coreData[1].historyNum = res.list[1].compare
|
|
|
- this.coreData[2].num = res.list[2].value
|
|
|
- this.coreData[2].historyNum = res.list[2].compare
|
|
|
- this.coreData[3].num = res.list[3].value
|
|
|
- this.coreData[3].historyNum = res.list[3].compare
|
|
|
+ return apiLifeRestaurant.getCoreData(this.queryData).then((res) => {
|
|
|
+ this.coreData[0].num = res.list[0].value;
|
|
|
+ this.coreData[0].historyNum = res.list[0].compare;
|
|
|
+ this.coreData[1].num = res.list[1].value;
|
|
|
+ this.coreData[1].historyNum = res.list[1].compare;
|
|
|
+ this.coreData[2].num = res.list[2].value;
|
|
|
+ this.coreData[2].historyNum = res.list[2].compare;
|
|
|
+ this.coreData[3].num = res.list[3].value;
|
|
|
+ this.coreData[3].historyNum = res.list[3].compare;
|
|
|
this.coreData[4].content = res.worthAttention;
|
|
|
- })
|
|
|
+ });
|
|
|
},
|
|
|
getDailyMenu() {
|
|
|
- this.queryData['type'] = this.eatTimeSelect;
|
|
|
- return apiLifeRestaurant.getTodayMenu(this.queryData).then(res=>{
|
|
|
+ this.queryData["type"] = this.eatTimeSelect;
|
|
|
+ return apiLifeRestaurant.getTodayMenu(this.queryData).then((res) => {
|
|
|
this.oriDailyMenu = res;
|
|
|
this.filterTimeMenu();
|
|
|
- })
|
|
|
+ });
|
|
|
},
|
|
|
filterTimeMenu() {
|
|
|
- this.dailyMenu = this.oriDailyMenu.filter(item=>item.cuisineType==this.eatTimeSelect);
|
|
|
- this.dailyMenu.sort((a,b)=>{
|
|
|
- if (a.cuisineTypeTwo>=b.cuisineTypeTwo) {
|
|
|
+ this.dailyMenu = this.oriDailyMenu.filter(
|
|
|
+ (item) => item.cuisineType == this.eatTimeSelect
|
|
|
+ );
|
|
|
+ this.dailyMenu.sort((a, b) => {
|
|
|
+ if (a.cuisineTypeTwo >= b.cuisineTypeTwo) {
|
|
|
return 1;
|
|
|
} else {
|
|
|
return -1;
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
},
|
|
|
getTopMenu() {
|
|
|
- return apiLifeRestaurant.getWelcomeDishes(this.queryData).then(res=>{
|
|
|
- this.topMenu = res
|
|
|
- this.topMenu = this.topMenu.slice(0,this.topSelect)
|
|
|
- })
|
|
|
+ return apiLifeRestaurant.getWelcomeDishes(this.queryData).then((res) => {
|
|
|
+ this.topMenu = res;
|
|
|
+ this.topMenu = this.topMenu.slice(0, this.topSelect);
|
|
|
+ });
|
|
|
},
|
|
|
- }
|
|
|
-}
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
<div class="lifeRestaurant">
|
|
|
<div class="page-query-core">
|
|
|
<a-row>
|
|
|
- <a-col>
|
|
|
+ <a-col style="margin-bottom: 10px">
|
|
|
<div class="lifeRestaurant-query">
|
|
|
- <Query :query-data.sync="queryData" :show="['company','dept','time']" :reset="reset" :search="search"></Query>
|
|
|
+ <Query
|
|
|
+ :query-data.sync="queryData"
|
|
|
+ :show="['company', 'dept', 'time']"
|
|
|
+ :reset="reset"
|
|
|
+ :search="search"
|
|
|
+ ></Query>
|
|
|
</div>
|
|
|
</a-col>
|
|
|
<a-col>
|
|
|
@@ -166,22 +172,38 @@ export default {
|
|
|
<div class="lifeRestaurant-left">
|
|
|
<div class="lifeRestaurant-eat ioc-card-content">
|
|
|
<Card title="用餐分析">
|
|
|
- <LifeRestEatChart ref="LifeRestEatChart" :query-data="queryData" :height="chartsHeight"></LifeRestEatChart>
|
|
|
+ <LifeRestEatChart
|
|
|
+ ref="LifeRestEatChart"
|
|
|
+ :query-data="queryData"
|
|
|
+ :height="chartsHeight"
|
|
|
+ ></LifeRestEatChart>
|
|
|
</Card>
|
|
|
</div>
|
|
|
<div class="lifeRestaurant-consume ioc-card-content">
|
|
|
<Card title="消费分析">
|
|
|
- <LifeRestConsumeChart ref="LifeRestConsumeChart" :query-data="queryData" :height="chartsHeight"></LifeRestConsumeChart>
|
|
|
+ <LifeRestConsumeChart
|
|
|
+ ref="LifeRestConsumeChart"
|
|
|
+ :query-data="queryData"
|
|
|
+ :height="chartsHeight"
|
|
|
+ ></LifeRestConsumeChart>
|
|
|
</Card>
|
|
|
</div>
|
|
|
- <div class="lifeRestaurant-profit ">
|
|
|
+ <div class="lifeRestaurant-profit">
|
|
|
<Card title="收入分析">
|
|
|
- <LifeRestProfitChart ref="LifeRestProfitChart" :query-data="queryData" :height="chartsHeight"></LifeRestProfitChart>
|
|
|
+ <LifeRestProfitChart
|
|
|
+ ref="LifeRestProfitChart"
|
|
|
+ :query-data="queryData"
|
|
|
+ :height="chartsHeight"
|
|
|
+ ></LifeRestProfitChart>
|
|
|
</Card>
|
|
|
</div>
|
|
|
- <div class="lifeRestaurant-pay ">
|
|
|
+ <div class="lifeRestaurant-pay">
|
|
|
<Card title="支付分析">
|
|
|
- <LifeRestPayChart ref="LifeRestPayChart" :query-data="queryData" :height="chartsHeight"></LifeRestPayChart>
|
|
|
+ <LifeRestPayChart
|
|
|
+ ref="LifeRestPayChart"
|
|
|
+ :query-data="queryData"
|
|
|
+ :height="chartsHeight"
|
|
|
+ ></LifeRestPayChart>
|
|
|
</Card>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -189,12 +211,18 @@ export default {
|
|
|
<a-col :span="6">
|
|
|
<div class="lifeRestaurant-right">
|
|
|
<div class="lifeRestaurant-top ioc-card-content">
|
|
|
- <Card title="受欢迎菜品" style="height: 350px ">
|
|
|
- <div style="height: 300px;overflow-y: auto">
|
|
|
- <LifeRestTopMenu :table-data="topMenu" ></LifeRestTopMenu>
|
|
|
+ <Card title="受欢迎菜品" style="height: 350px">
|
|
|
+ <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
|
|
|
+ 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>
|
|
|
@@ -204,26 +232,28 @@ export default {
|
|
|
</div>
|
|
|
<div class="lifeRestaurant-cookbook ioc-card-content">
|
|
|
<Card title="每日菜谱" style="height: 700px">
|
|
|
- <div style="height: 650px;overflow-y: auto">
|
|
|
- <LifeRestDailyMenu :table-data="dailyMenu" ></LifeRestDailyMenu>
|
|
|
+ <div style="height: 650px; overflow-y: auto">
|
|
|
+ <LifeRestDailyMenu :table-data="dailyMenu"></LifeRestDailyMenu>
|
|
|
</div>
|
|
|
|
|
|
<template #title-extra>
|
|
|
- <a-select v-model="eatTimeSelect" default-value="1" style="width: 100px;" size="small" @change="filterTimeMenu">
|
|
|
+ <a-select
|
|
|
+ v-model="eatTimeSelect"
|
|
|
+ default-value="1"
|
|
|
+ style="width: 100px"
|
|
|
+ size="small"
|
|
|
+ @change="filterTimeMenu"
|
|
|
+ >
|
|
|
<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>
|
|
|
</a-col>
|
|
|
-
|
|
|
-
|
|
|
</a-row>
|
|
|
-
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -236,6 +266,11 @@ export default {
|
|
|
vertical-align: top;
|
|
|
.lifeRestaurant-query {
|
|
|
width: 100%;
|
|
|
+ background: #fff;
|
|
|
+ height: 60px;
|
|
|
+ padding: 10px;
|
|
|
+ border-radius: 3px;
|
|
|
+ box-shadow: 1px 1px 4px #ccc;
|
|
|
}
|
|
|
.lifeRestaurant-core {
|
|
|
width: 100%;
|
|
|
@@ -286,6 +321,6 @@ export default {
|
|
|
border: none;
|
|
|
border-radius: 6px;
|
|
|
padding: 0px 12px;
|
|
|
- color: #B2B2B2;
|
|
|
+ color: #b2b2b2;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|
Bella