From de7fa7a71bdd21b7392d7a6a07841aad267d0653 Mon Sep 17 00:00:00 2001
From: SeongHyun Kim <kksh7842@gmail.com>
Date: Thu, 15 Jan 2026 14:36:00 +0900
Subject: [PATCH 1/6] =?UTF-8?q?fix:=20=EB=B0=9C=EC=A3=BC/=EC=9E=85?=
 =?UTF-8?q?=EA=B3=A0=EA=B4=80=EB=A6=AC=20=EA=B7=B8=EB=A3=B9=20=ED=8E=B8?=
 =?UTF-8?q?=EC=A7=91=20=EC=8B=9C=20=EB=8B=A8=EA=B1=B4=EB=A7=8C=20=EC=A0=80?=
 =?UTF-8?q?=EC=9E=A5=EB=90=98=EB=8D=98=20=EB=AC=B8=EC=A0=9C=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95=20EditModal.tsx:=20conditional-container=20=EC=A1=B4?=
 =?UTF-8?q?=EC=9E=AC=20=EC=8B=9C=20onSave=20=EB=AF=B8=EC=A0=84=EB=8B=AC=20?=
 =?UTF-8?q?=EB=A1=9C=EC=A7=81=20=EC=88=98=EC=A0=95=20ModalRepeaterTableCom?=
 =?UTF-8?q?ponent.tsx:=20groupedData=20prop=20=EC=9A=B0=EC=84=A0=20?=
 =?UTF-8?q?=EC=82=AC=EC=9A=A9=ED=95=98=EB=8F=84=EB=A1=9D=20=EB=B3=80?=
 =?UTF-8?q?=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/components/screen/EditModal.tsx      | 36 ++++++-------------
 .../ModalRepeaterTableComponent.tsx           | 16 +++++++--
 2 files changed, 23 insertions(+), 29 deletions(-)

