62 lines
3.0 KiB
Markdown
62 lines
3.0 KiB
Markdown
# 할 일 목록
|
|
|
|
10 Minute Planner를 단계적으로 구현하기 위한 작업 체크리스트다.
|
|
|
|
## 현재 방향
|
|
|
|
- 기본 레이아웃은 `1페이지 + 우측 정보 패널`을 유지한다.
|
|
- `2페이지 펼침 보기`는 비교용 보조 모드로 유지한다.
|
|
- 스타일은 Vue + TailwindCSS 기준으로 구현한다.
|
|
- D-DAY는 목표 관리 패널과 연결되는 기능으로 추후 구현한다.
|
|
|
|
## 1단계: 플래너 핵심 상호작용
|
|
|
|
- [x] 상단 날짜를 시스템 날짜 기준으로 자동 표시한다.
|
|
- [x] `COMMENT`를 자유 입력 가능한 입력 필드로 바꾼다.
|
|
- [x] `TASKS` 각 줄을 텍스트 입력 + 체크박스 토글 가능하게 만든다.
|
|
- [x] `MEMO` 각 줄을 텍스트 입력 가능하게 만든다.
|
|
- [x] `TIME TABLE`을 마우스 드래그로 칠할 수 있게 만든다.
|
|
- [x] `TIME TABLE` 드래그가 여러 줄을 지나가더라도 시간 흐름 기준으로 연속 선택되도록 처리한다.
|
|
- [x] 선택된 `TIME TABLE` 구간을 기준으로 `TOTAL TIME`을 자동 계산한다.
|
|
|
|
## 2단계: 달력과 이동 기능
|
|
|
|
- [x] 달력에 연/월 이동 기능을 추가한다.
|
|
- [x] 선택 날짜를 클릭하면 해당 날짜 플래너 데이터로 이동되게 한다.
|
|
- [x] 입력값이 하나라도 있는 날짜에는 달력 하단에 빨간 점 표시를 추가한다.
|
|
- [ ] `PREV DAY` / `NEXT DAY` 이동 시 현재 편집 중 데이터와 연결되도록 정리한다.
|
|
|
|
## 추가 반영 메모
|
|
|
|
- [x] TASKS 왼쪽 라벨은 자유 입력 가능해야 한다.
|
|
- [x] 우측 패널에서 TASKS 번호를 한 번에 채우는 빠른 액션이 있어야 한다.
|
|
- [x] 달력 상단은 좌우 화살표로 월 이동하는 구조가 더 적합하다.
|
|
- [x] 연도 클릭 시 연도 선택 UI가 열려야 한다.
|
|
- [x] 오늘 날짜로 즉시 돌아가는 버튼이 필요하다.
|
|
|
|
## 3단계: 목표와 회고 기능
|
|
|
|
- [ ] 목표 관리 패널을 설계한다.
|
|
- [ ] 선택한 목표 기준으로 `D-DAY`가 자동 계산되게 한다.
|
|
- [ ] 우측 요약 패널의 `PREV SNAPSHOT`, `READ NEXT`를 실제 데이터 기반으로 연결한다.
|
|
- [ ] 다음날 할 일 자동 제안 규칙을 정리한다.
|
|
|
|
## 4단계: 데이터 구조와 저장
|
|
|
|
- [ ] 플래너 데이터 구조를 날짜별 상태 중심으로 정리한다.
|
|
- [ ] 입력 데이터의 저장 위치를 결정한다.
|
|
- [ ] 로컬 저장 또는 외부 저장 방식 중 우선 구현 방식을 정한다.
|
|
- [ ] 입력 상태가 새로고침 후에도 유지되도록 만든다.
|
|
|
|
## 5단계: 확장 화면
|
|
|
|
- [ ] 통계 페이지 요구사항을 정리한다.
|
|
- [ ] 통계 페이지 라우팅 또는 화면 전환 구조를 설계한다.
|
|
- [ ] 집중 시간, 완료율, 연속 기록 같은 핵심 지표를 정의한다.
|
|
|
|
## 메모
|
|
|
|
- D-DAY는 현재 보류 상태다. 목표 패널 설계 후 연결한다.
|
|
- `TIME TABLE` 드래그는 단순 사각형 선택이 아니라 시간 셀 단위의 연속 선택으로 해석한다.
|
|
- 구현할 때마다 완료된 항목은 체크하고, 큰 결정사항은 `HANDOFF.md`에도 함께 반영한다.
|