21. PWA 푸시 알림 개발 예정

본 항목은 개발 예정 기능입니다. 현재 시스템에는 미구현 상태이며, 아래 기획 내용을 바탕으로 개발을 진행합니다.

1. 개요

PWA(Progressive Web App) 푸시 알림을 통해 결재 요청, 업무 지시, 처리 결과, 경고를 실시간으로 담당자의 모바일/PC에 전달합니다. 앱 설치 없이 브라우저만으로 동작합니다.

기대 효과

결재 지연 방지 — 대표에게 즉시 알림, 승인 대기 시간 단축
업무 지시 즉시 전달 — 생산오더 확정 시 실무자에게 바로 알림
재고 부족 사전 대응 — 안전재고 이하 시 자동 경고
별도 앱 불필요 — PWA 기반으로 브라우저에서 바로 동작

2. 기술 구조

이벤트 발생
(결재 상신 등)

notifications
테이블 저장

Web Push API
(VAPID)

Service Worker
푸시 수신

알림 표시
(모바일/PC)

구현 파일

파일	역할	설명
`manifest.json`	PWA 매니페스트	앱 이름, 아이콘, 시작 URL, 테마 색상
`sw.js`	Service Worker	푸시 수신, 알림 표시, 클릭 시 페이지 이동
`config/push.php`	푸시 발송 서버	VAPID 키 기반 Web Push 발송
`push_subscriptions`	DB 테이블	사용자별 푸시 구독 정보 저장
`notifications`	DB 테이블	알림 내역 저장 (이미 존재)

사용자 흐름

사용자가 로그인하면 "알림 허용" 팝업 표시
허용 시 Service Worker 등록 + 푸시 구독 → DB에 저장
이벤트 발생 시 서버에서 해당 사용자에게 Web Push 발송
알림 클릭 시 해당 결재/페이지로 바로 이동

3. 알림 목록 (15종)

A. 결재 알림 — 대표(승인권자)에게 (7종)

실무자가 결재를 상신하면 대표에게 즉시 푸시 알림이 발송됩니다.

No	알림	트리거 시점	알림 내용 예시	이동 페이지
1	입고 결재 상신	입고 확정 → PENDING_APPROVAL	"입고확정 결재: RCV-202603-0001 (IC칩 500개)"	전자결재 > 입고 탭
2	생산투입 결재 상신	투입 서명 → PENDING_APPROVAL	"생산투입 결재: PRD-0003 - SF-007 하우징케이스S 10개"	전자결재 > 생산 탭
3	생산산출 결재 상신	산출 등록 → PENDING_APPROVAL	"생산산출 결재: PRD-0003 - FG-005 ST-500 10개"	전자결재 > 생산 탭
4	출고 결재 상신	출고 확정 → PENDING_APPROVAL	"출고확정 결재: SR-202603-0001 (3건)"	전자결재 > 출고 탭
5	발주 결재 상신	발주 결재 상신	"발주 결재: PO-202603-0003 - 320,000원"	전자결재 > 발주 탭
6	분실/폐기 결재 상신	분실/폐기 결재 상신	"분실 결재: DSP-202603-0001 (파손 20개)"	전자결재 > 기타 탭
7	즉시입출고 결재 상신	즉시입출고 확정 → PENDING_APPROVAL	"즉시입출고 결재: INS-202603-0001"	전자결재 > 기타 탭

구현 위치: createApprovalWithLines() 함수 실행 직후에 푸시 발송 로직을 추가합니다. 결재자(role_id=1)의 push_subscription을 조회하여 발송합니다.

B. 요청 알림 — 대표에게 (1종)

No	알림	트리거 시점	알림 내용 예시	이동 페이지
8	발주요청 접수	실무자가 발주요청 제출	"발주요청: 김창고 - 원자재A 500개 (생산 일정 필요)"	전자결재 > 발주요청 탭

구현 위치: purchase_requests.php의 create 액션 및 scan.php의 QR 발주요청 제출 시 발송합니다.

