DUGURU Work Planner v4.1.3-pwa

두구루 업무 플래너 사용법 v4.1.3-pwa

🔐 로그인

👤

로그인 방법

이름 + 사번(입사일 8자리, 예: 20230522) 입력

Enter 키 또는 로그인 버튼 클릭

브라우저를 닫았다 다시 열어도 세션 자동 유지

우측 상단 이름 ▾ 클릭 → 휴지통 / 활동 로그 / 로그아웃

🔑

권한 구분

관리자 (4명): 김종현 · 현준규 · 백혜진 · 신유리

→ 전 직원 일정 수정 가능

→ 전체 활동 로그 조회

→ 모든 팀 OKR 편집 · 요청사항 전송

일반 직원: 본인 일정만 수정, 본인 로그만 조회

💡 사번 분실 시 관리자(김종현 대표)에게 문의하세요.

🖥 화면 구성 — 4가지 보기 모드

①

상단 바 안내

보기 토글: 주간 · 월간 · 개인 전환

주간 토글: 팀별 · 일자별 레이아웃 전환 (주간 보기 시에만 표시)

◀ 이전 / 다음 ▶: 주차 또는 월 이동

오늘: 현재 날짜로 즉시 이동 (일자별 뷰)

🔔 요청: 나에게 온 요청 수 표시 (빨간 뱃지)

📊 엑셀: 현재 월 전체 데이터 다운로드

🟢 실시간 연결: Supabase 서버 연결 상태

팀

주간 — 팀별 뷰 (기본)

모든 팀이 순서대로 표시 (스크롤)

팀 탭 클릭 → 해당 팀 섹션으로 자동 스크롤

좌측 패널: OKR 팀목표 + 팀 업무 + 팀 요청사항

그리드: 팀원 × 7일(일~토) × 오전/오후

셀 클릭 → 우측 편집 패널 열림

🔴 빨간 칩 = 해당 셀에 요청사항 있음

日

주간 — 일자별 뷰

상단 요일 탭에서 날짜 선택

선택한 하루의 전 팀 · 전 직원 오전/오후 일정 한눈에 확인

셀 클릭 → 편집 패널 열림 (팀별 뷰와 동일)

「오늘」버튼으로 현재 날짜 즉시 이동

月

월간 뷰

선택한 팀의 한 달 전체 일정을 주차별 그리드로 표시

상단 팀 탭으로 팀 전환

◀ ▶ 로 이전/다음 월 이동

각 주차마다 좌측에 OKR·팀업무·요청사항 패널

「이번 주」뱃지로 현재 주차 식별

👤

개인 월간 뷰 NEW

특정 직원 1명의 한 달 스케줄을 캘린더 형태로 표시

상단 드롭다운에서 직원 선택 (팀별 그룹화)

통계 바: 총 업무 수, 오전/오후 분포, 유형별 카운트

캘린더 셀 내 AM/PM 구분하여 업무 칩 표시

셀 클릭 → 편집 패널 열림 (업무 추가/수정 가능)

◀ ▶ 로 이전/다음 월 이동

※ 관리자 로그인 시 첫 번째 직원이 기본 선택됩니다

✏️ 업무 추가 · 수정 · 삭제

➕

업무 추가

캘린더 또는 그리드 셀 클릭 → 우측 편집 패널 열림

업무 유형 버튼(일반/프로젝트/미팅 등) 선택

텍스트 입력 후 Enter 또는 추가 버튼 클릭

여러 줄 입력 시 각 줄이 별도 업무로 등록됩니다

Shift+Enter = 줄바꿈 (한 업무에 여러 줄)

추가 즉시 자동 저장 (Supabase + localStorage)

🔄

수정 · 삭제 · 완료처리

유형 변경: 패널에서 업무 유형 뱃지 클릭 → 변경할 유형 선택

텍스트 수정: 패널에서 텍스트 영역 클릭 → 인라인 수정

삭제: 업무 오른쪽 ✕ 버튼 클릭

완료 처리: 유형을 「✓ 완료」로 변경 → 취소선 + 초록 뱃지

완료 취소: 다른 유형으로 변경하면 복원

관리자는 모든 팀원 업무 수정 가능

🏷 업무 유형 — 7종 색상 구분

