cloud
/
cloud_admin
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

11.13 首页更改 以及 统计分析页面

Browse Source
master
shilei 1 week ago
parent 6da0a26b35
commit 2269ec7fbd
4 changed files with 195 additions and 132 deletions
Show Stats Download Patch File Download Diff File

3
src/views/mall/home/components/OperationDataCard.vue
Unescape View File

@ -66,7 +66,8 @@ const getOrderData = async () => {
data.alloperationData = {
name: '总车辆',
value: allnumber,
prefix: '🔣'
// prefix: '🔣'
prefix: ''
}
// data.orderUndelivered.value = orderCount.undelivered
// data.orderAfterSaleApply.value = orderCount.afterSaleApply

290
src/views/mall/home/components/TradeTrendCard.vue
Unescape View File

@ -4,8 +4,8 @@
<div class="flex flex-row items-center justify-between">
<CardTitle title="充换电站信息统计" />
<!-- 查询条件 -->
<div class="flex flex-row items-center gap-2">
<el-radio-group v-model="timeRangeType" >
<div class="flex flex-row items-center gap-2">
<el-radio-group v-model="timeRangeType">
<el-radio-button v-for="[key, value] in timeRange.entries()" :key="key" :label="key">
{{ value.name }}
</el-radio-button>
@ -37,11 +37,14 @@ enum TimeRangeTypeEnum {
} // 日期类型
const timeRangeType = ref(TimeRangeTypeEnum.MONTH) // 日期快捷选择按钮, 默认30天
const loading = ref(true) // 加载中
const xAxisData=ref([])
const seriesData1=ref([])
const seriesData2=ref([])
// const
const xAxisData = ref([])
const seriesData1 = ref([])
const seriesData2 = ref([])
const min_y1 = ref(0)
const min_y2 = ref(0)
const max_y1 = ref(0)
const max_y2 = ref(0)
// const
// 时间范围 Map
const timeRange = new Map()
// .set(TimeRangeTypeEnum.DAY30, {
@ -79,89 +82,105 @@ const timeRange = new Map()
]
})
/** 图表配置 */
const eChartOptions =computed(()=>{
const eChartOptions = computed(() => {
return {
grid: {
left: 20,
right: 20,
bottom: 20,
top: 80,
containLabel: true
},
tooltip: {
trigger: 'axis'
},
legend: {
// data: ['充换电营收', '充换电量', '换电次数']
data: ['充换电营收', '充换电量']
},
calculable: true,
xAxis: [
{
type: 'category',
// prettier-ignore
data: xAxisData.value
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '充换电营收',
type: 'bar',
label:{show:true,position:'top',textStyle:{color:'#000000'},formatter:function(data){
return data.value+'元'
}},
data: seriesData1.value,
markPoint: {
data: [
// { type: 'max', name: 'Max' },
// { type: 'min', name: 'Min' }
]
},
markLine: {
data: [{ type: 'average', name: 'Avg' }]
}
grid: {
left: 20,
right: 40,
bottom: 20,
top: 80,
containLabel: true
},
{
name: '充换电量',
type: 'bar',
label:{show:true,position:'top',textStyle:{color:'#000000'},formatter:function(data){
return data.value+'kwh'}},
data:seriesData2.value,
markPoint: {
data: [
// { name: 'Max', value: 182.2, xAxis: 7, yAxis: 183 },
// { name: 'Min', value: 2.3, xAxis: 11, yAxis: 3 }
]
tooltip: {
trigger: 'axis'
},
legend: {
// data: ['充换电营收', '充换电量', '换电次数']
data: ['充换电营收', '充换电量']
},
// calculable: true,
xAxis: [
{
type: 'category',
// prettier-ignore
data: xAxisData.value
}
],
yAxis: [
{
type: 'value',
name: '充换电营收',
min: 0,
max: max_y1.value,
splitNumber: 5,
position: 'left',
alignTicks: true,
axisLine: {
show: true
}
},
markLine: {
data: [{ type: 'average', name: 'Avg' }]
{
type: 'value',
name: '充换电量',
min: 0,
max: max_y2.value,
splitNumber: 5,
position: 'right',
alignTicks: true,
axisLine: {
show: true
}
}
},
{
name: '换电次数',
type: 'bar',
data: [],
markPoint: {
data: [
// { name: 'Max', value: 182.2, xAxis: 7, yAxis: 183 },
// { name: 'Min', value: 2.3, xAxis: 11, yAxis: 3 }
]
],
series: [
{
name: '充换电营收',
type: 'bar',
label: {
show: true,
position: 'top',
textStyle: { color: '#000000' },
formatter: function (data) {
return data.value + '元'
}
},
data: seriesData1.value,
markPoint: {
data: [
// { type: 'max', name: 'Max' },
// { type: 'min', name: 'Min' }
]
},
// markLine: {
// data: [{ type: 'average', name: 'Avg' }]
// }
},
markLine: {
data: [{ type: 'average', name: 'Avg' }]
{
name: '充换电量',
type: 'bar',
label: {
show: true,
position: 'top',
textStyle: { color: '#000000' },
formatter: function (data) {
return data.value + 'kwh'
}
},
data: seriesData2.value,
markPoint: {
data: [
// { name: 'Max', value: 182.2, xAxis: 7, yAxis: 183 },
// { name: 'Min', value: 2.3, xAxis: 11, yAxis: 3 }
]
},
// markLine: {
// data: [{ type: 'average', name: 'Avg' }]
// }
}
}
]
}
]
}
})
const queryparams = ref({
startTime: '',
endTime: ''
@ -186,7 +205,7 @@ const getlist = async () => {
queryparams.value.endTime = convertToTimestamp(queryparams.value.endTime)
// 查询数据
const response = await MemberStatisticsApi.getHomeSwapInfo(queryparams.value)
console.log(response,"shuju")
console.log(response, 'shuju')
let x_data = []
// 充换电营收
let y_data_1 = []
@ -199,7 +218,7 @@ const getlist = async () => {
}
for (let item of response) {
// console.log(item,'item');
x_data.push(item.stationName)
y_data_1.push(item.swapRevenue / 100)
y_data_2.push(item.swapElec)
@ -326,38 +345,75 @@ onMounted(() => {
// getlist()
})
watch(
() => timeRangeType.value,
(newVal) => {
switch (newVal) {
case TimeRangeTypeEnum.WEEK:
queryparams.value.startTime = getDatesFromStartOfWeekToToday(new Date())
queryparams.value.endTime = getCurrentDateTime()
xAxisData.value = [
'平泽仓储站',
'长沙站',
'合肥站',
'前兴石材厂站',
'南京站',
'海口站',
'石家庄站'
]
seriesData1.value = [29792.4, 18646.14, 15153.6, 14488.05, 7735.55, 6667.58, 7035.6]
seriesData2.value = [35636.84, 18949.33, 18126.32, 16062.14, 9609.38, 7620.1, 7680.79]
max_y1.value = 50000
max_y2.value = 50000
break
case TimeRangeTypeEnum.MONTH:
queryparams.value.startTime = getDatesFromStartOfMonthToToday(new Date())
queryparams.value.endTime = getCurrentDateTime()
xAxisData.value = [
'平泽仓储站',
'长沙站',
'合肥站',
'前兴石材厂站',
'南京站',
'海口站',
'石家庄站'
]
seriesData1.value = [124066.96, 83359.23, 65376.96, 59176.53, 34983.17, 29397.98, 29080.48]
seriesData2.value = [145447.78, 100797.14, 72160.0, 66490.48, 35843.41, 34144.0, 33046.0]
max_y1.value = 150000
max_y2.value = 150000
break
case TimeRangeTypeEnum.YEAR:
queryparams.value.startTime = getFirstDayOfYear(new Date())
queryparams.value.endTime = getCurrentDateTime()
xAxisData.value = [
'平泽仓储站',
'长沙站',
'合肥站',
'前兴石材厂站',
'南京站',
'海口站',
'石家庄站'
]
seriesData1.value = [
124066.96, 827285.54, 638616.0, 100600.1, 349831.68, 146989.92, 174482.88
]
seriesData2.value = [
149839.32, 932678.17, 762071.6, 119762.03, 434573.52, 158736.41, 179140.53
]
watch(()=>timeRangeType.value,(newVal)=>{
switch (newVal) {
case TimeRangeTypeEnum.WEEK:
queryparams.value.startTime = getDatesFromStartOfWeekToToday(new Date())
queryparams.value.endTime = getCurrentDateTime()
xAxisData.value=['平泽仓储站','长沙站','合肥站','前兴石材厂站','南京站','海口站','石家庄站'];
seriesData1.value= [ 29792.40,18646.14,15153.60,14488.05,7735.55,6667.58,7035.60];
seriesData2.value=[ 35636.84,18949.33,18126.32,16062.14,9609.38,7620.10,7680.79];
break
case TimeRangeTypeEnum.MONTH:
queryparams.value.startTime = getDatesFromStartOfMonthToToday(new Date())
queryparams.value.endTime = getCurrentDateTime()
xAxisData.value=['平泽仓储站','长沙站','合肥站','前兴石材厂站','南京站','海口站','石家庄站'];
seriesData1.value=[124066.96,83359.23,65376.96,59176.53,34983.17,29397.98,29080.48];
seriesData2.value=[ 145447.78,100797.14,72160.00,66490.48,35843.41,34144.00,33046.00];
break
case TimeRangeTypeEnum.YEAR:
queryparams.value.startTime = getFirstDayOfYear(new Date())
queryparams.value.endTime = getCurrentDateTime()
xAxisData.value=['平泽仓储站','长沙站','合肥站','前兴石材厂站','南京站','海口站','石家庄站']
seriesData1.value=[124066.96,827285.54,638616.00,100600.10,349831.68,146989.92,174482.88];
seriesData2.value=[149839.32,932678.17,762071.60,119762.03,434573.52,158736.41,179140.53];
break
max_y1.value = 1500000
max_y2.value = 1500000
break
}
},
{
deep: true,
immediate: true
}
},{
deep:true,
immediate:true
})
</script>
)
</script>

25
src/views/mall/statistics/member/components/MemberTerminalCard.vue
Unescape View File

@ -21,9 +21,8 @@ const loading = ref(false) // 加载中
/** 会员终端统计图配置 */
const terminalChartOptions = reactive<EChartsOption>({
tooltip: {
trigger: "item",
formatter: "{b}:{d}%"
trigger: 'item',
formatter: '{b}:{d}%'
},
legend: {
@ -37,19 +36,21 @@ const terminalChartOptions = reactive<EChartsOption>({
type: 'pie',
label: {
show: true,
formatter:"{b}: {d}%"
// formatter: '{b}: {d}%'
formatter: '{d}%'
},
labelLine: {
show: true
},
center: ['40%', '50%'],
data: [
{value:4081.15,name:"平泽仓储站"},
{value:2742.08,name:"长沙站"},
{value:2164.8,name:"合肥站"},
{value:2040.57,name:"前兴石材厂站"},
{value:1154.56,name:"南京站"},
{value:1010.24,name:"海口站"},
{value:938.08,name:"石家庄站"},
{ value: 4081.15, name: '平泽仓储站' },
{ value: 2742.08, name: '长沙站' },
{ value: 2164.8, name: '合肥站' },
{ value: 2040.57, name: '前兴石材厂站' },
{ value: 1154.56, name: '南京站' },
{ value: 1010.24, name: '海口站' },
{ value: 938.08, name: '石家庄站' }
]
}
]
@ -59,7 +60,7 @@ const terminalChartOptions = reactive<EChartsOption>({
const getMemberTerminalStatisticsList = async () => {
loading.value = true
const list = await MemberStatisticsApi.getMemberAnalyse()
console.log(list, 'list')
// console.log(list, 'list')
// const dictDataList = getIntDictOptions(DICT_TYPE.TERMINAL)
let list_str = []

9
src/views/system/statisticsManagement/powerChangingTimesStatistics/index.vue
Unescape View File

@ -323,7 +323,8 @@ const eChartOptions = reactive<EChartsOption>({
},
legend: {
data: [],
left: 'center'
left: 'center',
top: '8%'
},
// brush: {
// toolbox: ['rect', 'polygon', 'lineX', 'lineY', 'keep', 'clear'],
@ -338,7 +339,11 @@ const eChartOptions = reactive<EChartsOption>({
},
yAxis: {},
grid: {
bottom: 100
top: '30%',
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
tooltip: {},
series: [

Write Preview
Loading…
Cancel
Save