fix: 用户头像、昵称修改
This commit is contained in:
parent
2f37232f5e
commit
a3e95b56ca
Binary file not shown.
Before Width: | Height: | Size: 6.1 KiB |
@ -18,7 +18,7 @@ import { useDesign } from '@/hooks/web/useDesign'
|
||||
import { propTypes } from '@/utils/propTypes'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import CopperModal from './CopperModal.vue'
|
||||
import avatar from '@/assets/imgs/avatar.jpg'
|
||||
import avatar from '@/assets/imgs/avatar.gif'
|
||||
|
||||
defineOptions({ name: 'CropperAvatar' })
|
||||
|
||||
|
@ -1,18 +1,15 @@
|
||||
<script lang="ts" setup>
|
||||
import { ElMessageBox } from 'element-plus'
|
||||
|
||||
import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
|
||||
import { useDesign } from '@/hooks/web/useDesign'
|
||||
import avatarImg from '@/assets/imgs/avatar.gif'
|
||||
import { useUserStore } from '@/store/modules/user'
|
||||
import { useDesign } from '@/hooks/web/useDesign'
|
||||
import { useTagsViewStore } from '@/store/modules/tagsView'
|
||||
import { useUserStore } from '@/store/modules/user'
|
||||
|
||||
defineOptions({ name: 'UserInfo' })
|
||||
|
||||
const { t } = useI18n()
|
||||
|
||||
const { wsCache } = useCache()
|
||||
|
||||
const { push, replace } = useRouter()
|
||||
|
||||
const userStore = useUserStore()
|
||||
@ -23,24 +20,21 @@ const { getPrefixCls } = useDesign()
|
||||
|
||||
const prefixCls = getPrefixCls('user-info')
|
||||
|
||||
const user = wsCache.get(CACHE_KEY.USER)
|
||||
const avatar = computed(() => userStore.user.avatar ?? avatarImg)
|
||||
const userName = computed(() => userStore.user.nickname ?? 'Admin')
|
||||
|
||||
const avatar = user.user.avatar ? user.user.avatar : avatarImg
|
||||
|
||||
const userName = user.user.nickname ? user.user.nickname : 'Admin'
|
||||
|
||||
const loginOut = () => {
|
||||
ElMessageBox.confirm(t('common.loginOutMessage'), t('common.reminder'), {
|
||||
confirmButtonText: t('common.ok'),
|
||||
cancelButtonText: t('common.cancel'),
|
||||
type: 'warning'
|
||||
})
|
||||
.then(async () => {
|
||||
await userStore.loginOut()
|
||||
tagsViewStore.delAllViews()
|
||||
replace('/login?redirect=/index')
|
||||
const loginOut = async () => {
|
||||
try {
|
||||
await ElMessageBox.confirm(t('common.loginOutMessage'), t('common.reminder'), {
|
||||
confirmButtonText: t('common.ok'),
|
||||
cancelButtonText: t('common.cancel'),
|
||||
type: 'warning'
|
||||
})
|
||||
.catch(() => {})
|
||||
await userStore.loginOut()
|
||||
tagsViewStore.delAllViews()
|
||||
replace('/login?redirect=/index')
|
||||
}
|
||||
catch { }
|
||||
}
|
||||
const toProfile = async () => {
|
||||
push('/user/profile')
|
||||
|
@ -63,6 +63,20 @@ export const useUserStore = defineStore('admin-user', {
|
||||
wsCache.set(CACHE_KEY.USER, userInfo)
|
||||
wsCache.set(CACHE_KEY.ROLE_ROUTERS, userInfo.menus)
|
||||
},
|
||||
async setUserAvatarAction(avatar: string) {
|
||||
const userInfo = wsCache.get(CACHE_KEY.USER)
|
||||
// NOTE: 是否需要像`setUserInfoAction`一样判断`userInfo != null`
|
||||
this.user.avatar = avatar
|
||||
userInfo.user.avatar = avatar
|
||||
wsCache.set(CACHE_KEY.USER, userInfo)
|
||||
},
|
||||
async setUserNicknameAction(nickname: string) {
|
||||
const userInfo = wsCache.get(CACHE_KEY.USER)
|
||||
// NOTE: 是否需要像`setUserInfoAction`一样判断`userInfo != null`
|
||||
this.user.nickname = nickname
|
||||
userInfo.user.nickname = nickname
|
||||
wsCache.set(CACHE_KEY.USER, userInfo)
|
||||
},
|
||||
async loginOut() {
|
||||
await loginOut()
|
||||
removeToken()
|
||||
|
@ -21,11 +21,13 @@ import {
|
||||
updateUserProfile,
|
||||
UserProfileUpdateReqVO
|
||||
} from '@/api/system/user/profile'
|
||||
import { useUserStore } from '@/store/modules/user'
|
||||
|
||||
defineOptions({ name: 'BasicInfo' })
|
||||
|
||||
const { t } = useI18n()
|
||||
const message = useMessage() // 消息弹窗
|
||||
const userStore = useUserStore()
|
||||
// 表单校验
|
||||
const rules = reactive<FormRules>({
|
||||
nickname: [{ required: true, message: t('profile.rules.nickname'), trigger: 'blur' }],
|
||||
@ -78,13 +80,15 @@ const submit = () => {
|
||||
const data = unref(formRef)?.formModel as UserProfileUpdateReqVO
|
||||
await updateUserProfile(data)
|
||||
message.success(t('common.updateSuccess'))
|
||||
await init()
|
||||
const profile = await init()
|
||||
userStore.setUserNicknameAction(profile.nickname)
|
||||
}
|
||||
})
|
||||
}
|
||||
const init = async () => {
|
||||
const res = await getUserProfile()
|
||||
unref(formRef)?.setValues(res)
|
||||
return res
|
||||
}
|
||||
onMounted(async () => {
|
||||
await init()
|
||||
|
@ -14,6 +14,8 @@
|
||||
import { propTypes } from '@/utils/propTypes'
|
||||
import { uploadAvatar } from '@/api/system/user/profile'
|
||||
import { CropperAvatar } from '@/components/Cropper'
|
||||
import { useUserStore } from '@/store/modules/user'
|
||||
|
||||
|
||||
defineOptions({ name: 'UserAvatar' })
|
||||
|
||||
@ -21,10 +23,14 @@ defineProps({
|
||||
img: propTypes.string.def('')
|
||||
})
|
||||
|
||||
const userStore = useUserStore()
|
||||
|
||||
|
||||
const cropperRef = ref()
|
||||
const handelUpload = async ({ data }) => {
|
||||
await uploadAvatar({ avatarFile: data })
|
||||
const res = await uploadAvatar({ avatarFile: data })
|
||||
cropperRef.value.close()
|
||||
userStore.setUserAvatarAction(res.data)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user