feat: tkreport/tkqc UX 개선 - 신고 완료 모달, 크로스시스템 배너, AI 도우미 가시성

- 신고 제출 후 alert → 성공 모달로 교체 (신고현황/새신고 버튼)
- cross-nav.js: tkreport 페이지 상단 크로스시스템 네비게이션 배너
- report-status.html: AI 신고 도우미 버튼 추가
- common-header.js: tkqc 헤더에 "신고" 외부 링크 추가
- 배포 스크립트/가이드 추가

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

system2-report/web/js/cross-nav.js

@@ -0,0 +1,42 @@
+/**
+ * 크로스시스템 네비게이션 배너
+ * tkreport 페이지 상단에 시스템 간 이동 링크를 제공
+ */
+document.addEventListener('DOMContentLoaded', function() {
+    var path = window.location.pathname;
+    var host = window.location.hostname;
+    var protocol = window.location.protocol;
+
+    // tkqc URL 결정
+    var tkqcUrl;
+    if (host.includes('technicalkorea.net')) {
+        tkqcUrl = protocol + '//tkqc.technicalkorea.net';
+    } else {
+        tkqcUrl = protocol + '//' + host + ':30200';
+    }
+
+    // 현재 페이지 판별
+    var isIssueReport = path.includes('issue-report');
+    var isReportStatus = path.includes('report-status');
+    var isChatReport = path.includes('chat-report');
+
+    var nav = document.createElement('div');
+    nav.id = 'crossNav';
+    nav.innerHTML =
+        '<a href="/pages/safety/issue-report.html" class="cn-link' + (isIssueReport ? ' cn-active' : '') + '">신고하기</a>' +
+        '<a href="/pages/safety/report-status.html" class="cn-link' + (isReportStatus ? ' cn-active' : '') + '">신고현황</a>' +
+        '<a href="/pages/safety/chat-report.html" class="cn-link' + (isChatReport ? ' cn-active' : '') + '">AI 도우미</a>' +
+        '<a href="' + tkqcUrl + '" class="cn-link cn-external">부적합관리(TKQC) &rarr;</a>';
+
+    var style = document.createElement('style');
+    style.textContent =
+        '#crossNav{display:flex;align-items:center;gap:0.25rem;padding:0.5rem 0.75rem;background:#1e293b;overflow-x:auto;-webkit-overflow-scrolling:touch;}' +
+        '.cn-link{color:rgba(255,255,255,0.7);text-decoration:none;font-size:0.8125rem;font-weight:500;padding:0.25rem 0.625rem;border-radius:0.375rem;white-space:nowrap;transition:background 0.15s,color 0.15s;-webkit-tap-highlight-color:transparent;}' +
+        '.cn-link:hover,.cn-link:active{color:#fff;background:rgba(255,255,255,0.1);}' +
+        '.cn-active{color:#fff !important;background:rgba(255,255,255,0.15) !important;font-weight:600;}' +
+        '.cn-external{margin-left:auto;color:#38bdf8;border:1px solid rgba(56,189,248,0.3);font-size:0.75rem;}' +
+        '.cn-external:hover,.cn-external:active{background:rgba(56,189,248,0.15);color:#7dd3fc;}';
+
+    document.head.appendChild(style);
+    document.body.insertBefore(nav, document.body.firstChild);
+});

system2-report/web/js/issue-report.js

@@ -1185,8 +1185,7 @@ async function submitReport() {
     const data = await response.json();
 
     if (data.success) {
-      alert('신고가 등록되었습니다.');
-      window.location.href = '/pages/safety/my-reports.html';
+      document.getElementById('successModal').style.display = 'flex';
     } else {
       throw new Error(data.error || '신고 등록 실패');
     }

system2-report/web/pages/safety/chat-report.html

@@ -32,6 +32,7 @@
     <!-- Hidden file input -->
     <input type="file" id="chatPhotoInput" accept="image/*" style="display:none">
 
+    <script src="/js/cross-nav.js?v=1"></script>
     <script src="/js/chat-report.js?v=3"></script>
 </body>
 </html>

system2-report/web/pages/safety/issue-report.html

@@ -556,6 +556,79 @@
           }
         }
 