diff --git a/frontend/components/screen/EditModal.tsx b/frontend/components/screen/EditModal.tsx
index b3c94ade..7c722ad6 100644
--- a/frontend/components/screen/EditModal.tsx
+++ b/frontend/components/screen/EditModal.tsx
@@ -309,17 +309,10 @@ export const EditModal: React.FC<EditModalProps> = ({ className }) => {
   // 🆕 그룹 데이터 조회 함수
   const loadGroupData = async () => {
     if (!modalState.tableName || !modalState.groupByColumns || modalState.groupByColumns.length === 0) {
-      // console.warn("테이블명 또는 그룹핑 컬럼이 없습니다.");
       return;
     }
 
     try {
-      // console.log("🔍 그룹 데이터 조회 시작:", {
-      //   tableName: modalState.tableName,
-      //   groupByColumns: modalState.groupByColumns,
-      //   editData: modalState.editData,
-      // });
-
       // 그룹핑 컬럼 값 추출 (예: order_no = "ORD-20251124-001")
       const groupValues: Record<string, any> = {};
       modalState.groupByColumns.forEach((column) => {
@@ -329,15 +322,9 @@ export const EditModal: React.FC<EditModalProps> = ({ className }) => {
       });
 
       if (Object.keys(groupValues).length === 0) {
-        // console.warn("그룹핑 컬럼 값이 없습니다:", modalState.groupByColumns);
         return;
       }
 
-      // console.log("🔍 그룹 조회 요청:", {
-      //   tableName: modalState.tableName,
-      //   groupValues,
-      // });
-
       // 같은 그룹의 모든 레코드 조회 (entityJoinApi 사용)
       const { entityJoinApi } = await import("@/lib/api/entityJoin");
       const response = await entityJoinApi.getTableDataWithJoins(modalState.tableName, {
@@ -347,23 +334,19 @@ export const EditModal: React.FC<EditModalProps> = ({ className }) => {
         enableEntityJoin: true,
       });
 
-      // console.log("🔍 그룹 조회 응답:", response);
-
       // entityJoinApi는 배열 또는 { data: [] } 형식으로 반환
       const dataArray = Array.isArray(response) ? response : response?.data || [];
 
       if (dataArray.length > 0) {
-        // console.log("✅ 그룹 데이터 조회 성공:", dataArray.length, "건");
         setGroupData(dataArray);
         setOriginalGroupData(JSON.parse(JSON.stringify(dataArray))); // Deep copy
         toast.info(`${dataArray.length}개의 관련 품목을 불러왔습니다.`);
       } else {
-        console.warn("그룹 데이터가 없습니다:", response);
         setGroupData([modalState.editData]); // 기본값: 선택된 행만
         setOriginalGroupData([JSON.parse(JSON.stringify(modalState.editData))]);
       }
     } catch (error: any) {
-      console.error("❌ 그룹 데이터 조회 오류:", error);
+      console.error("그룹 데이터 조회 오류:", error);
       toast.error("관련 데이터를 불러오는 중 오류가 발생했습니다.");
       setGroupData([modalState.editData]); // 기본값: 선택된 행만
       setOriginalGroupData([JSON.parse(JSON.stringify(modalState.editData))]);
@@ -1043,17 +1026,18 @@ export const EditModal: React.FC<EditModalProps> = ({ className }) => {
                 const groupedDataProp = groupData.length > 0 ? groupData : undefined;
 
                 // 🆕 UniversalFormModal이 있는지 확인 (자체 저장 로직 사용)
-                // 최상위 컴포넌트 또는 조건부 컨테이너 내부 화면에 universal-form-modal이 있는지 확인
+                // 최상위 컴포넌트에 universal-form-modal이 있는지 확인
+                // ⚠️ 수정: conditional-container는 제외 (groupData가 있으면 EditModal.handleSave 사용)
                 const hasUniversalFormModal = screenData.components.some(
                   (c) => {
-                    // 최상위에 universal-form-modal이 있는 경우
+                    // 최상위에 universal-form-modal이 있는 경우만 자체 저장 로직 사용
                     if (c.componentType === "universal-form-modal") return true;
-                    // 조건부 컨테이너 내부에 universal-form-modal이 있는 경우
-                    // (조건부 컨테이너가 있으면 내부 화면에서 universal-form-modal을 사용하는 것으로 가정)
-                    if (c.componentType === "conditional-container") return true;
                     return false;
                   }
                 );
+                
+                // 🆕 그룹 데이터가 있으면 EditModal.handleSave 사용 (일괄 저장)
+                const shouldUseEditModalSave = groupData.length > 0 || !hasUniversalFormModal;
 
                 // 🔑 첨부파일 컴포넌트가 행(레코드) 단위로 파일을 저장할 수 있도록 tableName 추가
                 const enrichedFormData = {
@@ -1095,9 +1079,9 @@ export const EditModal: React.FC<EditModalProps> = ({ className }) => {
                       id: modalState.screenId!,
                       tableName: screenData.screenInfo?.tableName,
                     }}
-                    // 🆕 UniversalFormModal이 있으면 onSave 전달 안 함 (자체 저장 로직 사용)
-                    // ModalRepeaterTable만 있으면 기존대로 onSave 전달 (호환성 유지)
-                    onSave={hasUniversalFormModal ? undefined : handleSave}
+                    // 🆕 그룹 데이터가 있거나 UniversalFormModal이 없으면 EditModal.handleSave 사용
+                    // groupData가 있으면 일괄 저장을 위해 반드시 EditModal.handleSave 사용
+                    onSave={shouldUseEditModalSave ? handleSave : undefined}
                     isInModal={true}
                     // 🆕 그룹 데이터를 ModalRepeaterTable에 전달
                     groupedData={groupedDataProp}
diff --git a/frontend/lib/registry/components/modal-repeater-table/ModalRepeaterTableComponent.tsx b/frontend/lib/registry/components/modal-repeater-table/ModalRepeaterTableComponent.tsx
index 2caf1332..153cebdf 100644
--- a/frontend/lib/registry/components/modal-repeater-table/ModalRepeaterTableComponent.tsx
+++ b/frontend/lib/registry/components/modal-repeater-table/ModalRepeaterTableComponent.tsx
@@ -180,8 +180,11 @@ export function ModalRepeaterTableComponent({
   filterCondition: propFilterCondition,
   companyCode: propCompanyCode,
   
+  // 🆕 그룹 데이터 (EditModal에서 전달, 같은 그룹의 여러 품목)
+  groupedData,
+  
   ...props
-}: ModalRepeaterTableComponentProps) {
+}: ModalRepeaterTableComponentProps & { groupedData?: Record<string, any>[] }) {
   // ✅ config 또는 component.config 또는 개별 prop 우선순위로 병합
   const componentConfig = {
     ...config,
@@ -208,9 +211,16 @@ export function ModalRepeaterTableComponent({
   // 모달 필터 설정
   const modalFilters = componentConfig?.modalFilters || [];
   
-  // ✅ value는 formData[columnName] 우선, 없으면 prop 사용
+  // ✅ value는 groupedData 우선, 없으면 formData[columnName], 없으면 prop 사용
   const columnName = component?.columnName;
-  const externalValue = (columnName && formData?.[columnName]) || componentConfig?.value || propValue || [];
+  
+  // 🆕 groupedData가 전달되면 (EditModal에서 그룹 조회 결과) 우선 사용
+  const externalValue = (() => {
+    if (groupedData && groupedData.length > 0) {
+      return groupedData;
+    }
+    return (columnName && formData?.[columnName]) || componentConfig?.value || propValue || [];
+  })();
   
   // 빈 객체 판단 함수 (수정 모달의 실제 데이터는 유지)
   const isEmptyRow = (item: any): boolean => {

From d4b5bdd835244c6e9b43101611ed62ef38787477 Mon Sep 17 00:00:00 2001
From: SeongHyun Kim <kksh7842@gmail.com>
Date: Mon, 19 Jan 2026 13:18:17 +0900
Subject: [PATCH 2/6] =?UTF-8?q?feat:=20RepeaterInput=20=ED=95=98=EC=9C=84?=
 =?UTF-8?q?=20=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EC=A1=B0=ED=9A=8C=20=EC=BB=AC?=
 =?UTF-8?q?=EB=9F=BC=20=EC=84=A4=EC=A0=95=20=EA=B8=B0=EB=8A=A5=20=EA=B0=9C?=
 =?UTF-8?q?=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 표시 컬럼 순서 변경 기능 추가 (columnOrder)
- 조회 컬럼 -> 저장 컬럼 매핑 기능 추가 (fieldMappings)
- 컬럼별 라벨, 순서, 저장 여부 통합 설정 UI 구현
- 하위 호환성 유지 (fieldMappings 없으면 기존 로직 사용)
---
 .../components/webtypes/RepeaterInput.tsx     |  32 ++-
 .../webtypes/config/RepeaterConfigPanel.tsx   | 196 +++++++++++++++++-
 .../SubDataLookupPanel.tsx                    |  16 +-
 .../repeater-field-group/useSubDataLookup.ts  |  12 +-
 frontend/types/repeater.ts                    |  10 +
 5 files changed, 252 insertions(+), 14 deletions(-)

diff --git a/frontend/components/webtypes/RepeaterInput.tsx b/frontend/components/webtypes/RepeaterInput.tsx
index 7cd4b279..49751699 100644
--- a/frontend/components/webtypes/RepeaterInput.tsx
+++ b/frontend/components/webtypes/RepeaterInput.tsx
@@ -309,18 +309,32 @@ export const RepeaterInput: React.FC<RepeaterInputProps> = ({
         _subDataMaxValue: maxValue,
       };
 
-      // 선택된 하위 데이터의 필드 값을 상위 item에 복사 (설정된 경우)
-      // 예: warehouse_code, location_code 등
-      if (subDataLookup.lookup.displayColumns) {
-        subDataLookup.lookup.displayColumns.forEach((col) => {
-          if (selectedItem[col] !== undefined) {
-            // 필드가 정의되어 있으면 복사
-            const fieldDef = fields.find((f) => f.name === col);
-            if (fieldDef || col.includes("_code") || col.includes("_id")) {
-              newItems[itemIndex][col] = selectedItem[col];
+      // fieldMappings가 설정되어 있으면 매핑에 따라 값 복사
+      if (subDataLookup.lookup.fieldMappings && subDataLookup.lookup.fieldMappings.length > 0) {
+        subDataLookup.lookup.fieldMappings.forEach((mapping) => {
+          if (mapping.targetField && mapping.targetField !== "") {
+            // 매핑된 타겟 필드에 소스 컬럼 값 복사
+            const sourceValue = selectedItem[mapping.sourceColumn];
+            if (sourceValue !== undefined) {
+              newItems[itemIndex][mapping.targetField] = sourceValue;
             }
           }
         });
+      } else {
+        // fieldMappings가 없으면 기존 로직 (하위 호환성)
+        // 선택된 하위 데이터의 필드 값을 상위 item에 복사 (설정된 경우)
+        // 예: warehouse_code, location_code 등
+        if (subDataLookup.lookup.displayColumns) {
+          subDataLookup.lookup.displayColumns.forEach((col) => {
+            if (selectedItem[col] !== undefined) {
+              // 필드가 정의되어 있으면 복사
+              const fieldDef = fields.find((f) => f.name === col);
+              if (fieldDef || col.includes("_code") || col.includes("_id")) {
+                newItems[itemIndex][col] = selectedItem[col];
+              }
+            }
+          });
+        }
       }
 
       setItems(newItems);
diff --git a/frontend/components/webtypes/config/RepeaterConfigPanel.tsx b/frontend/components/webtypes/config/RepeaterConfigPanel.tsx
index 97e20574..857ece17 100644
--- a/frontend/components/webtypes/config/RepeaterConfigPanel.tsx
+++ b/frontend/components/webtypes/config/RepeaterConfigPanel.tsx
@@ -319,6 +319,103 @@ export const RepeaterConfigPanel: React.FC<RepeaterConfigPanelProps> = ({
     });
   };
 
+  // 표시 컬럼 순서 가져오기 (columnOrder가 있으면 사용, 없으면 displayColumns 순서)
+  const getOrderedDisplayColumns = (): string[] => {
+    const displayColumns = config.subDataLookup?.lookup?.displayColumns || [];
+    const columnOrder = config.subDataLookup?.lookup?.columnOrder;
+    
+    if (columnOrder && columnOrder.length > 0) {
+      // columnOrder에 있는 컬럼만, 순서대로 반환 (displayColumns에 있는 것만)
+      const orderedCols = columnOrder.filter(col => displayColumns.includes(col));
+      // columnOrder에 없지만 displayColumns에 있는 컬럼 추가
+      const remainingCols = displayColumns.filter(col => !columnOrder.includes(col));
+      return [...orderedCols, ...remainingCols];
+    }
+    return displayColumns;
+  };
+
+  // 표시 컬럼 순서 변경 핸들러 (위로)
+  const handleDisplayColumnMoveUp = (columnName: string) => {
+    const orderedColumns = getOrderedDisplayColumns();
+    const index = orderedColumns.indexOf(columnName);
+    if (index <= 0) return;
+    
+    const newOrder = [...orderedColumns];
+    [newOrder[index - 1], newOrder[index]] = [newOrder[index], newOrder[index - 1]];
+    handleSubDataLookupChange("lookup.columnOrder", newOrder);
+  };
+
+  // 표시 컬럼 순서 변경 핸들러 (아래로)
+  const handleDisplayColumnMoveDown = (columnName: string) => {
+    const orderedColumns = getOrderedDisplayColumns();
+    const index = orderedColumns.indexOf(columnName);
+    if (index < 0 || index >= orderedColumns.length - 1) return;
+    
+    const newOrder = [...orderedColumns];
+    [newOrder[index], newOrder[index + 1]] = [newOrder[index + 1], newOrder[index]];
+    handleSubDataLookupChange("lookup.columnOrder", newOrder);
+  };
+
+  // 표시 컬럼 토글 시 columnOrder도 업데이트
+  const handleDisplayColumnToggleWithOrder = (columnName: string, checked: boolean) => {
+    const currentColumns = config.subDataLookup?.lookup?.displayColumns || [];
+    const currentOrder = config.subDataLookup?.lookup?.columnOrder || [];
+    const currentMappings = config.subDataLookup?.lookup?.fieldMappings || [];
+    
+    let newColumns: string[];
+    let newOrder: string[];
+    let newMappings: { sourceColumn: string; targetField: string }[];
+    
+    if (checked) {
+      newColumns = [...currentColumns, columnName];
+      newOrder = [...currentOrder, columnName];
+      // 기본 매핑 추가: 동일한 컬럼명이 targetTable에 있으면 자동 매핑, 없으면 빈 문자열
+      const targetColumn = tableColumns.find((c) => c.columnName === columnName);
+      newMappings = [...currentMappings, { sourceColumn: columnName, targetField: targetColumn ? columnName : "" }];
+    } else {
+      newColumns = currentColumns.filter((c) => c !== columnName);
+      newOrder = currentOrder.filter((c) => c !== columnName);
+      newMappings = currentMappings.filter((m) => m.sourceColumn !== columnName);
+    }
+    
+    // displayColumns, columnOrder, fieldMappings 함께 업데이트
+    const newConfig = { ...config.subDataLookup } as SubDataLookupConfig;
+    if (!newConfig.lookup) {
+      newConfig.lookup = { tableName: "", linkColumn: "", displayColumns: [] };
+    }
+    newConfig.lookup.displayColumns = newColumns;
+    newConfig.lookup.columnOrder = newOrder;
+    newConfig.lookup.fieldMappings = newMappings;
+    
+    onChange({
+      ...config,
+      subDataLookup: newConfig,
+    });
+  };
+
+  // 필드 매핑 변경 핸들러
+  const handleFieldMappingChange = (sourceColumn: string, targetField: string) => {
+    const currentMappings = config.subDataLookup?.lookup?.fieldMappings || [];
+    const existingIndex = currentMappings.findIndex((m) => m.sourceColumn === sourceColumn);
+    
+    let newMappings: { sourceColumn: string; targetField: string }[];
+    if (existingIndex >= 0) {
+      newMappings = [...currentMappings];
+      newMappings[existingIndex] = { sourceColumn, targetField };
+    } else {
+      newMappings = [...currentMappings, { sourceColumn, targetField }];
+    }
+    
+    handleSubDataLookupChange("lookup.fieldMappings", newMappings);
+  };
+
+  // 특정 컬럼의 현재 매핑된 타겟 필드 가져오기
+  const getFieldMapping = (sourceColumn: string): string => {
+    const mappings = config.subDataLookup?.lookup?.fieldMappings || [];
+    const mapping = mappings.find((m) => m.sourceColumn === sourceColumn);
+    return mapping?.targetField || "";
+  };
+
   return (
     <div className="space-y-4">
       {/* 대상 테이블 선택 */}
@@ -588,7 +685,7 @@ export const RepeaterConfigPanel: React.FC<RepeaterConfigPanelProps> = ({
                         <Checkbox
                           id={`display-col-${col.columnName}`}
                           checked={isSelected}
-                          onCheckedChange={(checked) => handleDisplayColumnToggle(col.columnName, checked as boolean)}
+                          onCheckedChange={(checked) => handleDisplayColumnToggleWithOrder(col.columnName, checked as boolean)}
                         />
                         <Label
                           htmlFor={`display-col-${col.columnName}`}
@@ -605,6 +702,103 @@ export const RepeaterConfigPanel: React.FC<RepeaterConfigPanelProps> = ({
               </div>
             )}
 
+            {/* 컬럼 설정 (순서 + 라벨 + 저장 컬럼) */}
+            {(config.subDataLookup?.lookup?.displayColumns?.length || 0) > 0 && (
+              <div className="space-y-2">
+                <Label className="text-xs font-medium text-purple-700">컬럼 설정</Label>
+                <p className="text-[10px] text-purple-500">순서, 라벨, 저장 여부를 설정하세요</p>
+                <div className="space-y-1.5 rounded border bg-white p-2">
+                  {getOrderedDisplayColumns().map((colName, index) => {
+                    const col = subDataTableColumns.find((c) => c.columnName === colName);
+                    const currentLabel = config.subDataLookup?.lookup?.columnLabels?.[colName] || "";
+                    const currentMapping = getFieldMapping(colName);
+                    const orderedColumns = getOrderedDisplayColumns();
+                    const isFirst = index === 0;
+                    const isLast = index === orderedColumns.length - 1;
+                    
+                    return (
+                      <div key={colName} className="rounded bg-purple-50 p-2">
+                        {/* 상단: 순서 버튼 + 번호 + 컬럼명 */}
+                        <div className="flex items-center gap-2">
+                          {/* 순서 변경 버튼 */}
+                          <div className="flex items-center gap-0.5">
+                            <Button
+                              type="button"
+                              variant="ghost"
+                              size="sm"
+                              className="h-5 w-5 p-0"
+                              onClick={() => handleDisplayColumnMoveUp(colName)}
+                              disabled={isFirst}
+                            >
+                              <ArrowUp className={cn("h-3 w-3", isFirst ? "text-gray-300" : "text-purple-600")} />
+                            </Button>
+                            <Button
+                              type="button"
+                              variant="ghost"
+                              size="sm"
+                              className="h-5 w-5 p-0"
+                              onClick={() => handleDisplayColumnMoveDown(colName)}
+                              disabled={isLast}
+                            >
+                              <ArrowDown className={cn("h-3 w-3", isLast ? "text-gray-300" : "text-purple-600")} />
+                            </Button>
+                          </div>
+                          
+                          {/* 순서 번호 */}
+                          <span className="w-4 text-center text-xs font-medium text-purple-600">{index + 1}</span>
+                          
+                          {/* 컬럼명 */}
+                          <div className="flex-1 text-xs">
+                            <span className="font-medium">{col?.columnLabel || colName}</span>
+                            <span className="ml-1 text-gray-400">({colName})</span>
+                          </div>
+                        </div>
+                        
+                        {/* 중단: 라벨 입력 */}
+                        <div className="mt-1.5 flex items-center gap-2">
+                          <span className="text-[10px] text-gray-500 whitespace-nowrap">표시 라벨:</span>
+                          <Input
+                            value={currentLabel}
+                            onChange={(e) => handleColumnLabelChange(colName, e.target.value)}
+                            placeholder={col?.columnLabel || colName}
+                            className="h-6 flex-1 text-xs"
+                          />
+                        </div>
+                        
+                        {/* 하단: 저장 컬럼 선택 */}
+                        <div className="mt-1.5 flex items-center gap-2">
+                          <span className="text-[10px] text-gray-500 whitespace-nowrap">저장 컬럼:</span>
+                          <Select
+                            value={currentMapping || "__none__"}
+                            onValueChange={(v) => handleFieldMappingChange(colName, v === "__none__" ? "" : v)}
+                          >
+                            <SelectTrigger className="h-6 flex-1 text-xs">
+                              <SelectValue placeholder="선택안함" />
+                            </SelectTrigger>
+                            <SelectContent>
+                              <SelectItem value="__none__" className="text-xs">
+                                선택안함
+                              </SelectItem>
+                              {tableColumns.map((targetCol) => (
+                                <SelectItem key={targetCol.columnName} value={targetCol.columnName} className="text-xs">
+                                  {targetCol.columnLabel || targetCol.columnName} ({targetCol.columnName})
+                                </SelectItem>
+                              ))}
+                            </SelectContent>
+                          </Select>
+                        </div>
+                      </div>
+                    );
+                  })}
+                </div>
+                {config.targetTable && (
+                  <p className="text-[10px] text-purple-500">
+                    * 저장 대상: {config.targetTable}
+                  </p>
+                )}
+              </div>
+            )}
+
             {/* 선택 설정 */}
             {(config.subDataLookup?.lookup?.displayColumns?.length || 0) > 0 && (
               <div className="space-y-3 border-t border-purple-200 pt-3">
diff --git a/frontend/lib/registry/components/repeater-field-group/SubDataLookupPanel.tsx b/frontend/lib/registry/components/repeater-field-group/SubDataLookupPanel.tsx
index 5baf0fe0..51be5a64 100644
--- a/frontend/lib/registry/components/repeater-field-group/SubDataLookupPanel.tsx
+++ b/frontend/lib/registry/components/repeater-field-group/SubDataLookupPanel.tsx
@@ -78,8 +78,20 @@ export const SubDataLookupPanel: React.FC<SubDataLookupPanelProps> = ({
     return config.lookup.columnLabels?.[columnName] || columnName;
   };
 
-  // 표시할 컬럼 목록
-  const displayColumns = config.lookup.displayColumns || [];
+  // 표시할 컬럼 목록 (columnOrder가 있으면 순서 적용)
+  const displayColumns = useMemo(() => {
+    const columns = config.lookup.displayColumns || [];
+    const columnOrder = config.lookup.columnOrder;
+    
+    if (columnOrder && columnOrder.length > 0) {
+      // columnOrder 순서대로 정렬 (displayColumns에 있는 것만)
+      const orderedCols = columnOrder.filter(col => columns.includes(col));
+      // columnOrder에 없지만 displayColumns에 있는 컬럼 추가
+      const remainingCols = columns.filter(col => !columnOrder.includes(col));
+      return [...orderedCols, ...remainingCols];
+    }
+    return columns;
+  }, [config.lookup.displayColumns, config.lookup.columnOrder]);
 
   // 요약 정보 표시용 선택 상태
   const summaryText = useMemo(() => {
diff --git a/frontend/lib/registry/components/repeater-field-group/useSubDataLookup.ts b/frontend/lib/registry/components/repeater-field-group/useSubDataLookup.ts
index b2c44e3d..2753dd16 100644
--- a/frontend/lib/registry/components/repeater-field-group/useSubDataLookup.ts
+++ b/frontend/lib/registry/components/repeater-field-group/useSubDataLookup.ts
@@ -197,10 +197,18 @@ export function useSubDataLookup(props: UseSubDataLookupProps): UseSubDataLookup
       return "선택 안됨";
     }
 
-    const { displayColumns, columnLabels } = config.lookup;
+    const { displayColumns, columnLabels, columnOrder } = config.lookup;
     const parts: string[] = [];
 
-    displayColumns.forEach((col) => {
+    // columnOrder가 있으면 순서 적용, 없으면 displayColumns 순서
+    let orderedColumns = displayColumns;
+    if (columnOrder && columnOrder.length > 0) {
+      const orderedCols = columnOrder.filter(col => displayColumns.includes(col));
+      const remainingCols = displayColumns.filter(col => !columnOrder.includes(col));
+      orderedColumns = [...orderedCols, ...remainingCols];
+    }
+
+    orderedColumns.forEach((col) => {
       const value = selectedItem[col];
       if (value !== undefined && value !== null && value !== "") {
         const label = columnLabels?.[col] || col;
diff --git a/frontend/types/repeater.ts b/frontend/types/repeater.ts
index 2362210b..bbdc8727 100644
--- a/frontend/types/repeater.ts
+++ b/frontend/types/repeater.ts
@@ -113,6 +113,14 @@ export type RepeaterData = RepeaterItemData[];
 // 품목 선택 시 재고/단가 등 관련 데이터를 조회하고 선택하는 기능
 // ============================================================
 
+/**
+ * 선택 데이터 필드 매핑 설정
+ */
+export interface SubDataFieldMapping {
+  sourceColumn: string; // 조회 테이블 컬럼 (예: lot_number)
+  targetField: string; // 저장 테이블 컬럼 (예: lot_number) 또는 "" (선택안함)
+}
+
 /**
  * 하위 데이터 조회 테이블 설정
  */
@@ -121,6 +129,8 @@ export interface SubDataLookupSettings {
   linkColumn: string; // 상위 데이터와 연결할 컬럼 (예: item_code)
   displayColumns: string[]; // 표시할 컬럼들 (예: ["warehouse_code", "location_code", "quantity"])
   columnLabels?: Record<string, string>; // 컬럼 라벨 (예: { warehouse_code: "창고" })
+  columnOrder?: string[]; // 컬럼 표시 순서 (없으면 displayColumns 순서 사용)
+  fieldMappings?: SubDataFieldMapping[]; // 선택 데이터 저장 매핑 (조회 컬럼 → 저장 컬럼)
   additionalFilters?: Record<string, any>; // 추가 필터 조건
 }
 

From b62a0b7e3b1572eb8485425968ace76afd7b3648 Mon Sep 17 00:00:00 2001
From: SeongHyun Kim <kksh7842@gmail.com>
Date: Mon, 19 Jan 2026 18:48:18 +0900
Subject: [PATCH 3/6] =?UTF-8?q?fix:=20=EB=B6=84=ED=95=A0=ED=8C=A8=EB=84=90?=
 =?UTF-8?q?=20=ED=99=94=EB=A9=B4=20=EB=B3=B5=EA=B5=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../SplitPanelLayoutComponent.tsx             | 470 ++++++++++++++++--
 1 file changed, 439 insertions(+), 31 deletions(-)

diff --git a/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx b/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
index 50f7c41b..869d2c3c 100644
--- a/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
+++ b/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
@@ -33,6 +33,7 @@ import {
   DialogDescription,
 } from "@/components/ui/dialog";
 import { Label } from "@/components/ui/label";
+import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { useTableOptions } from "@/contexts/TableOptionsContext";
 import { TableFilter, ColumnVisibility, GroupSumConfig } from "@/types/table-options";
 import { useAuth } from "@/hooks/useAuth";
@@ -171,6 +172,12 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
   const [rightSearchQuery, setRightSearchQuery] = useState("");
   const [isLoadingLeft, setIsLoadingLeft] = useState(false);
   const [isLoadingRight, setIsLoadingRight] = useState(false);
+
+  // 🆕 추가 탭 관련 상태
+  const [activeTabIndex, setActiveTabIndex] = useState(0); // 0 = 기본 탭 (우측 패널), 1+ = 추가 탭
+  const [tabsData, setTabsData] = useState<Record<number, any[]>>({}); // 탭별 데이터 캐시
+  const [tabsLoading, setTabsLoading] = useState<Record<number, boolean>>({}); // 탭별 로딩 상태
+
   const [rightTableColumns, setRightTableColumns] = useState<any[]>([]); // 우측 테이블 컬럼 정보
   const [expandedItems, setExpandedItems] = useState<Set<any>>(new Set()); // 펼쳐진 항목들
   const [leftColumnLabels, setLeftColumnLabels] = useState<Record<string, string>>({}); // 좌측 컬럼 라벨
@@ -1001,12 +1008,137 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
     ],
   );
 
+  // 🆕 추가 탭 데이터 로딩 함수
+  const loadTabData = useCallback(
+    async (tabIndex: number, leftItem: any) => {
+      const tabConfig = componentConfig.rightPanel?.additionalTabs?.[tabIndex - 1];
+      if (!tabConfig || !leftItem || isDesignMode) return;
+
+      const tabTableName = tabConfig.tableName;
+      if (!tabTableName) return;
+
+      setTabsLoading((prev) => ({ ...prev, [tabIndex]: true }));
+      try {
+        // 조인 키 확인
+        const keys = tabConfig.relation?.keys;
+        const leftColumn = tabConfig.relation?.leftColumn || keys?.[0]?.leftColumn;
+        const rightColumn = tabConfig.relation?.foreignKey || keys?.[0]?.rightColumn;
+
+        let resultData: any[] = [];
+
+        if (leftColumn && rightColumn) {
+          // 조인 조건이 있는 경우
+          const { entityJoinApi } = await import("@/lib/api/entityJoin");
+          const searchConditions: Record<string, any> = {};
+
+          if (keys && keys.length > 0) {
+            // 복합키
+            keys.forEach((key) => {
+              if (key.leftColumn && key.rightColumn && leftItem[key.leftColumn] !== undefined) {
+                searchConditions[key.rightColumn] = leftItem[key.leftColumn];
+              }
+            });
+          } else {
+            // 단일키
+            const leftValue = leftItem[leftColumn];
+            if (leftValue !== undefined) {
+              searchConditions[rightColumn] = leftValue;
+            }
+          }
+
+          console.log(`🔗 [추가탭 ${tabIndex}] 조회 조건:`, searchConditions);
+
+          const result = await entityJoinApi.getTableDataWithJoins(tabTableName, {
+            search: searchConditions,
+            enableEntityJoin: true,
+            size: 1000,
+          });
+
+          resultData = result.data || [];
+        } else {
+          // 조인 조건이 없는 경우: 전체 데이터 조회 (독립 탭)
+          const { entityJoinApi } = await import("@/lib/api/entityJoin");
+          const result = await entityJoinApi.getTableDataWithJoins(tabTableName, {
+            enableEntityJoin: true,
+            size: 1000,
+          });
+          resultData = result.data || [];
+        }
+
+        // 데이터 필터 적용
+        const dataFilter = tabConfig.dataFilter;
+        if (dataFilter?.enabled && dataFilter.conditions?.length > 0) {
+          resultData = resultData.filter((item: any) => {
+            return dataFilter.conditions.every((cond: any) => {
+              const value = item[cond.column];
+              const condValue = cond.value;
+              switch (cond.operator) {
+                case "equals":
+                  return value === condValue;
+                case "notEquals":
+                  return value !== condValue;
+                case "contains":
+                  return String(value).includes(String(condValue));
+                default:
+                  return true;
+              }
+            });
+          });
+        }
+
+        // 중복 제거 적용
+        const deduplication = tabConfig.deduplication;
+        if (deduplication?.enabled && deduplication.groupByColumn) {
+          const groupedMap = new Map<string, any>();
+          resultData.forEach((item) => {
+            const key = String(item[deduplication.groupByColumn] || "");
+            const existing = groupedMap.get(key);
+            if (!existing) {
+              groupedMap.set(key, item);
+            } else {
+              // keepStrategy에 따라 유지할 항목 결정
+              const sortCol = deduplication.sortColumn || "start_date";
+              const existingVal = existing[sortCol];
+              const newVal = item[sortCol];
+              if (deduplication.keepStrategy === "latest" && newVal > existingVal) {
+                groupedMap.set(key, item);
+              } else if (deduplication.keepStrategy === "earliest" && newVal < existingVal) {
+                groupedMap.set(key, item);
+              }
+            }
+          });
+          resultData = Array.from(groupedMap.values());
+        }
+
+        console.log(`🔗 [추가탭 ${tabIndex}] 결과 데이터:`, resultData.length);
+        setTabsData((prev) => ({ ...prev, [tabIndex]: resultData }));
+      } catch (error) {
+        console.error(`추가탭 ${tabIndex} 데이터 로드 실패:`, error);
+        toast({
+          title: "데이터 로드 실패",
+          description: `탭 데이터를 불러올 수 없습니다.`,
+          variant: "destructive",
+        });
+      } finally {
+        setTabsLoading((prev) => ({ ...prev, [tabIndex]: false }));
+      }
+    },
+    [componentConfig.rightPanel?.additionalTabs, isDesignMode, toast],
+  );
+
   // 좌측 항목 선택 핸들러
   const handleLeftItemSelect = useCallback(
     (item: any) => {
       setSelectedLeftItem(item);
       setExpandedRightItems(new Set()); // 좌측 항목 변경 시 우측 확장 초기화
-      loadRightData(item);
+      setTabsData({}); // 🆕 모든 탭 데이터 초기화
+
+      // 🆕 현재 활성 탭에 따라 데이터 로드
+      if (activeTabIndex === 0) {
+        loadRightData(item);
+      } else {
+        loadTabData(activeTabIndex, item);
+      }
 
       // 🆕 modalDataStore에 선택된 좌측 항목 저장 (단일 선택)
       const leftTableName = componentConfig.leftPanel?.tableName;
@@ -1017,7 +1149,30 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
         });
       }
     },
-    [loadRightData, componentConfig.leftPanel?.tableName, isDesignMode],
+    [loadRightData, loadTabData, activeTabIndex, componentConfig.leftPanel?.tableName, isDesignMode],
+  );
+
+  // 🆕 탭 변경 핸들러
+  const handleTabChange = useCallback(
+    (newTabIndex: number) => {
+      setActiveTabIndex(newTabIndex);
+
+      // 선택된 좌측 항목이 있으면 해당 탭의 데이터 로드
+      if (selectedLeftItem) {
+        if (newTabIndex === 0) {
+          // 기본 탭: 우측 패널 데이터가 없으면 로드
+          if (!rightData || (Array.isArray(rightData) && rightData.length === 0)) {
+            loadRightData(selectedLeftItem);
+          }
+        } else {
+          // 추가 탭: 해당 탭 데이터가 없으면 로드
+          if (!tabsData[newTabIndex]) {
+            loadTabData(newTabIndex, selectedLeftItem);
+          }
+        }
+      }
+    },
+    [selectedLeftItem, rightData, tabsData, loadRightData, loadTabData],
   );
 
   // 우측 항목 확장/축소 토글
@@ -2534,6 +2689,34 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
         className="flex flex-shrink-0 flex-col"
       >
         <Card className="flex flex-col border-0 shadow-none" style={{ height: "100%" }}>
+          {/* 🆕 탭 바 (추가 탭이 있을 때만 표시) */}
+          {(componentConfig.rightPanel?.additionalTabs?.length || 0) > 0 && (
+            <div className="flex-shrink-0 border-b">
+              <Tabs
+                value={String(activeTabIndex)}
+                onValueChange={(value) => handleTabChange(Number(value))}
+                className="w-full"
+              >
+                <TabsList className="h-9 w-full justify-start rounded-none border-b-0 bg-transparent p-0 px-2">
+                  <TabsTrigger
+                    value="0"
+                    className="h-8 rounded-none border-b-2 border-transparent px-4 data-[state=active]:border-primary data-[state=active]:bg-transparent data-[state=active]:shadow-none"
+                  >
+                    {componentConfig.rightPanel?.title || "기본"}
+                  </TabsTrigger>
+                  {componentConfig.rightPanel?.additionalTabs?.map((tab, index) => (
+                    <TabsTrigger
+                      key={tab.tabId}
+                      value={String(index + 1)}
+                      className="h-8 rounded-none border-b-2 border-transparent px-4 data-[state=active]:border-primary data-[state=active]:bg-transparent data-[state=active]:shadow-none"
+                    >
+                      {tab.label || `탭 ${index + 1}`}
+                    </TabsTrigger>
+                  ))}
+                </TabsList>
+              </Tabs>
+            </div>
+          )}
           <CardHeader
             className="flex-shrink-0 border-b"
             style={{
@@ -2546,16 +2729,28 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
           >
             <div className="flex w-full items-center justify-between">
               <CardTitle className="text-base font-semibold">
-                {componentConfig.rightPanel?.title || "우측 패널"}
+                {activeTabIndex === 0
+                  ? componentConfig.rightPanel?.title || "우측 패널"
+                  : componentConfig.rightPanel?.additionalTabs?.[activeTabIndex - 1]?.title ||
+                    componentConfig.rightPanel?.additionalTabs?.[activeTabIndex - 1]?.label ||
+                    "우측 패널"}
               </CardTitle>
               {!isDesignMode && (
                 <div className="flex items-center gap-2">
-                  {componentConfig.rightPanel?.showAdd && (
-                    <Button size="sm" variant="outline" onClick={() => handleAddClick("right")}>
-                      <Plus className="mr-1 h-4 w-4" />
-                      추가
-                    </Button>
-                  )}
+                  {/* 🆕 현재 활성 탭에 따른 추가 버튼 */}
+                  {activeTabIndex === 0
+                    ? componentConfig.rightPanel?.showAdd && (
+                        <Button size="sm" variant="outline" onClick={() => handleAddClick("right")}>
+                          <Plus className="mr-1 h-4 w-4" />
+                          추가
+                        </Button>
+                      )
+                    : componentConfig.rightPanel?.additionalTabs?.[activeTabIndex - 1]?.showAdd && (
+                        <Button size="sm" variant="outline" onClick={() => handleAddClick("right")}>
+                          <Plus className="mr-1 h-4 w-4" />
+                          추가
+                        </Button>
+                      )}
                   {/* 우측 패널 수정/삭제는 각 카드에서 처리 */}
                 </div>
               )}
@@ -2575,20 +2770,231 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
             </div>
           )}
           <CardContent className="flex-1 overflow-auto p-4">
-            {/* 우측 데이터 */}
-            {isLoadingRight ? (
-              // 로딩 중
-              <div className="flex h-full items-center justify-center">
-                <div className="text-center">
-                  <Loader2 className="text-primary mx-auto h-8 w-8 animate-spin" />
-                  <p className="text-muted-foreground mt-2 text-sm">데이터를 불러오는 중...</p>
-                </div>
-              </div>
-            ) : rightData ? (
-              // 실제 데이터 표시
-              Array.isArray(rightData) ? (
-                // 조인 모드: 여러 데이터를 테이블/리스트로 표시
-                (() => {
+            {/* 🆕 추가 탭 데이터 렌더링 */}
+            {activeTabIndex > 0 ? (
+              // 추가 탭 컨텐츠
+              (() => {
+                const currentTabConfig = componentConfig.rightPanel?.additionalTabs?.[activeTabIndex - 1];
+                const currentTabData = tabsData[activeTabIndex] || [];
+                const isTabLoading = tabsLoading[activeTabIndex];
+
+                if (isTabLoading) {
+                  return (
+                    <div className="flex h-full items-center justify-center">
+                      <div className="text-center">
+                        <Loader2 className="text-primary mx-auto h-8 w-8 animate-spin" />
+                        <p className="text-muted-foreground mt-2 text-sm">데이터를 불러오는 중...</p>
+                      </div>
+                    </div>
+                  );
+                }
+
+                if (!selectedLeftItem) {
+                  return (
+                    <div className="flex h-full items-center justify-center">
+                      <p className="text-muted-foreground text-sm">좌측에서 항목을 선택하세요</p>
+                    </div>
+                  );
+                }
+
+                if (currentTabData.length === 0) {
+                  return (
+                    <div className="flex h-full items-center justify-center">
+                      <p className="text-muted-foreground text-sm">데이터가 없습니다</p>
+                    </div>
+                  );
+                }
+
+                // 탭 데이터 렌더링 (목록/테이블 모드)
+                const isTableMode = currentTabConfig?.displayMode === "table";
+
+                if (isTableMode) {
+                  // 테이블 모드
+                  const displayColumns = currentTabConfig?.columns || [];
+                  const columnsToShow =
+                    displayColumns.length > 0
+                      ? displayColumns.map((col) => ({
+                          ...col,
+                          label: col.label || col.name,
+                        }))
+                      : Object.keys(currentTabData[0] || {})
+                          .filter(shouldShowField)
+                          .slice(0, 8)
+                          .map((key) => ({ name: key, label: key }));
+
+                  return (
+                    <div className="overflow-auto rounded-lg border">
+                      <table className="w-full text-sm">
+                        <thead className="bg-muted/50 sticky top-0">
+                          <tr>
+                            {columnsToShow.map((col: any) => (
+                              <th
+                                key={col.name}
+                                className="px-3 py-2 text-left font-medium"
+                                style={{ width: col.width ? `${col.width}px` : "auto" }}
+                              >
+                                {col.label}
+                              </th>
+                            ))}
+                            {(currentTabConfig?.showEdit || currentTabConfig?.showDelete) && (
+                              <th className="w-20 px-3 py-2 text-center font-medium">작업</th>
+                            )}
+                          </tr>
+                        </thead>
+                        <tbody>
+                          {currentTabData.map((item: any, idx: number) => (
+                            <tr key={item.id || idx} className="hover:bg-muted/30 border-t">
+                              {columnsToShow.map((col: any) => (
+                                <td key={col.name} className="px-3 py-2">
+                                  {formatCellValue(col.name, item[col.name], {}, col.format)}
+                                </td>
+                              ))}
+                              {(currentTabConfig?.showEdit || currentTabConfig?.showDelete) && (
+                                <td className="px-3 py-2 text-center">
+                                  <div className="flex items-center justify-center gap-1">
+                                    {currentTabConfig?.showEdit && (
+                                      <Button
+                                        variant="ghost"
+                                        size="sm"
+                                        className="h-7 w-7 p-0"
+                                        onClick={() => handleEditClick("right", item)}
+                                      >
+                                        <Pencil className="h-3.5 w-3.5" />
+                                      </Button>
+                                    )}
+                                    {currentTabConfig?.showDelete && (
+                                      <Button
+                                        variant="ghost"
+                                        size="sm"
+                                        className="h-7 w-7 p-0 text-red-500 hover:text-red-600"
+                                        onClick={() => handleDeleteClick("right", item)}
+                                      >
+                                        <Trash2 className="h-3.5 w-3.5" />
+                                      </Button>
+                                    )}
+                                  </div>
+                                </td>
+                              )}
+                            </tr>
+                          ))}
+                        </tbody>
+                      </table>
+                    </div>
+                  );
+                } else {
+                  // 목록 (카드) 모드
+                  const displayColumns = currentTabConfig?.columns || [];
+                  const summaryCount = currentTabConfig?.summaryColumnCount ?? 3;
+                  const showLabel = currentTabConfig?.summaryShowLabel ?? true;
+
+                  return (
+                    <div className="space-y-2">
+                      {currentTabData.map((item: any, idx: number) => {
+                        const itemId = item.id || idx;
+                        const isExpanded = expandedRightItems.has(itemId);
+
+                        // 표시할 컬럼 결정
+                        const columnsToShow =
+                          displayColumns.length > 0
+                            ? displayColumns
+                            : Object.keys(item)
+                                .filter(shouldShowField)
+                                .slice(0, 8)
+                                .map((key) => ({ name: key, label: key }));
+
+                        const summaryColumns = columnsToShow.slice(0, summaryCount);
+                        const detailColumns = columnsToShow.slice(summaryCount);
+
+                        return (
+                          <div key={itemId} className="rounded-lg border bg-white p-3">
+                            <div
+                              className="flex cursor-pointer items-start justify-between"
+                              onClick={() => toggleRightItemExpansion(itemId)}
+                            >
+                              <div className="flex-1">
+                                <div className="flex flex-wrap gap-x-4 gap-y-1">
+                                  {summaryColumns.map((col: any) => (
+                                    <div key={col.name} className="text-sm">
+                                      {showLabel && (
+                                        <span className="text-muted-foreground mr-1">{col.label}:</span>
+                                      )}
+                                      <span className={col.bold ? "font-semibold" : ""}>
+                                        {formatCellValue(col.name, item[col.name], {}, col.format)}
+                                      </span>
+                                    </div>
+                                  ))}
+                                </div>
+                              </div>
+                              <div className="ml-2 flex items-center gap-1">
+                                {currentTabConfig?.showEdit && (
+                                  <Button
+                                    variant="ghost"
+                                    size="sm"
+                                    className="h-7 w-7 p-0"
+                                    onClick={(e) => {
+                                      e.stopPropagation();
+                                      handleEditClick("right", item);
+                                    }}
+                                  >
+                                    <Pencil className="h-3.5 w-3.5" />
+                                  </Button>
+                                )}
+                                {currentTabConfig?.showDelete && (
+                                  <Button
+                                    variant="ghost"
+                                    size="sm"
+                                    className="h-7 w-7 p-0 text-red-500 hover:text-red-600"
+                                    onClick={(e) => {
+                                      e.stopPropagation();
+                                      handleDeleteClick("right", item);
+                                    }}
+                                  >
+                                    <Trash2 className="h-3.5 w-3.5" />
+                                  </Button>
+                                )}
+                                {detailColumns.length > 0 &&
+                                  (isExpanded ? (
+                                    <ChevronUp className="h-4 w-4 text-gray-400" />
+                                  ) : (
+                                    <ChevronDown className="h-4 w-4 text-gray-400" />
+                                  ))}
+                              </div>
+                            </div>
+                            {isExpanded && detailColumns.length > 0 && (
+                              <div className="mt-2 border-t pt-2">
+                                <div className="grid grid-cols-2 gap-2">
+                                  {detailColumns.map((col: any) => (
+                                    <div key={col.name} className="text-sm">
+                                      <span className="text-muted-foreground">{col.label}:</span>
+                                      <span className="ml-1">{formatCellValue(col.name, item[col.name], {}, col.format)}</span>
+                                    </div>
+                                  ))}
+                                </div>
+                              </div>
+                            )}
+                          </div>
+                        );
+                      })}
+                    </div>
+                  );
+                }
+              })()
+            ) : (
+              /* 기본 탭 (우측 패널) 데이터 */
+              <>
+                {isLoadingRight ? (
+                  // 로딩 중
+                  <div className="flex h-full items-center justify-center">
+                    <div className="text-center">
+                      <Loader2 className="text-primary mx-auto h-8 w-8 animate-spin" />
+                      <p className="text-muted-foreground mt-2 text-sm">데이터를 불러오는 중...</p>
+                    </div>
+                  </div>
+                ) : rightData ? (
+                  // 실제 데이터 표시
+                  Array.isArray(rightData) ? (
+                    // 조인 모드: 여러 데이터를 테이블/리스트로 표시
+                    (() => {
                   // 검색 필터링
                   const filteredData = rightSearchQuery
                     ? rightData.filter((item) => {
@@ -3018,14 +3424,16 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
                   </div>
                 </div>
               </div>
-            ) : (
-              // 선택 없음
-              <div className="flex h-full items-center justify-center">
-                <div className="text-muted-foreground text-center text-sm">
-                  <p className="mb-2">좌측에서 항목을 선택하세요</p>
-                  <p className="text-xs">선택한 항목의 상세 정보가 여기에 표시됩니다</p>
-                </div>
-              </div>
+                ) : (
+                  // 선택 없음
+                  <div className="flex h-full items-center justify-center">
+                    <div className="text-muted-foreground text-center text-sm">
+                      <p className="mb-2">좌측에서 항목을 선택하세요</p>
+                      <p className="text-xs">선택한 항목의 상세 정보가 여기에 표시됩니다</p>
+                    </div>
+                  </div>
+                )}
+              </>
             )}
           </CardContent>
         </Card>

From 585febfb52a310031725444c74beafb0cee5f25f Mon Sep 17 00:00:00 2001
From: SeongHyun Kim <kksh7842@gmail.com>
Date: Mon, 19 Jan 2026 18:58:23 +0900
Subject: [PATCH 4/6] =?UTF-8?q?make:=20RepeaterFieldGroup=20=EC=BB=B4?=
 =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20-=20=ED=95=98=EC=9C=84=20?=
 =?UTF-8?q?=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EC=A1=B0=ED=9A=8C=20=EC=97=B0?=
 =?UTF-8?q?=EB=8F=99=20=EB=B0=A9=EC=8B=9D=20=EA=B0=9C=EC=84=A0=20-=20?=
 =?UTF-8?q?=ED=95=84=EB=93=9C=20=EC=A0=95=EC=9D=98=20=EB=A0=88=EB=B2=A8?=
 =?UTF-8?q?=EC=97=90=EC=84=9C=20subDataSource=20=EC=84=A4=EC=A0=95=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80=20-=20=ED=95=84=EB=93=9C=EB=B3=84=20?=
 =?UTF-8?q?=EC=88=A8=EA=B9=80(isHidden)=20=EC=98=B5=EC=85=98=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80=20-=20=EA=B8=B0=EC=A1=B4=20fieldMappings=20=EB=B0=A9?=
 =?UTF-8?q?=EC=8B=9D=20=EC=A0=9C=EA=B1=B0,=20=ED=95=84=EB=93=9C=EB=B3=84?=
 =?UTF-8?q?=20=EC=97=B0=EB=8F=99=EC=9C=BC=EB=A1=9C=20=EB=B3=80=EA=B2=BD=20?=
 =?UTF-8?q?=5FrepeaterFieldsConfig=20=EB=A9=94=ED=83=80=EB=8D=B0=EC=9D=B4?=
 =?UTF-8?q?=ED=84=B0=EB=A1=9C=20=EC=84=A4=EC=A0=95=20=EC=A0=84=EB=8B=AC=20?=
 =?UTF-8?q?:=20"=EC=9D=B4=20=ED=95=84=EB=93=9C=EB=93=A4=EC=9D=98=20?=
 =?UTF-8?q?=ED=95=98=EC=9C=84=20=EC=A1=B0=ED=9A=8C=20=EA=B2=B0=EA=B3=BC?=
 =?UTF-8?q?=EC=97=90=EC=84=9C=20=EA=B0=92=20=EA=B0=80=EC=A0=B8=EC=99=80?=
 =?UTF-8?q?=EC=84=9C=20=EC=B6=94=EA=B0=80=EB=A1=9C=20=EC=A0=80=EC=9E=A5?=
 =?UTF-8?q?=ED=95=B4=EC=A4=98"=EB=9D=BC=EB=8A=94=20=EC=A3=BC=EB=AC=B8?=
 =?UTF-8?q?=EC=84=9C=20=EC=97=AD=ED=95=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/webtypes/RepeaterInput.tsx     |  18 +-
 .../webtypes/config/RepeaterConfigPanel.tsx   | 185 ++++++++++--------
 .../RepeaterFieldGroupRenderer.tsx            |  18 ++
 frontend/lib/utils/buttonActions.ts           |  38 +++-
 frontend/types/repeater.ts                    |  14 +-
 5 files changed, 182 insertions(+), 91 deletions(-)

diff --git a/frontend/components/webtypes/RepeaterInput.tsx b/frontend/components/webtypes/RepeaterInput.tsx
index 49751699..050b386b 100644
--- a/frontend/components/webtypes/RepeaterInput.tsx
+++ b/frontend/components/webtypes/RepeaterInput.tsx
@@ -907,6 +907,10 @@ export const RepeaterInput: React.FC<RepeaterInputProps> = ({
   const renderGridLayout = () => {
     // 하위 데이터 조회 설정이 있으면 연결 컬럼 찾기
     const linkColumn = subDataLookup?.lookup?.linkColumn;
+    
+    // hidden이 아닌 필드만 표시
+    // isHidden이 true이거나 displayMode가 hidden인 필드는 제외 (하위 호환성 유지)
+    const visibleFields = fields.filter((f) => !f.isHidden && f.displayMode !== "hidden");
 
     return (
       <div className="bg-card">
@@ -919,7 +923,7 @@ export const RepeaterInput: React.FC<RepeaterInputProps> = ({
               {allowReorder && (
                 <TableHead className="h-10 w-10 px-2.5 py-2 text-center text-sm font-semibold"></TableHead>
               )}
-              {fields.map((field) => (
+              {visibleFields.map((field) => (
                 <TableHead key={field.name} className="h-10 px-2.5 py-2 text-sm font-semibold">
                   {field.label}
                   {field.required && <span className="text-destructive ml-1">*</span>}
@@ -958,8 +962,8 @@ export const RepeaterInput: React.FC<RepeaterInputProps> = ({
                       </TableCell>
                     )}
 
-                    {/* 필드들 */}
-                    {fields.map((field) => (
+                    {/* 필드들 (hidden 제외) */}
+                    {visibleFields.map((field) => (
                       <TableCell key={field.name} className="h-12 px-2.5 py-2">
                         {renderField(field, itemIndex, item[field.name])}
                       </TableCell>
@@ -987,7 +991,7 @@ export const RepeaterInput: React.FC<RepeaterInputProps> = ({
                     <TableRow className="bg-gray-50/50">
                       <TableCell
                         colSpan={
-                          fields.length + (showIndex ? 1 : 0) + (allowReorder && !readonly && !disabled ? 1 : 0) + 1
+                          visibleFields.length + (showIndex ? 1 : 0) + (allowReorder && !readonly && !disabled ? 1 : 0) + 1
                         }
                         className="px-2.5 py-2"
                       >
@@ -1016,6 +1020,10 @@ export const RepeaterInput: React.FC<RepeaterInputProps> = ({
   const renderCardLayout = () => {
     // 하위 데이터 조회 설정이 있으면 연결 컬럼 찾기
     const linkColumn = subDataLookup?.lookup?.linkColumn;
+    
+    // hidden이 아닌 필드만 표시
+    // isHidden이 true이거나 displayMode가 hidden인 필드는 제외 (하위 호환성 유지)
+    const visibleFields = fields.filter((f) => !f.isHidden && f.displayMode !== "hidden");
 
     return (
       <>
@@ -1084,7 +1092,7 @@ export const RepeaterInput: React.FC<RepeaterInputProps> = ({
               {!isCollapsed && (
                 <CardContent>
                   <div className={getFieldsLayoutClass()}>
-                    {fields.map((field) => (
+                    {visibleFields.map((field) => (
                       <div key={field.name} className="space-y-1" style={{ width: field.width }}>
                         <label className="text-foreground text-sm font-medium">
                           {field.label}
diff --git a/frontend/components/webtypes/config/RepeaterConfigPanel.tsx b/frontend/components/webtypes/config/RepeaterConfigPanel.tsx
index 857ece17..09b2d7e0 100644
--- a/frontend/components/webtypes/config/RepeaterConfigPanel.tsx
+++ b/frontend/components/webtypes/config/RepeaterConfigPanel.tsx
@@ -360,32 +360,25 @@ export const RepeaterConfigPanel: React.FC<RepeaterConfigPanelProps> = ({
   const handleDisplayColumnToggleWithOrder = (columnName: string, checked: boolean) => {
     const currentColumns = config.subDataLookup?.lookup?.displayColumns || [];
     const currentOrder = config.subDataLookup?.lookup?.columnOrder || [];
-    const currentMappings = config.subDataLookup?.lookup?.fieldMappings || [];
     
     let newColumns: string[];
     let newOrder: string[];
-    let newMappings: { sourceColumn: string; targetField: string }[];
     
     if (checked) {
       newColumns = [...currentColumns, columnName];
       newOrder = [...currentOrder, columnName];
-      // 기본 매핑 추가: 동일한 컬럼명이 targetTable에 있으면 자동 매핑, 없으면 빈 문자열
-      const targetColumn = tableColumns.find((c) => c.columnName === columnName);
-      newMappings = [...currentMappings, { sourceColumn: columnName, targetField: targetColumn ? columnName : "" }];
     } else {
       newColumns = currentColumns.filter((c) => c !== columnName);
       newOrder = currentOrder.filter((c) => c !== columnName);
-      newMappings = currentMappings.filter((m) => m.sourceColumn !== columnName);
     }
     
-    // displayColumns, columnOrder, fieldMappings 함께 업데이트
+    // displayColumns, columnOrder 함께 업데이트
     const newConfig = { ...config.subDataLookup } as SubDataLookupConfig;
     if (!newConfig.lookup) {
       newConfig.lookup = { tableName: "", linkColumn: "", displayColumns: [] };
     }
     newConfig.lookup.displayColumns = newColumns;
     newConfig.lookup.columnOrder = newOrder;
-    newConfig.lookup.fieldMappings = newMappings;
     
     onChange({
       ...config,
@@ -393,28 +386,6 @@ export const RepeaterConfigPanel: React.FC<RepeaterConfigPanelProps> = ({
     });
   };
 
-  // 필드 매핑 변경 핸들러
-  const handleFieldMappingChange = (sourceColumn: string, targetField: string) => {
-    const currentMappings = config.subDataLookup?.lookup?.fieldMappings || [];
-    const existingIndex = currentMappings.findIndex((m) => m.sourceColumn === sourceColumn);
-    
-    let newMappings: { sourceColumn: string; targetField: string }[];
-    if (existingIndex >= 0) {
-      newMappings = [...currentMappings];
-      newMappings[existingIndex] = { sourceColumn, targetField };
-    } else {
-      newMappings = [...currentMappings, { sourceColumn, targetField }];
-    }
-    
-    handleSubDataLookupChange("lookup.fieldMappings", newMappings);
-  };
-
-  // 특정 컬럼의 현재 매핑된 타겟 필드 가져오기
-  const getFieldMapping = (sourceColumn: string): string => {
-    const mappings = config.subDataLookup?.lookup?.fieldMappings || [];
-    const mapping = mappings.find((m) => m.sourceColumn === sourceColumn);
-    return mapping?.targetField || "";
-  };
 
   return (
     <div className="space-y-4">
@@ -711,7 +682,6 @@ export const RepeaterConfigPanel: React.FC<RepeaterConfigPanelProps> = ({
                   {getOrderedDisplayColumns().map((colName, index) => {
                     const col = subDataTableColumns.find((c) => c.columnName === colName);
                     const currentLabel = config.subDataLookup?.lookup?.columnLabels?.[colName] || "";
-                    const currentMapping = getFieldMapping(colName);
                     const orderedColumns = getOrderedDisplayColumns();
                     const isFirst = index === 0;
                     const isLast = index === orderedColumns.length - 1;
@@ -765,37 +735,13 @@ export const RepeaterConfigPanel: React.FC<RepeaterConfigPanelProps> = ({
                           />
                         </div>
                         
-                        {/* 하단: 저장 컬럼 선택 */}
-                        <div className="mt-1.5 flex items-center gap-2">
-                          <span className="text-[10px] text-gray-500 whitespace-nowrap">저장 컬럼:</span>
-                          <Select
-                            value={currentMapping || "__none__"}
-                            onValueChange={(v) => handleFieldMappingChange(colName, v === "__none__" ? "" : v)}
-                          >
-                            <SelectTrigger className="h-6 flex-1 text-xs">
-                              <SelectValue placeholder="선택안함" />
-                            </SelectTrigger>
-                            <SelectContent>
-                              <SelectItem value="__none__" className="text-xs">
-                                선택안함
-                              </SelectItem>
-                              {tableColumns.map((targetCol) => (
-                                <SelectItem key={targetCol.columnName} value={targetCol.columnName} className="text-xs">
-                                  {targetCol.columnLabel || targetCol.columnName} ({targetCol.columnName})
-                                </SelectItem>
-                              ))}
-                            </SelectContent>
-                          </Select>
-                        </div>
                       </div>
                     );
                   })}
                 </div>
-                {config.targetTable && (
-                  <p className="text-[10px] text-purple-500">
-                    * 저장 대상: {config.targetTable}
-                  </p>
-                )}
+                <p className="text-[10px] text-purple-500">
+                  * 저장 설정은 필드 정의에서 "하위 데이터 조회에서 값 가져오기"로 설정하세요
+                </p>
               </div>
             )}
 
@@ -1545,35 +1491,106 @@ export const RepeaterConfigPanel: React.FC<RepeaterConfigPanelProps> = ({
 
               {/* 카테고리 타입이 아닐 때만 표시 모드 선택 */}
               {field.type !== "category" && (
-                <div className="grid grid-cols-2 gap-3">
-                  <div className="space-y-1">
-                    <Label className="text-xs">표시 모드</Label>
-                    <Select
-                      value={field.displayMode || "input"}
-                      onValueChange={(value) => updateField(index, { displayMode: value as any })}
-                    >
-                      <SelectTrigger className="h-8 w-full">
-                        <SelectValue />
-                      </SelectTrigger>
-                      <SelectContent>
-                        <SelectItem value="input">입력 (편집 가능)</SelectItem>
-                        <SelectItem value="readonly">읽기전용 (텍스트)</SelectItem>
-                      </SelectContent>
-                    </Select>
-                  </div>
+                <div className="space-y-3">
+                  <div className="grid grid-cols-2 gap-3">
+                    <div className="space-y-1">
+                      <Label className="text-xs">표시 모드</Label>
+                      <Select
+                        value={field.displayMode || "input"}
+                        onValueChange={(value) => updateField(index, { displayMode: value as any })}
+                      >
+                        <SelectTrigger className="h-8 w-full">
+                          <SelectValue />
+                        </SelectTrigger>
+                        <SelectContent>
+                          <SelectItem value="input">입력 (편집 가능)</SelectItem>
+                          <SelectItem value="readonly">읽기전용 (텍스트)</SelectItem>
+                        </SelectContent>
+                      </Select>
+                    </div>
 
-                  <div className="flex items-center space-x-4 pt-5">
-                    <div className="flex items-center space-x-2">
-                      <Checkbox
-                        id={`required-${index}`}
-                        checked={field.required ?? false}
-                        onCheckedChange={(checked) => updateField(index, { required: checked as boolean })}
-                      />
-                      <Label htmlFor={`required-${index}`} className="cursor-pointer text-xs font-normal">
-                        필수
-                      </Label>
+                    <div className="flex items-center space-x-4 pt-5">
+                      <div className="flex items-center space-x-2">
+                        <Checkbox
+                          id={`required-${index}`}
+                          checked={field.required ?? false}
+                          onCheckedChange={(checked) => updateField(index, { required: checked as boolean })}
+                        />
+                        <Label htmlFor={`required-${index}`} className="cursor-pointer text-xs font-normal">
+                          필수
+                        </Label>
+                      </div>
                     </div>
                   </div>
+
+                  {/* 숨김 체크박스 */}
+                  <div className="flex items-center space-x-2">
+                    <Checkbox
+                      id={`hidden-${index}`}
+                      checked={field.isHidden ?? false}
+                      onCheckedChange={(checked) => updateField(index, { isHidden: checked as boolean })}
+                    />
+                    <Label htmlFor={`hidden-${index}`} className="cursor-pointer text-xs font-normal">
+                      숨김 (테이블에 표시 안 함)
+                    </Label>
+                  </div>
+
+                  {/* 하위 데이터 조회에서 값 가져오기 */}
+                  {config.subDataLookup?.enabled && (
+                    <div className="space-y-2 rounded border border-purple-200 bg-purple-50 p-2">
+                      <div className="flex items-center space-x-2">
+                        <Checkbox
+                          id={`subdata-${index}`}
+                          checked={field.subDataSource?.enabled ?? false}
+                          onCheckedChange={(checked) => {
+                            updateField(index, {
+                              subDataSource: {
+                                enabled: checked as boolean,
+                                sourceColumn: field.subDataSource?.sourceColumn || "",
+                              },
+                            });
+                          }}
+                        />
+                        <Label htmlFor={`subdata-${index}`} className="cursor-pointer text-xs font-normal text-purple-700">
+                          하위 데이터 조회에서 값 가져오기
+                        </Label>
+                      </div>
+
+                      {field.subDataSource?.enabled && (
+                        <div className="ml-5 space-y-1">
+                          <Label className="text-[10px] text-purple-600">소스 컬럼</Label>
+                          <Select
+                            value={field.subDataSource?.sourceColumn || ""}
+                            onValueChange={(value) => {
+                              updateField(index, {
+                                subDataSource: {
+                                  enabled: true,
+                                  sourceColumn: value,
+                                },
+                              });
+                            }}
+                          >
+                            <SelectTrigger className="h-7 text-xs">
+                              <SelectValue placeholder="컬럼 선택" />
+                            </SelectTrigger>
+                            <SelectContent>
+                              {(config.subDataLookup?.lookup?.displayColumns || []).map((colName) => {
+                                const label = config.subDataLookup?.lookup?.columnLabels?.[colName] || colName;
+                                return (
+                                  <SelectItem key={colName} value={colName} className="text-xs">
+                                    {label} ({colName})
+                                  </SelectItem>
+                                );
+                              })}
+                            </SelectContent>
+                          </Select>
+                          <p className="text-[10px] text-purple-500">
+                            재고 조회 결과에서 이 컬럼의 값을 가져옵니다
+                          </p>
+                        </div>
+                      )}
+                    </div>
+                  )}
                 </div>
               )}
 
diff --git a/frontend/lib/registry/components/repeater-field-group/RepeaterFieldGroupRenderer.tsx b/frontend/lib/registry/components/repeater-field-group/RepeaterFieldGroupRenderer.tsx
index 2aefb047..63e1cbb9 100644
--- a/frontend/lib/registry/components/repeater-field-group/RepeaterFieldGroupRenderer.tsx
+++ b/frontend/lib/registry/components/repeater-field-group/RepeaterFieldGroupRenderer.tsx
@@ -287,12 +287,18 @@ const RepeaterFieldGroupComponent: React.FC<ComponentRendererProps> = (props) =>
           if (onChange && items.length > 0) {
             // 🆕 RepeaterFieldGroup이 관리하는 필드 목록 추출
             const repeaterFieldNames = (configRef.current.fields || []).map((f: any) => f.name);
+            // 🆕 subDataSource 설정이 있는 필드 목록 (하위 데이터 조회 연동)
+            const fieldsConfig = (configRef.current.fields || []).map((f: any) => ({
+              name: f.name,
+              subDataSource: f.subDataSource,
+            }));
             const dataWithMeta = items.map((item: any) => ({
               ...item,
               _targetTable: targetTable,
               _originalItemIds: itemIds, // 🆕 원본 ID 목록도 함께 전달
               _existingRecord: !!item.id, // 🆕 기존 레코드 플래그 (id가 있으면 기존 레코드)
               _repeaterFields: repeaterFieldNames, // 🆕 품목 고유 필드 목록
+              _repeaterFieldsConfig: fieldsConfig, // 🆕 필드 설정 (subDataSource 등)
             }));
             onChange(dataWithMeta);
           }
@@ -393,11 +399,17 @@ const RepeaterFieldGroupComponent: React.FC<ComponentRendererProps> = (props) =>
             if (items.length > 0) {
               // 🆕 RepeaterFieldGroup이 관리하는 필드 목록 추출
               const repeaterFieldNames = (configRef.current.fields || []).map((f: any) => f.name);
+              // 🆕 subDataSource 설정이 있는 필드 목록
+              const fieldsConfig = (configRef.current.fields || []).map((f: any) => ({
+                name: f.name,
+                subDataSource: f.subDataSource,
+              }));
               const dataWithMeta = items.map((item: any) => ({
                 ...item,
                 _targetTable: effectiveTargetTable,
                 _existingRecord: !!item.id,
                 _repeaterFields: repeaterFieldNames, // 🆕 품목 고유 필드 목록
+                _repeaterFieldsConfig: fieldsConfig, // 🆕 필드 설정 (subDataSource 등)
               }));
               onChange(dataWithMeta);
             } else {
@@ -681,6 +693,11 @@ const RepeaterFieldGroupComponent: React.FC<ComponentRendererProps> = (props) =>
     (newValue: any[]) => {
       // 🆕 RepeaterFieldGroup이 관리하는 필드 목록 추출
       const repeaterFieldNames = (configRef.current.fields || []).map((f: any) => f.name);
+      // 🆕 subDataSource 설정이 있는 필드 목록
+      const fieldsConfig = (configRef.current.fields || []).map((f: any) => ({
+        name: f.name,
+        subDataSource: f.subDataSource,
+      }));
       
       // 🆕 모든 항목에 메타데이터 추가
       let valueWithMeta = newValue.map((item: any) => ({
@@ -688,6 +705,7 @@ const RepeaterFieldGroupComponent: React.FC<ComponentRendererProps> = (props) =>
         _targetTable: effectiveTargetTable || targetTable,
         _existingRecord: !!item.id,
         _repeaterFields: repeaterFieldNames, // 🆕 품목 고유 필드 목록
+        _repeaterFieldsConfig: fieldsConfig, // 🆕 필드 설정 (subDataSource 등)
       }));
 
       // 🆕 분할 패널에서 우측인 경우, FK 값 추가
diff --git a/frontend/lib/utils/buttonActions.ts b/frontend/lib/utils/buttonActions.ts
index debf58b2..b0ac2ba9 100644
--- a/frontend/lib/utils/buttonActions.ts
+++ b/frontend/lib/utils/buttonActions.ts
@@ -803,7 +803,7 @@ export class ButtonActionExecutor {
 
           for (const item of parsedData) {
             // 메타 필드 제거
-            const { _targetTable, _isNewItem, _existingRecord, _originalItemIds, _deletedItemIds, _repeaterFields, ...itemData } = item;
+            const { _targetTable, _isNewItem, _existingRecord, _originalItemIds, _deletedItemIds, _repeaterFields, _subDataSelection, _subDataMaxValue, ...itemData } = item;
 
             // 🔧 품목 고유 필드만 추출 (RepeaterFieldGroup 설정 기반)
             const itemOnlyData: Record<string, any> = {};
@@ -812,6 +812,42 @@ export class ButtonActionExecutor {
                 itemOnlyData[field] = itemData[field];
               }
             });
+            
+            // 🆕 하위 데이터 선택에서 값 추출 (subDataSource 설정 기반)
+            // 필드 정의에서 subDataSource.enabled가 true이고 sourceColumn이 설정된 필드만 처리
+            if (_subDataSelection && typeof _subDataSelection === 'object') {
+              // _repeaterFieldsConfig에서 subDataSource 설정 확인
+              const fieldsConfig = item._repeaterFieldsConfig as Array<{
+                name: string;
+                subDataSource?: { enabled: boolean; sourceColumn: string };
+              }> | undefined;
+              
+              if (fieldsConfig && Array.isArray(fieldsConfig)) {
+                fieldsConfig.forEach((fieldConfig) => {
+                  if (fieldConfig.subDataSource?.enabled && fieldConfig.subDataSource?.sourceColumn) {
+                    const targetField = fieldConfig.name; // 필드명 = 저장할 컬럼명
+                    const sourceColumn = fieldConfig.subDataSource.sourceColumn;
+                    const sourceValue = _subDataSelection[sourceColumn];
+                    
+                    if (sourceValue !== undefined && sourceValue !== null) {
+                      itemOnlyData[targetField] = sourceValue;
+                      console.log(`📋 [handleSave] 하위 데이터 값 매핑: ${sourceColumn} → ${targetField} = ${sourceValue}`);
+                    }
+                  }
+                });
+              } else {
+                // 하위 호환성: fieldsConfig가 없으면 기존 방식 사용
+                Object.keys(_subDataSelection).forEach((subDataKey) => {
+                  if (itemOnlyData[subDataKey] === undefined || itemOnlyData[subDataKey] === null || itemOnlyData[subDataKey] === '') {
+                    const subDataValue = _subDataSelection[subDataKey];
+                    if (subDataValue !== undefined && subDataValue !== null) {
+                      itemOnlyData[subDataKey] = subDataValue;
+                      console.log(`📋 [handleSave] 하위 데이터 선택 값 추가 (레거시): ${subDataKey} = ${subDataValue}`);
+                    }
+                  }
+                });
+              }
+            }
 
             // 🔧 마스터 정보 + 품목 고유 정보 병합
             // masterFields: 상단 폼에서 수정한 최신 마스터 정보
diff --git a/frontend/types/repeater.ts b/frontend/types/repeater.ts
index bbdc8727..c7f0fa98 100644
--- a/frontend/types/repeater.ts
+++ b/frontend/types/repeater.ts
@@ -43,9 +43,19 @@ export interface CalculationFormula {
  * 필드 표시 모드
  * - input: 입력 필드로 표시 (편집 가능)
  * - readonly: 읽기 전용 텍스트로 표시
+ * - hidden: 숨김 (UI에 표시되지 않지만 데이터에 포함됨)
  * - (카테고리 타입은 자동으로 배지로 표시됨)
  */
-export type RepeaterFieldDisplayMode = "input" | "readonly";
+export type RepeaterFieldDisplayMode = "input" | "readonly" | "hidden";
+
+/**
+ * 하위 데이터 조회 소스 설정
+ * 필드 값을 하위 데이터 조회 결과에서 가져올 때 사용
+ */
+export interface SubDataSourceConfig {
+  enabled: boolean; // 활성화 여부
+  sourceColumn: string; // 하위 데이터 조회 테이블의 소스 컬럼 (예: lot_number)
+}
 
 /**
  * 반복 그룹 내 개별 필드 정의
@@ -60,6 +70,8 @@ export interface RepeaterFieldDefinition {
   options?: Array<{ label: string; value: string }>; // select용
   width?: string; // 필드 너비 (예: "200px", "50%")
   displayMode?: RepeaterFieldDisplayMode; // 표시 모드: input(입력), readonly(읽기전용)
+  isHidden?: boolean; // 숨김 여부 (true면 테이블에 표시 안 함, 데이터는 저장)
+  subDataSource?: SubDataSourceConfig; // 하위 데이터 조회에서 값 가져오기 설정
   categoryCode?: string; // category 타입일 때 사용할 카테고리 코드
   formula?: CalculationFormula; // 계산식 (type이 "calculated"일 때 사용)
   numberFormat?: {

From c31b0540aa2bfcb9e170c2f0512b9d6ffe5b7102 Mon Sep 17 00:00:00 2001
From: SeongHyun Kim <kksh7842@gmail.com>
Date: Tue, 20 Jan 2026 16:08:38 +0900
Subject: [PATCH 5/6] =?UTF-8?q?fix:=20=EB=B6=84=ED=95=A0=ED=8C=A8=EB=84=90?=
 =?UTF-8?q?=20=EC=97=B0=EA=B2=B0=20=ED=95=84=ED=84=B0=EC=97=90=20operator?=
 =?UTF-8?q?=20equals=20=EB=88=84=EB=9D=BD=EC=9C=BC=EB=A1=9C=20=EC=9D=B8?=
 =?UTF-8?q?=ED=95=9C=20=EC=A1=B0=ED=9A=8C=20=EC=8B=A4=ED=8C=A8=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95=20:=20=EC=9A=B0=EC=B8=A1=20=ED=8C=A8=EB=84=90?=
 =?UTF-8?q?=EC=97=90=20=EC=97=B0=EA=B4=80=20=EB=8D=B0=EC=9D=B4=ED=84=B0(?=
 =?UTF-8?q?=EB=B6=80=EC=84=9C=EC=9D=B8=EC=9B=90)=EA=B0=80=20=EC=A1=B0?=
 =?UTF-8?q?=ED=9A=8C=EB=90=98=EC=A7=80=20=EC=95=8A=EB=8D=98=20=EB=AC=B8?=
 =?UTF-8?q?=EC=A0=9C=20=EC=88=98=EC=A0=95=20-=20=EC=9E=AC=EA=B3=A0?=
 =?UTF-8?q?=EC=9D=B4=EB=A0=A5=EC=97=90=EC=84=9C=20=ED=92=88=EB=B2=88?=
 =?UTF-8?q?=EC=9C=BC=EB=A1=9C=20=EC=B6=9C=EB=A0=A5=EC=95=88=EB=90=98?=
 =?UTF-8?q?=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20=ED=95=B4=EA=B2=B0=20:=20?=
 =?UTF-8?q?=EC=97=94=ED=8B=B0=ED=8B=B0=20=EC=A1=B0=EC=9D=B8=20=EC=BF=BC?=
 =?UTF-8?q?=EB=A6=AC=20=EC=83=9D=EC=84=B1=20=EC=8B=9C=20=EB=8F=99=EC=9D=BC?=
 =?UTF-8?q?=ED=95=9C=20=EC=BB=AC=EB=9F=BC=20=EB=B3=84=EC=B9=AD=EC=9D=B4=20?=
 =?UTF-8?q?=EC=A4=91=EB=B3=B5=20=EC=83=9D=EC=84=B1=EB=90=98=EC=96=B4=20SQL?=
 =?UTF-8?q?=20=EC=97=90=EB=9F=AC=20=EB=B0=9C=EC=83=9D=ED=95=98=EB=8D=98=20?=
 =?UTF-8?q?=EB=AC=B8=EC=A0=9C=20=EB=B0=A9=EC=A7=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/services/entityJoinService.ts         | 36 +++++++++++++++----
 .../SplitPanelLayoutComponent.tsx             | 19 ++++++++--
 2 files changed, 45 insertions(+), 10 deletions(-)

diff --git a/backend-node/src/services/entityJoinService.ts b/backend-node/src/services/entityJoinService.ts
index 25d96927..86762b64 100644
--- a/backend-node/src/services/entityJoinService.ts
+++ b/backend-node/src/services/entityJoinService.ts
@@ -334,6 +334,10 @@ export class EntityJoinService {
         );
       });
 
+      // 🔧 _label 별칭 중복 방지를 위한 Set
+      // 같은 sourceColumn에서 여러 조인 설정이 있을 때 _label은 첫 번째만 생성
+      const generatedLabelAliases = new Set<string>();
+
       const joinColumns = joinConfigs
         .map((config) => {
           const aliasKey = `${config.referenceTable}:${config.sourceColumn}`;
@@ -368,16 +372,26 @@ export class EntityJoinService {
 
               // _label 필드도 함께 SELECT (프론트엔드 getColumnUniqueValues용)
               // sourceColumn_label 형식으로 추가
-              resultColumns.push(
-                `COALESCE(${alias}.${col}::TEXT, '') AS ${config.sourceColumn}_label`
-              );
+              // 🔧 중복 방지: 같은 sourceColumn에서 _label은 첫 번째만 생성
+              const labelAlias = `${config.sourceColumn}_label`;
+              if (!generatedLabelAliases.has(labelAlias)) {
+                resultColumns.push(
+                  `COALESCE(${alias}.${col}::TEXT, '') AS ${labelAlias}`
+                );
+                generatedLabelAliases.add(labelAlias);
+              }
 
               // 🆕 referenceColumn (PK)도 항상 SELECT (parentDataMapping용)
               // 예: customer_code, item_number 등
               // col과 동일해도 별도의 alias로 추가 (customer_code as customer_code)
-              resultColumns.push(
-                `COALESCE(${alias}.${config.referenceColumn}::TEXT, '') AS ${config.referenceColumn}`
-              );
+              // 🔧 중복 방지: referenceColumn도 한 번만 추가
+              const refColAlias = config.referenceColumn;
+              if (!generatedLabelAliases.has(refColAlias)) {
+                resultColumns.push(
+                  `COALESCE(${alias}.${config.referenceColumn}::TEXT, '') AS ${refColAlias}`
+                );
+                generatedLabelAliases.add(refColAlias);
+              }
             } else {
               resultColumns.push(
                 `COALESCE(main.${col}::TEXT, '') AS ${config.aliasColumn}`
@@ -392,6 +406,11 @@ export class EntityJoinService {
 
               const individualAlias = `${config.sourceColumn}_${col}`;
 
+              // 🔧 중복 방지: 같은 alias가 이미 생성되었으면 스킵
+              if (generatedLabelAliases.has(individualAlias)) {
+                return;
+              }
+
               if (isJoinTableColumn) {
                 // 조인 테이블 컬럼은 조인 별칭 사용
                 resultColumns.push(
@@ -403,6 +422,7 @@ export class EntityJoinService {
                   `COALESCE(main.${col}::TEXT, '') AS ${individualAlias}`
                 );
               }
+              generatedLabelAliases.add(individualAlias);
             });
 
             // 🆕 referenceColumn (PK)도 함께 SELECT (parentDataMapping용)
@@ -410,11 +430,13 @@ export class EntityJoinService {
               config.referenceTable && config.referenceTable !== tableName;
             if (
               isJoinTableColumn &&
-              !displayColumns.includes(config.referenceColumn)
+              !displayColumns.includes(config.referenceColumn) &&
+              !generatedLabelAliases.has(config.referenceColumn) // 🔧 중복 방지
             ) {
               resultColumns.push(
                 `COALESCE(${alias}.${config.referenceColumn}::TEXT, '') AS ${config.referenceColumn}`
               );
+              generatedLabelAliases.add(config.referenceColumn);
             }
           }
 
diff --git a/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx b/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
index 869d2c3c..ab387348 100644
--- a/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
+++ b/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
@@ -924,10 +924,15 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
             const { entityJoinApi } = await import("@/lib/api/entityJoin");
 
             // 복합키 조건 생성
+            // 🔧 entity 타입 컬럼은 코드 값으로 정확히 매칭해야 하므로 operator: 'equals' 사용
             const searchConditions: Record<string, any> = {};
             keys.forEach((key) => {
               if (key.leftColumn && key.rightColumn && leftItem[key.leftColumn] !== undefined) {
-                searchConditions[key.rightColumn] = leftItem[key.leftColumn];
+                // 연결 필터는 정확한 값 매칭이 필요하므로 equals 연산자 사용
+                searchConditions[key.rightColumn] = {
+                  value: leftItem[key.leftColumn],
+                  operator: "equals",
+                };
               }
             });
 
@@ -1033,16 +1038,24 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
 
           if (keys && keys.length > 0) {
             // 복합키
+            // 🔧 entity 타입 컬럼은 코드 값으로 정확히 매칭해야 하므로 operator: 'equals' 사용
             keys.forEach((key) => {
               if (key.leftColumn && key.rightColumn && leftItem[key.leftColumn] !== undefined) {
-                searchConditions[key.rightColumn] = leftItem[key.leftColumn];
+                searchConditions[key.rightColumn] = {
+                  value: leftItem[key.leftColumn],
+                  operator: "equals",
+                };
               }
             });
           } else {
             // 단일키
+            // 🔧 entity 타입 컬럼은 코드 값으로 정확히 매칭해야 하므로 operator: 'equals' 사용
             const leftValue = leftItem[leftColumn];
             if (leftValue !== undefined) {
-              searchConditions[rightColumn] = leftValue;
+              searchConditions[rightColumn] = {
+                value: leftValue,
+                operator: "equals",
+              };
             }
           }
 

From 0907d318ebd096b658b5a56ab407f7d8ff7ddcb5 Mon Sep 17 00:00:00 2001
From: SeongHyun Kim <kksh7842@gmail.com>
Date: Tue, 20 Jan 2026 17:05:36 +0900
Subject: [PATCH 6/6] =?UTF-8?q?fix:=20=EC=88=98=EC=A0=95=20=EB=AA=A8?=
 =?UTF-8?q?=EB=93=9C=EC=97=90=EC=84=9C=20=EC=B1=84=EB=B2=88=20=EC=BD=94?=
 =?UTF-8?q?=EB=93=9C=20=EC=9E=AC=ED=95=A0=EB=8B=B9=20=EB=B0=A9=EC=A7=80=20?=
 =?UTF-8?q?handleSave():=20formData.id=20=EC=B2=B4=ED=81=AC=EB=A1=9C=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95=20=EB=AA=A8=EB=93=9C=20=ED=8C=90=EB=B3=84,?=
 =?UTF-8?q?=20=EA=B8=B0=EC=A1=B4=20=EB=B2=88=ED=98=B8=20=EC=9C=A0=EC=A7=80?=
 =?UTF-8?q?=20handleUniversalFormModalTableSectionSave():=20formData.id=20?=
 =?UTF-8?q?=EB=B0=8F=20originalGroupedData=20=EC=B2=B4=ED=81=AC=EB=A1=9C?=
 =?UTF-8?q?=20=EC=88=98=EC=A0=95=20=EB=AA=A8=EB=93=9C=20=ED=8C=90=EB=B3=84?=
 =?UTF-8?q?=20=EC=8B=A0=EA=B7=9C=20=EB=93=B1=EB=A1=9D=20=EC=8B=9C=EC=97=90?=
 =?UTF-8?q?=EB=A7=8C=20allocateCode=20=ED=98=B8=EC=B6=9C=ED=95=98=EC=97=AC?=
 =?UTF-8?q?=20=EC=B1=84=EB=B2=88=20=EC=BD=94=EB=93=9C=20=ED=95=A0=EB=8B=B9?=
 =?UTF-8?q?=20=EC=9E=85=EA=B3=A0=EA=B4=80=EB=A6=AC=20=ED=99=94=EB=A9=B4?=
 =?UTF-8?q?=EC=97=90=EC=84=9C=20=EC=88=98=EC=A0=95=20=EC=8B=9C=20=EC=9E=85?=
 =?UTF-8?q?=EA=B3=A0=EB=B2=88=ED=98=B8=20=EC=A6=9D=EA=B0=80=20=EB=AC=B8?=
 =?UTF-8?q?=EC=A0=9C=20=ED=95=B4=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/lib/utils/buttonActions.ts | 64 +++++++++++++++++++++--------
 1 file changed, 46 insertions(+), 18 deletions(-)

diff --git a/frontend/lib/utils/buttonActions.ts b/frontend/lib/utils/buttonActions.ts
index b0ac2ba9..af342a1f 100644
--- a/frontend/lib/utils/buttonActions.ts
+++ b/frontend/lib/utils/buttonActions.ts
@@ -707,12 +707,19 @@ export class ButtonActionExecutor {
 
     if (repeaterJsonKeys.length > 0) {
       console.log("🔄 [handleSave] RepeaterFieldGroup JSON 문자열 감지:", repeaterJsonKeys);
-      
+
       // 🎯 채번 규칙 할당 처리 (RepeaterFieldGroup 저장 전에 실행)
-      console.log("🔍 [handleSave-RepeaterFieldGroup] 채번 규칙 할당 체크 시작");
-      
+      // 🔧 수정 모드 체크: formData.id가 존재하면 UPDATE 모드이므로 채번 코드 재할당 금지
+      const isEditModeRepeater =
+        context.formData.id !== undefined && context.formData.id !== null && context.formData.id !== "";
+
+      console.log("🔍 [handleSave-RepeaterFieldGroup] 채번 규칙 할당 체크 시작", {
+        isEditMode: isEditModeRepeater,
+        formDataId: context.formData.id,
+      });
+
       const fieldsWithNumberingRepeater: Record<string, string> = {};
-      
+
       // formData에서 채번 규칙이 설정된 필드 찾기
       for (const [key, value] of Object.entries(context.formData)) {
         if (key.endsWith("_numberingRuleId") && value) {
@@ -721,22 +728,27 @@ export class ButtonActionExecutor {
           console.log(`🎯 [handleSave-RepeaterFieldGroup] 채번 필드 발견: ${fieldName} → 규칙 ${value}`);
         }
       }
-      
+
       console.log("📋 [handleSave-RepeaterFieldGroup] 채번 규칙이 설정된 필드:", fieldsWithNumberingRepeater);
-      
-      // 채번 규칙이 있는 필드에 대해 allocateCode 호출
-      if (Object.keys(fieldsWithNumberingRepeater).length > 0) {
-        console.log("🎯 [handleSave-RepeaterFieldGroup] 채번 규칙 할당 시작 (allocateCode 호출)");
+
+      // 🔧 수정 모드에서는 채번 코드 할당 건너뛰기 (기존 번호 유지)
+      // 신규 등록 모드에서만 allocateCode 호출하여 새 번호 할당
+      if (Object.keys(fieldsWithNumberingRepeater).length > 0 && !isEditModeRepeater) {
+        console.log(
+          "🎯 [handleSave-RepeaterFieldGroup] 신규 등록 모드 - 채번 규칙 할당 시작 (allocateCode 호출)",
+        );
         const { allocateNumberingCode } = await import("@/lib/api/numberingRule");
-        
+
         for (const [fieldName, ruleId] of Object.entries(fieldsWithNumberingRepeater)) {
           try {
             console.log(`🔄 [handleSave-RepeaterFieldGroup] ${fieldName} 필드에 대해 allocateCode 호출: ${ruleId}`);
             const allocateResult = await allocateNumberingCode(ruleId);
-            
+
             if (allocateResult.success && allocateResult.data?.generatedCode) {
               const newCode = allocateResult.data.generatedCode;
-              console.log(`✅ [handleSave-RepeaterFieldGroup] ${fieldName} 새 코드 할당: ${context.formData[fieldName]} → ${newCode}`);
+              console.log(
+                `✅ [handleSave-RepeaterFieldGroup] ${fieldName} 새 코드 할당: ${context.formData[fieldName]} → ${newCode}`,
+              );
               context.formData[fieldName] = newCode;
             } else {
               console.warn(`⚠️ [handleSave-RepeaterFieldGroup] ${fieldName} 코드 할당 실패:`, allocateResult.error);
@@ -745,9 +757,11 @@ export class ButtonActionExecutor {
             console.error(`❌ [handleSave-RepeaterFieldGroup] ${fieldName} 코드 할당 오류:`, allocateError);
           }
         }
+      } else if (isEditModeRepeater) {
+        console.log("⏭️ [handleSave-RepeaterFieldGroup] 수정 모드 - 채번 코드 할당 건너뜀 (기존 번호 유지)");
       }
-      
-      console.log("✅ [handleSave-RepeaterFieldGroup] 채번 규칙 할당 완료");
+
+      console.log("✅ [handleSave-RepeaterFieldGroup] 채번 규칙 할당 처리 완료");
       
       // 🆕 상단 폼 데이터(마스터 정보) 추출
       // RepeaterFieldGroup JSON과 컴포넌트 키를 제외한 나머지가 마스터 정보
@@ -1951,7 +1965,16 @@ export class ButtonActionExecutor {
     }
 
     // 🎯 채번 규칙 할당 처리 (저장 시점에 실제 순번 증가)
-    console.log("🔍 [handleUniversalFormModalTableSectionSave] 채번 규칙 할당 체크 시작");
+    // 🔧 수정 모드 체크: formData.id 또는 originalGroupedData가 있으면 UPDATE 모드
+    const isEditModeUniversal =
+      (formData.id !== undefined && formData.id !== null && formData.id !== "") ||
+      originalGroupedData.length > 0;
+
+    console.log("🔍 [handleUniversalFormModalTableSectionSave] 채번 규칙 할당 체크 시작", {
+      isEditMode: isEditModeUniversal,
+      formDataId: formData.id,
+      originalGroupedDataCount: originalGroupedData.length,
+    });
 
     const fieldsWithNumbering: Record<string, string> = {};
 
@@ -1977,9 +2000,12 @@ export class ButtonActionExecutor {
 
     console.log("📋 [handleUniversalFormModalTableSectionSave] 채번 규칙이 설정된 필드:", fieldsWithNumbering);
 
-    // 🔥 저장 시점에 allocateCode 호출하여 실제 순번 증가
-    if (Object.keys(fieldsWithNumbering).length > 0) {
-      console.log("🎯 [handleUniversalFormModalTableSectionSave] 채번 규칙 할당 시작 (allocateCode 호출)");
+    // 🔧 수정 모드에서는 채번 코드 할당 건너뛰기 (기존 번호 유지)
+    // 신규 등록 모드에서만 allocateCode 호출하여 새 번호 할당
+    if (Object.keys(fieldsWithNumbering).length > 0 && !isEditModeUniversal) {
+      console.log(
+        "🎯 [handleUniversalFormModalTableSectionSave] 신규 등록 모드 - 채번 규칙 할당 시작 (allocateCode 호출)",
+      );
       const { allocateNumberingCode } = await import("@/lib/api/numberingRule");
 
       for (const [fieldName, ruleId] of Object.entries(fieldsWithNumbering)) {
@@ -2006,6 +2032,8 @@ export class ButtonActionExecutor {
           // 오류 시 기존 값 유지
         }
       }
+    } else if (isEditModeUniversal) {
+      console.log("⏭️ [handleUniversalFormModalTableSectionSave] 수정 모드 - 채번 코드 할당 건너뜀 (기존 번호 유지)");
     }
 
     console.log("✅ [handleUniversalFormModalTableSectionSave] 채번 규칙 할당 완료");