chpark/vexplor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

회사관리, 메뉴관리 수정,삭제 기능

Browse Source
This commit is contained in:
kjs
2025-08-25 11:07:39 +09:00
parent caacd0e0a4
commit 8667cb4780
19 changed files with 1471 additions and 584 deletions
Download Patch File Download Diff File Expand all files Collapse all files

262
frontend/components/admin/MenuFormModal.tsx
View File

@@ -39,17 +39,29 @@ export const MenuFormModal: React.FC<MenuFormModalProps> = ({
level,
parentCompanyCode,
}) => {
console.log("🎯 MenuFormModal 렌더링 - Props:", {
isOpen,
menuId,
parentId,
menuType,
level,
parentCompanyCode,
});
console.log("🔍 MenuFormModal 컴포넌트 마운트됨");
const [formData, setFormData] = useState<MenuFormData>({
parentObjId: parentId || "0",
menuNameKor: "",
menuUrl: "",
menuDesc: "",
seq: 1,
menuType: menuType || "1",
status: "active",
companyCode: "",
langKey: "", // 다국어 키 추가
menuType: "1",
status: "ACTIVE",
companyCode: parentCompanyCode || "none",
langKey: "",
});
const [loading, setLoading] = useState(false);
const [isEdit, setIsEdit] = useState(false);
const [companies, setCompanies] = useState<Company[]>([]);
@@ -57,110 +69,7 @@ export const MenuFormModal: React.FC<MenuFormModalProps> = ({
const [isLangKeyDropdownOpen, setIsLangKeyDropdownOpen] = useState(false);
const [langKeySearchText, setLangKeySearchText] = useState("");
// 회사 목록 로드
useEffect(() => {
if (isOpen) {
loadCompanies();
}
}, [isOpen]);
// 다국어 키 목록 로드
useEffect(() => {
if (isOpen && formData.companyCode) {
loadLangKeys();
}
}, [isOpen, formData.companyCode]);
// 드롭다운 외부 클릭 시 닫기
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
const target = event.target as Element;
if (!target.closest(".langkey-dropdown")) {
setIsLangKeyDropdownOpen(false);
setLangKeySearchText("");
}
};
if (isLangKeyDropdownOpen) {
document.addEventListener("mousedown", handleClickOutside);
}
return () => {
document.removeEventListener("mousedown", handleClickOutside);
};
}, [isLangKeyDropdownOpen]);
const loadCompanies = async () => {
try {
const companyList = await companyAPI.getList({ status: "active" });
setCompanies(companyList);
} catch (error) {
console.error("회사 목록 로딩 오류:", error);
toast.error(getMenuTextSync(MENU_MANAGEMENT_KEYS.MESSAGE_ERROR_LOAD_COMPANY_LIST));
}
};
const loadLangKeys = async () => {
console.log(`🔤 다국어 키 목록 조회 시작 - companyCode:`, formData.companyCode);
try {
const response = await menuApi.getLangKeys({
companyCode: formData.companyCode === "none" ? "*" : formData.companyCode,
});
if (response.success && response.data) {
// 활성화된 다국어 키만 필터링
const activeKeys = response.data.filter((key) => key.isActive === "Y");
console.log(`🔤 다국어 키 목록 조회 성공:`, activeKeys.length, "개 (활성화된 키)");
setLangKeys(activeKeys);
}
} catch (error) {
console.error("❌ 다국어 키 목록 로딩 오류:", error);
toast.error(getMenuTextSync(MENU_MANAGEMENT_KEYS.MESSAGE_ERROR_LOAD_LANG_KEY_LIST));
setLangKeys([]);
}
};
useEffect(() => {
console.log("MenuFormModal useEffect - menuId:", menuId, "parentId:", parentId, "menuType:", menuType);
if (menuId) {
console.log("메뉴 수정 모드 - menuId:", menuId);
setIsEdit(true);
loadMenuData();
} else {
console.log("메뉴 등록 모드 - parentId:", parentId, "menuType:", menuType);
setIsEdit(false);
// 메뉴 타입 변환 (0 -> 0, 1 -> 1, admin -> 0, user -> 1)
let defaultMenuType = "1"; // 기본값은 사용자
if (menuType === "0" || menuType === "admin") {
defaultMenuType = "0"; // 관리자
} else if (menuType === "1" || menuType === "user") {
defaultMenuType = "1"; // 사용자
}
setFormData({
parentObjId: parentId || "0",
menuNameKor: "",
menuUrl: "",
menuDesc: "",
seq: 1,
menuType: defaultMenuType,
status: "ACTIVE", // 기본값은 활성화
companyCode: parentCompanyCode || "none", // 상위 메뉴의 회사 코드를 기본값으로 설정
langKey: "", // 다국어 키 초기화
});
console.log("메뉴 등록 기본값 설정:", {
parentObjId: parentId || "0",
menuType: defaultMenuType,
status: "ACTIVE",
companyCode: "",
langKey: "",
});
}
}, [menuId, parentId, menuType]);
// loadMenuData 함수를 먼저 정의
const loadMenuData = async () => {
console.log("loadMenuData 호출됨 - menuId:", menuId);
if (!menuId) {
@@ -246,6 +155,129 @@ export const MenuFormModal: React.FC<MenuFormModalProps> = ({
}
};
// useEffect를 loadMenuData 함수 정의 후로 이동
useEffect(() => {
console.log("🚀 MenuFormModal useEffect 실행됨!");
console.log("📋 useEffect 파라미터:", { menuId, parentId, menuType });
console.log("MenuFormModal useEffect - menuId:", menuId, "parentId:", parentId, "menuType:", menuType);
if (menuId) {
console.log("메뉴 수정 모드 - menuId:", menuId);
setIsEdit(true);
loadMenuData();
} else {
console.log("메뉴 등록 모드 - parentId:", parentId, "menuType:", menuType);
setIsEdit(false);
// 메뉴 타입 변환 (0 -> 0, 1 -> 1, admin -> 0, user -> 1)
let defaultMenuType = "1"; // 기본값은 사용자
if (menuType === "0" || menuType === "admin") {
defaultMenuType = "0"; // 관리자
} else if (menuType === "1" || menuType === "user") {
defaultMenuType = "1"; // 사용자
}
setFormData({
parentObjId: parentId || "0",
menuNameKor: "",
menuUrl: "",
menuDesc: "",
seq: 1,
menuType: defaultMenuType,
status: "ACTIVE", // 기본값은 활성화
companyCode: parentCompanyCode || "none", // 상위 메뉴의 회사 코드를 기본값으로 설정
langKey: "", // 다국어 키 초기화
});
console.log("메뉴 등록 기본값 설정:", {
parentObjId: parentId || "0",
menuType: defaultMenuType,
status: "ACTIVE",
companyCode: "",
langKey: "",
});
}
}, [menuId, parentId, menuType]);
// 강제로 useEffect 실행시키기 위한 별도 useEffect
useEffect(() => {
console.log("🔧 강제 useEffect 실행 - 컴포넌트 마운트됨");
console.log("🔧 현재 props:", { isOpen, menuId, parentId, menuType });
// isOpen이 true일 때만 실행
if (isOpen && menuId) {
console.log("🔧 모달이 열렸고 menuId가 있음 - 강제 실행");
// 약간의 지연 후 실행
setTimeout(() => {
console.log("🔧 setTimeout으로 loadMenuData 실행");
loadMenuData();
}, 100);
}
}, [isOpen]); // isOpen만 의존성으로 설정
// 회사 목록 로드
useEffect(() => {
if (isOpen) {
loadCompanies();
}
}, [isOpen]);
// 다국어 키 목록 로드
useEffect(() => {
if (isOpen && formData.companyCode) {
loadLangKeys();
}
}, [isOpen, formData.companyCode]);
// 드롭다운 외부 클릭 시 닫기
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
const target = event.target as Element;
if (!target.closest(".langkey-dropdown")) {
setIsLangKeyDropdownOpen(false);
setLangKeySearchText("");
}
};
if (isLangKeyDropdownOpen) {
document.addEventListener("mousedown", handleClickOutside);
}
return () => {
document.removeEventListener("mousedown", handleClickOutside);
};
}, [isLangKeyDropdownOpen]);
const loadCompanies = async () => {
try {
const companyList = await companyAPI.getList({ status: "active" });
setCompanies(companyList);
} catch (error) {
console.error("회사 목록 로딩 오류:", error);
toast.error(getMenuTextSync(MENU_MANAGEMENT_KEYS.MESSAGE_ERROR_LOAD_COMPANY_LIST));
}
};
const loadLangKeys = async () => {
console.log("🔤 다국어 키 목록 조회 시작 - companyCode:", formData.companyCode);
try {
const response = await menuApi.getLangKeys({
companyCode: formData.companyCode === "none" ? "*" : formData.companyCode,
});
if (response.success && response.data) {
// 활성화된 다국어 키만 필터링
const activeKeys = response.data.filter((key) => key.isActive === "Y");
console.log("🔤 다국어 키 목록 조회 성공:", activeKeys.length, "개 (활성화된 키)");
setLangKeys(activeKeys);
}
} catch (error) {
console.error("❌ 다국어 키 목록 로딩 오류:", error);
toast.error(getMenuTextSync(MENU_MANAGEMENT_KEYS.MESSAGE_ERROR_LOAD_LANG_KEY_LIST));
setLangKeys([]);
}
};
const handleSubmit = async (e: React.FormEvent) => {
e.preventDefault();
@@ -270,7 +302,18 @@ export const MenuFormModal: React.FC<MenuFormModalProps> = ({
};
console.log("저장할 데이터:", submitData);
const response = await menuApi.saveMenu(submitData);
let response;
if (isEdit && menuId) {
// 수정 모드: updateMenu API 호출
console.log("🔧 메뉴 수정 API 호출:", menuId);
response = await menuApi.updateMenu(menuId, submitData);
} else {
// 추가 모드: saveMenu API 호출
console.log("➕ 메뉴 추가 API 호출");
response = await menuApi.saveMenu(submitData);
}
if (response.success) {
toast.success(response.message);
@@ -280,6 +323,7 @@ export const MenuFormModal: React.FC<MenuFormModalProps> = ({
toast.error(response.message);
}
} catch (error) {
console.error("메뉴 저장/수정 실패:", error);
toast.error(getMenuTextSync(MENU_MANAGEMENT_KEYS.MESSAGE_MENU_SAVE_FAILED));
} finally {
setLoading(false);