From 086be7eae50e48ad554fd8a3f4cb1e333d587595 Mon Sep 17 00:00:00 2001
From: rk <94314517@qq.com>
Date: 星期二, 27 一月 2026 10:33:11 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
admin/src/views/index.vue | 367 ++++++++++++++++++++++++++++++++++++++++++---------
1 files changed, 300 insertions(+), 67 deletions(-)
diff --git a/admin/src/views/index.vue b/admin/src/views/index.vue
index 4c935ce..2cd5e29 100644
--- a/admin/src/views/index.vue
+++ b/admin/src/views/index.vue
@@ -11,22 +11,22 @@
<div class="data-summary">
<div class="data-item blue">
<div>{{tabName}}閿�鍞</div>
- <div class="data-num">锟{ (countData.totalPrice ||0).toFixed(2) }}</div>
+ <div class="data-num">锟{ (topData.price ||0).toFixed(2) }}</div>
</div>
<div class="parting"></div>
<div class="data-item yellow">
<div>{{tabName}}鎴愪氦璁㈠崟閲�</div>
- <div class="data-num">{{ countData.totalNum ||0}}</div>
+ <div class="data-num">{{ topData.num||0}}</div>
</div>
<div class="parting"></div>
<div class="data-item green">
<div>{{tabName}}閫�娆鹃噾棰�</div>
- <div class="data-num">锟{( countData.totalRefundPrice ||0).toFixed(2) }}</div>
+ <div class="data-num">锟{( topData.price1 ||0).toFixed(2) }}</div>
</div>
<div class="parting"></div>
<div class="data-item orange">
<div>{{tabName}}閫�娆捐鍗曢噺</div>
- <div class="data-num">{{ countData.totalRefundNum ||0 }}</div>
+ <div class="data-num">{{ topData.num1 ||0 }}</div>
</div>
<div class="parting"></div>
</div>
@@ -35,7 +35,7 @@
<div class="change-style">
<div class="count-left">
<div class="item-title">璁㈠崟閲忎笌閿�鍞瓒嬪娍</div>
- <div ref="orderCount" class="bottom"></div>
+ <div ref="orderCount" class="bottom" ></div>
</div>
<div class="count-right">
<div class="item-title">鍚勫搧绫婚攢鍞鍗犳瘮</div>
@@ -46,9 +46,9 @@
<div class="tab-title" style="display: flex;align-items: center; ">
<span style="">鎺掑悕鍒嗘瀽</span>
<div class="tab-item" style="margin-left: 20px;" >
- <el-date-picker style="width: 110px;height: 22px;margin-right: 10px;" v-model="searchForm.topYear" type="year"
+ <el-date-picker style="width: 110px;height: 22px;margin-right: 10px;" v-model="searchForm.topYear" type="year" @change="changeYearMonth"
clearable value-format="yyyy" format="yyyy'骞�'" placeholder="骞翠唤" ></el-date-picker>
- <el-date-picker style="width: 100px;height: 22px;" v-model="searchForm.topMonth" type="month"
+ <el-date-picker style="width: 100px;height: 22px;" v-model="searchForm.topMonth" type="month" @change="changeYearMonth"
clearable value-format="MM" format="MM'鏈�'" placeholder="鏈堜唤" ></el-date-picker>
</div>
</div>
@@ -56,7 +56,7 @@
<div class="change-style">
<div class="count-left">
<div class="item-title" style="display: flex;">
- <span style="flex: 1">缁忛攢鍟咺OP10</span>
+ <span style="flex: 1">缁忛攢鍟員OP10</span>
<div class="tab-item" style="text-align: right;flex: 1.5; ">
<span v-for="(item,index) in tabs1" :key="'tab'+index" :class="item.index==tabIndex1?'active-tab tab-btn':'tab-btn'" @click="changeTab1(item)">{{item.name}}</span>
</div>
@@ -69,7 +69,7 @@
<el-table-column prop="name" label="缁忛攢鍟嗗悕绉�" align="center" > </el-table-column>
<el-table-column prop="num" label="璁㈠崟閲�" align="center" > </el-table-column>
<el-table-column prop="price" label="閿�鍞锛堝厓锛�" align="center" ></el-table-column>
- <el-table-column prop="num2" label="浼氬憳鏁�" align="center" ></el-table-column>
+ <el-table-column prop="num1" label="浼氬憳鏁�" align="center" ></el-table-column>
</el-table>
</div>
</div>
@@ -98,7 +98,7 @@
<div class="tab-title" style="display: flex;align-items: center; ">
<span style="">钀ラ攢鏁版嵁鍒嗘瀽</span>
<div class="tab-item" style="margin-left: 20px;" >
- <el-date-picker style="width: 110px;height: 22px;margin-right: 10px;" v-model="searchForm.topYear2" type="year"
+ <el-date-picker style="width: 110px;height: 22px;margin-right: 10px;" v-model="searchForm.topYear2" type="year" @change="changeYear"
clearable value-format="yyyy" format="yyyy'骞�'" placeholder="骞翠唤" ></el-date-picker>
</div>
</div>
@@ -106,25 +106,26 @@
<div class="change-style">
<div class="count-left">
<div class="item-title">绉垎鍙戞斁绫诲瀷鍗犳瘮</div>
- <div class="bottom2" style="display: flex">
- <div ref="integralCount" style="flex: 1"></div>
- <div style="flex: 1;font-size: 14px;font-weight: 500;">
- <div>绱娑堣�楋細{{10000}}</div>
- <div>绱浼樻儬閲戦锛氾骏{{10000 }}</div>
+ <div class="bottom2" style="display: flex;align-items: center">
+ <div ref="integralCount" style="flex: 1;min-height: 200px;"></div>
+ <div style="flex: 1;font-size: 14px;font-weight: 500;margin-left: 20px;">
+ <div>绱鍙戞斁鏁伴噺锛歿{( dataList4.num || 0 ) +( dataList4.num1 || 0 )+( dataList4.num2 || 0 )+( dataList4.num3 || 0 )}}</div>
+ <div>绱娑堣�楋細{{ dataList4.useNum || 0 }}</div>
+ <div>绱浼樻儬閲戦锛氾骏{{(dataList4.price || 0 ).toFixed(2) }}</div>
</div>
</div>
</div>
<div class="count-right">
<div class="item-title">浼樻儬鍒稿彂鏀剧被鍨嬪崰姣�</div>
- <div class="bottom2">
- <div class="bottom2" style="display: flex">
- <div ref="couponCount" style="flex: 1"></div>
- <div style="flex: 1;font-size: 14px;font-weight: 500;">
- <div>宸蹭娇鐢ㄤ紭鎯犲埜锛歿{10000}}</div>
- <div>绱浼樻儬閲戦锛氾骏{{10000 }}</div>
+ <div class="bottom2" style="display: flex;align-items: center">
+ <div ref="couponCount" style="flex: 1;min-height: 200px;"></div>
+ <div style="flex: 1;font-size: 14px;font-weight: 500;margin-left: 20px;">
+ <div>绱鍙戞斁鏁伴噺锛歿{( dataList3.num || 0 ) +( dataList3.num1 || 0 )}}</div>
+ <div>宸蹭娇鐢ㄤ紭鎯犲埜锛歿{ dataList3.useNum || 0 }}</div>
+ <div>绱浼樻儬閲戦锛氾骏{{(dataList3.price || 0 ).toFixed(2) }}</div>
+ <div>淇冩垚浜ゆ槗閲戦锛氾骏{{(dataList3.orderPrice || 0 ).toFixed(2) }}</div>
</div>
</div>
- </div>
</div>
</div>
<div class="change-style" v-if="1==2">
@@ -138,24 +139,42 @@
<script>
import TableLayout from '@/layouts/TableLayout'
+import BaseTable from '@/components/base/BaseTable'
import * as echarts from 'echarts'
export default {
+ extends: BaseTable,
components: {
TableLayout
},
data () {
return {
- tabs2: [{ index: 0, name: '鎸夐攢閲�' }, { index: 1, name: '鎸夐攢鍞' } ],
+ loading1: false,
+ loading2: false,
+ loading3: false,
+ loading4: false,
+ loading5: false,
+ tabs2: [{ index: 0, name: '鎸夐攢閲�' }, { index: 1, name: '鎸夐攢鍞' }],
tabs1: [{ index: 0, name: '鎸夎鍗曢噺' }, { index: 1, name: '鎸夐攢鍞' }, { index: 2, name: '鎸変細鍛樻暟' }],
- tabs: [{ index: 0, name: '浠婃棩' }, { index: 1, name: '杩�7鏃�' }, { index: 2, name: '杩�30鏃�' }, { index: 3, name: '杩�1骞�' }],
+ tabs: [{ index: 0, name: '浠婃棩' }, { index: 1, name: '杩�7鏃�' }, { index: 2, name: '杩�30鏃�' }, { index: 3, name: '杩�12鏈�' }],
tabName: '浠婃棩',
tabIndex: 0,
tabIndex1: 0,
tabIndex2: 0,
- searchForm:{
- topYear:null,
- topMonth:null,
- topYear2:null,
+ searchForm: {
+ topYear: null,
+ topMonth: null,
+ topYear2: null
+ },
+ topData: {
+ num: 0,
+ num1: 0,
+ price: 0,
+ price1: 0,
+ dateStrList: [],
+ dataList: [],
+ dataList2: [],
+ cateList: [],
+ numList: []
},
countData: {
totalPrice: 1000,
@@ -163,19 +182,99 @@
totalRefundPrice: 10000,
totalRefundNum: 100
},
- dataList1:[],
- dataList2:[],
- orderCorderCount: [10, 10, 20, 10, 40, 10, 30],
- opinionData: ['3.20', '3.21', '3.22', '3.23', '3.24', '3.25', '3.26'],
+ dataList1: [],
+ dataList2: [],
+ dataList4: [],
+ dataList3: [],
myChart0: null,
- myChart1: null
+ myChart1: null,
+ myChart2: null,
+ myChart3: null
}
},
+ created () {
+ this.config({
+ module: '宸ヤ綔鍙版暟鎹粺璁�',
+ api: '/business/workbench',
+ 'field.id': 'id',
+ 'field.main': 'id'
+ })
+ },
mounted () {
- this.initCountData()
+ this.initTopData()
+ this.initShopRankData()
+ this.initGoodsRankData()
+ this.initIntegralData()
+ this.initCouponData()
},
methods: {
- initCountData () {
+ changeYearMonth(){
+ this.initGoodsRankData()
+ this.initShopRankData()
+ },
+ changeYear(){
+ this.initIntegralData()
+ this.initCouponData()
+ },
+ initCouponData () {
+ this.loading4 = true
+ this.api.couponData({year: this.searchForm.topYear2}).then(res => {
+ res = res || {}
+ this.dataList3 = res
+ this.renderEchartOption3()
+ }).finally(() => {
+ this.loading4 = false
+ })
+ },
+ initIntegralData () {
+ this.loading5 = true
+ this.api.integralData({ year: this.searchForm.topYear2}).then(res => {
+ res = res || {}
+ this.dataList4 = res
+ this.renderEchartOption2()
+ }).finally(() => {
+ this.loading5 = false
+ })
+ },
+ initShopRankData () {
+ this.loading2 = true
+ this.api.shopRankList10({ year: this.searchForm.topYear, month: this.searchForm.topMonth ,type:this.tabIndex1}).then(res => {
+ res = res || []
+ this.dataList1 = res
+ }).finally(() => {
+ this.loading2 = false
+ })
+ },
+ initGoodsRankData () {
+ this.loading3 = true
+ this.api.goodsRankList10({ year: this.searchForm.topYear, month: this.searchForm.topMonth ,type:this.tabIndex2}).then(res => {
+ res = res || []
+ this.dataList2 = res
+ }).finally(() => {
+ this.loading3 = false
+ })
+ },
+ initTopData () {
+ this.loading1 = true
+ this.initTopEcharts()
+ this.api.businessData({ dateType: this.tabIndex }).then(res => {
+ res = res || {}
+ res.num = res.num || 0
+ res.num1 = res.num1 || 0
+ res.price = res.price || 0
+ res.price1 = res.price1 || 0
+ res.dateStrList = res.dateStrList || []
+ res.datalist2 = res.datalist2 || []
+ res.dataList = res.dataList || []
+ res.cateList = res.cateList || []
+ this.topData = res
+ this.renderEchartOption0()
+ this.renderEchartOption1()
+ }).finally(() => {
+ this.loading1 = false
+ })
+ },
+ initTopEcharts () {
this.myChart0 = echarts.init(this.$refs.orderCount)
window.addEventListener('resize', () => {
this.myChart0.resize()
@@ -184,23 +283,56 @@
window.addEventListener('resize', () => {
this.myChart1.resize()
})
- this.renderOrderChange(this.myChart0)
- this.renderOrderChange(this.myChart1)
+ this.myChart2 = echarts.init(this.$refs.integralCount)
+ window.addEventListener('resize', () => {
+ this.myChart2.resize()
+ })
+ this.myChart3 = echarts.init(this.$refs.couponCount)
+ window.addEventListener('resize', () => {
+ this.myChart3.resize()
+ })
+ this.renderEchartOption0()
+ this.renderEchartOption1()
+ this.renderEchartOption2()
+ this.renderEchartOption3()
},
changeTab (item) {
- this.tabName = item.name
- this.tabIndex = item.index
+ if (this.loading1) {
+ return
+ }
+ if (item.index !== this.tabIndex) {
+ this.tabName = item.name
+ this.tabIndex = item.index
+ this.initTopData()
+ }
},
changeTab1 (item) {
- this.tabIndex1 = item.index
+ if (this.loading2) {
+ return
+ }
+ if (item.index !== this.tabIndex1) {
+ this.tabName = item.name
+ this.tabIndex1 = item.index
+ this.initShopRankData()
+ }
},
changeTab2 (item) {
- this.tabIndex2 = item.index
+ if (this.loading3) {
+ return
+ }
+ if (item.index !== this.tabIndex2) {
+ this.tabName = item.name
+ this.tabIndex2 = item.index
+ this.initGoodsRankData()
+ }
},
- renderOrderChange (chart) {
- chart.setOption({
+ renderEchartOption0 () {
+ this.myChart0.setOption({
tooltip: {
- trigger: 'axis'
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross'
+ }
},
grid: {
left: '3%',
@@ -210,37 +342,138 @@
},
toolbox: {
feature: {
-
}
+ },
+ legend: {
+ data: ['璁㈠崟閲�', '閿�鍞(鍏�)']
},
xAxis: {
type: 'category',
boundaryGap: false,
- data: this.opinionData
+ data: this.topData.dateStrList || []
},
- yAxis: {
- type: 'value'
- },
- series: [{
- name: '璁㈠崟',
- type: 'line',
- stack: '鎬婚噺',
- data: this.orderCorderCount
- }]
+ yAxis: [
+ {
+ type: 'value',
+ name: '璁㈠崟閲�',
+ min: 0
+ },
+ {
+ type: 'value',
+ name: '閿�鍞(鍏�)',
+ min: 0
+ }
+ ],
+ series: [
+ {
+ name: '璁㈠崟閲�',
+ data: this.topData.dataList || [],
+ type: 'bar'
+ },
+ {
+ name: '閿�鍞(鍏�)',
+ yAxisIndex: 1,
+ data: this.topData.dataList2 || [],
+ type: 'line'
+ }
+ ]
})
},
- changeCount (page) {
- if (page == 7) {
- this.orderCorderCount = [10, 10, 20, 10, 40, 10, 30]
- this.opinionData = ['3.20', '3.21', '3.22', '3.23', '3.24', '3.25', '3.26']
- } else {
- this.orderCorderCount = [11, 10, 20, 10, 40, 10, 30, 20, 10, 20, 10, 40, 10, 30, 10, 10, 20, 10, 40, 10, 30, 10, 10, 20, 10, 40, 10, 30, 20, 40]
- this.opinionData = ['3.01', '3.02', '3.03', '3.04', '3.05', '3.06', '3.07', '3.08', '3.09', '3.10', '3.11', '3.12', '3.13', '3.14', '3.15', '3.16', '3.17', '3.18', '3.19', '3.20', '3.21', '3.22', '3.23', '3.24', '3.25', '3.26', '3.27', '3.28', '3.28', '3.30']
- }
- // this.orderCorderCount.push(1)
- // this.opinionData.push(1)
- this.renderOrderChange()
- }
+ renderEchartOption1 () {
+ const series = []
+ this.topData.cateList.forEach((item, index) => {
+ series.push( {
+ name: item.name,
+ type: 'bar',
+ stack: 'total',
+ barWidth: '60%',
+ label: {
+ // show: true
+ },
+ data: item.data || []
+ })
+ })
+ this.myChart1.setOption({
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross'
+ }
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
+ },
+ toolbox: {
+ feature: {
+ }
+ },
+ legend: {
+ data: this.topData.cateList || []
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ data: this.topData.dateStrList || []
+ },
+ yAxis: { type: 'value' },
+ series
+ })
+ },
+ renderEchartOption2() {
+ this.myChart2.setOption({
+ tooltip: {
+ trigger: 'item'
+ },
+ series: [
+ {
+ name: 'Access From',
+ type: 'pie',
+ radius: '50%',
+ data: [
+ { value: this.dataList4.num || 0, name: '鎵嬪姩澧炲姞' },
+ { value: this.dataList4.num1 || 0, name: '閭�璇峰ソ鍙�' },
+ { value: this.dataList4.num2 || 0, name: '娑堣垂杩斿埄' },
+ { value: this.dataList4.num3 || 0, name: '娉ㄥ唽璧犻��' }
+ ],
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ]
+ })
+ },
+ renderEchartOption3() {
+ this.myChart3.setOption({
+ tooltip: {
+ trigger: 'item'
+ },
+ series: [
+ {
+ name: '浼樻儬鍒稿彂鏀�',
+ type: 'pie',
+ radius: '50%',
+ data: [
+ { value: this.dataList3.num1 || 0, name: '鎶樻墸鍒�' },
+ { value: this.dataList3.num || 0, name: '婊″噺鍒�' }
+ ],
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ]
+ })
+ },
}
}
</script>
--
Gitblit v1.9.3