kjs
/
ERP-node
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity
ERP-node/.agent-pipeline/collab/collab-20260227160003-hpn2....

85 lines
12 KiB
JSON
Raw Permalink Normal View History

테스트 받지말것.
2026-03-01 03:39:00 +09:00
{
"featureDescription": "Phase E: 테이블 드롭 → 자동 화면 생성 시스템\n\n## 목표\n테이블을 캔버스에 드롭하면 \"화면 자동 생성\" 모달이 열리고,\n사용자가 형태(목록형/폼형/마스터-디테일/카드형)와 컬럼을 선택하면\n메타 컴포넌트(Search + DataView + Action + Modal/Field) 세트가 자동 생성된다.\n\n## 구현 파일\n\n### 1. 자동 생성 모달 컴포넌트 (신규)\n**파일**: `frontend/lib/meta-components/auto-generate/AutoGenerateModal.tsx`\n\nprops:\n```typescript\ninterface AutoGenerateModalProps {\n isOpen: boolean;\n onClose: () => void;\n tableName: string;\n tableLabel: string;\n columns: { columnName: string; label: string; webType: string; required: boolean; }[];\n onGenerate: (config: AutoGenerateConfig) => void;\n}\n\ninterface AutoGenerateConfig {\n templateType: \"list\" | \"form\" | \"master-detail\" | \"card\";\n selectedColumns: string[];\n includeSearch: boolean;\n includeCrud: boolean; // CRUD 버튼 포함 여부\n includeModal: boolean; // 등록/수정 모달 포함 여부\n}\n```\n\nUI 구성:\n```\n┌─────────────────────────────────────┐\n│ 화면 자동 생성 [×] │\n├─────────────────────────────────────┤\n│ 테이블: sales_order_mng (수주관리) │\n│ │\n│ 어떤 형태로 만들까요? │\n│ ┌─────┐ ┌─────┐ ┌─────┐ ┌─────┐ │\n│ │목록형│ │폼형 │ │마디 │ │카드 │ │\n│ │ ≡≡≡ │ │ □□ │ │≡≡│□│ │ ▦▦▦ │ │\n│ └─────┘ └─────┘ └─────┘ └─────┘ │\n│ │\n│ 포함할 컬럼: │\n│ ☑ order_no (수주번호) │\n│ ☑ customer_code (거래처) │\n│ ☑ order_date (수주일) │\n│ ☐ created_by (생성자) [숨김 추천] │\n│ │\n│ 옵션: │\n│ ☑ 검색 바 포함 │\n│ ☑ CRUD 버튼 포함 │\n│ ☑ 등록/수정 모달 포함 │\n│ │\n│ [생성하기] │\n└─────────────────────────────────────┘\n```\n\n- shadcn Dialog 사용 (max-w-[95vw] sm:max-w-[600px])\n- 템플릿 타입은 4개 카드로 선택 (선택 시 border-primary)\n- 컬럼 목록은 체크박스로 선택/해제\n- created_by, updated_at, created_date 등 시스템 컬럼은 기본 체크 해제 + \"[숨김 추천]\" 표시\n- \"use client\" 선언\n\n### 2. 자동 생성 로직 (신규)\n**파일**: `frontend/lib/meta-components/auto-generate/generateComponents.ts`\n\n```typescript\nexport function generateComponents(\n tableName: string,\n tableLabel: string,\n config: AutoGenerateConfig,\n columns: ColumnInfo[],\n startX: number,\n startY: number\n): ComponentData[]\n```\n\ntemplateType별 생성 로직:\n\n**목록형 (list)**:\n1. Search 컴포넌트 (mode: \"combined\", y: startY)\n2. Action 그룹 (등록/삭제 버튼, y: startY + 60)\n3. DataView 컴포넌트 (viewMode: \"table\", y: startY + 110)\n4. Modal 컴포넌트 (trigger: \"button\", form, y: startY + 510)\n\n**폼형 (form)**:\n1. Field 컴포넌트들 (selectedColumns 각각, 2열 그리드 배치)\n2. Action 그룹 (저장/취소 버튼)\n\n**마스터-디테일 (master-detail)**:\n1. Layout (mode: \"columns\", areas: [\"master\", \"detail\"])\n2. 좌측(master): Search + DataView (table)\n3. 우측(detail): Field 컴포넌트들 + Action (저장)\n\n**카드형 (card)**:\n1. Search 컴포넌트 (mode: \"simple\")\n2. DataView 컴포넌트
"round": 2,
"maxRounds": 5,
"agents": [
"frontend"
],
"messages": [
{
"round": 1,
"from": "frontend",
"type": "implementation",
"content": "Phase E 테이블 드롭 → 자동 화면 생성 시스템 구현 완료\n\n사용자가 테이블을 캔버스에 드롭하면 '화면 자동 생성' 모달이 열리고, 템플릿 타입(목록형/폼형/마스터-디테일/카드형)과 컬럼을 선택하면 메타 컴포넌트 세트가 자동 생성됩니다.\n\n**구현 파일**:\n1. `AutoGenerateModal.tsx`: 자동 생성 모달 UI (shadcn Dialog 기반, 반응형)\n2. `generateComponents.ts`: 템플릿별 메타 컴포넌트 자동 생성 로직 (목록형/폼형/마스터-디테일/카드형)\n3. `auto-generate/index.ts`: export 통합\n4. `lib/meta-components/index.ts`: 자동 생성 시스템 export 추가\n5. `ScreenDesigner.tsx`: 테이블 드롭 핸들러 수정 + 모달 통합\n\n**주요 기능**:\n- 4가지 템플릿: 목록형 (Search+DataView+Modal), 폼형 (Field 2열 배치), 마스터-디테일 (좌측 목록+우측 상세), 카드형 (카드뷰)\n- 시스템 컬럼 자동 감지 및 '숨김 권장' 표시\n- 옵션: 검색 바, CRUD 버튼, 등록/수정 모달 포함 여부 선택\n- 반응형 디자인 (mobile-first)\n- 생성된 컴포넌트는 자동으로 레이아웃에 추가되고 히스토리에 저장됨",
"timestamp": "2026-02-27T16:04:22.565Z"
},
{
"round": 2,
"from": "frontend",
"type": "fix",
"content": "Phase E 테이블 자동 생성 시스템 버그 수정 완료\n\nRound 1에서 구현한 코드에 2가지 버그 발견 및 수정:\n\n1. **모달 상태 리셋 누락**: 모달을 닫았다 다시 열면 이전 선택 상태가 남아 있던 문제 → `useEffect`로 `isOpen` 변경 시 리셋 로직 추가\n\n2. **하드코딩된 ID 충돌**: 같은 템플릿을 여러 번 생성하면 ID가 중복되어 컴포넌트 간 참조가 꼬이던 문제 → 모든 ID를 `generateComponentId()`로 동적 생성하고, Action → DataView 참조를 변수로 연결\n\n이제 테이블을 드롭하면 자동 생성 모달이 열리고, 사용자가 템플릿과 컬럼을 선택하면 메타 컴포넌트 세트가 생성됩니다. 같은 템플릿을 여러 번 생성해도 ID 충돌 없이 독립적으로 동작합니다.",
"timestamp": "2026-02-27T16:06:42.204Z"
}
],
"artifacts": [
{
"agent": "frontend",
"round": 1,
"filePath": "frontend/lib/meta-components/auto-generate/AutoGenerateModal.tsx",
"action": "create",
"summary": "자동 생성 모달 UI 컴포넌트 (템플릿 선택, 컬럼 선택, 옵션 설정)"
},
{
"agent": "frontend",
"round": 1,
"filePath": "frontend/lib/meta-components/auto-generate/generateComponents.ts",
"action": "create",
"summary": "템플릿별 메타 컴포넌트 자동 생성 로직 (4가지 템플릿 지원)"
},
{
"agent": "frontend",
"round": 1,
"filePath": "frontend/lib/meta-components/auto-generate/index.ts",
"action": "create",
"summary": "자동 생성 시스템 export"
},
{
"agent": "frontend",
"round": 1,
"filePath": "frontend/lib/meta-components/index.ts",
"action": "modify",
"summary": "자동 생성 시스템 re-export 추가"
},
{
"agent": "frontend",
"round": 1,
"filePath": "frontend/components/screen/ScreenDesigner.tsx",
"action": "modify",
"summary": "테이블 드롭 핸들러 수정 + 자동 생성 모달 통합 (state, handler, JSX 추가)"
},
{
"agent": "frontend",
"round": 2,
"filePath": "frontend/lib/meta-components/auto-generate/AutoGenerateModal.tsx",
"action": "modify",
"summary": "useEffect 추가 - 모달 열릴 때마다 선택 상태 리셋 (템플릿, 컬럼 선택)"
},
{
"agent": "frontend",
"round": 2,
"filePath": "frontend/lib/meta-components/auto-generate/generateComponents.ts",
"action": "modify",
"summary": "하드코딩된 ID 제거 - 모든 컴포넌트 ID를 generateComponentId()로 동적 생성 + Action → DataView 참조를 변수로 연결"
}
],
"testResults": [
{
"passed": true,
"exitCode": 0,
"stdout": "EXIT:0\n",
"stderr": "",
"duration": 4053
}
],
"converged": true
}