用户页面优化
This commit is contained in:
墨大叔
parent
e481bf27f4
commit
a608d89064
|
|
@ -7,7 +7,7 @@
|
|||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-row>
|
||||
<single-line-chart v-loading="loading" :labels="labels" :chart-data="chartData" name="收入(元)" />
|
||||
<single-line-chart v-loading="loading" :labels="labels" :chart-data="chartData" name="收入(元)" height="288px"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,65 +1,80 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<el-card class="box-card" header="用户详情">
|
||||
<div class="user-detail">
|
||||
<div class="user-header">
|
||||
<el-avatar :size="64" :src="userData.avatar"></el-avatar>
|
||||
<el-row type="flex" class="name-box">
|
||||
<span class="user-name">{{userData.nickName}}</span>
|
||||
<el-tag type="primary" v-if="userData.isMch">商户</el-tag>
|
||||
</el-row>
|
||||
<div class="phone-number">{{userData.phonenumber}}</div>
|
||||
</div>
|
||||
<div class="app-container" v-loading="loading">
|
||||
<template v-if="userData != null">
|
||||
<el-row :gutter="12">
|
||||
<el-col :lg="8" :md="12" :xs="24">
|
||||
<el-card class="box-card" header="用户详情">
|
||||
<div class="user-detail">
|
||||
<div class="user-header">
|
||||
<el-avatar :size="64" :src="userData.avatar"></el-avatar>
|
||||
<el-row type="flex" class="name-box">
|
||||
<span class="user-name">{{userData.nickName}}</span>
|
||||
<el-tag type="primary" v-if="userData.isMch">商户</el-tag>
|
||||
</el-row>
|
||||
<div class="phone-number">{{userData.phonenumber}}</div>
|
||||
</div>
|
||||
|
||||
<div class="user-description">
|
||||
<el-descriptions>
|
||||
<el-descriptions-item label="微信">{{userData.wxOpenId | defaultValue}}</el-descriptions-item>
|
||||
<el-descriptions-item label="店铺数">{{userData.storeCount | defaultValue}} 家</el-descriptions-item>
|
||||
<el-descriptions-item label="设备数">{{userData.deviceCount | defaultValue}} 台</el-descriptions-item>
|
||||
<el-descriptions-item label="账户余额">{{userData.balance | money | defaultValue}} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="总收入">{{userData.totalIncome | money | defaultValue}} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="总提现">{{userData.withDrawlAmount | money | defaultValue}} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="服务费费率">
|
||||
<template v-if="userData.serviceRate == null || userData.serviceType == null">跟随渠道</template>
|
||||
<template v-else>
|
||||
<dict-tag :options="dict.type.service_type" :value="userData.serviceType" size="mini"/>
|
||||
{{userData.serviceRate}} {{serviceUnit(userData.serviceType)}}
|
||||
</template>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
<div class="user-description">
|
||||
<el-descriptions :column="2">
|
||||
<el-descriptions-item label="微信" :span="2">{{userData.wxOpenId | defaultValue}}</el-descriptions-item>
|
||||
<el-descriptions-item label="店铺数">{{userData.storeCount | defaultValue}} 家</el-descriptions-item>
|
||||
<el-descriptions-item label="设备数">{{userData.deviceCount | defaultValue}} 台</el-descriptions-item>
|
||||
<el-descriptions-item label="设备服务费">
|
||||
<template v-if="userData.serviceRate == null || userData.serviceType == null">跟随渠道</template>
|
||||
<template v-else>
|
||||
<dict-tag :options="dict.type.service_type" :value="userData.serviceType" size="mini"/>
|
||||
{{userData.serviceRate}} {{serviceUnit(userData.serviceType)}}
|
||||
</template>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="提现服务费">
|
||||
<template v-if="userData.withdrawServiceRate == null || userData.withdrawServiceType == null">跟随渠道</template>
|
||||
<template v-else>
|
||||
<dict-tag :options="dict.type.service_type" :value="userData.withdrawServiceType" size="mini"/>
|
||||
{{userData.withdrawServiceRate}} {{serviceUnit(userData.withdrawServiceType)}}
|
||||
</template>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="账户余额">{{userData.balance | money | defaultValue}} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="总收入">{{userData.totalIncome | money | defaultValue}} 元</el-descriptions-item>
|
||||
<el-descriptions-item label="总提现">{{userData.withDrawlAmount | money | defaultValue}} 元</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :lg="16" :md="12" :xs="24">
|
||||
<el-card class="box-card">
|
||||
<user-recharge-report :mch-id="userData.userId"/>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-card class="box-card" header="收入统计">
|
||||
<user-recharge-report :mch-id="userData.userId"/>
|
||||
</el-card>
|
||||
|
||||
<el-card class="box-card">
|
||||
<el-tabs>
|
||||
<el-tab-pane label="设备列表" lazy>
|
||||
<user-device :user-id="userData.userId"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="店铺列表" lazy>
|
||||
<store :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="套餐列表" lazy>
|
||||
<suit :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="账户列表" lazy>
|
||||
<account :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="充值提现记录" lazy>
|
||||
<user-account :landlord-id="userData.userId"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="余额变化记录" lazy>
|
||||
<record-balance :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="用户秘钥" lazy>
|
||||
<access :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-card>
|
||||
<el-card class="box-card">
|
||||
<el-tabs>
|
||||
<el-tab-pane label="设备列表" lazy>
|
||||
<user-device :user-id="userData.userId"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="店铺列表" lazy>
|
||||
<store :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="套餐列表" lazy>
|
||||
<suit :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="账户列表" lazy>
|
||||
<account :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="充值提现记录" lazy>
|
||||
<user-account :landlord-id="userData.userId"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="余额变化记录" lazy>
|
||||
<record-balance :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="用户秘钥" lazy>
|
||||
<access :query="{userId: userData.userId}" :view="views.user"/>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-card>
|
||||
</template>
|
||||
<el-empty v-else description="用户不存在"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -91,6 +106,7 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
userData: {},
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
|
@ -98,8 +114,11 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
initData() {
|
||||
this.loading = true;
|
||||
getSmUser(this.$route.params.userId).then(response => {
|
||||
this.userData = response.data;
|
||||
}).finally(()=> {
|
||||
this.loading = false;
|
||||
})
|
||||
},
|
||||
}
|
||||
|
|
@ -133,6 +152,7 @@ export default {
|
|||
position: relative;
|
||||
display: flex;
|
||||
height: fit-content;
|
||||
flex-direction: column;
|
||||
}
|
||||
.user-detail .user-description {
|
||||
flex: 1;
|
||||
|
|
|
|||
|
|
@ -112,7 +112,7 @@
|
|||
<user-link :id="d.row.userId" :name="d.row.phonenumber"/>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'storeCount'">
|
||||
{{d.row.storeCount | defaultValue}} 间
|
||||
{{d.row.storeCount | defaultValue}} 家
|
||||
</template>
|
||||
<template v-else-if="column.key === 'rechargeAmount'">
|
||||
{{d.row.rechargeAmount | money}} 元
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user