bonus
/
bonus-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

数据总览页面修改

This commit is contained in:
zzyuan 2025-06-12 16:07:56 +08:00
parent 01b3ea14cf
commit 7a4eb580a9
2 changed files with 31 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/views/dashboard/PanelGroup.vue
View File

@ -10,7 +10,7 @@
</div>
<div>
<div style="display: flex;justify-content: space-between;width: 70%;" v-if="Number(item.rate)>=0">
<div style="font-size: 12px;color: #07B78A;">
<div style="font-size: 14px;color: #07B78A;">
同比上次 +{{item.rate}}％
</div>
<div>
@ -18,7 +18,7 @@
</div>
</div>
<div style="display: flex;justify-content: space-between;width: 70%;" v-if="Number(item.rate)<0">
<div style="font-size: 12px;color: #d81e06;">
<div style="font-size: 14px;color: #d81e06;">
同比上次 {{item.rate}}％
</div>
<div>
@ -220,6 +220,7 @@ export default {
box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
border-color: rgba(0, 0, 0, .05);
padding: 20px;
border-radius: 4px;
// &:hover {
// .icon-message {
@ -245,7 +246,7 @@ export default {
}
.card-panel-num {
font-size: 24px;
font-size: 28px;
color: #000;
}
}

36
src/views/index_v1.vue
View File

@ -4,7 +4,7 @@
<panel-group :topData="topAreaOptions"/>
<el-row>
<el-col :span="16">
<div style="background: #fff;padding: 10px;margin: 5px;margin-bottom: 10px;">
<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>
@ -16,7 +16,7 @@
</div>
<div id="lineChartOne" style="width: 100%;height: 300px;margin-bottom: 20px;"></div>
</div>
<div style="background: #fff;padding: 10px;margin: 5px;margin-bottom: 10px;">
<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>
@ -30,13 +30,21 @@
</div>
</el-col>
<el-col :span="8">
<div style="background: #fff;padding: 10px;margin: 5px;margin-bottom: 10px;">
<div style="border-left: 4px solid #00594F;padding-left: 10px;font-weight: 600">本月菜品销量排名</div>
<div id="lineChartThree" style="width: 100%;height: 410px;margin-bottom: 20px;"></div>
<div style="background: #fff;padding: 10px;margin: 5px;margin-bottom: 10px;border-radius: 4px;">
<div style="border-left: 4px solid #00594F;padding-left: 10px;font-weight: 600">近30天菜品销量排名</div>
<div id="lineChartThree" style="width: 100%;height: 380px;margin-bottom: 20px;"></div>
</div>
<div style="background: #fff;padding: 10px;margin: 5px;margin-bottom: 10px;">
<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 id="barChartFour" style="width: 100%;height: 220px;margin-bottom: 20px;"></div>
<div>
<el-radio-group v-model="type3" @change="changType3">
<el-radio-button :label="1">近7日</el-radio-button>
<el-radio-button :label="2">近30日</el-radio-button>
</el-radio-group>
</div>
</div>
<div id="barChartFour" style="width: 100%;height: 235px;margin-bottom: 20px;"></div>
</div>
@ -118,6 +126,7 @@ export default {
],
type1:1,
type2:1,
type3:1,
myCharts1:null,
myCharts2:null,
myCharts3:null,
@ -152,6 +161,7 @@ export default {
changType1(e){
console.log(this.type1)
this.InitEChartsOne()
this.myCharts1.resize();
},
InitEChartsOne() {
let chartData=[]
@ -276,6 +286,7 @@ export default {
changType2(e){
console.log(this.type2)
this.InitEChartsTwo()
this.myCharts2.resize();
},
InitEChartsTwo() {
let chartData=[]
@ -401,7 +412,7 @@ export default {
var getName = [];
var getValue = [];
var chartData=[]
getThisMonthSDishSalesRankingApi({type:"2"}).then((response) => {
getThisMonthSDishSalesRankingApi().then((response) => {
chartData = response.data;
chartData.forEach((item,index)=>{
getName.push(item.name)
@ -418,7 +429,7 @@ export default {
left: "10%",
right: "2%",
bottom: "2%",
top: "2%",
top: "10%",
containLabel: true,
},
tooltip: {
@ -607,9 +618,14 @@ export default {
// });
});
},
changType3(e){
console.log(this.type3)
this.InitEChartsFour()
this.myCharts4.resize();
},
InitEChartsFour() {
var chartData=[]
getProportionOfOrderTypesApi({type:"2"}).then((response) => {
getProportionOfOrderTypesApi({type:this.type3}).then((response) => {
chartData = response.data;
var m2R2Data = []
var sumNum = 0