refactor: Update account authentication and password input components

- Replace XKeypad with standard password input fields
- Update user authentication and login info components
- Modify password modification and account pages
- Add sub-layout widget enhancements

🤖 Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Jay Sheen
2025-10-23 10:34:28 +09:00
parent 02cacb9aab
commit 79271caab3
7 changed files with 31 additions and 21 deletions

View File

@@ -111,7 +111,7 @@ export const UserAccountAuthWrap = ({
] ]
return ( return (
<> <>
<div className="ing-list pdtop"> <div className="ing-list pdtop pb-86">
<div className="perm-form"> <div className="perm-form">
<div className="perm-field"> <div className="perm-field">
<div className="perm-label"> </div> <div className="perm-label"> </div>
@@ -144,7 +144,7 @@ export const UserAccountAuthWrap = ({
menuGrants={ permissions } menuGrants={ permissions }
></UserAccountAuthPermList> ></UserAccountAuthPermList>
<div className="apply-row bottom-padding"> <div className="apply-row">
<button <button
className="btn-50 btn-blue flex-1" className="btn-50 btn-blue flex-1"
type="button" type="button"

View File

@@ -5,6 +5,7 @@ import { useEffect, useState } from 'react';
import { useUserModifyAuthMethodMutation } from '@/entities/user/api/use-user-modify-authmethod-mutation'; import { useUserModifyAuthMethodMutation } from '@/entities/user/api/use-user-modify-authmethod-mutation';
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 { snackBar } from '@/shared/lib/toast';
export const UserLoginAuthInfoWrap = ({ export const UserLoginAuthInfoWrap = ({
mid, mid,
@@ -25,7 +26,7 @@ export const UserLoginAuthInfoWrap = ({
const { mutateAsync: userFindAuthMethod } = useUserFindAuthMethodMutation(); const { mutateAsync: userFindAuthMethod } = useUserFindAuthMethodMutation();
const { mutateAsync: userModifyAuthMethod } = useUserModifyAuthMethodMutation({ const { mutateAsync: userModifyAuthMethod } = useUserModifyAuthMethodMutation({
onSuccess: () => { onSuccess: () => {
// snackBar('사용자 정보가 성공적으로 저장되었습니다.'); snackBar('사용자 정보가 성공적으로 저장되었습니다.');
navigate(PATHS.account.user.manage, { navigate(PATHS.account.user.manage, {
state: { state: {
mid: mid, mid: mid,
@@ -33,7 +34,7 @@ export const UserLoginAuthInfoWrap = ({
}); });
}, },
onError: (error) => { onError: (error) => {
// snackBar(error?.response?.data?.message || '사용자 정보 저장에 실패했습니다.'); snackBar(error?.response?.data?.message || '사용자 정보 저장에 실패했습니다.');
} }
}); });
@@ -391,7 +392,7 @@ export const UserLoginAuthInfoWrap = ({
return ( return (
<> <>
<div className="ing-list pdtop"> <div className="ing-list pdtop">
<div className="settings-login-auth"> <div className="settings-login-auth pb-86">
<div className="group"> <div className="group">
<div className="group-header"> <div className="group-header">
<div className="title"> </div> <div className="title"> </div>
@@ -489,7 +490,7 @@ export const UserLoginAuthInfoWrap = ({
<div className="notice-bar"> .</div> <div className="notice-bar"> .</div>
</div> </div>
</div> </div>
<div className="apply-row bottom-padding"> <div className="apply-row">
<button <button
className="btn-50 btn-blue flex-1" className="btn-50 btn-blue flex-1"
disabled={!isSaveButtonEnabled()} disabled={!isSaveButtonEnabled()}

View File

@@ -41,7 +41,8 @@ export const UserManageWrap = () => {
return ( return (
<> <>
<div className="ing-list" style={{ display: 'flex', flexDirection: 'column', height: 'calc(100vh - 200px)' }}> {/* <div className="ing-list" style={{ display: 'flex', flexDirection: 'column', height: 'calc(100vh - 86px)' }}> */}
<div className="ing-list pb-86">
<div style={{ flexShrink: 0 }}> <div style={{ flexShrink: 0 }}>
<div className="input-wrapper top-select mt-16"> <div className="input-wrapper top-select mt-16">
<select <select

View File

@@ -9,6 +9,7 @@ import {
useSetOnBack useSetOnBack
} from '@/widgets/sub-layout/use-sub-layout'; } from '@/widgets/sub-layout/use-sub-layout';
import { useUserChangePasswordMutation } from '@/entities/user/api/use-user-change-password-mutation'; import { useUserChangePasswordMutation } from '@/entities/user/api/use-user-change-password-mutation';
import { snackBar } from '@/shared/lib/toast';
export const PasswordModifyLoginPasswordPage = () => { export const PasswordModifyLoginPasswordPage = () => {
const { navigate } = useNavigate(); const { navigate } = useNavigate();
@@ -19,7 +20,7 @@ export const PasswordModifyLoginPasswordPage = () => {
const changePasswordMutation = useUserChangePasswordMutation({ const changePasswordMutation = useUserChangePasswordMutation({
onSuccess: () => { onSuccess: () => {
// snackBar('비밀번호가 성공적으로 변경되었습니다.'); snackBar('비밀번호가 성공적으로 변경되었습니다.');
// Clear form // Clear form
setCurrentPassword(''); setCurrentPassword('');
setNewPassword(''); setNewPassword('');
@@ -28,7 +29,7 @@ export const PasswordModifyLoginPasswordPage = () => {
navigate(PATHS.account.password.manage); navigate(PATHS.account.password.manage);
}, },
onError: (error) => { onError: (error) => {
// snackBar(error?.response?.data?.message || '비밀번호 변경에 실패했습니다.'); snackBar(error?.response?.data?.message || '비밀번호 변경에 실패했습니다.');
} }
}); });

View File

@@ -12,6 +12,7 @@ import { VerificationItem } from '@/entities/account/model/types';
import { useUserCreateMutation } from '@/entities/user/api/use-user-create-mutation'; import { useUserCreateMutation } from '@/entities/user/api/use-user-create-mutation';
import { useUserExistsUseridQuery } from '@/entities/user/api/use-user-exists-userid-query'; import { useUserExistsUseridQuery } from '@/entities/user/api/use-user-exists-userid-query';
import { useLocation } from 'react-router'; import { useLocation } from 'react-router';
import { snackBar } from '@/shared/lib/toast';
export const UserAddAccountPage = () => { export const UserAddAccountPage = () => {
const { navigate } = useNavigate(); const { navigate } = useNavigate();
@@ -20,10 +21,10 @@ export const UserAddAccountPage = () => {
const { mutateAsync: userCreate, isPending } = useUserCreateMutation({ const { mutateAsync: userCreate, isPending } = useUserCreateMutation({
onSuccess: () => { onSuccess: () => {
// snackBar('사용자가 성공적으로 추가되었습니다.'); snackBar('사용자가 성공적으로 추가되었습니다.');
}, },
onError: (error) => { onError: (error) => {
// snackBar(error?.response?.data?.message || '사용자 추가에 실패했습니다.'); snackBar(error?.response?.data?.message || '사용자 추가에 실패했습니다.');
} }
}); });
@@ -381,7 +382,7 @@ export const UserAddAccountPage = () => {
if (response.status) { if (response.status) {
// 성공 시 사용자 관리 페이지로 이동 // 성공 시 사용자 관리 페이지로 이동
// snackBar('사용자가 성공적으로 추가되었습니다.'); snackBar('사용자가 성공적으로 추가되었습니다.');
navigate(PATHS.account.user.manage); navigate(PATHS.account.user.manage);
} else if (response.error) { } else if (response.error) {
// 에러 처리 // 에러 처리
@@ -409,7 +410,7 @@ export const UserAddAccountPage = () => {
<main> <main>
<div className="tab-content"> <div className="tab-content">
<div className="tab-pane sub active"> <div className="tab-pane sub active">
<div className="ing-list add"> <div className="ing-list pb-86">
<div className="user-add"> <div className="user-add">
<div className="ua-row"> <div className="ua-row">
<div className="ua-label">ID <span className="red">*</span></div> <div className="ua-label">ID <span className="red">*</span></div>
@@ -537,7 +538,7 @@ export const UserAddAccountPage = () => {
</div> </div>
</div> </div>
<div className="apply-row bottom-padding"> <div className="apply-row">
<button <button
className="btn-50 btn-blue flex-1" className="btn-50 btn-blue flex-1"
type="button" type="button"

View File

@@ -12,7 +12,7 @@ import { useLocation } from 'react-router';
import { useUserMenuPermissionsSaveMutation } from '@/entities/user/api/use-user-menu-permission-save-mutation'; import { useUserMenuPermissionsSaveMutation } from '@/entities/user/api/use-user-menu-permission-save-mutation';
// import { useUserMenuPermissionsMutation } from '@/entities/user/api/use-user-menu-permission-mutation'; // import { useUserMenuPermissionsMutation } from '@/entities/user/api/use-user-menu-permission-mutation';
import { UserMenuPermissionData } from '@/entities/user/model/types'; import { UserMenuPermissionData } from '@/entities/user/model/types';
//import { snackBar } from '@/shared/lib/toast'; import { snackBar } from '@/shared/lib/toast';
// 권한 비트 플래그 (실제 API 데이터 기준) // 권한 비트 플래그 (실제 API 데이터 기준)
const PERMISSION = { const PERMISSION = {
@@ -35,7 +35,7 @@ export const UserMenuAuthPage = () => {
const [isInitialLoad, setIsInitialLoad] = useState(true); const [isInitialLoad, setIsInitialLoad] = useState(true);
const savePermissionsMutation = useUserMenuPermissionsSaveMutation({ const savePermissionsMutation = useUserMenuPermissionsSaveMutation({
onSuccess: () => { onSuccess: () => {
//snackBar('권한이 성공적으로 저장되었습니다.'); snackBar('권한이 성공적으로 저장되었습니다.');
navigate(PATHS.account.user.accountAuth, { navigate(PATHS.account.user.accountAuth, {
state: { state: {
mid, mid,
@@ -46,7 +46,7 @@ export const UserMenuAuthPage = () => {
}); });
}, },
onError: (error) => { onError: (error) => {
// snackBar(error?.response?.data?.message || '권한 저장에 실패했습니다.'); snackBar(error?.response?.data?.message || '권한 저장에 실패했습니다.');
} }
}); });
@@ -181,7 +181,7 @@ export const UserMenuAuthPage = () => {
{ mid, namsUserMenuAccess }, { mid, namsUserMenuAccess },
{ {
onSuccess: () => { onSuccess: () => {
alert('권한이 저장되었습니다.'); snackBar('권한이 저장되었습니다.');
// 저장 성공 후 초기값 업데이트 // 저장 성공 후 초기값 업데이트
setInitialPermissions({...permissions}); setInitialPermissions({...permissions});
setHasChanges(false); setHasChanges(false);
@@ -199,7 +199,7 @@ export const UserMenuAuthPage = () => {
<main> <main>
<div className="tab-content"> <div className="tab-content">
<div className="tab-pane pt-46 active"> <div className="tab-pane pt-46 active">
<div className="ing-list sev"> <div className="ing-list pb-86">
<div className="desc service-tip"> .</div> <div className="desc service-tip"> .</div>
<div className="desc service-tip"> .</div> <div className="desc service-tip"> .</div>
@@ -281,6 +281,7 @@ export const UserMenuAuthPage = () => {
</div> </div>
); );
})} })}
</div>
<div className="apply-row"> <div className="apply-row">
<button <button
@@ -294,7 +295,6 @@ export const UserMenuAuthPage = () => {
</div> </div>
</div> </div>
</div> </div>
</div>
</main> </main>
</> </>
); );

View File

@@ -151,6 +151,12 @@ export const SubLayout = () => {
id: 'nictest00', id: 'nictest00',
password: 'nictest00' password: 'nictest00'
}; };
// userParmas = {
// id: 'medi9332',
// password: 'medi9332'
// };
} }
callLogin(userParmas).then(() => { callLogin(userParmas).then(() => {
callHomeGroups(); callHomeGroups();