한백 잔업 추출 (Chrome Extension)

작업일지 이미지(손글씨·엑셀·PDF 캡처)를 AI 비전으로 읽어 구글시트 잔업 DB 입력 데이터를 자동 생성하는 크롬 사이드패널 확장프로그램.

흐름

작업일지 이미지 (캡처/드래그)
  → Qwen 비전(qwen3-vl-flash)으로 OCR + 구조화
  → 코드 후처리 (부서 역추론 · 인명부 이름 매칭 · 잔업 span 보정 · 연장/야간 계산)
  → 사람이 검토/수정 (이미지별 테이블, 일괄/개별 편집)
  → Apps Script 웹앱으로 구글시트에 행 추가 (수식 보존)

기술 스택

• WXT + Svelte 5 + TypeScript
• Chrome Side Panel (MV3)
• Qwen3-VL (DashScope, OpenAI 호환 API)
• Google Apps Script 웹앱 (시트 수신)

개발

npm install
npm run dev      # 개발 빌드 (watch)
npm run build    # 프로덕션 빌드 → .output/chrome-mv3

chrome://extensions → 개발자 모드 → 압축 해제된 확장 프로그램 로드 → .output/chrome-mv3

설정 (사이드패널 ⚙)

• Qwen API Key — DashScope(qwencloud) 키
• Apps Script URL — 배포된 웹앱 /exec URL

구조

src/
  lib/
    store.svelte.ts   중앙 상태 + 액션
    parse.ts          Qwen 비전 호출 + 프롬프트
    calc.ts           연장/야간/휴게 계산 (시트 수식 1:1)
    roster.ts         인명부 · 이름/부서 매칭
    time.ts           시간 유틸
    sheets.ts         Apps Script 전송
  entrypoints/sidepanel/
    App.svelte
    components/        Header · Settings · AnalyzeTab · ReviewTab · DataTable · DataRow · BulkBar · …
apps-script/
  Code.js             구글시트 수신부 (헤더명으로 컬럼 자동 매칭, 수식 보존)

메모

• 도통/배전/송전 같은 깔끔한 양식은 실용적, 무정전 손글씨는 "초안 + 사람 검토" 보조 도구.
• Apps Script 설치/배포는 apps-script/Code.js 상단 주석 참고.