From a1fb0d4f9be01dc4ff4bdd802611818ecdef1c7b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B6=8C=ED=98=81=EC=84=B1?= <shine1324@gmail.com>
Date: Fri, 6 Mar 2026 17:46:06 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20[=EB=AC=B8=EC=84=9C]=20=EA=B2=80?=
 =?UTF-8?q?=EC=82=AC=EC=84=B1=EC=A0=81=EC=84=9C/=EC=9E=91=EC=97=85?=
 =?UTF-8?q?=EC=9D=BC=EC=A7=80=20=EC=A0=80=EC=9E=A5=20=EC=8B=9C=20HTML=20?=
 =?UTF-8?q?=EC=8A=A4=EB=83=85=EC=83=B7=20=EC=BA=A1=EC=B2=98=20=EC=A0=84?=
 =?UTF-8?q?=EC=86=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- InspectionReportModal: contentWrapperRef로 DOM 캡처, handleSave에서 rendered_html 포함
- WorkLogModal: contentWrapperRef로 DOM 캡처, handleSave에서 rendered_html 포함
- saveInspectionDocument/saveWorkLog 타입에 rendered_html 추가
- MNG에서 스냅샷 기반 문서 출력을 위한 프론트 파이프라인 완성
---
 src/components/production/WorkOrders/actions.ts       |  1 +
 .../WorkOrders/documents/InspectionReportModal.tsx    |  8 +++++++-
 .../production/WorkerScreen/WorkLogModal.tsx          | 11 +++++++++--
 src/components/production/WorkerScreen/actions.ts     |  1 +
 4 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/src/components/production/WorkOrders/actions.ts b/src/components/production/WorkOrders/actions.ts
index a9f67af5..4549f4b8 100644
--- a/src/components/production/WorkOrders/actions.ts
+++ b/src/components/production/WorkOrders/actions.ts
@@ -857,6 +857,7 @@ export async function saveInspectionDocument(
     title?: string;
     data: Record<string, unknown>[];
     approvers?: { role_name: string; user_id?: number }[];
+    rendered_html?: string;
   }
 ): Promise<{
   success: boolean;
diff --git a/src/components/production/WorkOrders/documents/InspectionReportModal.tsx b/src/components/production/WorkOrders/documents/InspectionReportModal.tsx
index 0d2672dd..8593cf84 100644
--- a/src/components/production/WorkOrders/documents/InspectionReportModal.tsx
+++ b/src/components/production/WorkOrders/documents/InspectionReportModal.tsx
@@ -164,6 +164,7 @@ export function InspectionReportModal({
   const [isSaving, setIsSaving] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const contentRef = useRef<InspectionContentRef>(null);
+  const contentWrapperRef = useRef<HTMLDivElement>(null);
 
   // API에서 로딩된 검사 데이터 (props 없을 때 fallback)
   const [apiWorkItems, setApiWorkItems] = useState<WorkItemData[] | null>(null);
@@ -341,6 +342,8 @@ export function InspectionReportModal({
     if (!workOrderId || !contentRef.current) return;
 
     const data = contentRef.current.getInspectionData();
+    // HTML 스냅샷 캡처 (MNG 출력용)
+    const renderedHtml = contentWrapperRef.current?.innerHTML || undefined;
     setIsSaving(true);
     try {
       // 템플릿 모드: Document 기반 저장 (정규화 형식)
@@ -359,6 +362,7 @@ export function InspectionReportModal({
           step_id: activeStepId ?? undefined,
           title: activeTemplate.title || activeTemplate.name,
           data: inspData.records,
+          rendered_html: renderedHtml,
         });
         if (result.success) {
           toast.success('검사 문서가 저장되었습니다.');
@@ -530,7 +534,9 @@ export function InspectionReportModal({
               )}
             </div>
           )}
-          {renderContent()}
+          <div ref={contentWrapperRef}>
+            {renderContent()}
+          </div>
         </>
       )}
     </DocumentViewer>
diff --git a/src/components/production/WorkerScreen/WorkLogModal.tsx b/src/components/production/WorkerScreen/WorkLogModal.tsx
index 278de2ac..0c90d77c 100644
--- a/src/components/production/WorkerScreen/WorkLogModal.tsx
+++ b/src/components/production/WorkerScreen/WorkLogModal.tsx
@@ -11,7 +11,7 @@
  * - 양식 미매핑 시 processType 폴백
  */
 
-import { useState, useEffect, useCallback } from 'react';
+import { useState, useEffect, useCallback, useRef } from 'react';
 import { Loader2, Save } from 'lucide-react';
 import { DocumentViewer } from '@/components/document-system';
 import { Button } from '@/components/ui/button';
@@ -63,6 +63,7 @@ export function WorkLogModal({
   const [isLoading, setIsLoading] = useState(false);
   const [isSaving, setIsSaving] = useState(false);
   const [error, setError] = useState<string | null>(null);
+  const contentWrapperRef = useRef<HTMLDivElement>(null);
 
   // 목업 WorkOrder 생성
   const createMockOrder = (id: string, pType?: ProcessType): WorkOrder => ({
@@ -155,9 +156,13 @@ export function WorkLogModal({
         unit: item.unit || 'EA',
       }));
 
+      // HTML 스냅샷 캡처 (MNG 출력용)
+      const renderedHtml = contentWrapperRef.current?.innerHTML || undefined;
+
       const result = await saveWorkLog(workOrderId, {
         table_data: tableData,
         title: workLogTemplateName || '작업일지',
+        rendered_html: renderedHtml,
       });
 
       if (result.success) {
@@ -255,7 +260,9 @@ export function WorkLogModal({
           <p className="text-muted-foreground">{error || '데이터를 불러올 수 없습니다.'}</p>
         </div>
       ) : (
-        renderContent()
+        <div ref={contentWrapperRef}>
+          {renderContent()}
+        </div>
       )}
     </DocumentViewer>
   );
diff --git a/src/components/production/WorkerScreen/actions.ts b/src/components/production/WorkerScreen/actions.ts
index bcddb261..6dc3ab90 100644
--- a/src/components/production/WorkerScreen/actions.ts
+++ b/src/components/production/WorkerScreen/actions.ts
@@ -744,6 +744,7 @@ export async function saveWorkLog(
     table_data?: Array<Record<string, unknown>>;
     remarks?: string;
     title?: string;
+    rendered_html?: string;
   }
 ): Promise<{
   success: boolean;