feat: 오류 분석 시스템 완전 재구조화 및 개선
✨ 주요 기능 - Production Report 스타일 오류 분석 테이블 구현 - 작업 형태 중심의 데이터 집계 및 표시 - 프로젝트별 그룹화 (rowspan 적용) - 연차/휴무 통합 처리 및 주말 제외 📊 테이블 구조 개선 - Job No. → 프로젝트명 표시 - 작업내용 → 작업 형태 (Base, Vessel, Piping Assembly) - 총 시간 → 작업 형태별 총 시간 - 세부시간 → 정규/오류 유형별 세분화 - 백분율 → 오류율로 변경 🎨 UI/UX 개선 - 프로젝트별 rowspan 그룹화 - 정규(녹색)/오류(빨간색) 시각적 구분 - 연차/휴무 오렌지 색상 테마 - 프로젝트 그룹 경계선 추가 🔧 데이터 처리 로직 - 작업 형태별 오류 데이터 집계 - 오류 유형별 세분화 (설계미스, 발주미스 등) - 주말 연차/휴무 자동 제외 - 모든 연차/휴무 하나로 통합 🛡️ 안정성 개선 - DOM 요소 null 체크 및 안전한 접근 - 디버깅 로그 추가 - 에러 핸들링 강화
This commit is contained in:
@@ -1159,6 +1159,29 @@ body {
|
||||
.data-table {
|
||||
min-width: 600px;
|
||||
}
|
||||
|
||||
.error-analysis-table {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.error-analysis-table th,
|
||||
.error-analysis-table td {
|
||||
padding: 0.5rem 0.25rem;
|
||||
}
|
||||
|
||||
.error-analysis-table .job-no {
|
||||
width: 80px;
|
||||
min-width: 80px;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-breakdown {
|
||||
gap: 0.15rem;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-item {
|
||||
padding: 0.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
@@ -1267,6 +1290,200 @@ select:focus {
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* ========== 오류 분석 테이블 스타일 ========== */
|
||||
.error-analysis-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 1rem;
|
||||
font-size: 0.9rem;
|
||||
background: var(--white);
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.error-analysis-table th {
|
||||
background: #FF6B6B; /* 오류 분석 전용 빨간색 헤더 */
|
||||
color: var(--white);
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
padding: 1rem 0.75rem;
|
||||
border-bottom: 2px solid #E74C3C;
|
||||
font-size: 0.85rem;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.error-analysis-table td {
|
||||
padding: 0.75rem;
|
||||
border-bottom: 1px solid #F8F9FA;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.error-analysis-table .job-no,
|
||||
.error-analysis-table .project-name {
|
||||
background: #FFE5E5; /* 연한 빨간색 배경 */
|
||||
color: #C0392B;
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
width: 120px;
|
||||
min-width: 120px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-content {
|
||||
text-align: left;
|
||||
font-weight: 500;
|
||||
color: var(--gray-800);
|
||||
}
|
||||
|
||||
.error-analysis-table .total-hours {
|
||||
font-weight: 600;
|
||||
color: var(--gray-900);
|
||||
}
|
||||
|
||||
.error-analysis-table .detail-hours {
|
||||
text-align: left;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.error-analysis-table .regular-hours {
|
||||
color: #27AE60;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.error-analysis-table .error-hours {
|
||||
color: #E74C3C;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type {
|
||||
text-align: left;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-breakdown {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.1rem;
|
||||
padding: 0.25rem;
|
||||
background: #F8F9FA;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
/* 정규 작업 스타일 */
|
||||
.error-analysis-table .work-type-item.regular {
|
||||
background: #E8F5E8;
|
||||
border-left: 3px solid #4CAF50;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-item.regular .work-type-name {
|
||||
color: #2E7D32;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-item.regular .regular-time {
|
||||
color: #4CAF50;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-item.regular .work-type-status {
|
||||
color: #388E3C;
|
||||
font-size: 0.7rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 오류 작업 스타일 */
|
||||
.error-analysis-table .work-type-item.error {
|
||||
background: #FFEBEE;
|
||||
border-left: 3px solid #F44336;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-item.error .work-type-name {
|
||||
color: #C62828;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-item.error .error-time {
|
||||
color: #F44336;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-item.error .work-type-status {
|
||||
color: #D32F2F;
|
||||
font-size: 0.7rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-name {
|
||||
font-weight: 600;
|
||||
color: var(--gray-800);
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.error-analysis-table .work-type-hours {
|
||||
font-size: 0.75rem;
|
||||
color: var(--gray-600);
|
||||
}
|
||||
|
||||
.error-analysis-table .error-percentage {
|
||||
font-weight: 600;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.error-analysis-table .error-percentage.has-error {
|
||||
color: #E74C3C;
|
||||
background: #FFE5E5;
|
||||
border-radius: 4px;
|
||||
padding: 0.25rem;
|
||||
}
|
||||
|
||||
/* 프로젝트 그룹 스타일 */
|
||||
.error-analysis-table .project-group {
|
||||
border-top: 1px solid #E0E0E0;
|
||||
}
|
||||
|
||||
.error-analysis-table .project-group:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
/* 연차/휴무 오류 스타일 */
|
||||
.error-analysis-table .vacation-project {
|
||||
background: #FFF3E0 !important; /* 연한 오렌지 배경 */
|
||||
border-top: 3px solid #FF9800 !important;
|
||||
}
|
||||
|
||||
.error-analysis-table .vacation-project .job-no,
|
||||
.error-analysis-table .vacation-project .project-name {
|
||||
background: #FF9800 !important; /* 오렌지 배경 */
|
||||
color: var(--white) !important;
|
||||
}
|
||||
|
||||
.error-analysis-table .vacation-project td {
|
||||
background: #FFF3E0 !important;
|
||||
color: #E65100 !important;
|
||||
}
|
||||
|
||||
/* 총계 행 스타일 */
|
||||
.error-analysis-table .total-row {
|
||||
background: #FFEBEE !important;
|
||||
color: #C62828;
|
||||
border-top: 2px solid #E74C3C;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.error-analysis-table .total-row td {
|
||||
background: #FFEBEE !important;
|
||||
color: #C62828 !important;
|
||||
font-weight: 600;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
/* 다크 모드 지원 (선택사항) */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
|
||||
Reference in New Issue
Block a user