fix:修复了个人中心,将前端的字段与后端对应,确保数据能够完全显示
This commit is contained in:
parent
1d96aad163
commit
54d9557a89
|
@ -1,64 +1,64 @@
|
||||||
/** 用户信息响应类型 */
|
/** 用户信息响应类型 */
|
||||||
export interface UserInfoResponse {
|
export interface UserInfoResponse {
|
||||||
code: number;
|
code: number
|
||||||
status: number;
|
status: number
|
||||||
success: boolean;
|
success: boolean
|
||||||
msg: string;
|
msg: string
|
||||||
data: {
|
data: {
|
||||||
user: UserDetail;
|
user: UserDetail
|
||||||
dept: DeptDetail;
|
dept: DeptDetail
|
||||||
roles: RoleDetail[];
|
roles: RoleDetail[]
|
||||||
posts: any[];
|
posts: any[]
|
||||||
};
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 用户详细信息 */
|
/** 用户详细信息 */
|
||||||
export interface UserDetail {
|
export interface UserDetail {
|
||||||
userId: string;
|
userId: string
|
||||||
account: string;
|
account: string
|
||||||
name: string;
|
name: string
|
||||||
status: number;
|
status: number
|
||||||
userCode: string;
|
userCode: string
|
||||||
userStatus: string;
|
userStatus: string
|
||||||
userType: string;
|
userType: string
|
||||||
mobile: string;
|
mobile: string
|
||||||
createTime: string;
|
createTime: string
|
||||||
avatar?: string;
|
avatar?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 部门详细信息 */
|
/** 部门详细信息 */
|
||||||
export interface DeptDetail {
|
export interface DeptDetail {
|
||||||
deptId: string;
|
deptId: string
|
||||||
deptName: string;
|
deptName: string
|
||||||
parentId: string;
|
parentId: string
|
||||||
orderNum: number;
|
orderNum: number
|
||||||
leaderId: string;
|
leaderId: string
|
||||||
status: string;
|
status: string
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 角色详细信息 */
|
/** 角色详细信息 */
|
||||||
export interface RoleDetail {
|
export interface RoleDetail {
|
||||||
roleId: string;
|
roleId: string
|
||||||
roleName: string;
|
roleName: string
|
||||||
roleCode: string | null;
|
roleCode: string | null
|
||||||
roleKey: string;
|
roleKey: string
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 用户类型 - 兼容旧版本 */
|
/** 用户类型 - 兼容旧版本 */
|
||||||
export interface UserInfo {
|
export interface UserInfo {
|
||||||
id: string;
|
id: string
|
||||||
username: string;
|
username: string
|
||||||
nickname: string;
|
nickname: string
|
||||||
gender: 0 | 1 | 2;
|
gender: 0 | 1 | 2
|
||||||
email: string;
|
email: string
|
||||||
phone: string;
|
phone: string
|
||||||
avatar: string;
|
avatar: string
|
||||||
pwdResetTime: string;
|
pwdResetTime: string
|
||||||
pwdExpired: boolean;
|
pwdExpired: boolean
|
||||||
registrationDate: string;
|
registrationDate: string
|
||||||
deptName: string;
|
deptName: string
|
||||||
roles: string[];
|
roles: string[]
|
||||||
permissions: string[];
|
permissions: string[]
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 路由类型 */
|
/** 路由类型 */
|
||||||
|
|
|
@ -17,25 +17,25 @@
|
||||||
</template>
|
</template>
|
||||||
</a-upload>
|
</a-upload>
|
||||||
<div class="name">
|
<div class="name">
|
||||||
<span style="margin-right: 10px">{{ userInfo.nickname }}</span>
|
<span style="margin-right: 10px">{{ userInfo.name }}</span>
|
||||||
<icon-edit :size="16" class="btn" @click="onUpdate" />
|
<icon-edit :size="16" class="btn" @click="onUpdate" />
|
||||||
</div>
|
</div>
|
||||||
<div class="id">
|
<div class="id">
|
||||||
<GiSvgIcon name="id" :size="16" />
|
<GiSvgIcon name="id" :size="16" />
|
||||||
<span>{{ userInfo.id }}</span>
|
<span>{{ userInfo.userId }}</span>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<footer>
|
<footer>
|
||||||
<a-descriptions :column="4" size="large">
|
<a-descriptions :column="4" size="large">
|
||||||
<a-descriptions-item :span="4">
|
<a-descriptions-item :span="4">
|
||||||
<template #label> <icon-user /><span style="margin-left: 5px">用户名</span></template>
|
<template #label> <icon-user /><span style="margin-left: 5px">用户名</span></template>
|
||||||
{{ userInfo.username }}
|
{{ userInfo.account }}
|
||||||
<icon-man v-if="userInfo.gender === 1" style="color: #19bbf1" />
|
<icon-man v-if="userInfo.gender === 1" style="color: #19bbf1" />
|
||||||
<icon-woman v-else-if="userInfo.gender === 2" style="color: #fa7fa9" />
|
<icon-woman v-else-if="userInfo.gender === 2" style="color: #fa7fa9" />
|
||||||
</a-descriptions-item>
|
</a-descriptions-item>
|
||||||
<a-descriptions-item :span="4">
|
<a-descriptions-item :span="4">
|
||||||
<template #label> <icon-phone /><span style="margin-left: 5px">手机</span></template>
|
<template #label> <icon-phone /><span style="margin-left: 5px">手机</span></template>
|
||||||
{{ userInfo.phone || '暂无' }}
|
{{ userInfo.mobile || '暂无' }}
|
||||||
</a-descriptions-item>
|
</a-descriptions-item>
|
||||||
<a-descriptions-item :span="4">
|
<a-descriptions-item :span="4">
|
||||||
<template #label> <icon-email /><span style="margin-left: 5px">邮箱</span></template>
|
<template #label> <icon-email /><span style="margin-left: 5px">邮箱</span></template>
|
||||||
|
@ -47,12 +47,12 @@
|
||||||
</a-descriptions-item>
|
</a-descriptions-item>
|
||||||
<a-descriptions-item :span="4">
|
<a-descriptions-item :span="4">
|
||||||
<template #label> <icon-user-group /><span style="margin-left: 5px">角色</span></template>
|
<template #label> <icon-user-group /><span style="margin-left: 5px">角色</span></template>
|
||||||
{{ userInfo.roles.join(',') }}
|
{{ userInfo.roles?.map(role => role.roleName).join(', ') || '暂无' }}
|
||||||
</a-descriptions-item>
|
</a-descriptions-item>
|
||||||
</a-descriptions>
|
</a-descriptions>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
<div class="footer">注册于 {{ userInfo.registrationDate }}</div>
|
<div class="footer">注册于 {{ userInfo.createTime }}</div>
|
||||||
</a-card>
|
</a-card>
|
||||||
|
|
||||||
<a-modal v-model:visible="visible" title="上传头像" :width="width >= 400 ? 400 : '100%'" :footer="false" draggable @close="reset">
|
<a-modal v-model:visible="visible" title="上传头像" :width="width >= 400 ? 400 : '100%'" :footer="false" draggable @close="reset">
|
||||||
|
@ -102,19 +102,22 @@ import { uploadAvatar } from '@/apis/system'
|
||||||
import 'vue-cropper/dist/index.css'
|
import 'vue-cropper/dist/index.css'
|
||||||
import { useUserStore } from '@/stores'
|
import { useUserStore } from '@/stores'
|
||||||
import getAvatar from '@/utils/avatar'
|
import getAvatar from '@/utils/avatar'
|
||||||
|
import XG_DEBUG from 'xgplayer/es/utils/debug'
|
||||||
|
import config = XG_DEBUG.config
|
||||||
|
|
||||||
const { width } = useWindowSize()
|
const { width } = useWindowSize()
|
||||||
const userStore = useUserStore()
|
const userStore = useUserStore()
|
||||||
const userInfo = computed(() => userStore.userInfo)
|
const userInfo = computed(() => userStore.userInfo)
|
||||||
|
|
||||||
const avatar = {
|
const avatar = computed(() => ({
|
||||||
uid: '-2',
|
uid: '-2',
|
||||||
name: 'avatar.png',
|
name: 'avatar.png',
|
||||||
url: userInfo.value.avatar,
|
url: userInfo.value.avatar || getAvatar(userInfo.value.avatar, undefined),
|
||||||
}
|
}))
|
||||||
const avatarList = ref<FileItem[]>([avatar])
|
|
||||||
const fileRef = ref(reactive({ name: 'avatar.png' }))
|
const avatarList = computed<FileItem[]>(() => [avatar.value])
|
||||||
const options: cropperOptions = reactive({
|
const fileRef = ref<File | null>(null)
|
||||||
|
const options = reactive<cropperOptions>({
|
||||||
img: '',
|
img: '',
|
||||||
autoCrop: true,
|
autoCrop: true,
|
||||||
autoCropWidth: 160,
|
autoCropWidth: 160,
|
||||||
|
@ -128,13 +131,14 @@ const options: cropperOptions = reactive({
|
||||||
outputType: 'png',
|
outputType: 'png',
|
||||||
})
|
})
|
||||||
const visible = ref(false)
|
const visible = ref(false)
|
||||||
|
|
||||||
// 打开裁剪框
|
// 打开裁剪框
|
||||||
const onBeforeUpload = (file: File): boolean => {
|
const onBeforeUpload = (file: File): boolean => {
|
||||||
fileRef.value = file
|
fileRef.value = file
|
||||||
const reader = new FileReader()
|
const reader = new FileReader()
|
||||||
reader.readAsDataURL(file)
|
reader.readAsDataURL(file)
|
||||||
reader.onload = () => {
|
reader.onload = () => {
|
||||||
options.img = reader.result
|
options.img = reader.result as string
|
||||||
}
|
}
|
||||||
visible.value = true
|
visible.value = true
|
||||||
return false
|
return false
|
||||||
|
|
Loading…
Reference in New Issue