C. 업무지시 알림 — 실무자에게 (2종)

No	알림	트리거 시점	알림 내용 예시	이동 페이지
9	생산오더 확정 (투입 대기 생성)	대표가 생산오더 확정	"생산오더 PRD-0003: 투입 대기 4건이 생성되었습니다"	현장업무
10	입고 DRAFT 생성 (발주 승인 시)	대표가 발주 승인 → 입고 DRAFT 자동 생성	"입고 대기: RCV-202603-0002 (원자재A 500개) - 발주 승인됨"	현장업무 또는 입고관리

수신 대상: 해당 창고(warehouse_id)에 배정된 실무자, 또는 role_id가 2(창고관리자), 3(생산관리자)인 사용자에게 발송합니다.

D. 처리 결과 알림 — 실무자에게 (3종)

No	알림	트리거 시점	알림 내용 예시	이동 페이지
11	결재 승인 완료	대표가 결재 승인	"승인 완료: 생산투입 PRD-0003 - SF-007 (재고 차감됨)"	해당 업무 페이지
12	결재 반려	대표가 결재 반려	"반려: 입고확정 RCV-0001 (사유: 수량 재확인 필요)"	해당 업무 페이지
13	발주요청 처리 결과	대표가 발주요청 확인/거절	"발주요청 승인: 원자재A 500개 → PO-202603-0004 생성됨"	발주요청 페이지

구현 위치: approval.php의 approve/reject 액션에서 submitted_by 사용자에게 발송합니다.

E. 경고 알림 — 대표에게 (2종)

No	알림	트리거 시점	알림 내용 예시	이동 페이지
14	재고 부족 경고	재고가 안전재고 이하로 떨어질 때 (결재 승인으로 재고 차감 시 체크)	"⚠ 재고 부족: 원자재A - 현재 5개 (안전재고: 20개)"	재고현황
15	입고 지연 / AS 반납 미이행	매일 자동 체크 (크론잡 또는 로그인 시)	"입고 지연: PO-0001 납기 3일 초과" / "AS 반납 미이행: SN-001 (7일)"	대시보드

No.14 재고 부족 경고: 결재 승인으로 재고가 차감될 때 items.safety_stock과 비교하여 자동 발생합니다. 별도 크론잡 불필요.
No.15 지연 경고: 대시보드 로드 시 또는 일 1회 크론잡으로 체크합니다.

4. 알림 수신 대상 요약

수신자	알림 종류	건수
대표 (명령자)	결재 상신 7종 + 발주요청 1종 + 경고 2종	10종
실무자	업무지시 2종 + 처리결과 3종	5종

5. 구현 계획

Phase 1: 기반 설정

manifest.json 생성 — 앱 이름, 아이콘, 테마 색상, 시작 URL
sw.js (Service Worker) 생성 — 푸시 수신 + 알림 표시 + 클릭 이벤트
VAPID 키 생성 — 서버 공개키/비밀키 쌍 (환경변수로 관리)
push_subscriptions 테이블 생성 — user_id, endpoint, p256dh, auth, created_at
로그인 시 알림 권한 요청 + 구독 등록 JS

Phase 2: 푸시 발송 서버

config/push.php — Web Push 발송 함수 (PHP curl 기반 또는 web-push 라이브러리)
sendPushNotification($userId, $title, $body, $url) 공통 함수
notifications 테이블에 동시 저장 (인앱 알림 + 푸시 알림 동기화)

Phase 3: 알림 트리거 연결

결재 상신 시 (No.1~7): createApprovalWithLines() 직후 발송
발주요청 접수 (No.8): purchase_requests.php create 액션
업무지시 (No.9~10): orders.php confirm + approval.php PO 승인 시
결재 결과 (No.11~12): approval.php approve/reject 액션
발주요청 결과 (No.13): purchase_requests.php acknowledge/reject 액션
재고 경고 (No.14): inventory_actions.php 재고 차감 후 안전재고 비교
지연 경고 (No.15): 크론잡 또는 대시보드 로드 시

