|
@@ -76,7 +76,7 @@
|
|
<a-col :md="4" :lg="4">
|
|
<a-col :md="4" :lg="4">
|
|
<a-card class="border-radius background-skyblue">
|
|
<a-card class="border-radius background-skyblue">
|
|
<div class="module-list ">
|
|
<div class="module-list ">
|
|
- <span>{{ carData.dayTotalCar }}</span>
|
|
|
|
|
|
+ <span>{{ chartData.KX.toFixed(2) }}</span>
|
|
<p>快速洗车</p>
|
|
<p>快速洗车</p>
|
|
</div>
|
|
</div>
|
|
</a-card>
|
|
</a-card>
|
|
@@ -84,7 +84,7 @@
|
|
<a-col :md="4" :lg="4">
|
|
<a-col :md="4" :lg="4">
|
|
<a-card class="border-radius background-greenBlue">
|
|
<a-card class="border-radius background-greenBlue">
|
|
<div class="module-list ">
|
|
<div class="module-list ">
|
|
- <span>{{ carData.dayWashCar }}</span>
|
|
|
|
|
|
+ <span>{{ chartData.JX.toFixed(2) }}</span>
|
|
<p>精致洗车</p>
|
|
<p>精致洗车</p>
|
|
</div>
|
|
</div>
|
|
</a-card>
|
|
</a-card>
|
|
@@ -92,7 +92,7 @@
|
|
<a-col :md="4" :lg="4">
|
|
<a-col :md="4" :lg="4">
|
|
<a-card class="border-radius background-blackGreen">
|
|
<a-card class="border-radius background-blackGreen">
|
|
<div class="module-list ">
|
|
<div class="module-list ">
|
|
- <span>{{ carData.dayCheckCar }}</span>
|
|
|
|
|
|
+ <span>{{ chartData.DLX.toFixed(2) }}</span>
|
|
<p>打蜡精洗</p>
|
|
<p>打蜡精洗</p>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
@@ -146,7 +146,7 @@
|
|
:searchData="XdaysData"
|
|
:searchData="XdaysData"
|
|
:value="washTypePieData"
|
|
:value="washTypePieData"
|
|
title="洗车总量(台)"
|
|
title="洗车总量(台)"
|
|
- :total="washCarsTotal"
|
|
|
|
|
|
+ :total="chartData.allOrderNum.toFixed(2)"
|
|
:color="washTypePieColor"
|
|
:color="washTypePieColor"
|
|
:xAxisRotate="resize"
|
|
:xAxisRotate="resize"
|
|
text="" />
|
|
text="" />
|
|
@@ -161,7 +161,7 @@
|
|
:searchData="XdaysData"
|
|
:searchData="XdaysData"
|
|
:value="couponChartData"
|
|
:value="couponChartData"
|
|
title="洗车总量(台)"
|
|
title="洗车总量(台)"
|
|
- :total="washCarsTotal"
|
|
|
|
|
|
+ :total="chartData.allOrderNum.toFixed(2)"
|
|
:color="couponColor"
|
|
:color="couponColor"
|
|
:xAxisRotate="resize"
|
|
:xAxisRotate="resize"
|
|
text="" />
|
|
text="" />
|
|
@@ -182,6 +182,10 @@ import {
|
|
import _ from 'lodash'
|
|
import _ from 'lodash'
|
|
import getDate from '@/libs/getDate'
|
|
import getDate from '@/libs/getDate'
|
|
import moment from 'moment'
|
|
import moment from 'moment'
|
|
|
|
+import { getOrderstatistics } from '@/api/report-charts.js'
|
|
|
|
+import {
|
|
|
|
+ storeList
|
|
|
|
+} from '@/api/order.js'
|
|
export default {
|
|
export default {
|
|
name: 'Home',
|
|
name: 'Home',
|
|
components: {
|
|
components: {
|
|
@@ -212,6 +216,31 @@ export default {
|
|
} else {
|
|
} else {
|
|
return 0
|
|
return 0
|
|
}
|
|
}
|
|
|
|
+ },
|
|
|
|
+ // 各类型占比总计数据
|
|
|
|
+ washTypePieData () {
|
|
|
|
+ const data = [{
|
|
|
|
+ 'name': '快速洗车',
|
|
|
|
+ 'value': this.chartData.KX.toFixed(2)
|
|
|
|
+ }, {
|
|
|
|
+ 'name': '精致洗车',
|
|
|
|
+ 'value': this.chartData.JX.toFixed(2)
|
|
|
|
+ }, {
|
|
|
|
+ 'name': '打蜡精洗',
|
|
|
|
+ 'value': this.chartData.DLX.toFixed(2)
|
|
|
|
+ }]
|
|
|
|
+ return data
|
|
|
|
+ },
|
|
|
|
+ // 洗车用券量占比数据
|
|
|
|
+ couponChartData () {
|
|
|
|
+ const data = [{
|
|
|
|
+ 'name': '未用券洗车量',
|
|
|
|
+ 'value': this.chartData.notUseCouponOrderNum.toFixed(2)
|
|
|
|
+ }, {
|
|
|
|
+ 'name': '用券洗车量',
|
|
|
|
+ 'value': this.chartData.useCouponOrderNum.toFixed(2)
|
|
|
|
+ }]
|
|
|
|
+ return data
|
|
}
|
|
}
|
|
},
|
|
},
|
|
// 将 reisze 事件在 vue mounted 的时候 去挂载一下它的方法
|
|
// 将 reisze 事件在 vue mounted 的时候 去挂载一下它的方法
|
|
@@ -235,6 +264,14 @@ export default {
|
|
queryWord: null, // 时间查询条件,默认本周
|
|
queryWord: null, // 时间查询条件,默认本周
|
|
storeIds: [] // 已选洗车网点
|
|
storeIds: [] // 已选洗车网点
|
|
},
|
|
},
|
|
|
|
+ chartData: {
|
|
|
|
+ KX: 0, // 快洗
|
|
|
|
+ JX: 0, // 精洗
|
|
|
|
+ DLX: 0, // 打蜡洗
|
|
|
|
+ allOrderNum: 0, // 洗车总量
|
|
|
|
+ useCouponOrderNum: 0, // 用券洗车量
|
|
|
|
+ notUseCouponOrderNum: 0 // 未用券洗车量
|
|
|
|
+ },
|
|
// 快速删选tab
|
|
// 快速删选tab
|
|
tabList: [{
|
|
tabList: [{
|
|
name: '今天',
|
|
name: '今天',
|
|
@@ -268,53 +305,28 @@ export default {
|
|
data: []
|
|
data: []
|
|
}
|
|
}
|
|
],
|
|
],
|
|
- // 洗车用券量占比
|
|
|
|
- couponChartData: [{
|
|
|
|
- 'name': '未用券洗车量',
|
|
|
|
- 'value': 0
|
|
|
|
- }, {
|
|
|
|
- 'name': '用券洗车量',
|
|
|
|
- 'value': 0
|
|
|
|
- }],
|
|
|
|
- washCarsTotal: 0, // 洗车总量
|
|
|
|
couponColor: ['#d48265', '#ff55ff'],
|
|
couponColor: ['#d48265', '#ff55ff'],
|
|
// 洗车类型数据
|
|
// 洗车类型数据
|
|
currentTabChart: 'tab1', // 洗车类型详情数据与变化趋势的tab 默认展示详情数据
|
|
currentTabChart: 'tab1', // 洗车类型详情数据与变化趋势的tab 默认展示详情数据
|
|
- carData: {
|
|
|
|
- dayTotalCar: 0, // 进店量
|
|
|
|
- dayWashCar: 0, // 洗车量
|
|
|
|
- dayCheckCar: 0 // 检测量
|
|
|
|
- },
|
|
|
|
XdaysData: [], // 图表X轴时间集合
|
|
XdaysData: [], // 图表X轴时间集合
|
|
- // 进店量,检测量 数据
|
|
|
|
|
|
+ // 洗车类型数据
|
|
washTypeChartData: [{
|
|
washTypeChartData: [{
|
|
- name: '进店量',
|
|
|
|
|
|
+ name: '',
|
|
type: 'bar',
|
|
type: 'bar',
|
|
data: []
|
|
data: []
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- name: '检测量',
|
|
|
|
|
|
+ name: '',
|
|
type: 'bar',
|
|
type: 'bar',
|
|
data: []
|
|
data: []
|
|
}
|
|
}
|
|
],
|
|
],
|
|
// 各类型占比
|
|
// 各类型占比
|
|
washTypePieColor: ['#ffaa00', '#00ff00', '#00aaff', '#ff55ff', '#1dc5d4', '#8465c7', '#00ffff'],
|
|
washTypePieColor: ['#ffaa00', '#00ff00', '#00aaff', '#ff55ff', '#1dc5d4', '#8465c7', '#00ffff'],
|
|
- washTypePieData: [{
|
|
|
|
- 'name': '快速洗车',
|
|
|
|
- 'value': 0
|
|
|
|
- }, {
|
|
|
|
- 'name': '精致洗车',
|
|
|
|
- 'value': 0
|
|
|
|
- }, {
|
|
|
|
- 'name': '打蜡精洗',
|
|
|
|
- 'value': 0
|
|
|
|
- }],
|
|
|
|
- dayBundleSaleIncome: 0, // 套餐销售额
|
|
|
|
databack: {
|
|
databack: {
|
|
couponChartData: [],
|
|
couponChartData: [],
|
|
washTypePieData: [],
|
|
washTypePieData: [],
|
|
- carData: {}
|
|
|
|
|
|
+ chartData: {}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
},
|
|
@@ -333,10 +345,10 @@ export default {
|
|
},
|
|
},
|
|
// 查询洗车网点
|
|
// 查询洗车网点
|
|
getListStore () {
|
|
getListStore () {
|
|
- // listStore().then(res => {
|
|
|
|
- // console.log(res)
|
|
|
|
- // this.storesList = res.data ? res.data : []
|
|
|
|
- // })
|
|
|
|
|
|
+ storeList({ pageNo: 1, pageSize: 1000 }).then(res => {
|
|
|
|
+ console.log(res)
|
|
|
|
+ this.storesList = res.data.list ? res.data.list : []
|
|
|
|
+ })
|
|
},
|
|
},
|
|
// 页面初始化
|
|
// 页面初始化
|
|
pageInit () {
|
|
pageInit () {
|
|
@@ -344,11 +356,8 @@ export default {
|
|
this.databack = {
|
|
this.databack = {
|
|
couponChartData: _.cloneDeep(this.couponChartData),
|
|
couponChartData: _.cloneDeep(this.couponChartData),
|
|
washTypePieData: _.cloneDeep(this.washTypePieData),
|
|
washTypePieData: _.cloneDeep(this.washTypePieData),
|
|
- carData: _.cloneDeep(this.carData)
|
|
|
|
|
|
+ chartData: _.cloneDeep(this.chartData)
|
|
}
|
|
}
|
|
- this.dayBundleSaleIncome = 0
|
|
|
|
- this.washCarsTotal = 0
|
|
|
|
- this.payCost = 0
|
|
|
|
},
|
|
},
|
|
// 查询
|
|
// 查询
|
|
handleSearch () {
|
|
handleSearch () {
|
|
@@ -397,17 +406,23 @@ export default {
|
|
endDate: this.endDate
|
|
endDate: this.endDate
|
|
}
|
|
}
|
|
console.log(_date, '_date')
|
|
console.log(_date, '_date')
|
|
- // this.getAmount(_date)
|
|
|
|
- // this.getServerData(_date)
|
|
|
|
- // this.getBundelData(_date)
|
|
|
|
- // this.getChartData(_date)
|
|
|
|
- // this.getPayData(_date)
|
|
|
|
|
|
+ getOrderstatistics(_date).then(res => {
|
|
|
|
+ console.log(res, 'rrrrrrr')
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ this.chartData = res.data
|
|
|
|
+ this.filterData()
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ // 整合图表数据
|
|
|
|
+ filterData () {
|
|
|
|
+
|
|
}
|
|
}
|
|
},
|
|
},
|
|
beforeRouteEnter (to, from, next) {
|
|
beforeRouteEnter (to, from, next) {
|
|
next(vm => {
|
|
next(vm => {
|
|
vm.pageInit()
|
|
vm.pageInit()
|
|
- vm.getListStore()
|
|
|
|
|
|
+ vm.getListStore() // 获取网点列表
|
|
vm.curentType = 'thisWeek'
|
|
vm.curentType = 'thisWeek'
|
|
vm.getCurentSearchTime()
|
|
vm.getCurentSearchTime()
|
|
})
|
|
})
|