8.17 首页更改提交

master
shilei 3 months ago
parent e35c8698ba
commit 6da533a9d5

@ -1,7 +1,7 @@
<template> <template>
<el-card shadow="never"> <el-card shadow="never">
<template #header> <template #header>
<CardTitle title="用户统计" /> <CardTitle title="换电车辆统计" />
</template> </template>
<!-- 折线图 --> <!-- 折线图 -->
<Echart :height="300" :options="lineChartOptions" /> <Echart :height="300" :options="lineChartOptions" />
@ -20,10 +20,6 @@ defineOptions({ name: 'MemberStatisticsCard' })
const loading = ref(true) // const loading = ref(true) //
/** 折线图配置 */ /** 折线图配置 */
const lineChartOptions = reactive<EChartsOption>({ const lineChartOptions = reactive<EChartsOption>({
dataset: {
dimensions: ['date', 'count'],
source: []
},
grid: { grid: {
left: 20, left: 20,
right: 20, right: 20,
@ -31,44 +27,50 @@ const lineChartOptions = reactive<EChartsOption>({
top: 80, top: 80,
containLabel: true containLabel: true
}, },
legend: {
top: 50
},
series: [{ name: '注册量', type: 'line', smooth: true, areaStyle: {} }],
toolbox: {
feature: {
//
dataZoom: {
yAxisIndex: false // Y
},
brush: {
type: ['lineX', 'clear'] //
},
saveAsImage: { show: true, name: '会员统计' } //
}
},
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
type: 'cross' type: 'cross',
}, label: {
padding: [5, 10] backgroundColor: '#91cc75'
}, }
xAxis: {
type: 'category',
boundaryGap: false,
axisTick: {
show: false
},
axisLabel: {
formatter: (date: string) => formatDate(date, 'MM-DD')
} }
}, },
yAxis: { xAxis: [
axisTick: { {
show: false type: 'category',
boundaryGap: false,
data: [
'内乡站',
'奇瑞智能换电站',
'广化站',
'长治站',
'常熟站',
'工博站',
'阳泉站',
'银滩站',
'鹿山站',
'新世纪站'
]
} }
} ],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '车辆统计',
type: 'line',
stack: 'Total',
areaStyle: {},
emphasis: {
focus: 'series'
},
data: [120, 132, 101, 134, 90, 230, 210, 180, 234, 210]
}
]
}) as EChartsOption }) as EChartsOption
const getMemberRegisterCountList = async () => { const getMemberRegisterCountList = async () => {

@ -1,7 +1,7 @@
<template> <template>
<el-card shadow="never"> <el-card shadow="never">
<template #header> <template #header>
<CardTitle title="运营数据" /> <CardTitle title="车队数据" />
</template> </template>
<div class="flex flex-row flex-wrap items-center gap-8 p-4"> <div class="flex flex-row flex-wrap items-center gap-8 p-4">
<div <div
@ -34,17 +34,17 @@ const router = useRouter() // 路由
/** 数据 */ /** 数据 */
const data = reactive({ const data = reactive({
orderUndelivered: { name: '待发货订单', value: 9, routerName: 'TradeOrder' }, orderUndelivered: { name: '阳泉车队', value: 32, routerName: 'TradeOrder' },
orderAfterSaleApply: { name: '退款中订单', value: 4, routerName: 'TradeAfterSale' }, orderAfterSaleApply: { name: '长治车队', value: 30, routerName: 'TradeAfterSale' },
orderWaitePickUp: { name: '待核销订单', value: 0, routerName: 'TradeOrder' }, orderWaitePickUp: { name: '昆仑绿能', value: 28, routerName: 'TradeOrder' },
productAlertStock: { name: '库存预警', value: 0, routerName: 'ProductSpu' }, productAlertStock: { name: '温州科韦德车队', value: 26, routerName: 'ProductSpu' },
productForSale: { name: '上架商品', value: 0, routerName: 'ProductSpu' }, productForSale: { name: '温州汉狄森车队', value: 24, routerName: 'ProductSpu' },
productInWarehouse: { name: '仓库商品', value: 0, routerName: 'ProductSpu' }, productInWarehouse: { name: '久月车队', value: 24, routerName: 'ProductSpu' },
withdrawAuditing: { name: '提现待审核', value: 0, routerName: 'TradeBrokerageWithdraw' }, withdrawAuditing: { name: '万能车队', value: 12, routerName: 'TradeBrokerageWithdraw' },
rechargePrice: { rechargePrice: {
name: '账户充值', name: '总车辆',
value: 0.0, value: 176,
prefix: '', prefix: '🔣',
decimals: 2, decimals: 2,
routerName: 'PayWalletRecharge' routerName: 'PayWalletRecharge'
} }

@ -31,40 +31,40 @@ const router = useRouter() // 路由
/** 菜单列表 */ /** 菜单列表 */
const menuList = [ const menuList = [
{ name: '用户管理', icon: 'ep:user-filled', bgColor: 'bg-red-400', routerName: 'MemberUser' }, { name: '站点管理', icon: 'ep:user-filled', bgColor: 'bg-red-400', routerName: 'MemberUser' },
{ {
name: '商品管理', name: '设备管理',
icon: 'fluent-mdl2:product', icon: 'fluent-mdl2:product',
bgColor: 'bg-orange-400', bgColor: 'bg-orange-400',
routerName: 'ProductSpu' routerName: 'ProductSpu'
}, },
{ name: '订单管理', icon: 'ep:list', bgColor: 'bg-yellow-500', routerName: 'TradeOrder' }, { name: '车队管理', icon: 'ep:list', bgColor: 'bg-yellow-500', routerName: 'TradeOrder' },
{ {
name: '售后管理', name: '司机管理',
icon: 'ri:refund-2-line', icon: 'ri:refund-2-line',
bgColor: 'bg-green-600', bgColor: 'bg-green-600',
routerName: 'TradeAfterSale' routerName: 'TradeAfterSale'
}, },
{ {
name: '分销管理', name: '充电订单',
icon: 'fa-solid:project-diagram', icon: 'fa-solid:project-diagram',
bgColor: 'bg-cyan-500', bgColor: 'bg-cyan-500',
routerName: 'TradeBrokerageUser' routerName: 'TradeBrokerageUser'
}, },
{ {
name: '优惠券', name: '换电订单',
icon: 'ep:ticket', icon: 'ep:ticket',
bgColor: 'bg-blue-500', bgColor: 'bg-blue-500',
routerName: 'PromotionCoupon' routerName: 'PromotionCoupon'
}, },
{ {
name: '拼团活动', name: '运营管理',
icon: 'fa:group', icon: 'fa:group',
bgColor: 'bg-purple-500', bgColor: 'bg-purple-500',
routerName: 'PromotionBargainActivity' routerName: 'PromotionBargainActivity'
}, },
{ {
name: '佣金提现', name: '统计管理',
icon: 'vaadin:money-withdraw', icon: 'vaadin:money-withdraw',
bgColor: 'bg-rose-500', bgColor: 'bg-rose-500',
routerName: 'TradeBrokerageWithdraw' routerName: 'TradeBrokerageWithdraw'

@ -2,7 +2,7 @@
<el-card shadow="never"> <el-card shadow="never">
<template #header> <template #header>
<div class="flex flex-row items-center justify-between"> <div class="flex flex-row items-center justify-between">
<CardTitle title="交易量趋势" /> <CardTitle title="换电站信息统计" />
<!-- 查询条件 --> <!-- 查询条件 -->
<div class="flex flex-row items-center gap-2"> <div class="flex flex-row items-center gap-2">
<el-radio-group v-model="timeRangeType" @change="handleTimeRangeTypeChange"> <el-radio-group v-model="timeRangeType" @change="handleTimeRangeTypeChange">
@ -81,62 +81,69 @@ const eChartOptions = reactive<EChartsOption>({
top: 80, top: 80,
containLabel: true containLabel: true
}, },
tooltip: {
trigger: 'axis'
},
legend: { legend: {
top: 50, data: ['换电营收', '换电量', '换电次数']
data: []
}, },
series: [], calculable: true,
toolbox: { xAxis: [
feature: { {
// type: 'category',
dataZoom: { // prettier-ignore
yAxisIndex: false // Y data: ['内乡站', '奇瑞智能换电站', '广化站', '长治站', '常熟站', '工博站', '阳泉站', '银滩站', '鹿山站', '新世纪站']
},
brush: {
type: ['lineX', 'clear'] //
},
saveAsImage: { show: true, name: '订单量趋势' } //
} }
}, ],
tooltip: { yAxis: [
trigger: 'axis', {
axisPointer: { type: 'value'
type: 'cross' }
],
series: [
{
name: '换电营收',
type: 'bar',
data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0],
markPoint: {
data: [
{ type: 'max', name: 'Max' },
{ type: 'min', name: 'Min' }
]
},
markLine: {
data: [{ type: 'average', name: 'Avg' }]
}
}, },
padding: [5, 10] {
}, name: '换电量',
xAxis: { type: 'bar',
type: 'category', data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8],
inverse: true, markPoint: {
boundaryGap: false, data: [
axisTick: { { name: 'Max', value: 182.2, xAxis: 7, yAxis: 183 },
show: false { name: 'Min', value: 2.3, xAxis: 11, yAxis: 3 }
]
},
markLine: {
data: [{ type: 'average', name: 'Avg' }]
}
}, },
data: [], {
axisLabel: { name: '换电次数',
formatter: (date: string) => { type: 'bar',
switch (timeRangeType.value) { data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8],
case TimeRangeTypeEnum.DAY30: markPoint: {
return formatDate(date, 'MM-DD') data: [
case TimeRangeTypeEnum.WEEK: { name: 'Max', value: 182.2, xAxis: 7, yAxis: 183 },
let weekDay = formatDate(date, 'ddd') { name: 'Min', value: 2.3, xAxis: 11, yAxis: 3 }
if (weekDay == '0') weekDay = '日' ]
return '周' + weekDay },
case TimeRangeTypeEnum.MONTH: markLine: {
return formatDate(date, 'D') data: [{ type: 'average', name: 'Avg' }]
case TimeRangeTypeEnum.YEAR:
return formatDate(date, 'M') + '月'
default:
return date
}
} }
} }
}, ]
yAxis: {
axisTick: {
show: false
}
}
}) as EChartsOption }) as EChartsOption
/** 时间范围类型单选按钮选中 */ /** 时间范围类型单选按钮选中 */

@ -8,15 +8,15 @@
title="营收" title="营收"
prefix="¥" prefix="¥"
::decimals="2" ::decimals="2"
:value="fenToYuan(orderComparison?.value?.orderPayPrice || 0)" :value="fenToYuan(orderComparison?.value?.orderPayPrice || 3861340)"
:reference="fenToYuan(orderComparison?.reference?.orderPayPrice || 0)" :reference="fenToYuan(orderComparison?.reference?.orderPayPrice || 0)"
/> />
</el-col> </el-col>
<el-col :md="4" :sm="12" :xs="24" :loading="loading"> <el-col :md="4" :sm="12" :xs="24" :loading="loading">
<ComparisonCard <ComparisonCard
tag="今日" tag="今日"
title="次数" title="换电次数"
:value="userComparison?.value?.visitUserCount || 0" :value="userComparison?.value?.visitUserCount || 103"
:reference="userComparison?.reference?.visitUserCount || 0" :reference="userComparison?.reference?.visitUserCount || 0"
/> />
</el-col> </el-col>
@ -24,7 +24,7 @@
<ComparisonCard <ComparisonCard
tag="今日" tag="今日"
title="电量" title="电量"
:value="fenToYuan(orderComparison?.value?.orderPayCount || 0)" :value="fenToYuan(orderComparison?.value?.orderPayCount || 2600000)"
:reference="fenToYuan(orderComparison?.reference?.orderPayCount || 0)" :reference="fenToYuan(orderComparison?.reference?.orderPayCount || 0)"
/> />
</el-col> </el-col>
@ -32,7 +32,7 @@
<ComparisonCard <ComparisonCard
tag="今日" tag="今日"
title="换电车辆" title="换电车辆"
:value="userComparison?.value?.registerUserCount || 0" :value="userComparison?.value?.registerUserCount || 53"
:reference="userComparison?.reference?.registerUserCount || 0" :reference="userComparison?.reference?.registerUserCount || 0"
/> />
</el-col> </el-col>
@ -41,7 +41,7 @@
tag="今日" tag="今日"
title="真实金额" title="真实金额"
prefix="¥" prefix="¥"
:value="userComparison?.value?.registerUserCount || 0" :value="userComparison?.value?.registerUserCount || 386134"
:reference="userComparison?.reference?.registerUserCount || 0" :reference="userComparison?.reference?.registerUserCount || 0"
/> />
</el-col> </el-col>
@ -52,23 +52,23 @@
<ShortcutCard /> <ShortcutCard />
</el-col> </el-col>
<el-col :md="12"> <el-col :md="12">
<!-- 运营数据 --> <!-- 车队数据 -->
<OperationDataCard /> <OperationDataCard />
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="16" class="mb-4"> <el-row :gutter="16" class="mb-4">
<el-col :md="18" :sm="24"> <el-col :md="16" :sm="24">
<!-- 会员概览 --> <!-- 换电站收入排行 -->
<MemberFunnelCard /> <MemberFunnelCard />
</el-col> </el-col>
<el-col :md="6" :sm="24"> <el-col :md="8" :sm="24">
<!-- 会员终端 --> <!-- 换电站收入占比 -->
<MemberTerminalCard /> <MemberTerminalCard />
</el-col> </el-col>
</el-row> </el-row>
<!-- 交易量趋势 --> <!-- 换电站信息统计 -->
<TradeTrendCard class="mb-4" /> <TradeTrendCard class="mb-4" />
<!-- 会员统计 --> <!-- 换电车辆统计 -->
<MemberStatisticsCard /> <MemberStatisticsCard />
</div> </div>
</template> </template>

@ -2,9 +2,9 @@
<el-card shadow="never"> <el-card shadow="never">
<template #header> <template #header>
<div class="my--1.5 flex flex-row items-center justify-between"> <div class="my--1.5 flex flex-row items-center justify-between">
<CardTitle title="会员概览" /> <CardTitle title="换电站收入排行" />
<!-- 查询条件 --> <!-- 查询条件 -->
<ShortcutDateRangePicker @change="handleTimeRangeChange" /> <!-- <ShortcutDateRangePicker @change="handleTimeRangeChange" /> -->
</div> </div>
</template> </template>
<div class="min-w-225 py-1.75" v-loading="loading"> <div class="min-w-225 py-1.75" v-loading="loading">
@ -12,10 +12,10 @@
<div class="h-full w-75% bg-blue-50 <lg:w-35% <xl:w-55%"> <div class="h-full w-75% bg-blue-50 <lg:w-35% <xl:w-55%">
<div class="ml-15 h-full flex flex-col justify-center"> <div class="ml-15 h-full flex flex-col justify-center">
<div class="font-bold"> <div class="font-bold">
注册用户数量{{ analyseData?.comparison?.value?.registerUserCount || 0 }} 内乡站{{ analyseData?.comparison?.value?.registerUserCount || 32652 }}
</div> </div>
<div class="mt-2 text-3.5"> <div class="mt-2 text-3.5">
环比增长率{{ 内乡智能换电站{{
calculateRelativeRate( calculateRelativeRate(
analyseData?.comparison?.value?.registerUserCount, analyseData?.comparison?.value?.registerUserCount,
analyseData?.comparison?.reference?.registerUserCount analyseData?.comparison?.reference?.registerUserCount
@ -27,18 +27,18 @@
<div <div
class="trapezoid1 ml--38.5 mt-1.5 h-full w-77 flex flex-col items-center justify-center bg-blue-5 text-3.5 text-white" class="trapezoid1 ml--38.5 mt-1.5 h-full w-77 flex flex-col items-center justify-center bg-blue-5 text-3.5 text-white"
> >
<span class="text-6 font-bold">{{ analyseData?.visitUserCount || 0 }}</span> <span class="text-6 font-bold">{{ analyseData?.visitUserCount || 32652 }}</span>
<span>访客</span> <span>Number One</span>
</div> </div>
</div> </div>
<div class="relative h-24 flex"> <div class="relative h-24 flex">
<div class="h-full w-75% flex bg-cyan-50 <lg:w-35% <xl:w-55%"> <div class="h-full w-75% flex bg-cyan-50 <lg:w-35% <xl:w-55%">
<div class="ml-15 h-full flex flex-col justify-center"> <div class="ml-15 h-full flex flex-col justify-center">
<div class="font-bold"> <div class="font-bold">
活跃用户数量{{ analyseData?.comparison?.value?.visitUserCount || 0 }} 奇瑞站{{ analyseData?.comparison?.value?.visitUserCount || 31502 }}
</div> </div>
<div class="mt-2 text-3.5"> <div class="mt-2 text-3.5">
环比增长率{{ 奇瑞智能换电站{{
calculateRelativeRate( calculateRelativeRate(
analyseData?.comparison?.value?.visitUserCount, analyseData?.comparison?.value?.visitUserCount,
analyseData?.comparison?.reference?.visitUserCount analyseData?.comparison?.reference?.visitUserCount
@ -50,8 +50,8 @@
<div <div
class="trapezoid2 ml--28 mt-1.7 h-25 w-56 flex flex-col items-center justify-center bg-cyan-5 text-3.5 text-white" class="trapezoid2 ml--28 mt-1.7 h-25 w-56 flex flex-col items-center justify-center bg-cyan-5 text-3.5 text-white"
> >
<span class="text-6 font-bold">{{ analyseData?.orderUserCount || 0 }}</span> <span class="text-6 font-bold">{{ analyseData?.orderUserCount || 31502 }}</span>
<span>下单</span> <span>Number Two</span>
</div> </div>
</div> </div>
<div class="relative h-24 flex"> <div class="relative h-24 flex">
@ -59,10 +59,10 @@
<div class="ml-15 h-full flex flex-row gap-x-16"> <div class="ml-15 h-full flex flex-row gap-x-16">
<div class="flex flex-col justify-center"> <div class="flex flex-col justify-center">
<div class="font-bold"> <div class="font-bold">
充值用户数量{{ analyseData?.comparison?.value?.rechargeUserCount || 0 }} 新世纪站{{ analyseData?.comparison?.value?.rechargeUserCount || 29686 }}
</div> </div>
<div class="mt-2 text-3.5"> <div class="mt-2 text-3.5">
环比增长率{{ 新世纪智能换电站{{
calculateRelativeRate( calculateRelativeRate(
analyseData?.comparison?.value?.rechargeUserCount, analyseData?.comparison?.value?.rechargeUserCount,
analyseData?.comparison?.reference?.rechargeUserCount analyseData?.comparison?.reference?.rechargeUserCount
@ -70,16 +70,13 @@
}}% }}%
</div> </div>
</div> </div>
<div class="flex flex-col justify-center">
<div class="font-bold">客单价{{ fenToYuan(analyseData?.atv || 0) }}</div>
</div>
</div> </div>
</div> </div>
<div <div
class="trapezoid3 ml--18 mt-3.25 h-23 w-36 flex flex-col items-center justify-center bg-slate-5 text-3.5 text-white" class="trapezoid3 ml--18 mt-3.25 h-23 w-36 flex flex-col items-center justify-center bg-slate-5 text-3.5 text-white"
> >
<span class="text-6 font-bold">{{ analyseData?.payUserCount || 0 }}</span> <span class="text-6 font-bold">{{ analyseData?.payUserCount || 29686 }}</span>
<span>成交用户</span> <span>Number Three</span>
</div> </div>
</div> </div>
</div> </div>
@ -95,7 +92,7 @@ import { CardTitle } from '@/components/Card'
/** 会员概览卡片 */ /** 会员概览卡片 */
defineOptions({ name: 'MemberFunnelCard' }) defineOptions({ name: 'MemberFunnelCard' })
const loading = ref(true) // const loading = ref(false) //
const analyseData = ref<MemberAnalyseRespVO>() // const analyseData = ref<MemberAnalyseRespVO>() //
/** 查询会员概览数据列表 */ /** 查询会员概览数据列表 */

@ -1,7 +1,7 @@
<template> <template>
<el-card shadow="never" v-loading="loading"> <el-card shadow="never" v-loading="loading">
<template #header> <template #header>
<CardTitle title="会员终端" /> <CardTitle title="换电站收入占比" />
</template> </template>
<Echart :height="300" :options="terminalChartOptions" /> <Echart :height="300" :options="terminalChartOptions" />
</el-card> </el-card>
@ -16,15 +16,16 @@ import { CardTitle } from '@/components/Card'
/** 会员终端卡片 */ /** 会员终端卡片 */
defineOptions({ name: 'MemberTerminalCard' }) defineOptions({ name: 'MemberTerminalCard' })
const loading = ref(true) // const loading = ref(false) //
/** 会员终端统计图配置 */ /** 会员终端统计图配置 */
const terminalChartOptions = reactive<EChartsOption>({ const terminalChartOptions = reactive<EChartsOption>({
tooltip: { tooltip: {
trigger: 'item', trigger: 'item'
confine: true, // confine: true,
formatter: '{a} <br/>{b} : {c} ({d}%)' // formatter: '{a} <br/>{b} : {c} ({d}%)'
}, },
legend: { legend: {
orient: 'vertical', orient: 'vertical',
left: 'right' left: 'right'
@ -32,15 +33,24 @@ const terminalChartOptions = reactive<EChartsOption>({
roseType: 'area', roseType: 'area',
series: [ series: [
{ {
name: '会员终端', name: '占比',
type: 'pie', type: 'pie',
label: { label: {
show: false show: true
}, },
labelLine: { labelLine: {
show: false show: true
}, },
data: [] data: [
{ value: 1048, name: '内乡站' },
{ value: 735, name: '奇瑞智能换电站' },
{ value: 580, name: '广化站' },
{ value: 484, name: '长治站' },
{ value: 654, name: '常熟站' },
{ value: 381, name: '工博站' },
{ value: 262, name: '阳泉站' },
{ value: 156, name: '银滩站' },
]
} }
] ]
}) as EChartsOption }) as EChartsOption

@ -19,22 +19,27 @@
class-name="my-content" class-name="my-content"
width="150px" width="150px"
> >
{{ check_row.nickName }} {{ check_row.nickName != null ? check_row.nickName : '--' }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="用户头像:" label-align="right" align="center"> <el-descriptions-item label="用户头像:" label-align="right" align="center">
{{ check_row.avatar }} <el-image
:src="check_row.avatar"
style="width: 160px; height: 90px"
v-if="check_row.avatar != null"
/>
<span v-else> -- </span>
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="余额(分):" label-align="right" align="center"> <el-descriptions-item label="余额():" label-align="right" align="center">
{{ check_row.balance }} {{ check_row.balance != null ? check_row.balance / 100 : '--' }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="累计支出(分):" label-align="right" align="center"> <el-descriptions-item label="累计支出():" label-align="right" align="center">
{{ check_row.totalExpense }} {{ check_row.totalExpense != null ? check_row.totalExpense / 100 : '--' }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="累计充值():" label-align="right" align="center"> <el-descriptions-item label="累计充值():" label-align="right" align="center">
{{ check_row.totalRecharge }} {{ check_row.totalRecharge != null ? check_row.totalRecharge / 100 : '--' }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="冻结金额():" label-align="right" align="center"> <el-descriptions-item label="冻结金额():" label-align="right" align="center">
{{ check_row.freezePrice }} {{ check_row.freezePrice != null ? check_row.freezePrice / 100 : '--' }}
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
<!-- --> <!-- -->

@ -35,10 +35,15 @@
:header-cell-style="{ :header-cell-style="{
backgroundColor: '#eff4fa' backgroundColor: '#eff4fa'
}" }"
> >
<el-table-column label="用户昵称" align="center" prop="nickname" /> <el-table-column label="用户昵称" align="center" prop="nickname" />
<el-table-column label="用户头像" align="center" prop="avatar" /> <el-table-column label="用户头像" align="center" prop="avatar">
<template #default="scope">
<div style="display: flex; align-items: center">
<el-image :src="scope.row.avatar" style="width: 160px; height: 90px" />
</div>
</template>
</el-table-column>
<el-table-column label="余额(分)" align="center" prop="balance" /> <el-table-column label="余额(分)" align="center" prop="balance" />
<el-table-column label="累计支出(分)" align="center" prop="totalExpense" /> <el-table-column label="累计支出(分)" align="center" prop="totalExpense" />
<el-table-column label="累计充值(分)" align="center" prop="totalRecharge" /> <el-table-column label="累计充值(分)" align="center" prop="totalRecharge" />
@ -73,8 +78,6 @@
</ContentWrap> --> </ContentWrap> -->
<drawer ref="drawerRef" /> <drawer ref="drawerRef" />
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
@ -132,7 +135,6 @@ const resetQuery = () => {
handleQuery() handleQuery()
} }
/** 导出按钮操作 */ /** 导出按钮操作 */
const handleExport = async () => { const handleExport = async () => {
try { try {
@ -155,7 +157,7 @@ const handleCurrentChange = (row) => {
} }
const drawerRef = ref() const drawerRef = ref()
const open_drawer = (row:any) => { const open_drawer = (row: any) => {
drawerRef.value.open(row) drawerRef.value.open(row)
} }

@ -19,22 +19,27 @@
class-name="my-content" class-name="my-content"
width="150px" width="150px"
> >
{{ check_row.nickName }} {{ check_row.nickName != null ? check_row.nickName : '--' }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="用户头像:" label-align="right" align="center"> <el-descriptions-item label="用户头像:" label-align="right" align="center">
{{ check_row.avatar }} <el-image
:src="check_row.avatar"
style="width: 160px; height: 90px"
v-if="check_row.avatar != null"
/>
<span v-else> -- </span>
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="余额(分):" label-align="right" align="center"> <el-descriptions-item label="余额():" label-align="right" align="center">
{{ check_row.balance }} {{ check_row.balance != null ? check_row.balance / 100 : '--' }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="累计支出(分):" label-align="right" align="center"> <el-descriptions-item label="累计支出():" label-align="right" align="center">
{{ check_row.totalExpense }} {{ check_row.totalExpense != null ? check_row.totalExpense / 100 : '--' }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="累计充值():" label-align="right" align="center"> <el-descriptions-item label="累计充值():" label-align="right" align="center">
{{ check_row.totalRecharge }} {{ check_row.totalRecharge != null ? check_row.totalRecharge / 100 : '--' }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="冻结金额():" label-align="right" align="center"> <el-descriptions-item label="冻结金额():" label-align="right" align="center">
{{ check_row.freezePrice }} {{ check_row.freezePrice != null ? check_row.freezePrice / 100 : '--' }}
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
<!-- --> <!-- -->

@ -40,7 +40,7 @@
<el-table-column label="用户头像" align="center" prop="avatar"> <el-table-column label="用户头像" align="center" prop="avatar">
<template #default="scope"> <template #default="scope">
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<el-image :preview-src-list="scope.row.avatar" /> <el-image :src="scope.row.avatar" style="width: 160px; height: 90px" />
</div> </div>
</template> </template>
</el-table-column> </el-table-column>

Loading…
Cancel
Save