일반업무일반 업무 처리 · 서류 정리 등

프로젝트프로젝트성 업무 · 제안서 · 시공

미팅회의 · 미팅 · 클라이언트 협의

현장/외근현장 방문 · 외근 · 창고 작업

연차HR 앱에서 자동 동기화 — work planner에서 직접 등록 불가, 두구루 HR 앱에서 신청·승인

★ 중요마감 임박 · 핵심 사안 · 강조

✓ 완료완료 처리 (텍스트에 취소선)

📋 팀 업무 (좌측 패널)

팀

팀 업무란?

팀이 자체적으로 등록하는 공유 업무 · 공지사항

삭제하기 전까지 계속 표시 (주차 무관)

등록자 이름 + 등록 시간이 함께 표시됩니다

해당 팀 소속 직원 + 관리자가 추가 가능

로그인한 모든 사용자가 삭제 가능 (삭제 시 확인 모달)

팀 업무 vs 요청사항 차이

📋 팀 업무

팀 내부에서 자체 등록하는 공유 업무
예) "이번 주 청암자이 현장 방문 준비"

🔴 요청사항

외부(타인 · 관리자)가 팀/팀원에게 전달하는 업무
예) "김종현 → 기획팀 전체: 제안서 검토 요청"

🔴 요청사항 시스템

팀

팀 요청사항

각 팀 좌측 패널 하단에 위치

관리자가 + 요청 버튼으로 추가

팀 전체 또는 특정 팀원 지정 가능

형식: 김종현 → 기획팀 전체 또는 김종현 → 백혜진

해당 팀원은 🔔 알람 뱃지로 확인

셀

셀별 요청사항

업무 편집 패널 하단 빨간 영역에 표시

모든 직원이 타인에게 요청 전송 가능

자기 자신에게는 요청 불가

삭제 시 타인 요청인 경우 경고 메시지 표시

그리드 셀에 🔴 요청 N건 칩으로 표시됨

🔔

요청 알람 확인

상단 🔔 요청 옆 숫자 = 안 읽은 요청 수

클릭하면 나에게 온 요청 목록 모달 표시

요청 항목 클릭 → 해당 날짜 · 시간대 셀로 자동 이동

모달을 열면 자동으로 읽음 처리됩니다

🎯 OKR — 팀 목표 운영

OKR 설정 방법

팀 좌측 패널 OKR 영역 클릭 또는 ✏ 버튼

O (Objective): 팀 목표 — 도전적, 영감, 수치 제외

KR (Key Results): 핵심 결과 지표 — 반드시 수치화, 2~4개 권장

★ 이번 주 집중: 이번 주 KR 기여를 위한 핵심 행동

주차별 · 팀별 독립 저장

📋

OKR 편집 권한

관리자: 모든 팀 OKR 편집 가능

일반 직원: 소속 팀 OKR만 편집 가능

KR 진척도: 슬라이더로 0~100% 입력

월간 뷰에서는 주차별 OKR 개별 관리

💡 OKR은 평가 도구가 아닌 정렬 도구입니다. 도전적 목표면 달성률 60~70%도 성공입니다.

📋 활동 로그

기록 항목: 접속, 로그아웃, 업무 추가/수정/삭제, 유형 변경, OKR 저장, 요청 전송

관리자: 전체 직원 로그 조회 가능

일반 직원: 본인 로그만 조회 가능

열기: 우측 상단 이름 클릭 → 📋 활동 로그

🗑️ 휴지통 v3.0

위치: 우측 상단 이름 클릭 → 🗑️ 휴지통

보관 기간: 삭제 후 30일 (이후 자동 영구삭제)

조회 권한: 일반 직원은 본인 항목만, 관리자는 전체

복원: 원래 셀의 마지막에 추가됨 (덮어쓰지 않음)

영구삭제: 더블 확인 후 즉시 삭제 (복구 불가)

시스템 안전망: 셀이 통째로 비워지는 사고가 발생하면 자동으로 휴지통에 백업됨

💾 저장 방식 및 서버 연결

실시간 저장 (Supabase)

업무 추가/수정/삭제 → 즉시 Supabase에 저장

Realtime 구독: 다른 사람의 변경사항이 즉시 반영

5초 간격 자동 새로고침 (안전장치)

