用户管理页面仅管理员可见

src/router/index.ts

@@ -1,6 +1,7 @@
 import { createRouter, createWebHistory } from "vue-router";
 import UserManage from "@/views/userManage/UserManage.vue";
 import Debug from "@/views/debug/debug.vue";
+import { useUserStore } from "@/stores/user";
 
 const router = createRouter({
 	history: createWebHistory(import.meta.env.BASE_URL),
@@ -77,6 +78,12 @@ router.beforeEach((to, from) => {
 	if (!isAuthenticated() && to.name !== "login") {
 		return { name: "login" };
 	}
+	if (to.name === "userManage") {
+		const userStore = useUserStore();
+		if (userStore.user?.role !== 1) {
+			return { name: "graphite" };
+		}
+	}
 });
 
 export default router;

src/stores/user.ts

@@ -0,0 +1,12 @@
+import type { User } from "@/services/user/userManager";
+import { defineStore } from "pinia";
+import { ref } from "vue";
+
+export const useUserStore = defineStore("user", () => {
+	const user = ref<User | undefined>();
+	const setUser = (usr: User) => {
+		user.value = usr;
+	};
+
+	return { user, setUser };
+});

src/views/components/Menu.vue

@@ -15,7 +15,7 @@
 <script lang="ts" setup>
     import { ref, onMounted } from 'vue'
     import { useRouter, useRoute } from 'vue-router'
-    import { menuIcon } from './menu.ts'
+    import { getMenus } from './menu.ts'
     const router = useRouter()
     const route = useRoute()
     const imageModules:any = import.meta.glob('@/assets/menuIcon/*.svg');
@@ -46,7 +46,7 @@
     onMounted(async ()=>{
         await onHeadleIcon()
         let path = route.path
-        muneList.value = menuIcon
+        muneList.value = getMenus()
         //@ts-ignore
         muneList.value.forEach(item => {
             item.s_img = importedImages[item.s_icon]

src/views/components/menu.ts

@@ -1,4 +1,6 @@
-export const menuIcon = [{
+import { useUserStore } from "@/stores/user"
+
+const menuIcon = [{
     id: 0,
     name: '任务操作',
     s_icon: '/src/assets/menuIcon/s_home.svg',
@@ -46,4 +48,13 @@ export const menuIcon = [{
     s_icon: '/src/assets/menuIcon/s_debug.svg',
     n_icon: '/src/assets/menuIcon/n_debug.svg',
     path: '/debug',
-}]
+}]
+
+const userStore = useUserStore()
+export function getMenus() {
+    if (userStore.user && userStore.user.role === 1) {
+        return menuIcon
+    } else {
+        return menuIcon.filter(m => m.path !== '/userManage')
+    }
+}

src/views/login/index.vue

@@ -35,11 +35,15 @@ import { login } from "@/services/user/userManager";
 import logoSvg from '@/assets/logo.svg'
 import userIconSvg from '@/assets/user_icon.svg'
 import pwdIconSvg from '@/assets/pwdw_icon.svg'
+import { getCurrentUser, login, type User } from "@/services/user/userManager";
+import { useUserStore } from "@/stores/user";
+
 const router = useRouter();
 // 定义用户名和密码的响应式变量
 const username = ref("");
 const password = ref("");
 
+const userStore = useUserStore();
 // 处理登录的函数
 const handleLogin = async () => {
 	if(!username.value || !password.value){
@@ -49,6 +53,11 @@ const handleLogin = async () => {
 	const res = await login({ username: username.value, password: password.value });
 	if (res.success) {
 		sessionStorage.setItem("token", res.data);
+		const response = await getCurrentUser();
+		if (response.success) {
+			const { username, nickname, role } = response.data;
+			userStore.setUser({ username, nickname, role } as User);
+		}
 		router.push("/home");
 	} else {
 		showToast(res.msg);