Phase 4: UI 연동

헤더 알림 벨 아이콘 — 읽지 않은 알림 수 배지
알림 드롭다운 — 최근 알림 목록 + 클릭 시 해당 페이지 이동
알림 센터 페이지 — 전체 알림 이력 조회 + 읽음 처리
QR 스캔 페이지에서도 알림 표시

6. DB 설계

push_subscriptions 테이블 (신규)

컬럼	타입	설명
id	INT PK	자동 증가
user_id	INT FK	사용자 ID
endpoint	TEXT	푸시 서비스 엔드포인트 URL
p256dh	VARCHAR(255)	클라이언트 공개키
auth	VARCHAR(255)	인증 시크릿
user_agent	VARCHAR(300)	브라우저/디바이스 정보
created_at	DATETIME	구독 일시

notifications 테이블 (기존 활용)

컬럼	용도
notification_type	'APPROVAL', 'WORK_ORDER', 'RESULT', 'WARNING', 'REQUEST'
reference_type	'APPROVAL', 'PRODUCTION_ORDER', 'RECEIVING', 'PURCHASE_REQUEST' 등
reference_id	해당 문서 ID
is_read	읽음 여부
push_sent	푸시 발송 여부 (신규 컬럼)

7. 알림 클릭 시 이동 경로

알림 종류	클릭 시 이동
결재 상신 (No.1~7)	`/pages/approval/index.php` (해당 탭 자동 선택)
발주요청 (No.8)	`/pages/approval/index.php` (발주요청 탭)
업무지시 - 투입 (No.9)	`/pages/production/pending.php`
업무지시 - 입고 (No.10)	`/pages/production/pending.php` 또는 `/pages/receiving/index.php`
결재 결과 (No.11~12)	해당 업무 페이지 (생산관리/입고관리 등)
발주요청 결과 (No.13)	`/pages/purchase/requests.php`
재고 부족 (No.14)	`/pages/warehouse/inventory.php`
지연 경고 (No.15)	`/pages/main/index.php` (대시보드)

21. PWA 푸시 알림 — 점검 체크리스트

개발 예정 항목입니다. 구현 완료 후 아래 체크리스트로 점검합니다.

확인	점검 항목 (Q)	판단 기준 / 예시 답변 (A)	비고
☐	PWA 설치 프롬프트가 표시되는가?	모바일 브라우저에서 "홈 화면에 추가" 안내 표시	필수
☐	알림 권한 요청이 정상 표시되는가?	로그인 후 "알림 허용" 팝업 표시 → 허용 시 구독 등록	필수
☐	결재 상신 시 대표에게 푸시 알림이 오는가? (No.1~7)	실무자 서명 → 대표 디바이스에 알림 표시	필수
☐	발주요청 시 대표에게 푸시 알림이 오는가? (No.8)	발주요청 제출 → 대표 디바이스에 알림 표시	필수
☐	생산오더 확정/발주 승인 시 실무자에게 알림이 오는가? (No.9~10)	대표 확정/승인 → 창고/생산 담당자 디바이스에 알림 표시	필수
☐	결재 승인/반려 시 상신자에게 알림이 오는가? (No.11~12)	대표 처리 → 상신자 디바이스에 결과 알림	주요
☐	재고 부족 경고가 발생하는가? (No.14)	재고 차감 후 안전재고 이하 → 대표에게 경고 알림	주요
☐	알림 클릭 시 해당 페이지로 이동하는가?	알림 클릭 → 전자결재/현장업무/재고현황 등 해당 페이지로 이동	필수
☐	헤더 알림 벨에 읽지 않은 알림 수가 표시되는가?	새 알림 발생 시 벨 아이콘에 숫자 배지 표시
☐	오프라인 상태에서도 앱이 동작하는가?	네트워크 끊김 시 캐시된 페이지 표시, 재연결 시 동기화

점검일: 3월 29일 점검자: (주)플랫폼뱅크 확인자: ____________