95 lines
2.6 KiB
Markdown
95 lines
2.6 KiB
Markdown
# POP 화면 시스템
|
|
|
|
> **AI 에이전트 시작점**: 이 파일 → STATUS.md 순서로 읽으세요.
|
|
> 저장 요청 시: [SAVE_RULES.md](./SAVE_RULES.md) 참조
|
|
|
|
---
|
|
|
|
## 현재 상태
|
|
|
|
| 항목 | 값 |
|
|
|------|-----|
|
|
| 버전 | **v5** (CSS Grid 기반) |
|
|
| 상태 | **기본 기능 완료** |
|
|
| 다음 | 실제 테스트, Phase 4 (실제 컴포넌트 구현) |
|
|
|
|
**마지막 업데이트**: 2026-02-05
|
|
|
|
---
|
|
|
|
## 마지막 대화 요약
|
|
|
|
> (B)(C)(D) 모두 완료. 팔레트 UI 추가, 타입 오류 수정, 문서 v5 기준 통일.
|
|
> 다음: 실제 테스트 후 Phase 4 (실제 컴포넌트 렌더링, 데이터 바인딩) 진행.
|
|
|
|
---
|
|
|
|
## 빠른 경로
|
|
|
|
| 알고 싶은 것 | 문서 |
|
|
|--------------|------|
|
|
| 지금 뭐 해야 해? | [STATUS.md](./STATUS.md) |
|
|
| 저장/조회 규칙 | [SAVE_RULES.md](./SAVE_RULES.md) |
|
|
| 왜 v5로 바꿨어? | [decisions/003-v5-grid-system.md](./decisions/003-v5-grid-system.md) |
|
|
| 이전 문제 해결 | [PROBLEMS.md](./PROBLEMS.md) |
|
|
| 코드 어디 있어? | [FILES.md](./FILES.md) |
|
|
| 기능별 색인 | [INDEX.md](./INDEX.md) |
|
|
| 변경 히스토리 | [CHANGELOG.md](./CHANGELOG.md) |
|
|
|
|
---
|
|
|
|
## 핵심 파일
|
|
|
|
| 파일 | 역할 | 경로 |
|
|
|------|------|------|
|
|
| 타입 정의 | v5 레이아웃 타입 | `frontend/components/pop/designer/types/pop-layout.ts` |
|
|
| 캔버스 | 그리드 캔버스 + DnD | `frontend/components/pop/designer/PopCanvas.tsx` |
|
|
| 렌더러 | CSS Grid 렌더링 | `frontend/components/pop/designer/renderers/PopRenderer.tsx` |
|
|
| 디자이너 | 메인 컴포넌트 | `frontend/components/pop/designer/PopDesigner.tsx` |
|
|
|
|
---
|
|
|
|
## 문서 구조
|
|
|
|
```
|
|
[Layer 1: 먼저 읽기]
|
|
README.md (지금 여기) → STATUS.md
|
|
|
|
[Layer 2: 필요시 읽기]
|
|
CHANGELOG, PROBLEMS, INDEX, FILES, ARCHITECTURE, SPEC, PLAN
|
|
|
|
[Layer 3: 심화]
|
|
decisions/, sessions/, archive/
|
|
```
|
|
|
|
**컨텍스트 효율화**: 모든 문서를 읽지 마세요. 필요한 것만 단계적으로.
|
|
|
|
---
|
|
|
|
## POP이란?
|
|
|
|
**Point of Production** - 현장 작업자용 모바일/태블릿 화면 시스템
|
|
|
|
| 용도 | 경로 |
|
|
|------|------|
|
|
| 뷰어 | `/pop/screens/{screenId}` |
|
|
| 관리 | `/admin/screenMng/popScreenMngList` |
|
|
| API | `/api/screen-management/layout-pop/:screenId` |
|
|
|
|
---
|
|
|
|
## v5 그리드 시스템 (현재)
|
|
|
|
| 모드 | 화면 너비 | 칸 수 |
|
|
|------|----------|-------|
|
|
| mobile_portrait | ~599px | 4칸 |
|
|
| mobile_landscape | 600~839px | 6칸 |
|
|
| tablet_portrait | 840~1023px | 8칸 |
|
|
| tablet_landscape | 1024px~ | 12칸 |
|
|
|
|
**핵심**: 컴포넌트를 칸 단위로 배치 (col, row, colSpan, rowSpan)
|
|
|
|
---
|
|
|
|
*상세: [SPEC.md](./SPEC.md) | 히스토리: [CHANGELOG.md](./CHANGELOG.md)*
|