계정 권한 메뉴 이름에 다국어 지원 추가
- PermItem 타입에 menuNameEng 속성 추가 - 메뉴 권한 목록/아이템/페이지에서 현재 언어에 따라 메뉴 이름 선택 - 영어 번역 파일에 사용자 삭제 관련 번역 키 추가 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -41,7 +41,11 @@ export interface UserAccountAuthWrapProps {
|
|||||||
};
|
};
|
||||||
export interface PermItem {
|
export interface PermItem {
|
||||||
menuId?: number;
|
menuId?: number;
|
||||||
|
parent?: number;
|
||||||
menuName?: string;
|
menuName?: string;
|
||||||
|
menuNameEng?: string;
|
||||||
|
iconFilePath?: string;
|
||||||
|
programPath?: string;
|
||||||
subMenu?: Array<PermItem>;
|
subMenu?: Array<PermItem>;
|
||||||
};
|
};
|
||||||
export interface UserAccountAuthPermListProps {
|
export interface UserAccountAuthPermListProps {
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import { PATHS } from '@/shared/constants/paths';
|
import { PATHS } from '@/shared/constants/paths';
|
||||||
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
|
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
|
||||||
import { UserAccountAuthPermItemProps } from '../model/types';
|
import { UserAccountAuthPermItemProps } from '../model/types';
|
||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
export const UserAccountAuthPermItem = ({
|
export const UserAccountAuthPermItem = ({
|
||||||
mid,
|
mid,
|
||||||
@@ -13,8 +14,16 @@ export const UserAccountAuthPermItem = ({
|
|||||||
menuGrants,
|
menuGrants,
|
||||||
}: UserAccountAuthPermItemProps) => {
|
}: UserAccountAuthPermItemProps) => {
|
||||||
const { navigate } = useNavigate();
|
const { navigate } = useNavigate();
|
||||||
|
const { i18n } = useTranslation();
|
||||||
|
const isEnglish = i18n.language === 'en';
|
||||||
|
|
||||||
const onClickToNavigation = () => {
|
const onClickToNavigation = () => {
|
||||||
|
// 현재 언어에 맞게 서브메뉴도 변환
|
||||||
|
const localizedSubMenu = subMenu.map(sub => ({
|
||||||
|
...sub,
|
||||||
|
menuName: isEnglish ? (sub.menuNameEng || sub.menuName) : sub.menuName
|
||||||
|
}));
|
||||||
|
|
||||||
navigate(PATHS.account.user.menuAuth, {
|
navigate(PATHS.account.user.menuAuth, {
|
||||||
state: {
|
state: {
|
||||||
mid: mid,
|
mid: mid,
|
||||||
@@ -23,7 +32,7 @@ export const UserAccountAuthPermItem = ({
|
|||||||
status: status,
|
status: status,
|
||||||
menuId: menuId,
|
menuId: menuId,
|
||||||
menuName: menuName,
|
menuName: menuName,
|
||||||
subMenu: subMenu,
|
subMenu: localizedSubMenu,
|
||||||
menuGrants: menuGrants,
|
menuGrants: menuGrants,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
import { UserAccountAuthPermListProps } from '../model/types';
|
import { UserAccountAuthPermListProps } from '../model/types';
|
||||||
import { UserAccountAuthPermItem } from './user-account-auth-perm-item';
|
import { UserAccountAuthPermItem } from './user-account-auth-perm-item';
|
||||||
|
|
||||||
@@ -9,6 +10,9 @@ export const UserAccountAuthPermList = ({
|
|||||||
menuItems,
|
menuItems,
|
||||||
menuGrants,
|
menuGrants,
|
||||||
}: UserAccountAuthPermListProps) => {
|
}: UserAccountAuthPermListProps) => {
|
||||||
|
const { i18n } = useTranslation();
|
||||||
|
const isEnglish = i18n.language === 'en';
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="perm-list">
|
<div className="perm-list">
|
||||||
{menuItems.map((item, index) => {
|
{menuItems.map((item, index) => {
|
||||||
@@ -18,6 +22,9 @@ export const UserAccountAuthPermList = ({
|
|||||||
subMenuIds.includes(grant.menuId)
|
subMenuIds.includes(grant.menuId)
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// 현재 언어에 맞는 메뉴 이름 선택
|
||||||
|
const menuName = isEnglish ? (item.menuNameEng ?? item.menuName ?? '') : (item.menuName ?? '');
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<UserAccountAuthPermItem
|
<UserAccountAuthPermItem
|
||||||
key={`perm-${item.menuId || index}`}
|
key={`perm-${item.menuId || index}`}
|
||||||
@@ -26,7 +33,7 @@ export const UserAccountAuthPermList = ({
|
|||||||
idCL={idCL}
|
idCL={idCL}
|
||||||
status={status}
|
status={status}
|
||||||
menuId={item.menuId}
|
menuId={item.menuId}
|
||||||
menuName={item.menuName ?? ''}
|
menuName={menuName}
|
||||||
subMenu={item.subMenu ?? []}
|
subMenu={item.subMenu ?? []}
|
||||||
menuGrants={relevantGrants}
|
menuGrants={relevantGrants}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -354,7 +354,10 @@
|
|||||||
"active": "Active",
|
"active": "Active",
|
||||||
"inactive": "Inactive",
|
"inactive": "Inactive",
|
||||||
"loginScope": "Login Scope",
|
"loginScope": "Login Scope",
|
||||||
"menuPermissions": "Menu Permissions"
|
"menuPermissions": "Menu Permissions",
|
||||||
|
"deleteUserConfirm": "Do you want to delete this user?",
|
||||||
|
"deleteUserSuccess": "User deleted successfully.",
|
||||||
|
"deleteUserFailed": "Failed to delete user."
|
||||||
},
|
},
|
||||||
"favorite": {
|
"favorite": {
|
||||||
"edit": "Edit",
|
"edit": "Edit",
|
||||||
|
|||||||
@@ -24,10 +24,11 @@ const PERMISSION = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const UserMenuAuthPage = () => {
|
export const UserMenuAuthPage = () => {
|
||||||
const { t } = useTranslation();
|
const { t, i18n } = useTranslation();
|
||||||
const { navigate } = useNavigate();
|
const { navigate } = useNavigate();
|
||||||
const location = useLocation();
|
const location = useLocation();
|
||||||
const { mid, usrid, menuName, subMenu, menuGrants } = location.state || {};
|
const { mid, usrid, menuName, subMenu, menuGrants } = location.state || {};
|
||||||
|
const isEnglish = i18n.language === 'en';
|
||||||
|
|
||||||
// 메뉴별 권한 상태 관리
|
// 메뉴별 권한 상태 관리
|
||||||
const [permissions, setPermissions] = useState<Record<number, number>>({});
|
const [permissions, setPermissions] = useState<Record<number, number>>({});
|
||||||
@@ -205,15 +206,17 @@ export const UserMenuAuthPage = () => {
|
|||||||
<div className="desc service-tip">{t('account.setMenuPermissions')}</div>
|
<div className="desc service-tip">{t('account.setMenuPermissions')}</div>
|
||||||
<div className="desc service-tip">{t('account.permissionRestrictionsNotice')}</div>
|
<div className="desc service-tip">{t('account.permissionRestrictionsNotice')}</div>
|
||||||
|
|
||||||
{subMenu && subMenu.map((menu: { menuId: number; menuName: string }) => {
|
{subMenu && subMenu.map((menu: { menuId: number; menuName: string; menuNameEng?: string }) => {
|
||||||
const menuGrant = permissions[menu.menuId] || 0;
|
const menuGrant = permissions[menu.menuId] || 0;
|
||||||
const hasAccess = menuGrant > 0;
|
const hasAccess = menuGrant > 0;
|
||||||
|
// 현재 언어에 맞는 메뉴 이름 선택
|
||||||
|
const displayMenuName = isEnglish ? (menu.menuNameEng || menu.menuName) : menu.menuName;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div key={menu.menuId}>
|
<div key={menu.menuId}>
|
||||||
<div className="settings-section nopadding">
|
<div className="settings-section nopadding">
|
||||||
<div className="settings-row">
|
<div className="settings-row">
|
||||||
<div className="settings-row-title bd-style">{menu.menuName}</div>
|
<div className="settings-row-title bd-style">{displayMenuName}</div>
|
||||||
<label className="settings-switch">
|
<label className="settings-switch">
|
||||||
<input
|
<input
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
|
|||||||
Reference in New Issue
Block a user