# PRD — 교육 이수 현황 공유

> **실습 방식**: 내 PC 안(로컬) · Claude 데스크톱 앱 **Code** 탭 · 다운로드 › **Test** 폴더 · 가상 데이터만 사용
> 이 문서를 Claude Code가 그대로 읽고 앱을 만듭니다. 고치고 싶은 곳은 직접 고쳐도 됩니다.

## 1. 한 줄 정의
교육 결과 **원데이터 CSV를 불러오면 부서·파트별 이수율이 한눈에** 보이고, 매월 **파트장에게 보낼 현황 메일·미이수자 본인에게 보낼 문자**의 대상과 문구를 미리 보고 CSV로 내보내는 앱.

## 2. 누가 쓰나
| 역할 | 하는 일 |
|---|---|
| 교육 담당자(나) | 원데이터 불러오기, 대시보드 확인, 리마인드 대상·문구 확인, 대상 CSV 내보내기 |
| 파트장(16명) | 파트 현황 메일을 받는 사람(앱은 쓰지 않음) |
| 미이수자 본인 | 리마인드 문자를 받는 사람(앱은 쓰지 않음) |

## 3. 오늘 만들 기능 (필수)
- [ ] **원데이터 불러오기**: `data/completions.csv`(130명 × 4과정 진도율) 를 불러와 브라우저 저장공간에 저장. 진도율 100 = 이수
- [ ] **이수율 대시보드**: KPI 4개(전체 이수율·4과정 모두 이수·미이수자·마감까지 남은 날), 16개 파트별 이수율 막대(낮은 순, 70% 미만 빨강), 부서×과정 미이수율 색 표, 월별 추이 선 그래프, 가장 낮은 과정 게이지
- [ ] **리마인드 대상 목록**: 파트장 메일 16건 + 미이수자 본인 문자 85건, 파트를 고르면 미이수자 표(과정별 진도율)
- [ ] **문구 미리보기 + CSV 내보내기**: Claude Code가 쓴 `reminders.md` 의 메일·문자 문구를 화면에 보여 주고, 대상 목록을 `send_list.csv` 로 내보내기(실제 발송은 하지 않음)

## 4. 화면 구성
1. **상단**: 앱 이름 · [이수율 대시보드 / 리마인드 미리보기] 탭 · 기준일·마감일 · 불러온 원데이터 인원
2. **대시보드**: KPI 카드 4개 → 파트별 막대(두 줄) + 부서×과정 색 표 → 월별 선 그래프 · 게이지 · Claude Code 현황 요약
3. **리마인드 미리보기**: 대상 누적 막대(메일/문자) · 선택 파트 도넛 · 과정별 진행 막대 → 미이수자 표 + 메일·문자 미리보기 카드
4. 그래프·표 칸에 **마우스를 올리면 수치가 말풍선으로**, 카드에 올리면 그래프가 다시 채워짐

## 5. 데이터 — 파일과 항목 (모두 가상 데이터)
| 파일 | 항목 |
|---|---|
| `data/courses.csv` | 과정ID, 과정명, 구분(법정필수), 이수마감, 학습시간 — 4과정 |
| `data/completions.csv` | 사번, 이름, 부서(6개), 파트(16개), 직급, 성희롱예방·개인정보보호·산업안전보건·괴롭힘예방(진도율 0~100), 최근학습일 — 130명 |
| `data/part_leaders.csv` | 부서, 파트, 파트장, 휴대폰(가상), 이메일(가상) — 16명 |
| `data/monthly_rate.csv` | 기준월(2026-07~10), 부서, 파트, 전체이수율(%) — 64건 |

- 전체 이수율 = 이수한 (사람×과정) 칸 수 ÷ (130명 × 4과정)
- 저장 위치: 브라우저 저장공간(localStorage) + CSV 파일. **외부 서버·데이터베이스를 쓰지 않습니다.**

## 6. AI 일은 Claude Code가 합니다
앱 안에서 AI를 부르지 않습니다(사내 기준: 별도 API 키 없음). 대신:
1. 미리보기 화면의 **[문구 생성 요청문 복사]** → Claude Code 입력창에 붙여넣기
2. Claude Code가 원데이터와 파트장 명단을 읽어 **파트별 현황 메일 문구 16개 · 미이수자 문자 문구(남은 과목 포함)** 를 `reminders.md`, 발송 대상을 `send_list.csv` 로 저장
3. 앱이 `reminders.md` 를 읽어 «문구 미리보기» 카드에 표시 → 실제 발송은 사내 메일·문자 시스템에서 사람이 직접

## 7. 기술 원칙 (로컬 실행)
- 폴더 하나: `Test/training-status/` 안에 `index.html`, `style.css`, `app.js`, `data/`
- 순수 HTML·CSS·JavaScript. 외부 인터넷 주소(CDN·글꼴)를 불러오지 않음 — 그래프는 직접 그림
- 실행: `python -m http.server 8765` → 브라우저에서 `http://localhost:8765`
- 결과물은 폴더째 zip으로 묶어 가져감. 인터넷에 올리지(배포하지) 않음

## 8. 원래 요청에서 조정한 부분
| 원래 요청 | 오늘은 이렇게 | 이유 |
|---|---|---|
| 매월 파트장에게 현황 메일, 본인에게 문자 발송 | 발송 대상 목록 + 문구 미리보기 + 대상 CSV 내보내기 | 메일·문자 발송은 외부 서비스 연동과 개인정보 처리가 필요 |
| 결과를 실시간으로 확인 | 원데이터 CSV를 불러올 때마다 대시보드가 바로 바뀜 | 외부 배포 금지 — 내 PC 안에서만 실행 |
| 구글시트로 정리 | 엑셀·구글시트에서 내려받은 CSV를 그대로 불러오기 | 외부 서비스 연결 없이 로컬에서 처리 |

## 9. 완료 기준 (테스트)
- [ ] `completions.csv` 를 불러오면 대상 **130명**, 전체 이수율 **74.8%**, 4과정 모두 이수 **45명**이 보인다
- [ ] 과정별 이수율이 성희롱 **80.0%** · 개인정보 **70.8%** · 산업안전 **69.2%** · 괴롭힘 **79.2%** 로 나온다
- [ ] 파트별 막대에서 가장 낮은 곳이 **연회 45.8%**, 가장 높은 곳이 **인사 95.0%** 이다
- [ ] 리마인드 대상이 파트장 **16명**, 미이수자 **85명**으로 나오고, 연회를 고르면 미이수자 **12명** 표가 보인다
- [ ] `reminders.md` 문구가 미리보기 카드에 보이고, [발송 대상 CSV 내보내기]로 받은 파일이 엑셀에서 한글 깨짐 없이 열린다
- [ ] 새로고침(F5)해도 불러온 데이터가 남아 있다

## 10. 다음 단계 (집에서 더 키울 것)
- 분기별 비교 보고서(A4 인쇄 화면)
- 법정필수 외 직무교육별 대시보드 추가
- 사내 메일·문자 시스템 연동은 사내 IT 검토 후