반복 데이터 입력컴포넌트 통합중

frontend/components/screen/panels/ComponentsPanel.tsx

@@ -92,6 +92,14 @@ export function ComponentsPanel({
       tags: ["tree", "org", "bom", "cascading", "unified"],
       defaultSize: { width: 400, height: 300 },
     },
+    {
+      id: "unified-repeater",
+      name: "통합 반복 데이터",
+      description: "반복 데이터 관리 (인라인/모달/버튼 모드)",
+      category: "data" as ComponentCategory,
+      tags: ["repeater", "table", "modal", "button", "unified"],
+      defaultSize: { width: 600, height: 300 },
+    },
   ], []);
 
   // 카테고리별 컴포넌트 그룹화

frontend/lib/registry/DynamicComponentRenderer.tsx

@@ -18,6 +18,7 @@ import {
   UnifiedBiz,
   UnifiedHierarchy,
 } from "@/components/unified";
+import { UnifiedRepeater } from "@/components/unified/UnifiedRepeater";
 
 // 컴포넌트 렌더러 인터페이스
 export interface ComponentRenderer {
@@ -392,6 +393,42 @@ export const DynamicComponentRenderer: React.FC<DynamicComponentRendererProps> =
           />
         );
 
+      case "unified-repeater":
+        return (
+          <UnifiedRepeater
+            config={{
+              renderMode: config.renderMode || "inline",
+              dataSource: config.dataSource || {
+                tableName: "",
+                foreignKey: "",
+                referenceKey: "",
+              },
+              columns: config.columns || [],
+              modal: config.modal,
+              button: config.button,
+              features: config.features || {
+                showAddButton: true,
+                showDeleteButton: true,
+                inlineEdit: false,
+                dragSort: false,
+                showRowNumber: false,
+                selectable: false,
+                multiSelect: false,
+              },
+            }}
+            parentId={props.formData?.[config.dataSource?.referenceKey] || props.formData?.id}
+            onDataChange={(data) => {
+              console.log("UnifiedRepeater data changed:", data);
+            }}
+            onRowClick={(row) => {
+              console.log("UnifiedRepeater row clicked:", row);
+            }}
+            onButtonClick={(action, row, buttonConfig) => {
+              console.log("UnifiedRepeater button clicked:", action, row, buttonConfig);
+            }}
+          />
+        );
+
       default:
         return (
           <div className="flex h-full w-full items-center justify-center rounded border-2 border-dashed border-amber-300 bg-amber-50 p-4">

frontend/types/unified-repeater.ts

@@ -1,11 +1,11 @@
 /**
  * UnifiedRepeater 컴포넌트 타입 정의
  * 
- * 기존 컴포넌트 통합:
+ * 렌더링 모드:
- * - simple-repeater-table: 인라인 모드
+ * - inline: 현재 테이블 컬럼 직접 입력 (simple-repeater-table)
- * - modal-repeater-table: 모달 모드
+ * - modal: 소스 테이블에서 검색/선택 후 복사 (modal-repeater-table)
- * - repeat-screen-modal: 화면 기반 모달 모드
+ * - button: 버튼으로 관련 화면 열기 (related-data-buttons)
- * - related-data-buttons: 버튼 모드
+ * - mixed: inline + modal 혼합
  */
 
 // 렌더링 모드
@@ -35,6 +35,7 @@ export interface RepeaterColumnConfig {
   title: string;
   width: ColumnWidthOption;
   visible: boolean;
+  editable?: boolean; // 편집 가능 여부 (inline 모드)
   isJoinColumn?: boolean;
   sourceTable?: string;
 }
@@ -62,10 +63,25 @@ export interface CommonCodeButtonConfig {
   variantMapping?: Record<string, ButtonVariant>; // 코드값별 색상 매핑
 }
 
+// 모달 표시 컬럼 (라벨 포함)
+export interface ModalDisplayColumn {
+  key: string;
+  label: string;
+}
+
 // 모달 설정
 export interface RepeaterModalConfig {
-  screenId?: number;
+  // 기본 설정
   size: ModalSize;
+  title?: string; // 모달 제목
+  buttonText?: string; // 검색 버튼 텍스트
+  
+  // 소스 테이블 표시 설정 (modal 모드)
+  sourceDisplayColumns?: ModalDisplayColumn[]; // 모달에 표시할 소스 테이블 컬럼 (라벨 포함)
+  searchFields?: string[]; // 검색에 사용할 필드
+  
+  // 화면 기반 모달 (옵션)
+  screenId?: number;
   titleTemplate?: {
     prefix?: string;
     columnKey?: string;
@@ -84,25 +100,55 @@ export interface RepeaterFeatureOptions {
   multiSelect: boolean;
 }
 
+// 데이터 소스 설정
+export interface RepeaterDataSource {
+  // inline 모드: 현재 테이블 설정은 필요 없음 (컬럼만 선택)
+  
+  // modal 모드: 소스 테이블 설정
+  sourceTable?: string;       // 검색할 테이블 (엔티티 참조 테이블)
+  foreignKey?: string;        // 현재 테이블의 FK 컬럼 (part_objid 등)
+  referenceKey?: string;      // 소스 테이블의 PK 컬럼 (id 등)
+  displayColumn?: string;     // 표시할 컬럼 (item_name 등)
+  
+  // 추가 필터
+  filter?: {
+    column: string;
+    value: string;
+  };
+}
+
+// 컬럼 매핑 (modal 모드에서 소스→타겟 복사용)
+export interface ColumnMapping {
+  sourceColumn: string;
+  targetColumn: string;
+  transform?: "copy" | "reference"; // copy: 값 복사, reference: ID 참조
+}
+
+// 계산 규칙
+export interface CalculationRule {
+  id: string;
+  targetColumn: string;
+  formula: string; // 예: "quantity * unit_price"
+  label?: string;
+}
+
 // 메인 설정 타입
 export interface UnifiedRepeaterConfig {
   // 렌더링 모드
   renderMode: RepeaterRenderMode;
 
   // 데이터 소스 설정
-  dataSource: {
+  dataSource: RepeaterDataSource;
-    tableName: string;        // 데이터 테이블
-    foreignKey: string;       // 연결 키 (FK) - 데이터 테이블의 컬럼
-    referenceKey: string;     // 상위 키 - 현재 화면 테이블의 컬럼 (부모 ID)
-    filter?: {                // 추가 필터 조건
-      column: string;
-      value: string;
-    };
-  };
 
-  // 컬럼 설정
+  // 컬럼 설정 (inline: 입력 컬럼, modal: 표시 컬럼)
   columns: RepeaterColumnConfig[];
 
+  // 컬럼 매핑 (modal 모드)
+  columnMappings?: ColumnMapping[];
+
+  // 계산 규칙 (modal 모드)
+  calculationRules?: CalculationRule[];
+
   // 모달 설정 (modal, mixed 모드)
   modal?: RepeaterModalConfig;
 
@@ -141,14 +187,12 @@ export interface UnifiedRepeaterProps {
 // 기본 설정값
 export const DEFAULT_REPEATER_CONFIG: UnifiedRepeaterConfig = {
   renderMode: "inline",
-  dataSource: {
+  dataSource: {},
-    tableName: "",
-    foreignKey: "",
-    referenceKey: "",
-  },
   columns: [],
   modal: {
-    size: "md",
+    size: "lg",
+    sourceDisplayColumns: [],
+    searchFields: [],
   },
   button: {
     sourceType: "manual",
@@ -159,20 +203,20 @@ export const DEFAULT_REPEATER_CONFIG: UnifiedRepeaterConfig = {
   features: {
     showAddButton: true,
     showDeleteButton: true,
-    inlineEdit: false,
+    inlineEdit: true,
     dragSort: false,
     showRowNumber: false,
     selectable: false,
-    multiSelect: false,
+    multiSelect: true,
   },
 };
 
 // 고정 옵션들 (콤보박스용)
 export const RENDER_MODE_OPTIONS = [
-  { value: "inline", label: "인라인 (테이블)" },
+  { value: "inline", label: "인라인 (직접 입력)" },
-  { value: "modal", label: "모달" },
+  { value: "modal", label: "모달 (검색 선택)" },
   { value: "button", label: "버튼" },
-  { value: "mixed", label: "혼합 (테이블 + 버튼)" },
+  { value: "mixed", label: "혼합 (입력 + 검색)" },
 ] as const;
 
 export const MODAL_SIZE_OPTIONS = [
@@ -227,4 +271,3 @@ export const LABEL_FIELD_OPTIONS = [
   { value: "codeName", label: "코드명" },
   { value: "codeValue", label: "코드값" },
 ] as const;
-