서버 연결 실패 시 localStorage에 자동 백업

재연결 시 10초 후 자동 재시도

📡

연결 상태 표시

실시간 연결 — Supabase 정상 연결

연결 중... — 서버 접속 시도 중

오프라인 — 로컬 저장 모드

📊 엑셀 다운로드 & ⌨ 단축키

엑셀 포함 시트 (7개)

전체 업무: 팀 · 이름 · 날짜 · 유형 · 내용 · 상태 통합 리스트

기획팀 / 디자인팀 / 마케팅팀 / 지원팀 / 연출팀(EET): 날짜별 오전·오후 행렬

OKR: 팀별 주차별 목표 · KR · 진척도

⌨

단축키

Esc패널 · 모달 닫기

Enter업무 추가 · 로그인 확인

Shift+Enter업무 입력창 줄바꿈

📱 홈화면 추가 (앱처럼 사용)

🍎

iOS (iPhone · iPad)

Safari로 duguru-workplanner.netlify.app 접속

하단 공유 버튼 (□↑) 탭

홈 화면에 추가 선택 → 추가

홈화면 DP 아이콘 탭하면 풀스크린 앱으로 실행

🤖

Android (Chrome)

Chrome으로 duguru-workplanner.netlify.app 접속

우측 상단 ⋮ 메뉴 또는 자동 안내 배너

앱 설치 또는 홈 화면에 추가 선택

홈화면 DP 아이콘 탭하면 풀스크린 앱으로 실행

💡 팝업 종료 · 자동 갱신

⚠

팝업 실수 종료 방지

업무 입력 패널·OKR 모달은 바깥 클릭으로 닫히지 않음

닫기: × 버튼 · 취소 · Esc

변경 사항이 있으면 자동 저장 (저장 중 ⏳ 표시 → ✓ 자동저장됨)

🔄

새 버전 승인형 갱신

새 빌드 배포 시 우측 상단 알림 표시 — [업데이트] / [나중에] 선택

[업데이트]: 입력 중인 데이터 자동 저장 후 1회 새로고침으로 적용

[나중에]: 현재 버전 유지 — 자동 새로고침 없음 (다음 접속 시 재안내)

보안 긴급 패치만 중앙 팝업으로 안내

강제 갱신 (캐시 무시): Ctrl+Shift+R (Win) / Cmd+Shift+R (Mac)

버전별 신규·연동·안정화 이력 확인

📋

새 기능 안내 — 승인형 업데이트 전환 v4.1.3-pwa

🎉 두구루 업무 플래너가 앱이 되었습니다

스마트폰 홈화면에 추가하면 별도 앱처럼 사용할 수 있습니다. 새 버전이 배포되면 우측 상단 알림으로 알려드리며, [업데이트]를 누른 시점에만 적용됩니다 — 작업 중 강제 새로고침은 없습니다.

V4.1.3 — 2026.07.01 (삭제 오류 수정)

• 수정 업무 삭제가 안 되던 문제 해결
▸ 한 칸(오전/오후)에 업무가 하나뿐일 때 그 업무를 삭제하면 다시 살아나던 현상을 수정
▸ 여러 업무 중 하나를 지우는 경우는 기존과 동일하게 정상 동작
▸ 실수로 인한 전체 지움 방지 안전장치는 그대로 유지 — 의도한 삭제만 통과
▸ 저장·유형·프로젝트 연결·권한 로직 무변경

V4.1.2 — 2026.06.25 (프로젝트 선택 개선)

• 개선 프로젝트 선택 — 년월 표시 · 최근 3개월 · 검색
▸ 각 프로젝트에 [YYYY-MM] 실행 년월 표시(start_date 우선, 없으면 등록일)
▸ 기본 목록은 최신 프로젝트 기준 최근 3개월만 노출 — 옛 프로젝트로 어수선해지지 않음
▸ 검색창에 이름·코드 입력 시 전체 진행중 프로젝트에서 옛것까지 탐색
▸ 저장·표식·DB 로직 무변경

V4.1.1 — 2026.06.25 (프로젝트 표식)

