update permission

src/contexts/auth/index.tsx

@@ -2,7 +2,7 @@ import Loader from "@/components/loader";
 import React, { createContext, useEffect, useReducer } from "react";
 import { auth, getUserInfo } from "@/service/api/user.ts";
 import { getAuthToken, setAuthToken } from "@/hooks/useAuth.ts";
-import {getRoleByDepartName} from "@/contexts/auth/role.ts";
+import { getRoleByUsername } from "@/contexts/auth/role.ts";
 
 
 const AuthContext = createContext<AuthContextType | null>(null)
@@ -42,12 +42,8 @@ const authReducer = (state: AuthProps, action: { action?: string, payload: Parti
 }
 
 const UserRoleStorageKey = 'user-current-role';
-function getCurrentRole(department?:string){
+function getCurrentRole(username: string) {
-    const role = localStorage.getItem(UserRoleStorageKey);
+    return (localStorage.getItem(UserRoleStorageKey) || getRoleByUsername(username)) as UserRole
-    if(role){
-        return role as UserRole
-    }
-    return getRoleByDepartName(department)
 }
 
 export function setCurrentRole(role: UserRole) {
@@ -79,7 +75,8 @@ export const AuthProvider = ({children}: { children: React.ReactNode }) => {
                     isLoggedIn: !!user,
                     user: {
                         ...user,
-                        role: getCurrentRole(user.department)
+                        origin_role: getRoleByUsername(user.username),
+                        role: getCurrentRole(user.username)
                     }
                 }
             })
@@ -105,7 +102,8 @@ export const AuthProvider = ({children}: { children: React.ReactNode }) => {
                 isLoggedIn: true,
                 user: {
                     ...user,
-                    role: getCurrentRole(user.department)
+                    origin_role: getRoleByUsername(user.username),
+                    role: getCurrentRole(user.username)
                 }
             }
         })

src/contexts/auth/role.ts

@@ -4,6 +4,38 @@ const RoleConfig: { [key: string]: UserRole } = {
 	'FO': 'fo',
 }
 
+/*
+11. 权限管理:
+ - RO: Kitty
+ - FO 1: Cecilia, Zoe, Jacko
+ - FO 2: 现场支付和查询账单：Ancus
+ - 超级管理员权限：可以添加用户和权限。
+
+
+
+	ETSO: 超级管理员，用户名：michaelding，kennytan
+	RO： 现场支付和查看，用户名：kittyho
+	FO2：现场支付和查看，用户名：ancuscheng
+    
+	FO：全部权限，用户名： ceciliachan sylam jackoyeung
+	STAFF: 现场支付
+*/
+const UserRoles: { [key: string]: string[] } = {
+	'root': ['michaelding', 'kennytan','itsotest010'],
+	'ro': ['kittyho', 'ancuscheng'],
+	'fo': ['ceciliachan', 'sylam', 'jackoyeung'],
+}
+
 export function getRoleByDepartName(departName?: string, defaultRole: UserRole = 'staff') {
 	return (departName ? (RoleConfig[departName] || defaultRole) : defaultRole);
 }
+
+export function getRoleByUsername(username: string, defaultRole: UserRole = 'staff') {
+	const roles = ['root', 'ro', 'fo'];
+	for (const r of roles) {
+		if (UserRoles[r].includes(username.toLowerCase())) {
+			return r as UserRole;
+		}
+	}
+	return defaultRole;
+}

src/routes/layout/dashboard-layout.tsx

@@ -38,13 +38,20 @@ export const HeaderUserAvatar = () => {
             <>
                 <HeaderUserProfile>
                     <Space>
-                        <Avatar color="orange" size="small"><IconUser /></Avatar>
+                        <Avatar color="orange" size="default"><IconUser /></Avatar>
                         <div>
                             <Typography.Title heading={6}>{user?.username}</Typography.Title>
+                            <div style={{maxWidth:250,overflow:'hidden',whiteSpace:'nowrap',textOverflow:'ellipsis'}}>
                                 <Typography.Text
                                     type="quaternary"
                                     size={'small'}>Department:{user?.department?.toUpperCase()}</Typography.Text>
                             </div>
+                            <div>
+                                <Typography.Text
+                                        type="quaternary"
+                                        size={'small'}>Role:{user?.role?.toUpperCase()}</Typography.Text>
+                            </div>
+                        </div>
                     </Space>
                 </HeaderUserProfile>
                 <Dropdown.Menu>
@@ -68,7 +75,7 @@ const RoleSwitcher = ()=>{
         })
     }
     return (<>
-        {AppMode !== 'production' && (<Dropdown
+        {user?.origin_role == 'root' && (<Dropdown
             clickToHide
             render={
                 <Dropdown.Menu>
@@ -84,7 +91,7 @@ const RoleSwitcher = ()=>{
             <Button theme="borderless">
                 <Space style={{transform:'translateY(3px)'}}>
                     <IconRoles size={20} color={'white'} />
-                    <span style={{color:'white'}}>{user?.department?.toUpperCase()}</span>
+                    <span style={{color:'white'}}>{user?.role?.toUpperCase()}</span>
                 </Space>
             </Button>
         </Dropdown>) }

src/types/auth.d.ts

@@ -13,6 +13,7 @@ declare type UserProfile = {
     nbf: number;
     type: string;
     role: UserRole;
+    origin_role?: UserRole;
 }
 
 declare interface AuthProps {