+        /* 성공 모달 */
+        .success-modal-overlay {
+            display: none;
+            position: fixed;
+            inset: 0;
+            z-index: 10001;
+            background: rgba(0,0,0,0.5);
+            align-items: center;
+            justify-content: center;
+            padding: 1rem;
+        }
+        .success-modal {
+            background: white;
+            border-radius: 1rem;
+            padding: 2rem 1.5rem;
+            text-align: center;
+            max-width: 320px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0,0,0,0.3);
+        }
+        .success-modal .success-icon {
+            width: 64px;
+            height: 64px;
+            border-radius: 50%;
+            background: #d1fae5;
+            color: #059669;
+            font-size: 2rem;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin: 0 auto 1rem;
+        }
+        .success-modal h3 {
+            font-size: 1.125rem;
+            font-weight: 700;
+            color: #1f2937;
+            margin: 0 0 0.5rem;
+        }
+        .success-modal p {
+            font-size: 0.875rem;
+            color: #6b7280;
+            margin: 0 0 1.5rem;
+        }
+        .success-modal .modal-buttons {
+            display: flex;
+            flex-direction: column;
+            gap: 0.625rem;
+        }
+        .success-modal .btn-primary {
+            padding: 0.75rem;
+            background: #ef4444;
+            color: white;
+            border: none;
+            border-radius: 0.625rem;
+            font-size: 0.9375rem;
+            font-weight: 600;
+            cursor: pointer;
+            -webkit-tap-highlight-color: transparent;
+        }
+        .success-modal .btn-primary:active { background: #dc2626; }
+        .success-modal .btn-secondary {
+            padding: 0.75rem;
+            background: #f3f4f6;
+            color: #374151;
+            border: none;
+            border-radius: 0.625rem;
+            font-size: 0.9375rem;
+            font-weight: 600;
+            cursor: pointer;
+            -webkit-tap-highlight-color: transparent;
+        }
+        .success-modal .btn-secondary:active { background: #e5e7eb; }
+
         /* Responsive */
         @media (min-width: 480px) {
             body { max-width: 480px; margin: 0 auto; min-height: 100vh; }
@@ -688,9 +761,23 @@
       </div>
     </div>
 
+    <!-- 성공 모달 -->
+    <div id="successModal" class="success-modal-overlay">
+        <div class="success-modal">
+            <div class="success-icon">&#10003;</div>
+            <h3>신고가 성공적으로 등록되었습니다!</h3>
+            <p>등록된 신고는 담당자가 확인 후 처리합니다.</p>
+            <div class="modal-buttons">
+                <button class="btn-primary" onclick="window.location.href='/pages/safety/report-status.html'">신고 현황 보기</button>
+                <button class="btn-secondary" onclick="window.location.href='/pages/safety/issue-report.html'">새 신고하기</button>
+            </div>
+        </div>
+    </div>
+
     <!-- Hidden file input for camera/gallery -->
     <input type="file" id="photoInput" accept="image/*" style="display:none">
 
-    <script src="/js/issue-report.js?v=6"></script>
+    <script src="/js/cross-nav.js?v=1"></script>
+    <script src="/js/issue-report.js?v=7"></script>
 </body>
 </html>

system2-report/web/pages/safety/report-status.html

@@ -286,6 +286,7 @@
                     <input type="date" id="filterStartDate" title="시작일">
                     <input type="date" id="filterEndDate" title="종료일">
 
+                    <a href="/pages/safety/chat-report.html" class="btn-ai-report" style="padding:0.625rem 1rem;background:linear-gradient(135deg,#0ea5e9,#0284c7);color:white;border:none;border-radius:0.5rem;font-size:0.875rem;font-weight:600;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:0.5rem;transition:opacity 0.2s;">🤖 AI 신고</a>
                     <a href="/pages/safety/issue-report.html" class="btn-new-report">+ 신고하기</a>
                 </div>
 
@@ -299,6 +300,7 @@
         </main>
     </div>
 
+    <script src="/js/cross-nav.js?v=1"></script>
     <script src="/js/safety-report-list.js?v=2"></script>
 </body>
 </html>