🎯 Tab-Specific Interface Design:
- 진행 중 탭: 편집 가능한 테이블 형태 (11개 컬럼)
- 완료됨 탭: 입력 여부 표시 + 클릭으로 상세보기 (13개 컬럼)
- 탭별 다른 헤더 구조로 최적화된 정보 표시
✅ 완료됨 탭 - 입력 여부 표시:
- ✅ 입력됨 (초록색 체크)
- ❌ 미입력 (회색 X)
- 사진: ✅ 2장 형태로 개수 표시
- 클릭 시 상세보기 모달 팝업
🔧 진행 중 탭 최적화:
- 완료 처리 버튼 한 줄로 표시 (white-space: nowrap)
- 불필요한 컬럼 제거 (완료확인일, 확인자, 원인부서, 의견, 조치결과, 완료사진)
- 핵심 편집 필드만 표시로 깔끔한 인터페이스
📋 완료된 이슈 상세보기 모달:
- 2컬럼 레이아웃 (읽기전용 vs 편집가능)
- 읽기전용: 프로젝트, 내용, 원인, 확인자, 업로드사진
- 편집가능: 해결방안, 담당부서, 담당자, 조치예상일, 원인부서, 의견, 완료사진
- 완료 사진 업로드 기능 포함
🎨 Enhanced UX Features:
- 완료됨 행 호버 효과 (hover:bg-blue-50)
- 모달 내 사진 클릭으로 확대보기
- 파일 업로드 → Base64 변환 → API 전송
- 저장 후 자동 목록 새로고침
🔄 Dynamic Header Generation:
- createTableHeader() 함수로 탭별 헤더 동적 생성
- 진행 중: 11개 컬럼 (편집 중심)
- 완료됨: 13개 컬럼 (검토 중심)
📊 Status Icon System:
- getStatusIcon(): 입력 여부를 시각적으로 표시
- getPhotoStatusIcon(): 사진 개수와 함께 상태 표시
- 일관된 ✅/❌ 아이콘으로 직관적 인식
🚀 Technical Implementation:
- openIssueDetailModal(): 완료된 이슈 상세보기
- createModalContent(): 동적 모달 내용 생성
- saveModalChanges(): 편집된 내용 저장
- fileToBase64(): 파일 업로드 처리
Expected Result:
✅ 진행 중: 편집 중심의 간소화된 테이블
✅ 완료됨: 입력 여부 확인 + 상세 편집 모달
✅ 완료 처리 버튼 한 줄로 깔끔한 표시
✅ 권한별 필드 구분으로 명확한 워크플로우
11b03348f9