diff --git a/sam/docs/features/rd/planning-design.md b/sam/docs/features/rd/planning-design.md index b69a9f1..695d95c 100644 --- a/sam/docs/features/rd/planning-design.md +++ b/sam/docs/features/rd/planning-design.md @@ -169,6 +169,7 @@ ERP 화면 기획서(스토리보드)를 **브라우저 내에서 직접 설계* | 블록 이동 | 드래그 앤 드롭 (단일/다중) | | 블록 리사이즈 | 선택 후 우측/하단/우하단 핸들 드래그 | | 블록 편집 | 더블클릭 → contenteditable 활성화 | +| 이미지 업로드 | 이미지 블록 더블클릭 → 파일 선택 (드래그 충돌 방지) | | 블록 복제 | 우상단 ⧉ 버튼 또는 Ctrl+C → Ctrl+V | | 블록 삭제 | 우상단 × 버튼 또는 Delete 키 | | 블록 잘라내기 | Ctrl+X | @@ -248,7 +249,17 @@ ERP 화면 기획서(스토리보드)를 **브라우저 내에서 직접 설계* - 블록 추가/삭제/이동/리사이즈/서식 변경 모두 스냅샷 저장 - 히스토리 분기: 중간 상태에서 새 작업 시 이후 히스토리 폐기 -### 4.8 템플릿 시스템 +### 4.8 작업 영역 극대화 + +| 기능 | 설명 | +|------|------| +| 사이드바 접기 | 좌측 패널 탭 바의 `<<` 버튼 → 메뉴트리 패널 숨김 | +| 사이드바 펼치기 | 좌측 가장자리 `>` 버튼 → 메뉴트리 패널 복원 | +| Description 접기 | Description 영역 상단 토글 바 클릭 → 패널 숨김 | +| 캔버스 폭 자동 확장 | 사이드바 접힘 시 페이지 폭 1100px → 1400px | +| 패딩 축소 | sb-editor padding 24px → 12px | + +### 4.9 템플릿 시스템 | 유형 | 설명 | |------|------| @@ -323,7 +334,7 @@ mng/ ├── app/Http/Controllers/ │ └── RdController.php ← planningDesign() 메서드 (L308) └── resources/views/rd/planning-design/ - └── index.blade.php ← 전체 CSS + HTML + Alpine.js (~4,300줄) + └── index.blade.php ← 전체 CSS + HTML + Alpine.js (~4,430줄) ``` > **단일 파일 구조**: 이 기능은 서버 API가 없으며, 모든 CSS/HTML/JS가 `index.blade.php` 하나에 포함된다. Alpine.js `x-data` 객체 내에 모든 상태와 메서드가 정의되어 있다. @@ -341,6 +352,7 @@ mng/ | PDF 내보내기 | 직접 PDF 생성 | 낮음 | | 리치 텍스트 | 블록 내 부분 텍스트 서식 (인라인 B/I/색상) | 중간 | | 스냅샷/버전 관리 | 명시적 버전 저장 및 비교 | 낮음 | +| 이미지 드래그 업로드 | 외부 이미지를 캔버스로 드래그 앤 드롭 | 낮음 | --- diff --git a/sam/docs/projects/index_projects.md b/sam/docs/projects/index_projects.md index 134cbed..7ce5106 100644 --- a/sam/docs/projects/index_projects.md +++ b/sam/docs/projects/index_projects.md @@ -19,7 +19,7 @@ | [migration-5130-mng](#migration-5130-mng---5130--mng-마이그레이션) | 🟡 진행중 | 5130 → mng 통합 마이그레이션 | | [e-sign](#e-sign---전자계약-서명) | 🟢 v1.0 구현 완료 | 전자계약 서명 솔루션 (SAM E-Sign) | | [org-chart](#org-chart---조직도-관리) | 🟢 v1.0 구현 완료 | 트리형 조직도 관리 (드래그앤드롭, 숨기기) | -| [planning-design](#planning-design---기획디자인-스토리보드-에디터) | 🟢 v1.1 운영 중 | 브라우저 블록 에디터 (Notion/Figma 스타일) | +| [planning-design](#planning-design---기획디자인-스토리보드-에디터) | 🟢 v1.2 운영 중 | 브라우저 블록 에디터 (Notion/Figma 스타일) | --- @@ -231,7 +231,7 @@ ### planning-design - 기획디자인 스토리보드 에디터 **경로**: `docs/projects/planning-design/` -**상태**: 🟢 v1.1 운영 중 (고도화 진행중) +**상태**: 🟢 v1.2 운영 중 (고도화 진행중) **목표**: 브라우저 내 Notion/Figma 스타일 블록 에디터로 ERP 화면 기획서 작성 **핵심 문서**: @@ -244,6 +244,7 @@ | 블록 유형 | 15종 (텍스트/레이아웃/UI모형/미디어/체크리스트) | | 편집 기능 | 올가미 선택, Undo/Redo, 복사/잘라내기, 서식 | | 서식 시스템 | 글자색/배경색/크기/굵기/기울임/정렬/z-index | +| 작업 영역 | 사이드바/Description 접기/펼치기, 캔버스 폭 자동 확장 | | 출력 | HTML 내보내기 + A4 인쇄 (좌표 기반 WYSIWYG) | **기술 스택**: Alpine.js + localStorage (서버 API 없음) diff --git a/sam/docs/projects/planning-design/README.md b/sam/docs/projects/planning-design/README.md index 4b90dda..12dba75 100644 --- a/sam/docs/projects/planning-design/README.md +++ b/sam/docs/projects/planning-design/README.md @@ -1,7 +1,7 @@ # 기획디자인 스토리보드 에디터 > **시작일**: 2026-03-07 -> **상태**: 🟢 v1.0 운영 중 (고도화 진행중) +> **상태**: 🟢 v1.2 운영 중 (고도화 진행중) > **경로**: MNG `/rd/planning-design` > **담당**: Claude Code + 개발팀 @@ -56,6 +56,14 @@ ERP 화면 기획서(스토리보드)를 PowerPoint나 Figma 없이 **SAM 관리 | `dfbbd3a1` | 플로팅 서식 툴바 + 우클릭 컨텍스트 메뉴 추가 | | `280bfddb` | 블록 서식 CSS 상속 수정 (자식 요소 color inherit) | +### v1.2 — 작업 영역 극대화 (2026-03-08) + +| 커밋 | 내용 | +|------|------| +| `5e0f1a63` | 좌측 사이드바 접기/펼치기 버튼 추가 | +| `f1202731` | 메뉴트리/Description 패널 접기/펼치기 + 캔버스 폭 자동 확장 (1100→1400px) | +| `a38c017c` | 이미지 블록 업로드를 더블클릭으로 변경 (드래그 중 파일 창 오픈 방지) | + --- ## 3. 현재 기능 목록 @@ -79,6 +87,7 @@ ERP 화면 기획서(스토리보드)를 PowerPoint나 Figma 없이 **SAM 관리 - 복사/붙여넣기/잘라내기 (Ctrl+C/V/X) - 전체 선택 (Ctrl+A) - 더블클릭 인라인 편집 (contenteditable) +- 이미지 블록 더블클릭 업로드 (드래그 충돌 방지) ### 3.3 서식 시스템 @@ -92,6 +101,13 @@ ERP 화면 기획서(스토리보드)를 PowerPoint나 Figma 없이 **SAM 관리 - Description 패널 (기능 설명 + 번호 마커 D&D) - 프리셋/커스텀 템플릿 +### 3.6 작업 영역 극대화 + +- 좌측 사이드바(메뉴트리) 접기/펼치기 토글 +- Description 패널 접기/펼치기 토글 바 +- 패널 접힘 시 캔버스 폭 자동 확장 (1100px → 1400px) +- sb-editor 패딩 축소 (24px → 12px) + ### 3.5 출력 - HTML 파일 내보내기 (좌표 기반 WYSIWYG) @@ -118,7 +134,7 @@ ERP 화면 기획서(스토리보드)를 PowerPoint나 Figma 없이 **SAM 관리 ### 5.1 단일 파일 아키텍처 -모든 CSS + HTML + JavaScript가 `index.blade.php` 하나에 포함 (~4,300줄). 서버 API가 없고 localStorage만 사용하므로, 컨트롤러는 뷰만 반환한다. +모든 CSS + HTML + JavaScript가 `index.blade.php` 하나에 포함 (~4,430줄). 서버 API가 없고 localStorage만 사용하므로, 컨트롤러는 뷰만 반환한다. ### 5.2 CSS 스타일 상속 문제