diff --git a/frontend/issues-dashboard.html b/frontend/issues-dashboard.html index 0ecc823..407f07b 100644 --- a/frontend/issues-dashboard.html +++ b/frontend/issues-dashboard.html @@ -27,31 +27,34 @@ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); } - /* 이슈 카드 스타일 (관리함 진행 중 스타일) */ - .issue-card { - transition: all 0.2s ease; - border-left: 4px solid transparent; + /* 이슈 테이블 스타일 (가로 테이블 레이아웃) */ + .dashboard-table { + min-width: 1200px; } - .issue-card:hover { - transform: translateY(-2px); - border-left-color: #3b82f6; - box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); - } - - .issue-card label { - font-weight: 600; - color: #374151; - } - - .issue-card .bg-gray-50 { + .dashboard-table th { + position: sticky; + top: 0; background-color: #f9fafb; - border: 1px solid #e5e7eb; - transition: all 0.2s ease; + z-index: 10; } - .issue-card .bg-gray-50:hover { - background-color: #f3f4f6; + .dashboard-table td { + vertical-align: middle; + } + + .dashboard-table tr:hover { + background-color: #f8fafc; + } + + .truncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + + .dashboard-table .fas.fa-image:hover { + transform: scale(1.1); } .progress-bar { @@ -366,7 +369,7 @@ document.getElementById('activeProjects').textContent = activeProjectIds.size; } - // 이슈 카드 업데이트 (관리함 진행 중 스타일) + // 이슈 테이블 업데이트 (가로 테이블 스타일) function updateProjectCards() { const container = document.getElementById('projectDashboard'); const emptyState = document.getElementById('emptyState'); @@ -379,13 +382,39 @@ emptyState.classList.add('hidden'); - // 이슈 카드들을 생성 (관리함 진행 중 스타일) - const issueCards = filteredIssues.map(issue => createIssueCard(issue)).join(''); - container.innerHTML = `
${issueCards}
`; + // 가로 스크롤 테이블 생성 + const tableHTML = ` +
+
+ + + + + + + + + + + + + + + + + + ${filteredIssues.map(issue => createIssueRow(issue)).join('')} + +
No.프로젝트부적합 내용카테고리해결방안담당부서담당자예상완료일원인부서사진등록일
+
+
+ `; + + container.innerHTML = tableHTML; } - // 이슈 카드 생성 (관리함 진행 중 스타일, 읽기 전용) - function createIssueCard(issue) { + // 이슈 테이블 행 생성 (가로 테이블 스타일, 읽기 전용) + function createIssueRow(issue) { const project = projects.find(p => p.id === issue.project_id); const projectName = project ? project.project_name : '미지정'; @@ -435,84 +464,72 @@ return diffDays <= 3; // 3일 이내 또는 지연 }; + // 사진 아이콘 생성 + const getPhotoIcons = () => { + const photos = []; + if (issue.photo_path) photos.push(issue.photo_path); + if (issue.photo_path2) photos.push(issue.photo_path2); + + if (photos.length === 0) return '-'; + + return photos.map(photo => + `` + ).join(''); + }; + + // 긴급 표시가 있는 No. 생성 + const getNoWithUrgent = () => { + const noText = issue.project_sequence_no || '-'; + if (isUrgent()) { + return `
+ ${noText} + 긴급 +
`; + } + return `${noText}`; + }; + return ` -
- -
-
- No.${issue.project_sequence_no || '-'} - ${isUrgent() ? '긴급' : ''} + + ${getNoWithUrgent()} + +
${projectName}
+ + +
+ ${issue.final_description || issue.description || '-'}
- ${formatKSTDate(issue.report_date)} -
- - -
-
- -
${projectName}
+ + + ${getCategoryText(issue.final_category || issue.category)} + + +
+ ${issue.solution || '-'}
- -
- -
${issue.final_description || issue.description || '-'}
+ + + ${getDepartmentText(issue.responsible_department)} + + +
+ ${issue.responsible_person || '-'}
- -
- -
${getCategoryText(issue.final_category || issue.category)}
-
-
- - -
-
-
- -
${issue.solution || '-'}
-
-
- -
${getDepartmentText(issue.responsible_department)}
-
-
- -
-
- -
${issue.responsible_person || '-'}
-
-
- -
${formatKSTDate(issue.expected_completion_date)}
-
-
- -
- -
${getDepartmentText(issue.cause_department)}
-
-
- - - ${issue.photo_path || issue.photo_path2 ? ` -
- -
- ${issue.photo_path ? ` -
- -
- ` : ''} - ${issue.photo_path2 ? ` -
- -
- ` : ''} -
-
- ` : ''} -
+ + + ${formatKSTDate(issue.expected_completion_date)} + + + ${getDepartmentText(issue.cause_department)} + + + ${getPhotoIcons()} + + + ${formatKSTDate(issue.report_date)} + + `; }