refactor: 코드 분리 + 성능 최적화 + 모바일 개선

tkqc 5개 페이지 인라인 JS/CSS를 외부 파일로 추출 (HTML 82% 감소)
tkuser index.html을 CSS 1개 + JS 10개 모듈로 분리 (3283→1155줄)

- 공통 유틸 추출: issue-helpers, photo-modal, toast
- 공통 CSS 확장: tkqc-common.css (모바일 반응형 포함)
- 모바일 하단 네비게이션 추가 (mobile-bottom-nav.js)
- nginx: JS/CSS 1시간 캐싱 + gzip 압축 활성화
- Tailwind CDN preload, 캐시버스터 통일 (?v=20260213)
- 카메라 capture="environment" 추가
- tkuser Dockerfile에 static/ 디렉토리 복사 추가

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

system3-nonconformance/web/static/js/utils/issue-helpers.js

@@ -0,0 +1,88 @@
+/**
+ * issue-helpers.js — 부적합 관리 공통 유틸리티 함수
+ * dashboard, management, inbox, archive 등에서 공유
+ */
+
+function getDepartmentText(department) {
+    const departments = {
+        'production': '생산',
+        'quality': '품질',
+        'purchasing': '구매',
+        'design': '설계',
+        'sales': '영업'
+    };
+    return department ? departments[department] || department : '-';
+}
+
+function getCategoryText(category) {
+    const categoryMap = {
+        'material_missing': '자재 누락',
+        'design_error': '설계 오류',
+        'incoming_defect': '반입 불량',
+        'inspection_miss': '검사 누락',
+        'quality': '품질',
+        'safety': '안전',
+        'environment': '환경',
+        'process': '공정',
+        'equipment': '장비',
+        'material': '자재',
+        'etc': '기타'
+    };
+    return categoryMap[category] || category || '-';
+}
+
+function getStatusBadgeClass(status) {
+    const statusMap = {
+        'new': 'new',
+        'processing': 'processing',
+        'pending': 'pending',
+        'completed': 'completed',
+        'archived': 'archived',
+        'cancelled': 'cancelled'
+    };
+    return statusMap[status] || 'new';
+}
+
+function getStatusText(status) {
+    const statusMap = {
+        'new': '새 부적합',
+        'processing': '처리 중',
+        'pending': '대기 중',
+        'completed': '완료',
+        'archived': '보관',
+        'cancelled': '취소'
+    };
+    return statusMap[status] || status;
+}
+
+function getIssueTitle(issue) {
+    const description = issue.description || issue.final_description || '';
+    const lines = description.split('\n');
+    return lines[0] || '부적합명 없음';
+}
+
+function getIssueDetail(issue) {
+    const description = issue.description || issue.final_description || '';
+    const lines = description.split('\n');
+    return lines.slice(1).join('\n') || '상세 내용 없음';
+}
+
+function getDisposalReasonText(reason) {
+    const reasonMap = {
+        'duplicate': '중복',
+        'invalid_report': '잘못된 신고',
+        'not_applicable': '해당 없음',
+        'spam': '스팸/오류',
+        'custom': '직접 입력'
+    };
+    return reasonMap[reason] || reason;
+}
+
+function getReporterNames(issue) {
+    let names = [issue.reporter?.full_name || issue.reporter?.username || '알 수 없음'];
+    if (issue.duplicate_reporters && issue.duplicate_reporters.length > 0) {
+        const duplicateNames = issue.duplicate_reporters.map(r => r.full_name || r.username);
+        names = names.concat(duplicateNames);
+    }
+    return names.join(', ');
+}

system3-nonconformance/web/static/js/utils/photo-modal.js

@@ -0,0 +1,42 @@
+/**
+ * photo-modal.js — 사진 확대 모달 공통 모듈
+ * dashboard, management, inbox, issue-view 등에서 공유
+ */
+
+function openPhotoModal(photoPath) {
+    if (!photoPath) return;
+
+    const modal = document.createElement('div');
+    modal.className = 'photo-modal-overlay';
+    modal.onclick = (e) => { if (e.target === modal) modal.remove(); };
+
+    modal.innerHTML = `
+        <div class="photo-modal-content">
+            <img src="${photoPath}" alt="확대된 사진">
+            <button class="photo-modal-close" onclick="this.closest('.photo-modal-overlay').remove()">
+                <i class="fas fa-times"></i>
+            </button>
+        </div>
+    `;
+
+    document.body.appendChild(modal);
+
+    // ESC 키로 닫기
+    const handleEsc = (e) => {
+        if (e.key === 'Escape') {
+            modal.remove();
+            document.removeEventListener('keydown', handleEsc);
+        }
+    };
+    document.addEventListener('keydown', handleEsc);
+}
+
+// 기존 코드 호환용 별칭
+function showImageModal(imagePath) {
+    openPhotoModal(imagePath);
+}
+
+function closePhotoModal() {
+    const modal = document.querySelector('.photo-modal-overlay');
+    if (modal) modal.remove();
+}

system3-nonconformance/web/static/js/utils/toast.js

@@ -0,0 +1,45 @@
+/**
+ * toast.js — 토스트 알림 공통 모듈
+ */
+
+function showToast(message, type = 'success', duration = 3000) {
+    const existing = document.querySelector('.toast-notification');
+    if (existing) existing.remove();
+
+    const iconMap = {
+        success: 'fas fa-check-circle',
+        error: 'fas fa-exclamation-circle',
+        warning: 'fas fa-exclamation-triangle',
+        info: 'fas fa-info-circle'
+    };
+
+    const colorMap = {
+        success: 'bg-green-500',
+        error: 'bg-red-500',
+        warning: 'bg-yellow-500',
+        info: 'bg-blue-500'
+    };
+
+    const toast = document.createElement('div');
+    toast.className = `toast-notification fixed top-4 right-4 z-[9999] ${colorMap[type] || colorMap.info} text-white px-6 py-3 rounded-lg shadow-lg flex items-center space-x-2 transform translate-x-full transition-transform duration-300`;
+    toast.innerHTML = `
+        <i class="${iconMap[type] || iconMap.info}"></i>
+        <span>${message}</span>
+    `;
+
+    document.body.appendChild(toast);
+
+    requestAnimationFrame(() => {
+        toast.style.transform = 'translateX(0)';
+    });
+
+    setTimeout(() => {
+        toast.style.transform = 'translateX(120%)';
+        setTimeout(() => toast.remove(), 300);
+    }, duration);
+}
+
+// 기존 코드 호환용 별칭
+function showToastMessage(message, type = 'success') {
+    showToast(message, type);
+}