공통코드 수정중

frontend/components/unified/UnifiedSelect.tsx

@@ -12,7 +12,7 @@
  * - swap: 스왑 선택 (좌우 이동)
  */
 
-import React, { forwardRef, useCallback, useEffect, useMemo, useState } from "react";
+import React, { forwardRef, useCallback, useContext, useEffect, useMemo, useState } from "react";
 import { Label } from "@/components/ui/label";
 import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
 import { Checkbox } from "@/components/ui/checkbox";
@@ -26,6 +26,7 @@ import { cn } from "@/lib/utils";
 import { UnifiedSelectProps, SelectOption } from "@/types/unified-components";
 import { Check, ChevronsUpDown, X, ArrowLeftRight } from "lucide-react";
 import { apiClient } from "@/lib/api/client";
+import UnifiedFormContext from "./UnifiedFormContext";
 
 /**
  * 드롭다운 선택 컴포넌트
@@ -463,20 +464,56 @@ export const UnifiedSelect = forwardRef<HTMLDivElement, UnifiedSelectProps>(
     const [optionsLoaded, setOptionsLoaded] = useState(false);
 
     // 옵션 로딩에 필요한 값들만 추출 (객체 참조 대신 원시값 사용)
-    const source = config.source;
+    // category 소스는 code로 자동 변환 (카테고리 → 공통코드 통합)
+    const rawSource = config.source;
+    const categoryTable = (config as any).categoryTable;
+    const categoryColumn = (config as any).categoryColumn;
+    
+    // category 소스인 경우 code로 변환하고 codeGroup을 자동 생성
+    const source = rawSource === "category" ? "code" : rawSource;
+    const codeGroup = rawSource === "category" && categoryTable && categoryColumn
+      ? `${categoryTable.toUpperCase()}_${categoryColumn.toUpperCase()}`
+      : config.codeGroup;
+    
     const entityTable = config.entityTable;
     const entityValueColumn = config.entityValueColumn || config.entityValueField;
     const entityLabelColumn = config.entityLabelColumn || config.entityLabelField;
-    const codeGroup = config.codeGroup;
     const table = config.table;
     const valueColumn = config.valueColumn;
     const labelColumn = config.labelColumn;
     const apiEndpoint = config.apiEndpoint;
     const staticOptions = config.options;
+    
+    // 계층 코드 연쇄 선택 관련
+    const hierarchical = config.hierarchical;
+    const parentField = config.parentField;
+    
+    // FormContext에서 부모 필드 값 가져오기 (Context가 없으면 null)
+    const formContext = useContext(UnifiedFormContext);
+    
+    // 부모 필드의 값 계산
+    const parentValue = useMemo(() => {
+      if (!hierarchical || !parentField) return null;
+      
+      // FormContext가 있으면 거기서 값 가져오기
+      if (formContext) {
+        const val = formContext.getValue(parentField);
+        return val as string | null;
+      }
+      
+      return null;
+    }, [hierarchical, parentField, formContext]);
 
     // 데이터 소스에 따른 옵션 로딩 (원시값 의존성만 사용)
     useEffect(() => {
-      // 이미 로드된 경우 스킵 (static 제외)
+      // 계층 구조인 경우 부모 값이 변경되면 다시 로드
+      if (hierarchical && source === "code") {
+        setOptionsLoaded(false);
+      }
+    }, [parentValue, hierarchical, source]);
+
+    useEffect(() => {
+      // 이미 로드된 경우 스킵 (static 제외, 계층 구조 제외)
       if (optionsLoaded && source !== "static") {
         return;
       }
@@ -493,14 +530,32 @@ export const UnifiedSelect = forwardRef<HTMLDivElement, UnifiedSelectProps>(
           let fetchedOptions: SelectOption[] = [];
 
           if (source === "code" && codeGroup) {
-            // 공통코드에서 로드
-            const response = await apiClient.get(`/common-codes/${codeGroup}/items`);
-            const data = response.data;
-            if (data.success && data.data) {
-              fetchedOptions = data.data.map((item: { code: string; codeName: string }) => ({
-                value: item.code,
-                label: item.codeName,
-              }));
+            // 계층 구조 사용 시 자식 코드만 로드
+            if (hierarchical) {
+              const params = new URLSearchParams();
+              if (parentValue) {
+                params.append("parentCodeValue", parentValue);
+              }
+              const queryString = params.toString();
+              const url = `/common-codes/categories/${codeGroup}/children${queryString ? `?${queryString}` : ""}`;
+              const response = await apiClient.get(url);
+              const data = response.data;
+              if (data.success && data.data) {
+                fetchedOptions = data.data.map((item: { value: string; label: string; hasChildren: boolean }) => ({
+                  value: item.value,
+                  label: item.label,
+                }));
+              }
+            } else {
+              // 일반 공통코드에서 로드
+              const response = await apiClient.get(`/common-codes/${codeGroup}/items`);
+              const data = response.data;
+              if (data.success && data.data) {
+                fetchedOptions = data.data.map((item: { code: string; codeName: string }) => ({
+                  value: item.code,
+                  label: item.codeName,
+                }));
+              }
             }
           } else if (source === "db" && table) {
             // DB 테이블에서 로드
@@ -547,8 +602,8 @@ export const UnifiedSelect = forwardRef<HTMLDivElement, UnifiedSelectProps>(
         }
       };
 
-      loadOptions();
-    }, [source, entityTable, entityValueColumn, entityLabelColumn, codeGroup, table, valueColumn, labelColumn, apiEndpoint, staticOptions, optionsLoaded]);
+        loadOptions();
+    }, [source, entityTable, entityValueColumn, entityLabelColumn, codeGroup, table, valueColumn, labelColumn, apiEndpoint, staticOptions, optionsLoaded, hierarchical, parentValue]);
 
     // 모드별 컴포넌트 렌더링
     const renderSelect = () => {