feat: update

src/api/user/index.ts

@@ -182,3 +182,16 @@ export const deleteFavorites = (data: any): any => {
 		data: data,
 	});
 };
+/**
+ * 退出登录
+ * @param userId
+ */
+export const logout = (userId: any): any => {
+	return web.request({
+		url: "/auth/auth/user/logout",
+		method: "post",
+		params: {
+			userId: userId,
+		},
+	});
+};

src/store/modules/user.ts

@@ -7,23 +7,34 @@ import { handleLocalforage } from "@/utils/localforage";
 export class useUserStore {
 	token: string = "";
 	userId: string = "";
+	name: string = "";
+	avatar: string = "";
+	nickname: string = "";
 
 	constructor() {
 		makeObservable(this, {
 			token: observable,
 			userId: observable,
+			name: observable,
+			avatar: observable,
 			setToken: action,
 			setUserId: action,
 			getToken: action,
 			getUserId: action,
 			isHydrated: action,
+			setName: action,
+			getName: action,
+			setAvatar: action,
+			getAvatar: action,
+			setNickName: action,
+			getNickName: action,
 		});
 		makePersistable(
 			this,
 			{
 				// 在构造函数内使用 makePersistable
 				name: "userInfo", // 保存的name，用于在storage中的名称标识，只要不和storage中其他名称重复就可以
-				properties: ["token", "userId"], // 要保存的字段，这些字段会被保存在name对应的storage中，注意：不写在这里面的字段将不会被保存，刷新页面也将丢失：get字段例外。get数据会在数据返回后再自动计算
+				properties: ["token", "userId", "name", "avatar", "nickname"], // 要保存的字段，这些字段会被保存在name对应的storage中，注意：不写在这里面的字段将不会被保存，刷新页面也将丢失：get字段例外。get数据会在数据返回后再自动计算
 				storage: handleLocalforage, // 保存的位置：可以是localStorage，sessionstorage
 				// removeOnExpiration: true, //如果 expireIn 具有值且已过期，则在调用 getItem 时将自动删除存储中的数据。默认值为 true。
 				// stringify: false, //如果为 true，则数据在传递给 setItem 之前将是 JSON.stringify。默认值为 true。
@@ -61,4 +72,22 @@ export class useUserStore {
 	setUserId(userId: string) {
 		this.userId = userId;
 	}
+	setName(name: string) {
+		this.name = name;
+	}
+	setNickName(name: string) {
+		this.nickname = name;
+	}
+	getNickName() {
+		return this.nickname ? this.nickname : null;
+	}
+	setAvatar(avatar: string) {
+		this.avatar = avatar;
+	}
+	getName() {
+		return this.name ? this.name : null;
+	}
+	getAvatar() {
+		return this.avatar ? this.avatar : null;
+	}
 }

src/views/Main/index.tsx

@@ -6,21 +6,21 @@ import {
 	LogoutOutlined,
 	QuestionCircleFilled,
 } from "@ant-design/icons";
-import {
+import { DefaultFooter, PageContainer, ProCard, ProLayout } from "@ant-design/pro-components";
-	DefaultFooter,
+import { Link, Outlet, useLocation, useNavigate } from "react-router-dom";
-	PageContainer,
-	ProCard,
-	ProLayout,
-} from "@ant-design/pro-components";
-import { Link, Outlet, useLocation } from "react-router-dom";
 import logo from "@/assets/images/logo.png";
 import { Suspense } from "react";
 import { Dropdown } from "antd";
 import settings from "@/views/Main/settings.tsx";
-// import { getUserMenuPermission } from "@/api/user";
+import { logout } from "@/api/user";
+import { observer } from "mobx-react";
+import useStore from "@/utils/store/useStore.tsx";
+import { getUserMenuPermission } from "@/api/user";
 
-export default function Layout() {
+const Layout = () => {
 	const location = useLocation();
+	const store = useStore("user");
+	const navigate = useNavigate();
 	return (
 		<div
 			id="pro-layout"
@@ -44,10 +44,10 @@ export default function Layout() {
 				}}
 				{...settings}
 				menu={{
-					// request: async () => {
+					request: async () => {
-					// 	const res: any = await getUserMenuPermission("17");
+						const res: any = await getUserMenuPermission(store.getUserId() as any);
-					// 	return res.data.routes;
+						return res.data.routes;
-					// },
+					},
 					type: "group",
 					defaultOpenAll: false,
 					hideMenuWhenCollapsed: false,
@@ -59,8 +59,8 @@ export default function Layout() {
 				}}
 				avatarProps={
 					{
-						src: "https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg",
+						src: store.getAvatar() || logo,
-						title: "七妮妮",
+						title: store.getNickName() || store.getName() || "unknown",
 						size: "large",
 						// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 						// @ts-expect-error
@@ -74,7 +74,8 @@ export default function Layout() {
 												icon: <LogoutOutlined />,
 												label: "退出登录",
 												onClick: () => {
-													console.log("推出");
+													logout(store.getUserId());
+													navigate("/login");
 												},
 											},
 										],
@@ -130,4 +131,5 @@ export default function Layout() {
 			</ProLayout>
 		</div>
 	);
-}
+};
+export default observer(Layout);

src/views/Main/settings.tsx

@@ -23,65 +23,65 @@ import qingyun from "@/assets/icons/qingyun.svg";
 import ucloud from "@/assets/icons/ucloud.svg";
 import jinshan from "@/assets/icons/jinshan.svg";
 export default {
-	route: {
+	// route: {
-		path: "/",
+	// 	path: "/",
-		routes: [
+	// 	routes: [
-			{
+	// 		{
-				index: true,
+	// 			index: true,
-				path: "main/home",
+	// 			path: "main/home",
-				name: "仪表盘",
+	// 			name: "仪表盘",
-				icon: "https://pic.imgdb.cn/item/668b9176d9c307b7e99e51b9.png",
+	// 			icon: "https://pic.imgdb.cn/item/668b9176d9c307b7e99e51b9.png",
-			},
+	// 		},
-			{
+	// 		{
-				path: "main/setting",
+	// 			path: "main/setting",
-				name: "存储商",
+	// 			name: "存储商",
-				icon: "https://pic.imgdb.cn/item/668b918cd9c307b7e99e7fbc.png",
+	// 			icon: "https://pic.imgdb.cn/item/668b918cd9c307b7e99e7fbc.png",
-			},
+	// 		},
-			{
+	// 		{
-				path: "main/bucket",
+	// 			path: "main/bucket",
-				name: "存储桶",
+	// 			name: "存储桶",
-				icon: "https://pic.imgdb.cn/item/668b91a5d9c307b7e99ea40d.png",
+	// 			icon: "https://pic.imgdb.cn/item/668b91a5d9c307b7e99ea40d.png",
-			},
+	// 		},
-			{
+	// 		{
-				path: "main/file",
+	// 			path: "main/file",
-				name: "文件",
+	// 			name: "文件",
-				icon: "https://pic.imgdb.cn/item/668b91b7d9c307b7e99eb9fb.png",
+	// 			icon: "https://pic.imgdb.cn/item/668b91b7d9c307b7e99eb9fb.png",
-			},
+	// 		},
-			{
+	// 		{
-				path: "main/share",
+	// 			path: "main/share",
-				name: "分享圈",
+	// 			name: "分享圈",
-				icon: "https://pic.imgdb.cn/item/668b91d1d9c307b7e99edb1c.png",
+	// 			icon: "https://pic.imgdb.cn/item/668b91d1d9c307b7e99edb1c.png",
-			},
+	// 		},
-			{
+	// 		{
-				path: "/",
+	// 			path: "/",
-				name: "个人中心",
+	// 			name: "个人中心",
-				icon: "https://pic.imgdb.cn/item/668b91e1d9c307b7e99eed3a.png",
+	// 			icon: "https://pic.imgdb.cn/item/668b91e1d9c307b7e99eed3a.png",
-				routes: [
+	// 			routes: [
-					{
+	// 				{
-						index: true,
+	// 					index: true,
-						path: "main/user/info",
+	// 					path: "main/user/info",
-						name: "用户信息",
+	// 					name: "用户信息",
-						icon: "https://pic.imgdb.cn/item/668b91fbd9c307b7e99f0f90.png",
+	// 					icon: "https://pic.imgdb.cn/item/668b91fbd9c307b7e99f0f90.png",
-					},
+	// 				},
-					{
+	// 				{
-						path: "main/user/setting",
+	// 					path: "main/user/setting",
-						name: "用户设置",
+	// 					name: "用户设置",
-						icon: "https://pic.imgdb.cn/item/668b921ad9c307b7e99f35b2.png",
+	// 					icon: "https://pic.imgdb.cn/item/668b921ad9c307b7e99f35b2.png",
-					},
+	// 				},
-					{
+	// 				{
-						path: "main/user/myshare",
+	// 					path: "main/user/myshare",
-						name: "我的分享",
+	// 					name: "我的分享",
-						icon: "https://pic.imgdb.cn/item/668f8e5fd9c307b7e9f079bf.png",
+	// 					icon: "https://pic.imgdb.cn/item/668f8e5fd9c307b7e9f079bf.png",
-					},
+	// 				},
-					{
+	// 				{
-						path: "main/user/favorites",
+	// 					path: "main/user/favorites",
-						name: "我的收藏",
+	// 					name: "我的收藏",
-						icon: "https://pic.imgdb.cn/item/6690e7c0d9c307b7e9738f02.png",
+	// 					icon: "https://pic.imgdb.cn/item/6690e7c0d9c307b7e9738f02.png",
-					},
+	// 				},
-				],
+	// 			],
-			},
+	// 		},
-		],
+	// 	],
-	},
+	// },
 	location: {
 		pathname: "/main/home",
 	},

src/views/User/Login/index.tsx

@@ -116,10 +116,13 @@ export default observer(() => {
 		if (res && res.success && res.code === 0) {
 			store.setToken(res.data.token);
 			store.setUserId(res.data.user.id);
+			store.setName(res.data.user.userName);
+			store.setAvatar(res.data.user.avatar);
+			store.setNickName(res.data.user.nickName);
 			setStorage("token", res.data.token, 24 * 60 * 30);
 			if (store.getToken() !== null || store.getUserId() !== null) {
 				setTimeout(() => {
-					navigate("/main");
+					navigate("/main/home");
 				}, 3000);
 			}
 			message.open({