|
@@ -11,7 +11,7 @@
|
|
|
<div class="stat-card stat-card-blue">
|
|
|
<div class="stat-card-title">洗衣件数</div>
|
|
|
<div class="stat-card-value">
|
|
|
- <count-to :start-val="0" :end-val="orderStats.dailyInFactoryCount || 0" :duration="2600" />
|
|
|
+ <count-to :start-val="0" :end-val="orderStats.clothCount || 0" :duration="2600" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -19,30 +19,30 @@
|
|
|
<div class="stat-card stat-card-green">
|
|
|
<div class="stat-card-title">洗衣金额</div>
|
|
|
<div class="stat-card-value">
|
|
|
- <count-to :start-val="0" :end-val="orderStats.dailyInFactoryAmount || 0" :duration="2600" prefix="¥" />
|
|
|
+ <count-to :start-val="0" :end-val="orderStats.clothCashAmount || 0" :duration="2600" prefix="¥" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col :xs="12" :sm="12" :lg="6">
|
|
|
<div class="stat-card stat-card-red">
|
|
|
- <div class="stat-card-title">撤单件数</div>
|
|
|
+ <div class="stat-card-title">商品笔数</div>
|
|
|
<div class="stat-card-value">
|
|
|
- <count-to :start-val="0" :end-val="orderStats.dailyRefundCount || 0" :duration="2600" />
|
|
|
+ <count-to :start-val="0" :end-val="orderStats.goodsOrderCount || 0" :duration="2600" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col :xs="12" :sm="12" :lg="6">
|
|
|
<div class="stat-card stat-card-orange">
|
|
|
- <div class="stat-card-title">撤单金额</div>
|
|
|
+ <div class="stat-card-title">商品金额</div>
|
|
|
<div class="stat-card-value">
|
|
|
- <count-to :start-val="0" :end-val="orderStats.dailyRefundAmount || 0" :duration="2600" prefix="¥" />
|
|
|
+ <count-to :start-val="0" :end-val="orderStats.goodsOrderAmount || 0" :duration="2600" prefix="¥" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
-
|
|
|
+
|
|
|
<!-- 充值统计卡片 -->
|
|
|
<el-col :xs="24" :sm="24" :lg="12">
|
|
|
<div class="stat-section">
|
|
@@ -50,9 +50,9 @@
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :xs="12" :sm="12" :lg="6">
|
|
|
<div class="stat-card stat-card-purple">
|
|
|
- <div class="stat-card-title">充值金额</div>
|
|
|
+ <div class="stat-card-title">付款金额</div>
|
|
|
<div class="stat-card-value">
|
|
|
- <count-to :start-val="0" :end-val="chargeStats.dailyChargeAmount || 0" :duration="2600" prefix="¥" />
|
|
|
+ <count-to :start-val="0" :end-val="chargeStats.rechargePayAmount || 0" :duration="2600" prefix="¥" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -60,23 +60,23 @@
|
|
|
<div class="stat-card stat-card-cyan">
|
|
|
<div class="stat-card-title">充值笔数</div>
|
|
|
<div class="stat-card-value">
|
|
|
- <count-to :start-val="0" :end-val="chargeStats.dailyChargeCount || 0" :duration="2600" />
|
|
|
+ <count-to :start-val="0" :end-val="chargeStats.rechargeCount || 0" :duration="2600" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col :xs="12" :sm="12" :lg="6">
|
|
|
<div class="stat-card stat-card-teal">
|
|
|
- <div class="stat-card-title">平均充值</div>
|
|
|
+ <div class="stat-card-title">退款金额</div>
|
|
|
<div class="stat-card-value">
|
|
|
- <count-to :start-val="0" :end-val="chargeStats.dailyChargeAmount ? (chargeStats.dailyChargeAmount / chargeStats.dailyChargeCount) : 0" :duration="2600" prefix="¥" />
|
|
|
+ <count-to :start-val="0" :end-val="chargeStats.chargeRefundAmount || 0" :duration="2600" prefix="¥" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col :xs="12" :sm="12" :lg="6">
|
|
|
<div class="stat-card stat-card-indigo">
|
|
|
- <div class="stat-card-title">会员充值</div>
|
|
|
+ <div class="stat-card-title">退款笔数</div>
|
|
|
<div class="stat-card-value">
|
|
|
- <count-to :start-val="0" :end-val="chargeStats.dailyMemberChargeAmount || 0" :duration="2600" prefix="¥" />
|
|
|
+ <count-to :start-val="0" :end-val="chargeStats.refundCount || 0" :duration="2600" prefix="¥" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -107,7 +107,7 @@
|
|
|
</div>
|
|
|
<div class="card-panel-description">
|
|
|
<div class="card-panel-text">洗衣件数</div>
|
|
|
- <count-to :start-val="0" :end-val="dailyOrderStats.dailyInFactoryCount || 0" :duration="2600" class="card-panel-num" />
|
|
|
+ <count-to :start-val="0" :end-val="dailyOrderStats.clothOrderCount || 0" :duration="2600" class="card-panel-num" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -118,7 +118,7 @@
|
|
|
</div>
|
|
|
<div class="card-panel-description">
|
|
|
<div class="card-panel-text">洗衣金额</div>
|
|
|
- <count-to :start-val="0" :end-val="dailyOrderStats.dailyInFactoryAmount || 0" :duration="2600" class="card-panel-num" prefix="¥" />
|
|
|
+ <count-to :start-val="0" :end-val="dailyOrderStats.clothOrderAmount || 0" :duration="2600" class="card-panel-num" prefix="¥" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -129,7 +129,7 @@
|
|
|
</div>
|
|
|
<div class="card-panel-description">
|
|
|
<div class="card-panel-text">充值金额</div>
|
|
|
- <count-to :start-val="0" :end-val="dailyChargeStats.dailyChargeAmount || 0" :duration="2600" class="card-panel-num" prefix="¥" />
|
|
|
+ <count-to :start-val="0" :end-val="dailyChargeStats.rechargePayAmount || 0" :duration="2600" class="card-panel-num" prefix="¥" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -140,7 +140,7 @@
|
|
|
</div>
|
|
|
<div class="card-panel-description">
|
|
|
<div class="card-panel-text">充值笔数</div>
|
|
|
- <count-to :start-val="0" :end-val="dailyChargeStats.dailyChargeCount || 0" :duration="2600" class="card-panel-num" />
|
|
|
+ <count-to :start-val="0" :end-val="dailyChargeStats.rechargeCount || 0" :duration="2600" class="card-panel-num" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
@@ -233,22 +233,22 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
/**
|
|
|
* 处理今日概览时间范围变化
|
|
|
*/
|
|
|
handleDailyTimeRangeChange() {
|
|
|
this.getDailyStatistics()
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
/**
|
|
|
* 获取今日概览数据
|
|
|
*/
|
|
|
getDailyStatistics() {
|
|
|
- const date = this.dailyTimeRange === 'today'
|
|
|
- ? this.formatDate(new Date())
|
|
|
+ const date = this.dailyTimeRange === 'today'
|
|
|
+ ? this.formatDate(new Date())
|
|
|
: this.formatDate(this.getYesterday())
|
|
|
-
|
|
|
+
|
|
|
getStoreDailyStatistics(date).then(response => {
|
|
|
if (response.code === 200) {
|
|
|
this.dailyOrderStats = response.data.orderStats || {}
|
|
@@ -256,7 +256,7 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
/**
|
|
|
* 获取趋势数据
|
|
|
*/
|
|
@@ -265,19 +265,19 @@ export default {
|
|
|
const endDate = new Date()
|
|
|
const startDate = new Date()
|
|
|
startDate.setDate(endDate.getDate() - 14)
|
|
|
-
|
|
|
+
|
|
|
const params = {
|
|
|
startDate: this.formatDate(startDate),
|
|
|
endDate: this.formatDate(endDate)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 获取订单趋势数据
|
|
|
listStoreStatistics(params).then(response => {
|
|
|
if (response.code === 200) {
|
|
|
this.orderTrendData = response.rows || []
|
|
|
}
|
|
|
})
|
|
|
-
|
|
|
+
|
|
|
// 获取充值趋势数据
|
|
|
listStoreChargeStatistics(params).then(response => {
|
|
|
if (response.code === 200) {
|
|
@@ -285,7 +285,7 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
/**
|
|
|
* 获取昨天的日期
|
|
|
*/
|
|
@@ -294,7 +294,7 @@ export default {
|
|
|
yesterday.setDate(yesterday.getDate() - 1)
|
|
|
return yesterday
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
/**
|
|
|
* 格式化日期为 yyyy-MM-dd
|
|
|
*/
|
|
@@ -312,13 +312,13 @@ export default {
|
|
|
.home {
|
|
|
.panel-group {
|
|
|
margin-top: 18px;
|
|
|
-
|
|
|
+
|
|
|
.stat-section {
|
|
|
background: #fff;
|
|
|
padding: 20px;
|
|
|
border-radius: 8px;
|
|
|
box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
|
|
|
-
|
|
|
+
|
|
|
.section-title {
|
|
|
font-size: 16px;
|
|
|
font-weight: bold;
|
|
@@ -326,7 +326,7 @@ export default {
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card {
|
|
|
height: 120px;
|
|
|
border-radius: 8px;
|
|
@@ -337,56 +337,56 @@ export default {
|
|
|
justify-content: center;
|
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
|
|
transition: all 0.3s;
|
|
|
-
|
|
|
+
|
|
|
&:hover {
|
|
|
transform: translateY(-5px);
|
|
|
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-title {
|
|
|
font-size: 16px;
|
|
|
margin-bottom: 10px;
|
|
|
opacity: 0.9;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-value {
|
|
|
font-size: 28px;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-blue {
|
|
|
background: linear-gradient(135deg, #1890ff, #36cfc9);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-green {
|
|
|
background: linear-gradient(135deg, #52c41a, #73d13d);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-red {
|
|
|
background: linear-gradient(135deg, #f5222d, #ff4d4f);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-orange {
|
|
|
background: linear-gradient(135deg, #fa8c16, #ffa940);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-purple {
|
|
|
background: linear-gradient(135deg, #722ed1, #b37feb);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-cyan {
|
|
|
background: linear-gradient(135deg, #13c2c2, #5cdbd3);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-teal {
|
|
|
background: linear-gradient(135deg, #006d75, #08979c);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.stat-card-indigo {
|
|
|
background: linear-gradient(135deg, #2f54eb, #597ef7);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.card-panel {
|
|
|
height: 108px;
|
|
|
cursor: pointer;
|
|
@@ -442,30 +442,30 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.chart-wrapper {
|
|
|
background: #fff;
|
|
|
padding: 20px;
|
|
|
border-radius: 4px;
|
|
|
box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
|
|
|
-
|
|
|
+
|
|
|
.chart-header {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
margin-bottom: 20px;
|
|
|
-
|
|
|
+
|
|
|
.chart-title {
|
|
|
font-size: 16px;
|
|
|
font-weight: bold;
|
|
|
color: #303133;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.chart-content {
|
|
|
height: 300px;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.chart-content-1 {
|
|
|
height: 130px;
|
|
|
}
|