Browse Source

fix: login 更新

lanceJiang 1 year ago
parent
commit
66fa2164cc
3 changed files with 27 additions and 17 deletions
  1. 8 4
      src/layout/components/Navbar.vue
  2. 13 11
      src/store/modules/user.ts
  3. 6 2
      src/types/store.d.ts

+ 8 - 4
src/layout/components/Navbar.vue

@@ -19,9 +19,9 @@
 
 			<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click" size="default">
 				<div class="avatar-wrapper">
-					<span class="nickname">{{ user.nickname || '' }}</span>
-					<img v-if="user.avatar" :src="user.avatar" class="user-avatar" />
-					<ArrowDown style="width: 0.6em; height: 0.6em; margin-left: 5px; font-size: 24px;" />
+					<span class="userName">{{ userInfo.userName || '' }}</span>
+					<el-avatar :size="30" class="user-avatar">{{ userInfo.userNameF }}</el-avatar>
+					<ArrowDown style="width: 0.6em; height: 0.6em; margin-left: 5px; font-size: 24px" />
 				</div>
 
 				<template #dropdown>
@@ -63,6 +63,10 @@ const router = useRouter()
 
 const sidebar = computed(() => app.sidebar)
 const device = computed(() => app.device)
+const userInfo = computed(() => {
+	const _info: Recordable = user.userInfo || {}
+	return { ..._info, userNameF: _info.userName?.substring(0, 1) }
+})
 
 function toggleSideBar() {
 	app.toggleSidebar()
@@ -146,7 +150,7 @@ ul {
 				display: flex;
 				align-items: center;
 				white-space: nowrap;
-				.nickname {
+				.userName {
 					font-size: 14px;
 				}
 				.user-avatar {

+ 13 - 11
src/store/modules/user.ts

@@ -1,7 +1,7 @@
 import { defineStore } from 'pinia'
 import { UserState } from '@/types'
 import { ls } from '@/utils'
-import { login, logout, getMenuPermissions } from '@/api/login'
+import { login, logout } from '@/api/login'
 import router, { resetRouter } from '@/router'
 import md5 from 'js-md5'
 
@@ -9,8 +9,9 @@ const useUserStore = defineStore({
 	id: 'user',
 	state: (): UserState => ({
 		token: ls.get('token') || '',
-		nickname: '',
-		avatar: '',
+		userInfo: ls.get('userInfo') || {},
+		// nickname: '',
+		// avatar: '',
 		roles: [],
 		perms: [],
 		loginQuery: {},
@@ -27,21 +28,21 @@ const useUserStore = defineStore({
 		 *  password: 密码 -> md5加密
 		 */
 		login(params: { username: string; password: string }) {
-			const userInfo = {
+			const _params = {
 				...params,
 				password: md5(params.password)
 			}
-			return login(userInfo).then((data: any) => {
-				const token = (data || {}).token
+			return login(_params).then((data: any) => {
+				const { token, userInfo } = data || {}
 				ls.set('token', token)
 				this.token = token
-
+				// 用户信息
+				ls.set('userInfo', userInfo)
+				this.userInfo = userInfo
 				const { redirect, ...query } = (this.loginQuery || {}) as any
 				// debugger
 				const path = redirect || '/'
 				router.push({ path, query })
-				// 登录账号 设置为 nickname
-				this.nickname = params.username
 				return data
 			})
 		},
@@ -49,12 +50,13 @@ const useUserStore = defineStore({
 		 *  获取用户信息(昵称、头像、角色集合、权限集合)
 		 */
 		getUserInfo() {
+			/*// 获取菜单权限
 			getMenuPermissions().then(res => {
 				console.error(res, 'res.......')
-			})
+			})*/
 			return new Promise(resolve => {
 				console.log('fetch 获取用户信息')
-				this.isLogin = true
+				this.isLogin = true // user/get
 				resolve(true)
 			})
 			// return getUserInfo()

+ 6 - 2
src/types/store.d.ts

@@ -50,8 +50,12 @@ export interface TagsViewState {
  */
 export interface UserState {
 	token: string
-	nickname: string
-	avatar: string
+	userInfo: {
+		userId: string
+		userName: string
+	}
+	// nickname: string
+	// avatar: string
 	roles: string[]
 	perms: string[]
 	loginQuery: object