【功能完善】商城: 客服会员信息

This commit is contained in:
puhui999
2024-11-10 14:15:15 +08:00
parent 33a4100ed4
commit fdee8d8628
3 changed files with 136 additions and 19 deletions

View File

@ -1,5 +1,5 @@
<template>
<el-descriptions :column="2">
<el-descriptions :column="column">
<el-descriptions-item>
<template #label>
<descriptions-item-label icon="svg-icon:member_level" label=" 等级 " />
@ -50,7 +50,9 @@ import * as UserApi from '@/api/member/user'
import * as WalletApi from '@/api/pay/wallet/balance'
import { fenToYuan } from '@/utils'
defineProps<{ user: UserApi.UserVO; wallet: WalletApi.WalletVO }>() // 用户信息
withDefaults(defineProps<{ user: UserApi.UserVO; wallet: WalletApi.WalletVO; column?: number }>(), {
column: 2
}) // 用户信息
</script>
<style lang="scss" scoped>
.cell-item {

View File

@ -3,80 +3,141 @@
<template #header>
<slot name="header"></slot>
</template>
<el-row>
<el-row v-if="mode === 'member'">
<el-col :span="4">
<ElAvatar shape="square" :size="140" :src="user.avatar || undefined" />
<ElAvatar :size="140" :src="user.avatar || undefined" shape="square" />
</el-col>
<el-col :span="20">
<el-descriptions :column="2">
<el-descriptions-item>
<template #label>
<descriptions-item-label label="用户名" icon="ep:user" />
<descriptions-item-label icon="ep:user" label="用户名" />
</template>
{{ user.name || '空' }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label label="昵称" icon="ep:user" />
<descriptions-item-label icon="ep:user" label="昵称" />
</template>
{{ user.nickname }}
</el-descriptions-item>
<el-descriptions-item label="手机号">
<template #label>
<descriptions-item-label label="手机号" icon="ep:phone" />
<descriptions-item-label icon="ep:phone" label="手机号" />
</template>
{{ user.mobile }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label label="性别" icon="fa:mars-double" />
<descriptions-item-label icon="fa:mars-double" label="性别" />
</template>
<dict-tag :type="DICT_TYPE.SYSTEM_USER_SEX" :value="user.sex" />
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label label="所在地" icon="ep:location" />
<descriptions-item-label icon="ep:location" label="所在地" />
</template>
{{ user.areaName }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label label="注册 IP" icon="ep:position" />
<descriptions-item-label icon="ep:position" label="注册 IP" />
</template>
{{ user.registerIp }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label label="生日" icon="fa:birthday-cake" />
<descriptions-item-label icon="fa:birthday-cake" label="生日" />
</template>
{{ user.birthday ? formatDate(user.birthday) : '空' }}
{{ user.birthday ? formatDate(user.birthday as any) : '空' }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label label="注册时间" icon="ep:calendar" />
<descriptions-item-label icon="ep:calendar" label="注册时间" />
</template>
{{ user.createTime ? formatDate(user.createTime) : '空' }}
{{ user.createTime ? formatDate(user.createTime as any) : '空' }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label label="最后登录时间" icon="ep:calendar" />
<descriptions-item-label icon="ep:calendar" label="最后登录时间" />
</template>
{{ user.loginDate ? formatDate(user.loginDate) : '空' }}
{{ user.loginDate ? formatDate(user.loginDate as any) : '空' }}
</el-descriptions-item>
</el-descriptions>
</el-col>
</el-row>
<template v-if="mode === 'kefu'">
<ElAvatar :size="140" :src="user.avatar || undefined" shape="square" />
<el-descriptions :column="1">
<el-descriptions-item>
<template #label>
<descriptions-item-label icon="ep:user" label="用户名" />
</template>
{{ user.name || '空' }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label icon="ep:user" label="昵称" />
</template>
{{ user.nickname }}
</el-descriptions-item>
<el-descriptions-item label="手机号">
<template #label>
<descriptions-item-label icon="ep:phone" label="手机号" />
</template>
{{ user.mobile }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label icon="fa:mars-double" label="性别" />
</template>
<dict-tag :type="DICT_TYPE.SYSTEM_USER_SEX" :value="user.sex" />
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label icon="ep:location" label="所在地" />
</template>
{{ user.areaName }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label icon="ep:position" label="注册 IP" />
</template>
{{ user.registerIp }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label icon="fa:birthday-cake" label="生日" />
</template>
{{ user.birthday ? formatDate(user.birthday as any) : '空' }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label icon="ep:calendar" label="注册时间" />
</template>
{{ user.createTime ? formatDate(user.createTime as any) : '空' }}
</el-descriptions-item>
<el-descriptions-item>
<template #label>
<descriptions-item-label icon="ep:calendar" label="最后登录时间" />
</template>
{{ user.loginDate ? formatDate(user.loginDate as any) : '空' }}
</el-descriptions-item>
</el-descriptions>
</template>
</el-card>
</template>
<script setup lang="ts">
<script lang="ts" setup>
import { DICT_TYPE } from '@/utils/dict'
import { formatDate } from '@/utils/formatTime'
import * as UserApi from '@/api/member/user'
import { DescriptionsItemLabel } from '@/components/Descriptions/index'
const { user } = defineProps<{ user: UserApi.UserVO }>()
withDefaults(defineProps<{ user: UserApi.UserVO; mode?: string }>(), {
mode: 'member'
})
</script>
<style scoped lang="scss">
<style lang="scss" scoped>
.card-header {
display: flex;
justify-content: space-between;