• 개선 프로젝트 연결 업무 표식
▸ 프로젝트가 연결된 업무는 그리드 셀에 ▣ 표식 + 좌측 컬러 라인으로 표시 (긴 프로젝트명 대신 짧은 표식)
▸ 편집 패널 칩도 프로젝트명 → "▣ 프로젝트" 단축 (전체명은 마우스오버)
▸ 유형·내용·저장 로직 무변경 — 표시 전용 보정

V4.1.0 — 2026.06.25 (프로젝트 연결)

• 신규 업무에 프로젝트 연결
▸ 업무 패널 상단 프로젝트 연결에서 진행 중 프로젝트를 선택하면 업무가 해당 프로젝트에 묶입니다 (선택 사항)
▸ 업무 내용은 그대로 자유 입력 — "어떤 프로젝트의 무엇을" 구조
▸ 상단 ▣ 프로젝트 집계에서 프로젝트별·월별 업무 현황을 한눈에 확인
▸ 유형 선택·기존 업무는 영향 없음 (프로젝트 연결은 유형과 독립)

V4.0.9 — 2026.06.22 (로그인 정상화)

• 수정 로그인 시 불필요한 인증 실패 제거
▸ 로그인할 때마다 서버에 인증 실패가 1회씩 기록되던 문제를 시정했습니다
▸ 올바른 자격(이름:사번)을 먼저 시도하도록 순서를 교정 — 로그인 처리와 서버 로그가 깔끔해집니다
▸ 입력 방식·비밀번호는 그대로입니다 (데이터·권한 변경 없음)

V4.0.8 — 2026.06.18 (모바일 저장 정상화)

• 수정 모바일에서 저장이 안 되던 문제 해결
▸ 휴대폰에서 입력 후 앱 전환·홈버튼·화면 잠금 시 저장이 서버에 반영되지 않던 문제를 시정했습니다
▸ 종료 직전 전송 경로가 로그인 자격을 첨부하도록 교정 (데이터·권한 변경 없음)
▸ 저장에 실패하면 더 이상 "저장됨"으로 표시하지 않고 재로그인 안내를 표시합니다

V4.0.7 — 2026.06.05 (업데이트 방식 개선: 승인형 전환)

• 변경 자동 새로고침 제거 — 내가 누를 때만 업데이트
▸ 새 버전이 배포되면 우측 상단 알림에 [업데이트] / [나중에] 버튼 표시
▸ [업데이트]: 입력 중인 데이터를 먼저 저장한 뒤 1회 새로고침으로 적용
▸ [나중에]: 현재 화면 그대로 유지 — 작업 중 끊김 없음 (다음 접속 시 재안내)
▸ 3초 카운트다운·강제 새로고침은 전면 제거됐습니다

• 보안 긴급 보안 패치 별도 안내
▸ 보안상 긴급한 버전만 중앙 팝업으로 안내 (이 경우에도 적용은 버튼 클릭 시점)

V3.4 — 2026.05.16 (PWA 설치 지원)

• 신규 홈화면 추가 (앱처럼 사용)
▸ iPhone · iPad: Safari 하단 공유 (□↑) → 홈 화면에 추가
▸ Android: Chrome 우측 상단 ⋮ 메뉴 → 앱 설치 또는 홈 화면에 추가
▸ 데스크톱 Chrome: 주소창 우측 설치 아이콘 클릭
▸ 추가 후 홈화면 DP 아이콘 탭하면 풀스크린으로 실행

• 신규 새 버전 자동 알림 ~~+ 자동 새로고침~~ (V4.0.7부터 승인형 [업데이트]/[나중에] 방식으로 변경)
▸ 새 버전이 배포되면 우측 상단 토스트 알림이 자동 표시
▸ 3초 후 자동 새로고침 — 강제 새로고침(Ctrl+Shift+R) 불필요
▸ ~~즉시 갱신은 토스트의 지금 새로고침 버튼~~
▸ ~~입력 중인 데이터는 자동 저장 후 새로고침~~ → V4.0.7: [업데이트] 승인 시에만 저장 후 적용

• 신규 사용법 / 패치노트 모달
▸ 우측 상단 ? 사용법 클릭 시 13개 섹션 매뉴얼
▸ 사용법 하단 📋 패치노트 버튼으로 이 화면 재확인 가능
▸ 새 버전 배포 시 이 안내는 1회 자동 표시 (닫으면 다시 안 뜸)

