From ab52c49492f8a7c57a615df60ea43fc20f3b66fe Mon Sep 17 00:00:00 2001 From: DDD1542 Date: Fri, 16 Jan 2026 14:48:15 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20=ED=99=94=EB=A9=B4=20=EA=B4=80=EB=A6=AC?= =?UTF-8?q?=20=EA=B8=B0=EB=8A=A5=20=EA=B0=9C=EC=84=A0=20(=EB=B3=B5?= =?UTF-8?q?=EC=A0=9C/=EC=82=AD=EC=A0=9C/=EA=B7=B8=EB=A3=B9=20=EA=B4=80?= =?UTF-8?q?=EB=A6=AC/=ED=85=8C=EC=9D=B4=EB=B8=94=20=EC=84=A4=EC=A0=95)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 화면 관리 시스템의 복제, 삭제, 수정 및 테이블 설정 기능을 전면 개선 - 그룹 삭제 시 하위 그룹과의 연관성 정리 및 로딩 프로그레스 바 추가 - 화면 수정 기능 추가: 이름, 그룹, 역할, 정렬 순서 변경 - 테이블 설정 모달에 관련 기능 추가 및 데이터 일관성 유지 - 메뉴-화면 그룹 동기화 API 추가 및 관련 상태 관리 기능 구현 - 검색어 필터링 로직 개선: 다중 키워드 지원 - 관련 파일 및 진행 상태 업데이트 --- PLAN.MD | 59 +- .../src/controllers/screenGroupController.ts | 240 ++++- backend-node/src/routes/screenGroupRoutes.ts | 17 + .../src/services/menuScreenSyncService.ts | 939 ++++++++++++++++++ .../admin/screenMng/screenMngList/page.tsx | 14 +- .../components/screen/CopyScreenModal.tsx | 2 +- .../components/screen/ScreenGroupTreeView.tsx | 589 ++++++++++- .../screen/panels/DataFlowPanel.tsx | 1 + .../screen/panels/FieldJoinPanel.tsx | 1 + frontend/lib/api/screenGroup.ts | 94 ++ 10 files changed, 1906 insertions(+), 50 deletions(-) create mode 100644 backend-node/src/services/menuScreenSyncService.ts diff --git a/PLAN.MD b/PLAN.MD index 0ca6521d..271d0af1 100644 --- a/PLAN.MD +++ b/PLAN.MD @@ -1,7 +1,7 @@ -# 프로젝트: 화면 관리 기능 개선 (복제/삭제/그룹 관리) +# 프로젝트: 화면 관리 기능 개선 (복제/삭제/그룹 관리/테이블 설정) ## 개요 -화면 관리 시스템의 복제 및 삭제 기능을 전면 개선하여, 단일 화면 복제, 그룹(폴더) 전체 복제, 정렬 순서 유지, 일괄 이름 변경 등 다양한 고급 기능을 지원합니다. +화면 관리 시스템의 복제, 삭제, 수정, 테이블 설정 기능을 전면 개선하여 효율적인 화면 관리를 지원합니다. ## 핵심 기능 @@ -15,47 +15,54 @@ ### 2. 그룹(폴더) 전체 복제 - [x] 대분류 폴더 복제 시 모든 하위 폴더 + 화면 재귀적 복제 - [x] 정렬 순서(display_order) 유지 - - 그룹 생성 시 원본 display_order 전달 - - 화면 추가 시 원본 display_order 유지 - - 하위 그룹들 display_order 순으로 정렬 후 복제 - [x] 대분류(최상위 그룹) 복제 시 경고 문구 표시 -- [x] 정렬 순서 입력 필드 추가 (사용자가 직접 수정 가능) -- [x] 원본 그룹 정보 표시 개선 - - 직접 포함 화면 수 - - 하위 그룹 수 - - 복제될 총 화면 수 (하위 그룹 포함) +- [x] 정렬 순서 입력 필드 추가 +- [x] 복제 모드 선택: 전체(폴더+화면), 폴더만, 화면만 +- [x] 모달 스크롤 지원 (max-h-[90vh] overflow-y-auto) ### 3. 고급 옵션: 이름 일괄 변경 -- [x] 삭제할 텍스트 지정 (모든 폴더/화면 이름에서 제거) -- [x] 추가할 접미사 지정 (기본값: " (복제)") +- [x] 찾을 텍스트 / 대체할 텍스트 (Find & Replace) - [x] 미리보기 기능 ### 4. 삭제 기능 - [x] 단일 화면 삭제 (휴지통으로 이동) -- [x] 그룹 삭제 시 옵션 선택 - - "화면도 함께 삭제" 체크박스 - - 체크 시: 그룹 + 포함된 화면 모두 삭제 - - 미체크 시: 화면은 "미분류"로 이동 +- [x] 그룹 삭제 (화면 함께 삭제 옵션) +- [x] 삭제 시 로딩 프로그레스 바 표시 -### 5. 회사 코드 지원 (최고 관리자) +### 5. 화면 수정 기능 +- [x] 우클릭 "수정" 메뉴로 화면 이름/그룹/역할/정렬 순서 변경 +- [x] 그룹 추가/수정 시 상위 그룹 기반 자동 회사 코드 설정 + +### 6. 테이블 설정 기능 (TableSettingModal) +- [x] 화면 설정 모달에 "테이블 설정" 탭 추가 +- [x] 입력 타입 변경 시 관련 참조 필드 자동 초기화 + - 엔티티→텍스트: referenceTable, referenceColumn, displayColumn 초기화 + - 코드→다른 타입: codeCategory, codeValue 초기화 +- [x] 데이터 일관성 유지 (inputType ↔ referenceTable 연동) +- [x] 조인 배지 단일화 (FK 배지 제거, 조인 배지만 표시) + +### 7. 회사 코드 지원 (최고 관리자) - [x] 대상 회사 선택 가능 -- [x] 복제된 그룹/화면에 선택한 회사 코드 적용 +- [x] 상위 그룹 선택 시 자동 회사 코드 설정 ## 관련 파일 -- `frontend/components/screen/CopyScreenModal.tsx` - 복제 모달 (화면/그룹 통합) +- `frontend/components/screen/CopyScreenModal.tsx` - 복제 모달 - `frontend/components/screen/ScreenGroupTreeView.tsx` - 트리 뷰 + 컨텍스트 메뉴 -- `frontend/lib/api/screen.ts` - 화면 API (복제, 삭제) +- `frontend/components/screen/TableSettingModal.tsx` - 테이블 설정 모달 +- `frontend/components/screen/ScreenSettingModal.tsx` - 화면 설정 모달 (테이블 설정 탭 포함) +- `frontend/lib/api/screen.ts` - 화면 API - `frontend/lib/api/screenGroup.ts` - 그룹 API +- `frontend/lib/api/tableManagement.ts` - 테이블 관리 API ## 진행 상태 - [완료] 단일 화면 복제 + 새로고침 - [완료] 그룹 전체 복제 (재귀적) -- [완료] 정렬 순서(display_order) 유지 -- [완료] 대분류 경고 문구 -- [완료] 정렬 순서 입력 필드 -- [완료] 고급 옵션: 이름 일괄 변경 -- [완료] 단일 화면 삭제 -- [완료] 그룹 삭제 (화면 함께 삭제 옵션) +- [완료] 고급 옵션: 이름 일괄 변경 (Find & Replace) +- [완료] 단일 화면/그룹 삭제 + 로딩 프로그레스 +- [완료] 화면 수정 (이름/그룹/역할/순서) +- [완료] 테이블 설정 탭 추가 +- [완료] 입력 타입 변경 시 관련 필드 초기화 +- [완료] 그룹 복제 모달 스크롤 문제 수정 --- diff --git a/backend-node/src/controllers/screenGroupController.ts b/backend-node/src/controllers/screenGroupController.ts index 569fe793..b89ef902 100644 --- a/backend-node/src/controllers/screenGroupController.ts +++ b/backend-node/src/controllers/screenGroupController.ts @@ -1,6 +1,12 @@ import { Request, Response } from "express"; import { getPool } from "../database/db"; import { logger } from "../utils/logger"; +import { + syncScreenGroupsToMenu, + syncMenuToScreenGroups, + getSyncStatus, + syncAllCompanies, +} from "../services/menuScreenSyncService"; // pool 인스턴스 가져오기 const pool = getPool(); @@ -294,10 +300,35 @@ export const updateScreenGroup = async (req: Request, res: Response) => { // 화면 그룹 삭제 export const deleteScreenGroup = async (req: Request, res: Response) => { + const client = await pool.connect(); try { const { id } = req.params; const companyCode = (req.user as any).companyCode; + await client.query('BEGIN'); + + // 1. 삭제할 그룹과 하위 그룹 ID 수집 (CASCADE 삭제 대상) + const childGroupsResult = await client.query(` + WITH RECURSIVE child_groups AS ( + SELECT id FROM screen_groups WHERE id = $1 + UNION ALL + SELECT sg.id FROM screen_groups sg + JOIN child_groups cg ON sg.parent_group_id = cg.id + ) + SELECT id FROM child_groups + `, [id]); + const groupIdsToDelete = childGroupsResult.rows.map((r: any) => r.id); + + // 2. menu_info에서 삭제될 screen_group 참조를 NULL로 정리 + if (groupIdsToDelete.length > 0) { + await client.query(` + UPDATE menu_info + SET screen_group_id = NULL + WHERE screen_group_id = ANY($1::int[]) + `, [groupIdsToDelete]); + } + + // 3. screen_groups 삭제 let query = `DELETE FROM screen_groups WHERE id = $1`; const params: any[] = [id]; @@ -308,18 +339,24 @@ export const deleteScreenGroup = async (req: Request, res: Response) => { query += " RETURNING id"; - const result = await pool.query(query, params); + const result = await client.query(query, params); if (result.rows.length === 0) { + await client.query('ROLLBACK'); return res.status(404).json({ success: false, message: "화면 그룹을 찾을 수 없거나 권한이 없습니다." }); } - logger.info("화면 그룹 삭제", { companyCode, groupId: id }); + await client.query('COMMIT'); + + logger.info("화면 그룹 삭제", { companyCode, groupId: id, cleanedRefs: groupIdsToDelete.length }); res.json({ success: true, message: "화면 그룹이 삭제되었습니다." }); } catch (error: any) { + await client.query('ROLLBACK'); logger.error("화면 그룹 삭제 실패:", error); res.status(500).json({ success: false, message: "화면 그룹 삭제에 실패했습니다.", error: error.message }); + } finally { + client.release(); } }; @@ -2014,3 +2051,202 @@ export const getScreenSubTables = async (req: Request, res: Response) => { } }; + +// ============================================================ +// 메뉴-화면그룹 동기화 API +// ============================================================ + +/** + * 화면관리 → 메뉴 동기화 + * screen_groups를 menu_info로 동기화 + */ +export const syncScreenGroupsToMenuController = async (req: Request, res: Response) => { + try { + const userCompanyCode = (req.user as any).companyCode; + const userId = (req.user as any).userId; + const { targetCompanyCode } = req.body; + + // 최고 관리자가 특정 회사를 지정한 경우 해당 회사로 + let companyCode = userCompanyCode; + if (userCompanyCode === "*" && targetCompanyCode) { + companyCode = targetCompanyCode; + } + + // 최고 관리자(*)는 회사를 지정해야 함 + if (companyCode === "*") { + return res.status(400).json({ + success: false, + message: "동기화할 회사를 선택해주세요.", + }); + } + + logger.info("화면관리 → 메뉴 동기화 요청", { companyCode, userId }); + + const result = await syncScreenGroupsToMenu(companyCode, userId); + + if (!result.success) { + return res.status(500).json({ + success: false, + message: "동기화 중 오류가 발생했습니다.", + errors: result.errors, + }); + } + + res.json({ + success: true, + message: `동기화 완료: 생성 ${result.created}개, 연결 ${result.linked}개, 스킵 ${result.skipped}개`, + data: result, + }); + } catch (error: any) { + logger.error("화면관리 → 메뉴 동기화 실패:", error); + res.status(500).json({ + success: false, + message: "동기화에 실패했습니다.", + error: error.message, + }); + } +}; + +/** + * 메뉴 → 화면관리 동기화 + * menu_info를 screen_groups로 동기화 + */ +export const syncMenuToScreenGroupsController = async (req: Request, res: Response) => { + try { + const userCompanyCode = (req.user as any).companyCode; + const userId = (req.user as any).userId; + const { targetCompanyCode } = req.body; + + // 최고 관리자가 특정 회사를 지정한 경우 해당 회사로 + let companyCode = userCompanyCode; + if (userCompanyCode === "*" && targetCompanyCode) { + companyCode = targetCompanyCode; + } + + // 최고 관리자(*)는 회사를 지정해야 함 + if (companyCode === "*") { + return res.status(400).json({ + success: false, + message: "동기화할 회사를 선택해주세요.", + }); + } + + logger.info("메뉴 → 화면관리 동기화 요청", { companyCode, userId }); + + const result = await syncMenuToScreenGroups(companyCode, userId); + + if (!result.success) { + return res.status(500).json({ + success: false, + message: "동기화 중 오류가 발생했습니다.", + errors: result.errors, + }); + } + + res.json({ + success: true, + message: `동기화 완료: 생성 ${result.created}개, 연결 ${result.linked}개, 스킵 ${result.skipped}개`, + data: result, + }); + } catch (error: any) { + logger.error("메뉴 → 화면관리 동기화 실패:", error); + res.status(500).json({ + success: false, + message: "동기화에 실패했습니다.", + error: error.message, + }); + } +}; + +/** + * 동기화 상태 조회 + */ +export const getSyncStatusController = async (req: Request, res: Response) => { + try { + const userCompanyCode = (req.user as any).companyCode; + const { targetCompanyCode } = req.query; + + // 최고 관리자가 특정 회사를 지정한 경우 해당 회사로 + let companyCode = userCompanyCode; + if (userCompanyCode === "*" && targetCompanyCode) { + companyCode = targetCompanyCode as string; + } + + // 최고 관리자(*)는 회사를 지정해야 함 + if (companyCode === "*") { + return res.status(400).json({ + success: false, + message: "조회할 회사를 선택해주세요.", + }); + } + + const status = await getSyncStatus(companyCode); + + res.json({ + success: true, + data: status, + }); + } catch (error: any) { + logger.error("동기화 상태 조회 실패:", error); + res.status(500).json({ + success: false, + message: "동기화 상태 조회에 실패했습니다.", + error: error.message, + }); + } +}; + +/** + * 전체 회사 동기화 + * 모든 회사에 대해 양방향 동기화 수행 (최고 관리자만) + */ +export const syncAllCompaniesController = async (req: Request, res: Response) => { + try { + const userCompanyCode = (req.user as any).companyCode; + const userId = (req.user as any).userId; + + // 최고 관리자만 전체 동기화 가능 + if (userCompanyCode !== "*") { + return res.status(403).json({ + success: false, + message: "전체 동기화는 최고 관리자만 수행할 수 있습니다.", + }); + } + + logger.info("전체 회사 동기화 요청", { userId }); + + const result = await syncAllCompanies(userId); + + if (!result.success) { + return res.status(500).json({ + success: false, + message: "전체 동기화 중 오류가 발생했습니다.", + }); + } + + // 결과 요약 + const totalCreated = result.results.reduce((sum, r) => sum + r.created, 0); + const totalLinked = result.results.reduce((sum, r) => sum + r.linked, 0); + + res.json({ + success: true, + message: `전체 동기화 완료: ${result.totalCompanies}개 회사 중 ${result.successCount}개 성공`, + data: { + totalCompanies: result.totalCompanies, + successCount: result.successCount, + failedCount: result.failedCount, + totalCreated, + totalLinked, + details: result.results, + }, + }); + } catch (error: any) { + logger.error("전체 회사 동기화 실패:", error); + res.status(500).json({ + success: false, + message: "전체 동기화에 실패했습니다.", + error: error.message, + }); + } +}; + diff --git a/backend-node/src/routes/screenGroupRoutes.ts b/backend-node/src/routes/screenGroupRoutes.ts index d4980fe8..614e6d61 100644 --- a/backend-node/src/routes/screenGroupRoutes.ts +++ b/backend-node/src/routes/screenGroupRoutes.ts @@ -31,6 +31,11 @@ import { getMultipleScreenLayoutSummary, // 화면 서브 테이블 관계 getScreenSubTables, + // 메뉴-화면그룹 동기화 + syncScreenGroupsToMenuController, + syncMenuToScreenGroupsController, + getSyncStatusController, + syncAllCompaniesController, } from "../controllers/screenGroupController"; const router = Router(); @@ -89,6 +94,18 @@ router.post("/layout-summary/batch", getMultipleScreenLayoutSummary); // ============================================================ router.post("/sub-tables/batch", getScreenSubTables); +// ============================================================ +// 메뉴-화면그룹 동기화 +// ============================================================ +// 동기화 상태 조회 +router.get("/sync/status", getSyncStatusController); +// 화면관리 → 메뉴 동기화 +router.post("/sync/screen-to-menu", syncScreenGroupsToMenuController); +// 메뉴 → 화면관리 동기화 +router.post("/sync/menu-to-screen", syncMenuToScreenGroupsController); +// 전체 회사 동기화 (최고 관리자만) +router.post("/sync/all", syncAllCompaniesController); + export default router; diff --git a/backend-node/src/services/menuScreenSyncService.ts b/backend-node/src/services/menuScreenSyncService.ts new file mode 100644 index 00000000..13c77ed6 --- /dev/null +++ b/backend-node/src/services/menuScreenSyncService.ts @@ -0,0 +1,939 @@ +import { getPool } from "../database/db"; +import { logger } from "../utils/logger"; + +const pool = getPool(); + +/** + * 메뉴-화면그룹 동기화 서비스 + * + * 양방향 동기화: + * 1. screen_groups → menu_info: 화면관리 폴더 구조를 메뉴로 동기화 + * 2. menu_info → screen_groups: 사용자 메뉴를 화면관리 폴더로 동기화 + */ + +// ============================================================ +// 타입 정의 +// ============================================================ + +interface SyncResult { + success: boolean; + created: number; + linked: number; + skipped: number; + errors: string[]; + details: SyncDetail[]; +} + +interface SyncDetail { + action: 'created' | 'linked' | 'skipped' | 'error'; + sourceName: string; + sourceId: number | string; + targetId?: number | string; + reason?: string; +} + +// ============================================================ +// 화면관리 → 메뉴 동기화 +// ============================================================ + +/** + * screen_groups를 menu_info로 동기화 + * + * 로직: + * 1. 해당 회사의 screen_groups 조회 (폴더 구조) + * 2. 이미 menu_objid가 연결된 것은 제외 + * 3. 이름으로 기존 menu_info 매칭 시도 + * - 매칭되면: 양쪽에 연결 ID 업데이트 + * - 매칭 안되면: menu_info에 새로 생성 + * 4. 계층 구조(parent) 유지 + */ +export async function syncScreenGroupsToMenu( + companyCode: string, + userId: string +): Promise { + const result: SyncResult = { + success: true, + created: 0, + linked: 0, + skipped: 0, + errors: [], + details: [], + }; + + const client = await pool.connect(); + + try { + await client.query('BEGIN'); + + logger.info("화면관리 → 메뉴 동기화 시작", { companyCode, userId }); + + // 1. 해당 회사의 screen_groups 조회 (아직 menu_objid가 없는 것) + const screenGroupsQuery = ` + SELECT + sg.id, + sg.group_name, + sg.group_code, + sg.parent_group_id, + sg.group_level, + sg.display_order, + sg.description, + sg.icon, + sg.menu_objid, + -- 부모 그룹의 menu_objid도 조회 (계층 연결용) + parent.menu_objid as parent_menu_objid + FROM screen_groups sg + LEFT JOIN screen_groups parent ON sg.parent_group_id = parent.id + WHERE sg.company_code = $1 + ORDER BY sg.group_level ASC, sg.display_order ASC + `; + const screenGroupsResult = await client.query(screenGroupsQuery, [companyCode]); + + // 2. 해당 회사의 기존 menu_info 조회 (사용자 메뉴, menu_type=1) + // 경로 기반 매칭을 위해 부모 이름도 조회 + const existingMenusQuery = ` + SELECT + m.objid, + m.menu_name_kor, + m.parent_obj_id, + m.screen_group_id, + p.menu_name_kor as parent_name + FROM menu_info m + LEFT JOIN menu_info p ON m.parent_obj_id = p.objid + WHERE m.company_code = $1 AND m.menu_type = 1 + `; + const existingMenusResult = await client.query(existingMenusQuery, [companyCode]); + + // 경로(부모이름 > 이름) → 메뉴 매핑 (screen_group_id가 없는 것만) + // 단순 이름 매칭도 유지 (하위 호환) + const menuByPath: Map = new Map(); + const menuByName: Map = new Map(); + existingMenusResult.rows.forEach((menu: any) => { + if (!menu.screen_group_id) { + const menuName = menu.menu_name_kor?.trim().toLowerCase() || ''; + const parentName = menu.parent_name?.trim().toLowerCase() || ''; + const pathKey = parentName ? `${parentName}>${menuName}` : menuName; + + menuByPath.set(pathKey, menu); + // 단순 이름 매핑은 첫 번째 것만 (중복 방지) + if (!menuByName.has(menuName)) { + menuByName.set(menuName, menu); + } + } + }); + + // 모든 메뉴의 objid 집합 (삭제 확인용) + const existingMenuObjids = new Set(existingMenusResult.rows.map((m: any) => Number(m.objid))); + + // 3. 사용자 메뉴의 루트 찾기 (parent_obj_id = 0인 사용자 메뉴) + // 없으면 생성 + let userMenuRootObjid: number | null = null; + const rootMenuQuery = ` + SELECT objid FROM menu_info + WHERE company_code = $1 AND menu_type = 1 AND parent_obj_id = 0 + ORDER BY seq ASC + LIMIT 1 + `; + const rootMenuResult = await client.query(rootMenuQuery, [companyCode]); + + if (rootMenuResult.rows.length > 0) { + userMenuRootObjid = Number(rootMenuResult.rows[0].objid); + } else { + // 루트 메뉴가 없으면 생성 + const newObjid = Date.now(); + const createRootQuery = ` + INSERT INTO menu_info (objid, parent_obj_id, menu_name_kor, menu_name_eng, seq, menu_type, company_code, writer, regdate, status) + VALUES ($1, 0, '사용자', 'User', 1, 1, $2, $3, NOW(), 'Y') + RETURNING objid + `; + const createRootResult = await client.query(createRootQuery, [newObjid, companyCode, userId]); + userMenuRootObjid = Number(createRootResult.rows[0].objid); + logger.info("사용자 메뉴 루트 생성", { companyCode, objid: userMenuRootObjid }); + } + + // 4. screen_groups ID → menu_objid 매핑 (순차 처리를 위해) + const groupToMenuMap: Map = new Map(); + + // screen_groups의 부모 이름 조회를 위한 매핑 + const groupIdToName: Map = new Map(); + screenGroupsResult.rows.forEach((g: any) => { + groupIdToName.set(g.id, g.group_name?.trim().toLowerCase() || ''); + }); + + // 5. 각 screen_group 처리 + for (const group of screenGroupsResult.rows) { + const groupId = group.id; + const groupName = group.group_name?.trim(); + const groupNameLower = groupName?.toLowerCase() || ''; + + // 이미 연결된 경우 - 실제로 메뉴가 존재하는지 확인 + if (group.menu_objid) { + const menuExists = existingMenuObjids.has(Number(group.menu_objid)); + + if (menuExists) { + // 메뉴가 존재하면 스킵 + result.skipped++; + result.details.push({ + action: 'skipped', + sourceName: groupName, + sourceId: groupId, + targetId: group.menu_objid, + reason: '이미 메뉴와 연결됨', + }); + groupToMenuMap.set(groupId, Number(group.menu_objid)); + continue; + } else { + // 메뉴가 삭제되었으면 연결 해제하고 재생성 + logger.info("삭제된 메뉴 연결 해제", { groupId, deletedMenuObjid: group.menu_objid }); + await client.query( + `UPDATE screen_groups SET menu_objid = NULL, updated_date = NOW() WHERE id = $1`, + [groupId] + ); + // 계속 진행하여 재생성 또는 재연결 + } + } + + // 부모 그룹 이름 조회 (경로 기반 매칭용) + const parentGroupName = group.parent_group_id ? groupIdToName.get(group.parent_group_id) : ''; + const pathKey = parentGroupName ? `${parentGroupName}>${groupNameLower}` : groupNameLower; + + // 경로로 기존 메뉴 매칭 시도 (우선순위: 경로 매칭 > 이름 매칭) + let matchedMenu = menuByPath.get(pathKey); + if (!matchedMenu) { + // 경로 매칭 실패시 이름으로 시도 (하위 호환) + matchedMenu = menuByName.get(groupNameLower); + } + + if (matchedMenu) { + // 매칭된 메뉴와 연결 + const menuObjid = Number(matchedMenu.objid); + + // screen_groups에 menu_objid 업데이트 + await client.query( + `UPDATE screen_groups SET menu_objid = $1, updated_date = NOW() WHERE id = $2`, + [menuObjid, groupId] + ); + + // menu_info에 screen_group_id 업데이트 + await client.query( + `UPDATE menu_info SET screen_group_id = $1 WHERE objid = $2`, + [groupId, menuObjid] + ); + + groupToMenuMap.set(groupId, menuObjid); + result.linked++; + result.details.push({ + action: 'linked', + sourceName: groupName, + sourceId: groupId, + targetId: menuObjid, + }); + + // 매칭된 메뉴는 Map에서 제거 (중복 매칭 방지) + menuByPath.delete(pathKey); + menuByName.delete(groupNameLower); + + } else { + // 새 메뉴 생성 + const newObjid = Date.now() + groupId; // 고유 ID 보장 + + // 부모 메뉴 objid 결정 + let parentMenuObjid = userMenuRootObjid; + if (group.parent_group_id && group.parent_menu_objid) { + parentMenuObjid = Number(group.parent_menu_objid); + } else if (group.parent_group_id && groupToMenuMap.has(group.parent_group_id)) { + parentMenuObjid = groupToMenuMap.get(group.parent_group_id)!; + } + + // 같은 부모 아래에서 가장 높은 seq 조회 후 +1 + let nextSeq = 1; + const maxSeqQuery = ` + SELECT COALESCE(MAX(seq), 0) + 1 as next_seq + FROM menu_info + WHERE parent_obj_id = $1 AND company_code = $2 AND menu_type = 1 + `; + const maxSeqResult = await client.query(maxSeqQuery, [parentMenuObjid, companyCode]); + if (maxSeqResult.rows.length > 0) { + nextSeq = parseInt(maxSeqResult.rows[0].next_seq) || 1; + } + + // menu_info에 삽입 + const insertMenuQuery = ` + INSERT INTO menu_info ( + objid, parent_obj_id, menu_name_kor, menu_name_eng, + seq, menu_type, company_code, writer, regdate, status, screen_group_id, menu_desc + ) VALUES ($1, $2, $3, $4, $5, 1, $6, $7, NOW(), 'Y', $8, $9) + RETURNING objid + `; + await client.query(insertMenuQuery, [ + newObjid, + parentMenuObjid, + groupName, + group.group_code || groupName, + nextSeq, + companyCode, + userId, + groupId, + group.description || null, + ]); + + // screen_groups에 menu_objid 업데이트 + await client.query( + `UPDATE screen_groups SET menu_objid = $1, updated_date = NOW() WHERE id = $2`, + [newObjid, groupId] + ); + + groupToMenuMap.set(groupId, newObjid); + result.created++; + result.details.push({ + action: 'created', + sourceName: groupName, + sourceId: groupId, + targetId: newObjid, + }); + } + } + + await client.query('COMMIT'); + + logger.info("화면관리 → 메뉴 동기화 완료", { + companyCode, + created: result.created, + linked: result.linked, + skipped: result.skipped + }); + + return result; + + } catch (error: any) { + await client.query('ROLLBACK'); + logger.error("화면관리 → 메뉴 동기화 실패", { companyCode, error: error.message }); + result.success = false; + result.errors.push(error.message); + return result; + } finally { + client.release(); + } +} + + +// ============================================================ +// 메뉴 → 화면관리 동기화 +// ============================================================ + +/** + * menu_info를 screen_groups로 동기화 + * + * 로직: + * 1. 해당 회사의 사용자 메뉴(menu_type=1) 조회 + * 2. 이미 screen_group_id가 연결된 것은 제외 + * 3. 이름으로 기존 screen_groups 매칭 시도 + * - 매칭되면: 양쪽에 연결 ID 업데이트 + * - 매칭 안되면: screen_groups에 새로 생성 (폴더로) + * 4. 계층 구조(parent) 유지 + */ +export async function syncMenuToScreenGroups( + companyCode: string, + userId: string +): Promise { + const result: SyncResult = { + success: true, + created: 0, + linked: 0, + skipped: 0, + errors: [], + details: [], + }; + + const client = await pool.connect(); + + try { + await client.query('BEGIN'); + + logger.info("메뉴 → 화면관리 동기화 시작", { companyCode, userId }); + + // 0. 회사 이름 조회 (회사 폴더 찾기/생성용) + const companyNameQuery = `SELECT company_name FROM company_mng WHERE company_code = $1`; + const companyNameResult = await client.query(companyNameQuery, [companyCode]); + const companyName = companyNameResult.rows[0]?.company_name || companyCode; + + // 1. 해당 회사의 사용자 메뉴 조회 (menu_type=1) + const menusQuery = ` + SELECT + m.objid, + m.menu_name_kor, + m.menu_name_eng, + m.parent_obj_id, + m.seq, + m.menu_url, + m.menu_desc, + m.screen_group_id, + -- 부모 메뉴의 screen_group_id도 조회 (계층 연결용) + parent.screen_group_id as parent_screen_group_id + FROM menu_info m + LEFT JOIN menu_info parent ON m.parent_obj_id = parent.objid + WHERE m.company_code = $1 AND m.menu_type = 1 + ORDER BY + CASE WHEN m.parent_obj_id = 0 THEN 0 ELSE 1 END, + m.parent_obj_id, + m.seq + `; + const menusResult = await client.query(menusQuery, [companyCode]); + + // 2. 해당 회사의 기존 screen_groups 조회 (경로 기반 매칭을 위해 부모 이름도 조회) + const existingGroupsQuery = ` + SELECT + g.id, + g.group_name, + g.menu_objid, + g.parent_group_id, + p.group_name as parent_name + FROM screen_groups g + LEFT JOIN screen_groups p ON g.parent_group_id = p.id + WHERE g.company_code = $1 + `; + const existingGroupsResult = await client.query(existingGroupsQuery, [companyCode]); + + // 경로(부모이름 > 이름) → 그룹 매핑 (menu_objid가 없는 것만) + // 단순 이름 매칭도 유지 (하위 호환) + const groupByPath: Map = new Map(); + const groupByName: Map = new Map(); + existingGroupsResult.rows.forEach((group: any) => { + if (!group.menu_objid) { + const groupName = group.group_name?.trim().toLowerCase() || ''; + const parentName = group.parent_name?.trim().toLowerCase() || ''; + const pathKey = parentName ? `${parentName}>${groupName}` : groupName; + + groupByPath.set(pathKey, group); + // 단순 이름 매핑은 첫 번째 것만 (중복 방지) + if (!groupByName.has(groupName)) { + groupByName.set(groupName, group); + } + } + }); + + // 모든 그룹의 id 집합 (삭제 확인용) + const existingGroupIds = new Set(existingGroupsResult.rows.map((g: any) => Number(g.id))); + + // 3. 회사 폴더 찾기 또는 생성 (루트 레벨에 회사명으로 된 폴더) + let companyFolderId: number | null = null; + const companyFolderQuery = ` + SELECT id FROM screen_groups + WHERE company_code = $1 AND parent_group_id IS NULL AND group_level = 0 + ORDER BY id ASC + LIMIT 1 + `; + const companyFolderResult = await client.query(companyFolderQuery, [companyCode]); + + if (companyFolderResult.rows.length > 0) { + companyFolderId = companyFolderResult.rows[0].id; + logger.info("회사 폴더 발견", { companyCode, companyFolderId, companyName }); + } else { + // 회사 폴더가 없으면 생성 + // 루트 레벨에서 가장 높은 display_order 조회 후 +1 + let nextRootOrder = 1; + const maxRootOrderQuery = ` + SELECT COALESCE(MAX(display_order), 0) + 1 as next_order + FROM screen_groups + WHERE parent_group_id IS NULL + `; + const maxRootOrderResult = await client.query(maxRootOrderQuery); + if (maxRootOrderResult.rows.length > 0) { + nextRootOrder = parseInt(maxRootOrderResult.rows[0].next_order) || 1; + } + + const createFolderQuery = ` + INSERT INTO screen_groups ( + group_name, group_code, parent_group_id, group_level, + display_order, company_code, writer, hierarchy_path + ) VALUES ($1, $2, NULL, 0, $3, $4, $5, '/') + RETURNING id + `; + const createFolderResult = await client.query(createFolderQuery, [ + companyName, + companyCode.toLowerCase(), + nextRootOrder, + companyCode, + userId, + ]); + companyFolderId = createFolderResult.rows[0].id; + + // hierarchy_path 업데이트 + await client.query( + `UPDATE screen_groups SET hierarchy_path = $1 WHERE id = $2`, + [`/${companyFolderId}/`, companyFolderId] + ); + + logger.info("회사 폴더 생성", { companyCode, companyFolderId, companyName }); + } + + // 4. menu_objid → screen_group_id 매핑 (순차 처리를 위해) + const menuToGroupMap: Map = new Map(); + + // 부모 메뉴 중 이미 screen_group_id가 있는 것 등록 + menusResult.rows.forEach((menu: any) => { + if (menu.screen_group_id) { + menuToGroupMap.set(Number(menu.objid), Number(menu.screen_group_id)); + } + }); + + // 루트 메뉴(parent_obj_id = 0)의 objid 찾기 → 회사 폴더와 매핑 + let rootMenuObjid: number | null = null; + for (const menu of menusResult.rows) { + if (Number(menu.parent_obj_id) === 0) { + rootMenuObjid = Number(menu.objid); + // 루트 메뉴는 회사 폴더와 연결 + if (companyFolderId) { + menuToGroupMap.set(rootMenuObjid, companyFolderId); + } + break; + } + } + + // 5. 각 메뉴 처리 + for (const menu of menusResult.rows) { + const menuObjid = Number(menu.objid); + const menuName = menu.menu_name_kor?.trim(); + + // 루트 메뉴(parent_obj_id = 0)는 스킵 (이미 회사 폴더와 매핑됨) + if (Number(menu.parent_obj_id) === 0) { + result.skipped++; + result.details.push({ + action: 'skipped', + sourceName: menuName, + sourceId: menuObjid, + targetId: companyFolderId || undefined, + reason: '루트 메뉴 → 회사 폴더와 매핑됨', + }); + continue; + } + + // 이미 연결된 경우 - 실제로 그룹이 존재하는지 확인 + if (menu.screen_group_id) { + const groupExists = existingGroupIds.has(Number(menu.screen_group_id)); + + if (groupExists) { + // 그룹이 존재하면 스킵 + result.skipped++; + result.details.push({ + action: 'skipped', + sourceName: menuName, + sourceId: menuObjid, + targetId: menu.screen_group_id, + reason: '이미 화면그룹과 연결됨', + }); + menuToGroupMap.set(menuObjid, Number(menu.screen_group_id)); + continue; + } else { + // 그룹이 삭제되었으면 연결 해제하고 재생성 + logger.info("삭제된 그룹 연결 해제", { menuObjid, deletedGroupId: menu.screen_group_id }); + await client.query( + `UPDATE menu_info SET screen_group_id = NULL WHERE objid = $1`, + [menuObjid] + ); + // 계속 진행하여 재생성 또는 재연결 + } + } + + const menuNameLower = menuName?.toLowerCase() || ''; + + // 부모 메뉴 이름 조회 (경로 기반 매칭용) + const parentMenu = menusResult.rows.find((m: any) => Number(m.objid) === Number(menu.parent_obj_id)); + const parentMenuName = parentMenu?.menu_name_kor?.trim().toLowerCase() || ''; + const pathKey = parentMenuName ? `${parentMenuName}>${menuNameLower}` : menuNameLower; + + // 경로로 기존 그룹 매칭 시도 (우선순위: 경로 매칭 > 이름 매칭) + let matchedGroup = groupByPath.get(pathKey); + if (!matchedGroup) { + // 경로 매칭 실패시 이름으로 시도 (하위 호환) + matchedGroup = groupByName.get(menuNameLower); + } + + if (matchedGroup) { + // 매칭된 그룹과 연결 + const groupId = Number(matchedGroup.id); + + try { + // menu_info에 screen_group_id 업데이트 + await client.query( + `UPDATE menu_info SET screen_group_id = $1 WHERE objid = $2`, + [groupId, menuObjid] + ); + + // screen_groups에 menu_objid 업데이트 + await client.query( + `UPDATE screen_groups SET menu_objid = $1, updated_date = NOW() WHERE id = $2`, + [menuObjid, groupId] + ); + + menuToGroupMap.set(menuObjid, groupId); + result.linked++; + result.details.push({ + action: 'linked', + sourceName: menuName, + sourceId: menuObjid, + targetId: groupId, + }); + + // 매칭된 그룹은 Map에서 제거 (중복 매칭 방지) + groupByPath.delete(pathKey); + groupByName.delete(menuNameLower); + } catch (linkError: any) { + logger.error("그룹 연결 중 에러", { menuName, menuObjid, groupId, error: linkError.message, stack: linkError.stack }); + throw linkError; + } + + } else { + // 새 screen_group 생성 + // 부모 그룹 ID 결정 + let parentGroupId: number | null = null; + let groupLevel = 1; // 기본값은 1 (회사 폴더 아래) + + // 우선순위 1: menuToGroupMap에서 부모 메뉴의 새 그룹 ID 조회 (같은 트랜잭션에서 생성된 것) + if (menuToGroupMap.has(Number(menu.parent_obj_id))) { + parentGroupId = menuToGroupMap.get(Number(menu.parent_obj_id))!; + } + // 우선순위 2: 부모 메뉴가 루트 메뉴면 회사 폴더 사용 + else if (Number(menu.parent_obj_id) === rootMenuObjid) { + parentGroupId = companyFolderId; + } + // 우선순위 3: 부모 메뉴의 screen_group_id가 있고, 해당 그룹이 실제로 존재하면 사용 + else if (menu.parent_screen_group_id && existingGroupIds.has(Number(menu.parent_screen_group_id))) { + parentGroupId = Number(menu.parent_screen_group_id); + } + + // 부모 그룹의 레벨 조회 + if (parentGroupId) { + const parentLevelQuery = `SELECT group_level FROM screen_groups WHERE id = $1`; + const parentLevelResult = await client.query(parentLevelQuery, [parentGroupId]); + if (parentLevelResult.rows.length > 0) { + groupLevel = (parentLevelResult.rows[0].group_level || 0) + 1; + } + } + + // 같은 부모 아래에서 가장 높은 display_order 조회 후 +1 + let nextDisplayOrder = 1; + const maxOrderQuery = parentGroupId + ? `SELECT COALESCE(MAX(display_order), 0) + 1 as next_order FROM screen_groups WHERE parent_group_id = $1 AND company_code = $2` + : `SELECT COALESCE(MAX(display_order), 0) + 1 as next_order FROM screen_groups WHERE parent_group_id IS NULL AND company_code = $1`; + const maxOrderParams = parentGroupId ? [parentGroupId, companyCode] : [companyCode]; + const maxOrderResult = await client.query(maxOrderQuery, maxOrderParams); + if (maxOrderResult.rows.length > 0) { + nextDisplayOrder = parseInt(maxOrderResult.rows[0].next_order) || 1; + } + + // group_code 생성 (영문명 또는 이름 기반) + const groupCode = (menu.menu_name_eng || menuName || 'group') + .replace(/\s+/g, '_') + .toLowerCase() + .substring(0, 50); + + // screen_groups에 삽입 + const insertGroupQuery = ` + INSERT INTO screen_groups ( + group_name, group_code, parent_group_id, group_level, + display_order, company_code, writer, menu_objid, description + ) VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9) + RETURNING id + `; + + let newGroupId: number; + try { + logger.info("새 그룹 생성 시도", { + menuName, + menuObjid, + groupCode: groupCode + '_' + menuObjid, + parentGroupId, + groupLevel, + nextDisplayOrder, + companyCode, + }); + + const insertResult = await client.query(insertGroupQuery, [ + menuName, + groupCode + '_' + menuObjid, // 고유성 보장 + parentGroupId, + groupLevel, + nextDisplayOrder, + companyCode, + userId, + menuObjid, + menu.menu_desc || null, + ]); + + newGroupId = insertResult.rows[0].id; + } catch (insertError: any) { + logger.error("그룹 생성 중 에러", { + menuName, + menuObjid, + parentGroupId, + groupLevel, + error: insertError.message, + stack: insertError.stack, + code: insertError.code, + detail: insertError.detail, + }); + throw insertError; + } + + // hierarchy_path 업데이트 + let hierarchyPath = `/${newGroupId}/`; + if (parentGroupId) { + const parentPathQuery = `SELECT hierarchy_path FROM screen_groups WHERE id = $1`; + const parentPathResult = await client.query(parentPathQuery, [parentGroupId]); + if (parentPathResult.rows.length > 0 && parentPathResult.rows[0].hierarchy_path) { + hierarchyPath = `${parentPathResult.rows[0].hierarchy_path}${newGroupId}/`.replace('//', '/'); + } + } + await client.query( + `UPDATE screen_groups SET hierarchy_path = $1 WHERE id = $2`, + [hierarchyPath, newGroupId] + ); + + // menu_info에 screen_group_id 업데이트 + await client.query( + `UPDATE menu_info SET screen_group_id = $1 WHERE objid = $2`, + [newGroupId, menuObjid] + ); + + menuToGroupMap.set(menuObjid, newGroupId); + result.created++; + result.details.push({ + action: 'created', + sourceName: menuName, + sourceId: menuObjid, + targetId: newGroupId, + }); + } + } + + await client.query('COMMIT'); + + logger.info("메뉴 → 화면관리 동기화 완료", { + companyCode, + created: result.created, + linked: result.linked, + skipped: result.skipped + }); + + return result; + + } catch (error: any) { + await client.query('ROLLBACK'); + logger.error("메뉴 → 화면관리 동기화 실패", { + companyCode, + error: error.message, + stack: error.stack, + code: error.code, + detail: error.detail, + }); + result.success = false; + result.errors.push(error.message); + return result; + } finally { + client.release(); + } +} + + +// ============================================================ +// 동기화 상태 조회 +// ============================================================ + +/** + * 동기화 상태 조회 + * + * - 연결된 항목 수 + * - 연결 안 된 항목 수 + * - 양방향 비교 + */ +export async function getSyncStatus(companyCode: string): Promise<{ + screenGroups: { total: number; linked: number; unlinked: number }; + menuItems: { total: number; linked: number; unlinked: number }; + potentialMatches: Array<{ menuName: string; groupName: string; similarity: string }>; +}> { + // screen_groups 상태 + const sgQuery = ` + SELECT + COUNT(*) as total, + COUNT(menu_objid) as linked + FROM screen_groups + WHERE company_code = $1 + `; + const sgResult = await pool.query(sgQuery, [companyCode]); + + // menu_info 상태 (사용자 메뉴만, 루트 제외) + const menuQuery = ` + SELECT + COUNT(*) as total, + COUNT(screen_group_id) as linked + FROM menu_info + WHERE company_code = $1 AND menu_type = 1 AND parent_obj_id != 0 + `; + const menuResult = await pool.query(menuQuery, [companyCode]); + + // 이름이 같은 잠재적 매칭 후보 조회 + const matchQuery = ` + SELECT + m.menu_name_kor as menu_name, + sg.group_name + FROM menu_info m + JOIN screen_groups sg ON LOWER(TRIM(m.menu_name_kor)) = LOWER(TRIM(sg.group_name)) + WHERE m.company_code = $1 + AND sg.company_code = $1 + AND m.menu_type = 1 + AND m.screen_group_id IS NULL + AND sg.menu_objid IS NULL + LIMIT 10 + `; + const matchResult = await pool.query(matchQuery, [companyCode]); + + const sgTotal = parseInt(sgResult.rows[0].total); + const sgLinked = parseInt(sgResult.rows[0].linked); + const menuTotal = parseInt(menuResult.rows[0].total); + const menuLinked = parseInt(menuResult.rows[0].linked); + + return { + screenGroups: { + total: sgTotal, + linked: sgLinked, + unlinked: sgTotal - sgLinked, + }, + menuItems: { + total: menuTotal, + linked: menuLinked, + unlinked: menuTotal - menuLinked, + }, + potentialMatches: matchResult.rows.map((row: any) => ({ + menuName: row.menu_name, + groupName: row.group_name, + similarity: 'exact', + })), + }; +} + + +// ============================================================ +// 전체 동기화 (모든 회사) +// ============================================================ + +interface AllCompaniesSyncResult { + success: boolean; + totalCompanies: number; + successCount: number; + failedCount: number; + results: Array<{ + companyCode: string; + companyName: string; + direction: 'screens-to-menus' | 'menus-to-screens'; + created: number; + linked: number; + skipped: number; + success: boolean; + error?: string; + }>; +} + +/** + * 모든 회사에 대해 양방향 동기화 수행 + * + * 로직: + * 1. 모든 회사 조회 + * 2. 각 회사별로 양방향 동기화 수행 + * - 화면관리 → 메뉴 동기화 + * - 메뉴 → 화면관리 동기화 + * 3. 결과 집계 + */ +export async function syncAllCompanies( + userId: string +): Promise { + const result: AllCompaniesSyncResult = { + success: true, + totalCompanies: 0, + successCount: 0, + failedCount: 0, + results: [], + }; + + try { + logger.info("전체 동기화 시작", { userId }); + + // 모든 회사 조회 (최고 관리자 전용 회사 제외) + const companiesQuery = ` + SELECT company_code, company_name + FROM company_mng + WHERE company_code != '*' + ORDER BY company_name + `; + const companiesResult = await pool.query(companiesQuery); + + result.totalCompanies = companiesResult.rows.length; + + // 각 회사별로 양방향 동기화 + for (const company of companiesResult.rows) { + const companyCode = company.company_code; + const companyName = company.company_name; + + try { + // 1. 화면관리 → 메뉴 동기화 + const screensToMenusResult = await syncScreenGroupsToMenu(companyCode, userId); + result.results.push({ + companyCode, + companyName, + direction: 'screens-to-menus', + created: screensToMenusResult.created, + linked: screensToMenusResult.linked, + skipped: screensToMenusResult.skipped, + success: screensToMenusResult.success, + error: screensToMenusResult.errors.length > 0 ? screensToMenusResult.errors.join(', ') : undefined, + }); + + // 2. 메뉴 → 화면관리 동기화 + const menusToScreensResult = await syncMenuToScreenGroups(companyCode, userId); + result.results.push({ + companyCode, + companyName, + direction: 'menus-to-screens', + created: menusToScreensResult.created, + linked: menusToScreensResult.linked, + skipped: menusToScreensResult.skipped, + success: menusToScreensResult.success, + error: menusToScreensResult.errors.length > 0 ? menusToScreensResult.errors.join(', ') : undefined, + }); + + if (screensToMenusResult.success && menusToScreensResult.success) { + result.successCount++; + } else { + result.failedCount++; + } + + } catch (error: any) { + logger.error("회사 동기화 실패", { companyCode, companyName, error: error.message }); + result.results.push({ + companyCode, + companyName, + direction: 'screens-to-menus', + created: 0, + linked: 0, + skipped: 0, + success: false, + error: error.message, + }); + result.failedCount++; + } + } + + logger.info("전체 동기화 완료", { + totalCompanies: result.totalCompanies, + successCount: result.successCount, + failedCount: result.failedCount, + }); + + return result; + + } catch (error: any) { + logger.error("전체 동기화 실패", { error: error.message }); + result.success = false; + return result; + } +} + diff --git a/frontend/app/(main)/admin/screenMng/screenMngList/page.tsx b/frontend/app/(main)/admin/screenMng/screenMngList/page.tsx index 106870eb..cbd74337 100644 --- a/frontend/app/(main)/admin/screenMng/screenMngList/page.tsx +++ b/frontend/app/(main)/admin/screenMng/screenMngList/page.tsx @@ -111,10 +111,15 @@ export default function ScreenManagementPage() { }; // 검색어로 필터링된 화면 - const filteredScreens = screens.filter((screen) => - screen.screenName.toLowerCase().includes(searchTerm.toLowerCase()) || - screen.screenCode.toLowerCase().includes(searchTerm.toLowerCase()) - ); + // 검색어가 여러 키워드(폴더 계층 검색)이면 화면 필터링 없이 모든 화면 표시 + // 단일 키워드면 해당 키워드로 화면 필터링 + const searchKeywords = searchTerm.toLowerCase().trim().split(/\s+/).filter(Boolean); + const filteredScreens = searchKeywords.length > 1 + ? screens // 폴더 계층 검색 시에는 화면 필터링 없음 (폴더에서 이미 필터링됨) + : screens.filter((screen) => + screen.screenName.toLowerCase().includes(searchTerm.toLowerCase()) || + screen.screenCode.toLowerCase().includes(searchTerm.toLowerCase()) + ); // 화면 설계 모드일 때는 레이아웃 없이 전체 화면 사용 if (isDesignMode) { @@ -183,6 +188,7 @@ export default function ScreenManagementPage() { selectedScreen={selectedScreen} onScreenSelect={handleScreenSelect} onScreenDesign={handleDesignScreen} + searchTerm={searchTerm} onGroupSelect={(group) => { setSelectedGroup(group); setSelectedScreen(null); // 화면 선택 해제 diff --git a/frontend/components/screen/CopyScreenModal.tsx b/frontend/components/screen/CopyScreenModal.tsx index 5590cef4..a5207b96 100644 --- a/frontend/components/screen/CopyScreenModal.tsx +++ b/frontend/components/screen/CopyScreenModal.tsx @@ -927,7 +927,7 @@ export default function CopyScreenModal({ if (mode === "group") { return ( - + {/* 로딩 오버레이 */} {isCopying && (
diff --git a/frontend/components/screen/ScreenGroupTreeView.tsx b/frontend/components/screen/ScreenGroupTreeView.tsx index b171bbe1..edd36816 100644 --- a/frontend/components/screen/ScreenGroupTreeView.tsx +++ b/frontend/components/screen/ScreenGroupTreeView.tsx @@ -1,6 +1,6 @@ "use client"; -import { useState, useEffect } from "react"; +import { useState, useEffect, useMemo } from "react"; import { cn } from "@/lib/utils"; import { ChevronRight, @@ -16,6 +16,8 @@ import { Copy, FolderTree, Loader2, + RefreshCw, + Building2, } from "lucide-react"; import { ScreenDefinition } from "@/types/screen"; import { @@ -24,9 +26,17 @@ import { deleteScreenGroup, addScreenToGroup, removeScreenFromGroup, + getMenuScreenSyncStatus, + syncScreenGroupsToMenu, + syncMenuToScreenGroups, + syncAllCompanies, + SyncStatus, + AllCompaniesSyncResult, } from "@/lib/api/screenGroup"; import { Badge } from "@/components/ui/badge"; import { Button } from "@/components/ui/button"; +import { useAuth } from "@/hooks/useAuth"; +import { getCompanyList, Company } from "@/lib/api/company"; import { DropdownMenu, DropdownMenuContent, @@ -88,6 +98,7 @@ interface ScreenGroupTreeViewProps { onGroupSelect?: (group: { id: number; name: string; company_code?: string } | null) => void; onScreenSelectInGroup?: (group: { id: number; name: string; company_code?: string }, screenId: number) => void; companyCode?: string; + searchTerm?: string; // 검색어 (띄어쓰기로 구분된 여러 키워드) } interface TreeNode { @@ -107,6 +118,7 @@ export function ScreenGroupTreeView({ onGroupSelect, onScreenSelectInGroup, companyCode, + searchTerm = "", }: ScreenGroupTreeViewProps) { const [groups, setGroups] = useState([]); const [loading, setLoading] = useState(true); @@ -155,6 +167,24 @@ export function ScreenGroupTreeView({ const [contextMenuGroup, setContextMenuGroup] = useState(null); const [contextMenuGroupPosition, setContextMenuGroupPosition] = useState<{ x: number; y: number } | null>(null); + // 메뉴-화면그룹 동기화 상태 + const [isSyncDialogOpen, setIsSyncDialogOpen] = useState(false); + const [syncStatus, setSyncStatus] = useState(null); + const [isSyncing, setIsSyncing] = useState(false); + const [syncDirection, setSyncDirection] = useState<"screen-to-menu" | "menu-to-screen" | "all" | null>(null); + + // 회사 선택 (최고 관리자용) + const { user } = useAuth(); + const [companies, setCompanies] = useState([]); + const [selectedCompanyCode, setSelectedCompanyCode] = useState(""); + const [isSyncCompanySelectOpen, setIsSyncCompanySelectOpen] = useState(false); + + // 현재 사용자가 최고 관리자인지 확인 + const isSuperAdmin = user?.companyCode === "*"; + + // 실제 사용할 회사 코드 (props → 선택 → 사용자 기본값) + const effectiveCompanyCode = companyCode || selectedCompanyCode || (isSuperAdmin ? "" : user?.companyCode) || ""; + // 그룹 목록 및 그룹별 화면 로드 useEffect(() => { loadGroupsData(); @@ -242,6 +272,124 @@ export function ScreenGroupTreeView({ setIsGroupModalOpen(true); }; + // 동기화 다이얼로그 열기 + const handleOpenSyncDialog = async () => { + setIsSyncDialogOpen(true); + setSyncStatus(null); + setSyncDirection(null); + setSelectedCompanyCode(""); + + // 최고 관리자일 때 회사 목록 로드 + if (isSuperAdmin && companies.length === 0) { + try { + const companiesList = await getCompanyList(); + // 최고 관리자(*)용 회사는 제외 + const filteredCompanies = companiesList.filter(c => c.company_code !== "*"); + setCompanies(filteredCompanies); + } catch (error) { + console.error("회사 목록 로드 실패:", error); + } + } + + // 최고 관리자가 아니면 바로 상태 조회 + if (!isSuperAdmin && user?.companyCode) { + const response = await getMenuScreenSyncStatus(user.companyCode); + if (response.success && response.data) { + setSyncStatus(response.data); + } + } + }; + + // 회사 선택 시 상태 조회 + const handleCompanySelect = async (companyCode: string) => { + setSelectedCompanyCode(companyCode); + setIsSyncCompanySelectOpen(false); + setSyncStatus(null); + + if (companyCode) { + const response = await getMenuScreenSyncStatus(companyCode); + if (response.success && response.data) { + setSyncStatus(response.data); + } else { + toast.error(response.error || "동기화 상태 조회 실패"); + } + } + }; + + // 동기화 실행 + const handleSync = async (direction: "screen-to-menu" | "menu-to-screen") => { + // 사용할 회사 코드 결정 + const targetCompanyCode = isSuperAdmin ? selectedCompanyCode : user?.companyCode; + + if (!targetCompanyCode) { + toast.error("회사를 선택해주세요."); + return; + } + + setIsSyncing(true); + setSyncDirection(direction); + + try { + const response = direction === "screen-to-menu" + ? await syncScreenGroupsToMenu(targetCompanyCode) + : await syncMenuToScreenGroups(targetCompanyCode); + + if (response.success) { + const data = response.data; + toast.success( + `동기화 완료: 생성 ${data?.created || 0}개, 연결 ${data?.linked || 0}개, 스킵 ${data?.skipped || 0}개` + ); + // 그룹 데이터 새로고침 + await loadGroupsData(); + // 동기화 상태 새로고침 + const statusResponse = await getMenuScreenSyncStatus(targetCompanyCode); + if (statusResponse.success && statusResponse.data) { + setSyncStatus(statusResponse.data); + } + } else { + toast.error(`동기화 실패: ${response.error || "알 수 없는 오류"}`); + } + } catch (error: any) { + toast.error(`동기화 실패: ${error.message}`); + } finally { + setIsSyncing(false); + setSyncDirection(null); + } + }; + + // 전체 회사 동기화 (최고 관리자만) + const handleSyncAll = async () => { + if (!isSuperAdmin) { + toast.error("전체 동기화는 최고 관리자만 수행할 수 있습니다."); + return; + } + + setIsSyncing(true); + setSyncDirection("all"); + + try { + const response = await syncAllCompanies(); + + if (response.success && response.data) { + const data = response.data; + toast.success( + `전체 동기화 완료: ${data.totalCompanies}개 회사, 생성 ${data.totalCreated}개, 연결 ${data.totalLinked}개` + ); + // 그룹 데이터 새로고침 + await loadGroupsData(); + // 동기화 다이얼로그 닫기 + setIsSyncDialogOpen(false); + } else { + toast.error(`전체 동기화 실패: ${response.error || "알 수 없는 오류"}`); + } + } catch (error: any) { + toast.error(`전체 동기화 실패: ${error.message}`); + } finally { + setIsSyncing(false); + setSyncDirection(null); + } + }; + // 그룹 수정 버튼 클릭 const handleEditGroup = (group: ScreenGroup, e: React.MouseEvent) => { e.stopPropagation(); @@ -596,6 +744,191 @@ export function ScreenGroupTreeView({ return result; }; + // 검색어로 그룹 필터링 (띄어쓰기로 구분된 여러 키워드 - 계층적 검색) + const getFilteredGroups = useMemo(() => { + if (!searchTerm.trim()) { + return groups; // 검색어가 없으면 모든 그룹 반환 + } + + // 검색어를 띄어쓰기로 분리하고 빈 문자열 제거 + const keywords = searchTerm.toLowerCase().trim().split(/\s+/).filter(k => k.length > 0); + + if (keywords.length === 0) { + return groups; + } + + // 그룹의 조상 ID들을 가져오는 함수 + const getAncestorIds = (groupId: number): Set => { + const ancestors = new Set(); + let current = groups.find(g => g.id === groupId); + while (current?.parent_group_id) { + ancestors.add(current.parent_group_id); + current = groups.find(g => g.id === current!.parent_group_id); + } + return ancestors; + }; + + // 첫 번째 키워드와 일치하는 그룹 찾기 + let currentMatchingIds = new Set(); + for (const group of groups) { + const groupName = group.group_name.toLowerCase(); + if (groupName.includes(keywords[0])) { + currentMatchingIds.add(group.id); + } + } + + // 일치하는 그룹이 없으면 빈 배열 반환 + if (currentMatchingIds.size === 0) { + return []; + } + + // 나머지 키워드들을 순차적으로 처리 (계층적 검색) + for (let i = 1; i < keywords.length; i++) { + const keyword = keywords[i]; + const nextMatchingIds = new Set(); + + for (const group of groups) { + const groupName = group.group_name.toLowerCase(); + if (groupName.includes(keyword)) { + // 이 그룹의 조상 중에 이전 키워드와 일치하는 그룹이 있는지 확인 + const ancestors = getAncestorIds(group.id); + const hasMatchingAncestor = Array.from(currentMatchingIds).some(id => + ancestors.has(id) || id === group.id + ); + + if (hasMatchingAncestor) { + nextMatchingIds.add(group.id); + } + } + } + + // 매칭되는 게 있으면 업데이트, 없으면 이전 결과 유지 + if (nextMatchingIds.size > 0) { + // 이전 키워드 매칭도 유지 (상위 폴더 표시를 위해) + nextMatchingIds.forEach(id => currentMatchingIds.add(id)); + currentMatchingIds = nextMatchingIds; + } + } + + // 최종 매칭 결과 + const finalMatchingIds = currentMatchingIds; + + // 표시할 그룹 ID 집합 + const groupsToShow = new Set(); + + // 일치하는 그룹의 상위 그룹들도 포함 (계층 유지를 위해) + const addParents = (groupId: number) => { + const group = groups.find(g => g.id === groupId); + if (group) { + groupsToShow.add(group.id); + if (group.parent_group_id) { + addParents(group.parent_group_id); + } + } + }; + + // 하위 그룹들을 추가하는 함수 + const addChildren = (groupId: number) => { + const children = groups.filter(g => g.parent_group_id === groupId); + for (const child of children) { + groupsToShow.add(child.id); + addChildren(child.id); + } + }; + + // 최종 매칭 그룹들의 상위 추가 + for (const groupId of finalMatchingIds) { + addParents(groupId); + } + + // 마지막 키워드와 일치하는 그룹의 하위만 추가 + for (const groupId of finalMatchingIds) { + addChildren(groupId); + } + + // 필터링된 그룹만 반환 + return groups.filter(g => groupsToShow.has(g.id)); + }, [groups, searchTerm]); + + // 검색 시 해당 그룹이 일치하는지 확인 (하이라이트용) + const isGroupMatchingSearch = (groupName: string): boolean => { + if (!searchTerm.trim()) return false; + const keywords = searchTerm.toLowerCase().trim().split(/\s+/).filter(k => k.length > 0); + const name = groupName.toLowerCase(); + return keywords.some(keyword => name.includes(keyword)); + }; + + // 검색 시 해당 그룹이 자동으로 펼쳐져야 하는지 확인 + // (검색어와 일치하는 그룹의 상위 + 마지막 검색어와 일치하는 그룹도 자동 펼침) + const shouldAutoExpandForSearch = useMemo(() => { + if (!searchTerm.trim()) return new Set(); + + const keywords = searchTerm.toLowerCase().trim().split(/\s+/).filter(k => k.length > 0); + if (keywords.length === 0) return new Set(); + + // 그룹의 조상 ID들을 가져오는 함수 + const getAncestorIds = (groupId: number): Set => { + const ancestors = new Set(); + let current = groups.find(g => g.id === groupId); + while (current?.parent_group_id) { + ancestors.add(current.parent_group_id); + current = groups.find(g => g.id === current!.parent_group_id); + } + return ancestors; + }; + + // 계층적 검색으로 최종 일치 그룹 찾기 (getFilteredGroups와 동일한 로직) + let currentMatchingIds = new Set(); + for (const group of groups) { + const groupName = group.group_name.toLowerCase(); + if (groupName.includes(keywords[0])) { + currentMatchingIds.add(group.id); + } + } + + for (let i = 1; i < keywords.length; i++) { + const keyword = keywords[i]; + const nextMatchingIds = new Set(); + + for (const group of groups) { + const groupName = group.group_name.toLowerCase(); + if (groupName.includes(keyword)) { + const ancestors = getAncestorIds(group.id); + const hasMatchingAncestor = Array.from(currentMatchingIds).some(id => + ancestors.has(id) || id === group.id + ); + + if (hasMatchingAncestor) { + nextMatchingIds.add(group.id); + } + } + } + + if (nextMatchingIds.size > 0) { + nextMatchingIds.forEach(id => currentMatchingIds.add(id)); + currentMatchingIds = nextMatchingIds; + } + } + + // 자동 펼침 대상: 일치 그룹의 상위 + 일치 그룹 자체 + const autoExpandIds = new Set(); + + const addParents = (groupId: number) => { + const group = groups.find(g => g.id === groupId); + if (group?.parent_group_id) { + autoExpandIds.add(group.parent_group_id); + addParents(group.parent_group_id); + } + }; + + for (const groupId of currentMatchingIds) { + autoExpandIds.add(groupId); // 일치하는 그룹 자체도 펼침 (화면 표시를 위해) + addParents(groupId); + } + + return autoExpandIds; + }, [groups, searchTerm]); + // 그룹 데이터 새로고침 const loadGroupsData = async () => { try { @@ -635,8 +968,8 @@ export function ScreenGroupTreeView({ return (
- {/* 그룹 추가 버튼 */} -
+ {/* 그룹 추가 & 동기화 버튼 */} +
+
{/* 트리 목록 */}
+ {/* 검색 결과 없음 표시 */} + {searchTerm.trim() && getFilteredGroups.length === 0 && ( +
+ "{searchTerm}"와 일치하는 폴더가 없습니다 +
+ )} + {/* 그룹화된 화면들 (대분류만 먼저 렌더링) */} - {groups + {getFilteredGroups .filter((g) => !(g as any).parent_group_id) // 대분류만 (parent_group_id가 null) .map((group) => { const groupId = String(group.id); - const isExpanded = expandedGroups.has(groupId); + const isExpanded = expandedGroups.has(groupId) || shouldAutoExpandForSearch.has(group.id); // 검색 시 상위 그룹만 자동 확장 const groupScreens = getScreensInGroup(group.id); + const isMatching = isGroupMatchingSearch(group.group_name); // 검색어 일치 여부 - // 하위 그룹들 찾기 - const childGroups = groups.filter((g) => (g as any).parent_group_id === group.id); + // 하위 그룹들 찾기 (필터링된 그룹에서만) + const childGroups = getFilteredGroups.filter((g) => (g as any).parent_group_id === group.id); return (
@@ -667,7 +1017,8 @@ export function ScreenGroupTreeView({
toggleGroup(groupId)} onContextMenu={(e) => handleGroupContextMenu(e, group)} @@ -682,7 +1033,7 @@ export function ScreenGroupTreeView({ ) : ( )} - {group.group_name} + {group.group_name} {groupScreens.length} @@ -719,11 +1070,12 @@ export function ScreenGroupTreeView({
{childGroups.map((childGroup) => { const childGroupId = String(childGroup.id); - const isChildExpanded = expandedGroups.has(childGroupId); + const isChildExpanded = expandedGroups.has(childGroupId) || shouldAutoExpandForSearch.has(childGroup.id); // 검색 시 상위 그룹만 자동 확장 const childScreens = getScreensInGroup(childGroup.id); + const isChildMatching = isGroupMatchingSearch(childGroup.group_name); - // 손자 그룹들 (3단계) - const grandChildGroups = groups.filter((g) => (g as any).parent_group_id === childGroup.id); + // 손자 그룹들 (3단계) - 필터링된 그룹에서만 + const grandChildGroups = getFilteredGroups.filter((g) => (g as any).parent_group_id === childGroup.id); return (
@@ -731,7 +1083,8 @@ export function ScreenGroupTreeView({
toggleGroup(childGroupId)} onContextMenu={(e) => handleGroupContextMenu(e, childGroup)} @@ -746,7 +1099,7 @@ export function ScreenGroupTreeView({ ) : ( )} - {childGroup.group_name} + {childGroup.group_name} {childScreens.length} @@ -782,8 +1135,9 @@ export function ScreenGroupTreeView({
{grandChildGroups.map((grandChild) => { const grandChildId = String(grandChild.id); - const isGrandExpanded = expandedGroups.has(grandChildId); + const isGrandExpanded = expandedGroups.has(grandChildId) || shouldAutoExpandForSearch.has(grandChild.id); // 검색 시 상위 그룹만 자동 확장 const grandScreens = getScreensInGroup(grandChild.id); + const isGrandMatching = isGroupMatchingSearch(grandChild.group_name); return (
@@ -791,7 +1145,8 @@ export function ScreenGroupTreeView({
toggleGroup(grandChildId)} onContextMenu={(e) => handleGroupContextMenu(e, grandChild)} @@ -806,7 +1161,7 @@ export function ScreenGroupTreeView({ ) : ( )} - {grandChild.group_name} + {grandChild.group_name} {grandScreens.length} @@ -1459,6 +1814,206 @@ export function ScreenGroupTreeView({ )} + {/* 메뉴-화면그룹 동기화 다이얼로그 */} + + + + 메뉴-화면 동기화 + + 화면관리의 폴더 구조와 메뉴관리를 연동합니다. + + + + {/* 최고 관리자: 회사 선택 */} + {isSuperAdmin && ( +
+ + + + + + + + + + 회사를 찾을 수 없습니다. + + {companies.map((company) => ( + handleCompanySelect(company.company_code)} + className="text-sm" + > + + {company.company_name} + + ))} + + + + + +
+ )} + + {/* 현재 상태 표시 */} + {syncStatus ? ( +
+
+
+
화면관리
+
{syncStatus.screenGroups.total}개
+
+ 연결됨: {syncStatus.screenGroups.linked} / 미연결: {syncStatus.screenGroups.unlinked} +
+
+
+
사용자 메뉴
+
{syncStatus.menuItems.total}개
+
+ 연결됨: {syncStatus.menuItems.linked} / 미연결: {syncStatus.menuItems.unlinked} +
+
+
+ + {syncStatus.potentialMatches.length > 0 && ( +
+
자동 매칭 가능 ({syncStatus.potentialMatches.length}개)
+
+ {syncStatus.potentialMatches.slice(0, 5).map((match, i) => ( +
+ {match.menuName} = {match.groupName} +
+ ))} + {syncStatus.potentialMatches.length > 5 && ( +
...외 {syncStatus.potentialMatches.length - 5}개
+ )} +
+
+ )} + + {/* 동기화 버튼 */} +
+ + +
+ + {/* 전체 동기화 (최고 관리자만) */} + {isSuperAdmin && ( +
+ +
+ )} +
+ ) : isSuperAdmin && !selectedCompanyCode ? ( +
+ +

+ 개별 회사 동기화를 하려면 회사를 선택해주세요. +

+ + {/* 전체 회사 동기화 버튼 (회사 선택 없이도 표시) */} +
+ +
+
+ ) : ( +
+ +
+ )} + + + + + + +
); } \ No newline at end of file diff --git a/frontend/components/screen/panels/DataFlowPanel.tsx b/frontend/components/screen/panels/DataFlowPanel.tsx index 4b31d1a9..1fdf0ec8 100644 --- a/frontend/components/screen/panels/DataFlowPanel.tsx +++ b/frontend/components/screen/panels/DataFlowPanel.tsx @@ -462,3 +462,4 @@ export default function DataFlowPanel({ groupId, screenId, screens = [] }: DataF + diff --git a/frontend/components/screen/panels/FieldJoinPanel.tsx b/frontend/components/screen/panels/FieldJoinPanel.tsx index 884ac69b..29891228 100644 --- a/frontend/components/screen/panels/FieldJoinPanel.tsx +++ b/frontend/components/screen/panels/FieldJoinPanel.tsx @@ -414,3 +414,4 @@ export default function FieldJoinPanel({ screenId, componentId, layoutId }: Fiel + diff --git a/frontend/lib/api/screenGroup.ts b/frontend/lib/api/screenGroup.ts index 65294444..0a91f907 100644 --- a/frontend/lib/api/screenGroup.ts +++ b/frontend/lib/api/screenGroup.ts @@ -498,3 +498,97 @@ export async function getScreenSubTables( } } + +// ============================================================ +// 메뉴-화면그룹 동기화 API +// ============================================================ + +export interface SyncDetail { + action: 'created' | 'linked' | 'skipped' | 'error'; + sourceName: string; + sourceId: number | string; + targetId?: number | string; + reason?: string; +} + +export interface SyncResult { + success: boolean; + created: number; + linked: number; + skipped: number; + errors: string[]; + details: SyncDetail[]; +} + +export interface SyncStatus { + screenGroups: { total: number; linked: number; unlinked: number }; + menuItems: { total: number; linked: number; unlinked: number }; + potentialMatches: Array<{ menuName: string; groupName: string; similarity: string }>; +} + +// 동기화 상태 조회 +export async function getMenuScreenSyncStatus( + targetCompanyCode?: string +): Promise> { + try { + const queryParams = targetCompanyCode ? `?targetCompanyCode=${targetCompanyCode}` : ''; + const response = await apiClient.get(`/screen-groups/sync/status${queryParams}`); + return response.data; + } catch (error: any) { + return { success: false, error: error.message }; + } +} + +// 화면관리 → 메뉴 동기화 +export async function syncScreenGroupsToMenu( + targetCompanyCode?: string +): Promise> { + try { + const response = await apiClient.post("/screen-groups/sync/screen-to-menu", { targetCompanyCode }); + return response.data; + } catch (error: any) { + return { success: false, error: error.message }; + } +} + +// 메뉴 → 화면관리 동기화 +export async function syncMenuToScreenGroups( + targetCompanyCode?: string +): Promise> { + try { + const response = await apiClient.post("/screen-groups/sync/menu-to-screen", { targetCompanyCode }); + return response.data; + } catch (error: any) { + return { success: false, error: error.message }; + } +} + +// 전체 동기화 결과 타입 +export interface AllCompaniesSyncResult { + totalCompanies: number; + successCount: number; + failedCount: number; + totalCreated: number; + totalLinked: number; + details: Array<{ + companyCode: string; + companyName: string; + direction: 'screens-to-menus' | 'menus-to-screens'; + created: number; + linked: number; + skipped: number; + success: boolean; + error?: string; + }>; +} + +// 전체 회사 동기화 (최고 관리자만) +export async function syncAllCompanies(): Promise> { + try { + const response = await apiClient.post("/screen-groups/sync/all"); + return response.data; + } catch (error: any) { + return { success: false, error: error.message }; + } +} +