이 안내는 한 번 닫으면 다시 표시되지 않습니다. 언제든 ? 사용법 → 📋 패치노트로 재확인 가능합니다.

🎨

두구루 플래너 디자인 시스템 & 개발 가이드

버전 히스토리

v4.0.9로그인 정상화 — 로그인 시 '사번 단독'을 먼저 시도해 매 로그인마다 GoTrue 인증실패 1회가 강제되던 결함 시정. DB 실측상 전 계정 정본='이름:사번'(crypt 12/12 통과, 사번단독 0/12)이라 자격 후보 순서를 [이름:사번, 사번]으로 교정. version.json 정본 표기도 실DB에 맞게 정정. 입력 방식·비밀번호·DB·RLS·권한 무변경. §6 verifyOtp 매직링크 전환·5회30분 잠금은 전사 인증 트랙 별도.

v4.0.8모바일 저장 정상화 — 종료 직전(beacon/keepalive) 저장 경로가 publishable(anon) 키만 첨부해 wp_* 쓰기가 RLS에서 거부되던 결함 시정(v3.0r5 회귀). 사용자 JWT를 Bearer로 첨부. 부수: persistToSupabase가 쓰기 오류를 console.warn만 하고 '✓ 저장됨'을 표시하던 은폐 제거 — 실패 시 dirty 보존 + 재로그인 안내. 클라이언트 한정, DB·RLS·GRANT·auth.users 무수정.

v3.0r5모바일 저장 사라짐 버그 수정 — 모바일에서 입력 후 새로고침/앱전환 시 저장된 것처럼 보이지만 실제로는 사라지던 버그 해소. 원인: persistToSupabase가 await 없이 호출되어 fetch가 페이지 종료와 함께 abort됨. 해소: ① 'UI ✓ 자동저장됨' 표시를 Supabase 응답 후로 이동(저장 중에는 ⏳ 표시), ② pagehide/visibilitychange='hidden' 시점에 navigator.sendBeacon으로 wp_tasks REST 직접 INSERT(브라우저가 페이지 종료 후에도 전송 보장), ③ 기존 항목 UPDATE는 fetch keepalive로 강제 전송. 디자인·콘텐츠 변경 0건. DB 변경 0건.

v3.0r4전사 열람 모델 — 모든 직원이 모든 직원의 일정을 볼 수 있게 변경. 쓰기(추가/수정/삭제)는 본인 + 관리자만 가능. 다른 직원 셀에는 [+ 추가] 버튼 숨김, 클릭 시 편집 패널이 열리되 read-only 모드(입력 영역 숨김 + 🔒 안내 배너 노출). 헤더 라벨도 "전사 열람 · 본인만 편집"으로 변경. DB 변경 0건 (이미 anon SELECT 권한 부여 상태).

v3.0r3복구함 노출 강화 — 상단 도구 바에 [🔄 복구함] 독립 버튼(빨간 카운트 배지), 첫 진입 시 자동 배너(2주 활성, 24h dismiss). 0건일 때 버튼·배너 자동 숨김. 등급 배지 (A 확실 / B 가능 / C 의도가능) + A등급 재해석 안내문 ("같은 본문 반복 = 저장 안 된 줄 알고 다시 입력한 흔적, 거의 확정 유실"). RPC fn_wp_v3_recovered_count 사용. hotfix1: loadFromSupabase await 처리 + setConnStatus(online)에서 카운트 자동 갱신(SB_ONLINE race 해소). hotfix2: .recover-box에 position:relative+z-index:1 추가 — .hm-bg(absolute, backdrop-filter:blur)가 모달 박스를 가려 컨텐츠가 흐려보이던 v3.0 base 결함 해소

v3.0전면 재설계 — 직원별 데이터 격리 + 자동 안전망 — 직원별 4월 사고 대비 12개 테이블 격리(wp_tasks_<slug>), DB 트리거 자동 history·휴지통, 빈 본문 INSERT 차단(CHECK), 173건 4월 유실 본문 검토 복구함 신설, 관리자(김종현·백혜진·현준규) 통합 뷰 wp_admin_all_*, STORE_KEY v40 갱신

v2.7휴지통 UI 신설 — 삭제된 task를 30일간 휴지통에 보관, 사용자 메뉴에서 복원·영구삭제 가능. 본인 항목만 표시(관리자는 전체). 영구삭제는 더블 확인. STORE_KEY v36 갱신

v2.6업무 유형 "연차" 제거 (HR SSOT 일원화) — 직접 등록 불가, HR앱에서만 신청. 기존 연차 task 53건 자동 정리(공휴일·HR중복), 개인메모 4건 일반 type으로 변환 보존

v2.5HR 연차 자동 표시 + 월간 뷰 버그픽스 — 두구루 HR 앱의 승인된 연차/반차/병가를 셀에 자동 표시(파란 좌측보더), 노동절 명칭 정정, 개인↔팀 월간 전환 시 렌더 깨짐 수정

v2.4토/일/공휴일 색상 구분 — 토(파랑)/일(빨강)/공휴일(빨강+휴일명 표시), 2026 대한민국 공휴일 + 대체공휴일 보강

v2.3주간 7일 표시 (Google Calendar 방식) — 일~토 7일 무조건 표시, 월 경계 무시. 다른 달 날짜는 흐리게 표시. STORE_KEY v32 갱신

v2.2캐시 무효화 강제 적용 — no-cache 헤더, STORE_KEY v31 갱신(localStorage 강제 초기화), Realtime 채널 v31

v2.1데이터 유실 핫픽스 — 빈 배열 덮어쓰기 차단, 변경 셀만 저장(dirty tracking), 다중 세션 안전

v2.0개인 뷰 일간·주간·월간 연동 (보기×구분 6가지 조합), VIEW_MODE/SCOPE 독립 상태 관리

v5.2상단 토글 재설계: 보기[일간·주간·월간] + 구분[개인·팀별] — 레이아웃 고정

v5.1스타일 버튼 삭제, 사용법 전면 개편(개인 뷰 포함), 보기/주간 토글 시인성 개선

v5.0개인 월간 스케줄 뷰 신설 (직원별 캘린더·업무 통계·유형별 카운트·관리자 fallback)

v4.0요청사항 삭제 권한 확장(모든 로그인 사용자), 삭제 확인 모달 추가(타인 요청 경고 표시)

v1.1좌측 패널 3섹션(OKR·팀업무·요청사항), 팀 업무 시스템, 사용법·스타일 가이드 전면 개편

v1.0로그인/로그아웃, 권한관리, 요청사항, 활동로그, 실시간협업, 완료유형, 엑셀다운로드

v9Supabase 연동, OKR 팀목표, 자동 새로고침

v8기업 블루 디자인, OKR 패널, 주간/월간/일자별 뷰, 업무 유형 7종

배포 & 서버 정보

NET

Netlify

팀: DDUGURU

계정: duguruasia@gmail.com

URL: duguru-workplanner.netlify.app

파일명: index.html (PWA — sw.js, manifest.json, icon 동반)

업데이트: Deploys → 파일 드래그 앤 드롭

Supabase

Project ID: jdmzgsyqsozjzakxppls

리전: Northeast Asia

테이블:
wp_tasks_<slug> × 12 (직원별),
wp_admin_all_tasks/trash (관리자 뷰),
wp_okr, wp_requests, wp_log,
wp_holidays, wp_trash_<slug>

플랜: Free tier

파일 수정 원칙

CONTENT ZONE (▼▼▼ ~ ▲▲▲) 안의 데이터만 수정하세요

MEMBERS 배열: 팀원 추가/변경 (name, empId, rank, team, c, init)

TASK_TYPES: 업무 유형 추가 시 CSS 변수도 함께 추가

STORE_KEY: 버전 변경 시 키 업데이트 (기존 localStorage 초기화)

ADMINS 배열: 관리자 이름 목록

색상 팔레트 — CSS 변수

업무 유형 색상

--c-gen 일반

--c-proj 프로젝트

--c-meet 미팅

--c-field 현장

--c-leave 연차

--c-key 중요

#065F46 완료

시스템 색상

--blue 주요 액션

#EF4444 요청사항

#6D28D9 OKR

#3ECF8E Supabase

팀 컬러 (MEMBERS.c 값)

기획팀#2e7d20

디자인팀#0060b0

마케팅팀#b86000

지원팀#6a2eaa

연출팀(EET)#b02020