diff --git a/system1-factory/web/pages/admin/attendance-report.html b/system1-factory/web/pages/admin/attendance-report.html index 8f83903..61e9faa 100644 --- a/system1-factory/web/pages/admin/attendance-report.html +++ b/system1-factory/web/pages/admin/attendance-report.html @@ -6,7 +6,7 @@ 출퇴근-작업보고서 대조 - TK 공장관리 - + diff --git a/system1-factory/web/pages/admin/purchase-analysis.html b/system1-factory/web/pages/admin/purchase-analysis.html index 9110c61..9734b39 100644 --- a/system1-factory/web/pages/admin/purchase-analysis.html +++ b/system1-factory/web/pages/admin/purchase-analysis.html @@ -6,7 +6,7 @@ 소모품 분석 - TK 공장관리 - +
diff --git a/system1-factory/web/pages/admin/repair-management.html b/system1-factory/web/pages/admin/repair-management.html index c73f6ec..c3aca5e 100644 --- a/system1-factory/web/pages/admin/repair-management.html +++ b/system1-factory/web/pages/admin/repair-management.html @@ -6,7 +6,7 @@ 시설설비 관리 - TK 공장관리 - + diff --git a/system1-factory/web/pages/admin/tasks.html b/system1-factory/web/pages/admin/tasks.html index e9040a6..1f2fd20 100644 --- a/system1-factory/web/pages/admin/tasks.html +++ b/system1-factory/web/pages/admin/tasks.html @@ -6,7 +6,7 @@ 작업 관리 - TK 공장관리 - + diff --git a/system1-factory/web/pages/attendance/checkin.html b/system1-factory/web/pages/attendance/checkin.html index 4e65e37..e1a20a2 100644 --- a/system1-factory/web/pages/attendance/checkin.html +++ b/system1-factory/web/pages/attendance/checkin.html @@ -6,7 +6,7 @@ 출근 체크 - TK 공장관리 - + diff --git a/system1-factory/web/pages/attendance/daily.html b/system1-factory/web/pages/attendance/daily.html index 7c62f47..fe63d51 100644 --- a/system1-factory/web/pages/attendance/daily.html +++ b/system1-factory/web/pages/attendance/daily.html @@ -6,7 +6,7 @@ 일일 출퇴근 입력 - TK 공장관리 - +
@@ -250,76 +250,140 @@ return; } - const tableHTML = ` - - - - - - - - - - - + const isMobile = window.innerWidth <= 768; + + if (isMobile) { + // 모바일: 카드 뷰 + const cardsHTML = ` +
${attendanceRecords.map((record, index) => { const isCustom = record.is_custom || record.attendance_type === 'custom'; - const isHoursReadonly = !isCustom; // 특이사항이 아니면 근무시간은 읽기 전용 - + const isHoursReadonly = !isCustom; const isOnVacation = record.is_on_vacation || false; const vacationLabel = record.vacation_type_name ? ` (${record.vacation_type_name})` : ''; return ` -
- - - - - - + ${isOnVacation ? `연차${vacationLabel}` : ''} + +
+
+ + +
+
+ + +
+
+ + +
+
+ +
+ ${isCustom ? '✓' : '-'} +
+
+
+ `; }).join('')} - -
작업자근태 구분근무시간연장근로특이사항
+
+
${record.worker_name} - ${isOnVacation ? `연차${vacationLabel}` : ''} -
- - - - - - - ${isCustom ? - '✓' : - '-'} -
- `; + + `; + container.innerHTML = cardsHTML; + } else { + // 데스크탑: 테이블 뷰 + const tableHTML = ` + + + + + + + + + + + + ${attendanceRecords.map((record, index) => { + const isCustom = record.is_custom || record.attendance_type === 'custom'; + const isHoursReadonly = !isCustom; + const isOnVacation = record.is_on_vacation || false; + const vacationLabel = record.vacation_type_name ? ` (${record.vacation_type_name})` : ''; - container.innerHTML = tableHTML; + return ` + + + + + + + + `; + }).join('')} + +
작업자근태 구분근무시간연장근로특이사항
+ ${record.worker_name} + ${isOnVacation ? `연차${vacationLabel}` : ''} + + + + + + + + ${isCustom ? + '✓' : + '-'} +
+ `; + container.innerHTML = tableHTML; + } } + // 화면 크기 변경 시 재렌더링 + let resizeTimer; + window.addEventListener('resize', () => { + clearTimeout(resizeTimer); + resizeTimer = setTimeout(() => { + if (attendanceRecords.length > 0) renderAttendanceList(); + }, 250); + }); + function updateTotalHours(index, value) { attendanceRecords[index].total_hours = parseFloat(value) || 0; } diff --git a/system1-factory/web/pages/attendance/monthly.html b/system1-factory/web/pages/attendance/monthly.html index 3fd4d08..f54af93 100644 --- a/system1-factory/web/pages/attendance/monthly.html +++ b/system1-factory/web/pages/attendance/monthly.html @@ -6,7 +6,7 @@ 월별 출근부 - TK 공장관리 - + diff --git a/system1-factory/web/pages/attendance/my-vacation-info.html b/system1-factory/web/pages/attendance/my-vacation-info.html index e6b8f84..b8d279c 100644 --- a/system1-factory/web/pages/attendance/my-vacation-info.html +++ b/system1-factory/web/pages/attendance/my-vacation-info.html @@ -6,7 +6,7 @@ 내 연차 정보 - TK 공장관리 - + diff --git a/system1-factory/web/pages/attendance/vacation-input.html b/system1-factory/web/pages/attendance/vacation-input.html index 3abc7c6..236914f 100644 --- a/system1-factory/web/pages/attendance/vacation-input.html +++ b/system1-factory/web/pages/attendance/vacation-input.html @@ -6,7 +6,7 @@ 휴가 직접 입력 - TK 공장관리 - +
diff --git a/system1-factory/web/pages/attendance/vacation-management.html b/system1-factory/web/pages/attendance/vacation-management.html index 4f2f84e..ed8831a 100644 --- a/system1-factory/web/pages/attendance/vacation-management.html +++ b/system1-factory/web/pages/attendance/vacation-management.html @@ -6,7 +6,7 @@ 휴가 관리 - TK 공장관리 - + diff --git a/system1-factory/web/pages/attendance/vacation-request.html b/system1-factory/web/pages/attendance/vacation-request.html index 1ec5e17..e599d16 100644 --- a/system1-factory/web/pages/attendance/vacation-request.html +++ b/system1-factory/web/pages/attendance/vacation-request.html @@ -6,7 +6,7 @@ 휴가 신청 - TK 공장관리 - +
diff --git a/system1-factory/web/pages/attendance/work-status.html b/system1-factory/web/pages/attendance/work-status.html index 8e6fd0e..aff847f 100644 --- a/system1-factory/web/pages/attendance/work-status.html +++ b/system1-factory/web/pages/attendance/work-status.html @@ -6,7 +6,7 @@ 근무 현황 - TK 공장관리 - + @@ -449,6 +459,16 @@ } function render() { + const isMobile = window.innerWidth <= 768; + + if (isMobile) { + renderMobile(); + } else { + renderDesktop(); + } + } + + function renderMobile() { const tbody = document.getElementById('workerTableBody'); if (workers.length === 0) { @@ -456,10 +476,93 @@ return; } + // 모바일에서는 테이블을 숨기고 카드 뷰 사용 + const table = tbody.closest('table'); + table.style.display = 'none'; + + // 기존 모바일 컨테이너 제거 + let mobileContainer = document.getElementById('mobileWorkCards'); + if (!mobileContainer) { + mobileContainer = document.createElement('div'); + mobileContainer.id = 'mobileWorkCards'; + table.parentNode.insertBefore(mobileContainer, table.nextSibling); + } + + mobileContainer.className = 'mobile-work-cards'; + mobileContainer.innerHTML = workers.map((w, idx) => { + const s = workStatus[w.user_id]; + + if (s.isNotHired) { + return ` +
+
+ ${w.worker_name} 미입사 + 입사일: ${formatDisplayDate(s.joinDate)} +
+
-
+
+ `; + } + + const typeInfo = attendanceTypes.find(t => t.value === s.type); + const isLeaveType = typeInfo?.isLeave || false; + const showOvertimeInput = s.type === 'overtime'; + const baseHours = s.hours; + const totalHours = s.type === 'overtime' ? baseHours + s.overtimeHours : baseHours; + + let rowClass = ''; + if (s.isSaved) rowClass = isLeaveType ? 'leave' : 'saved'; + else if (!s.isPresent) rowClass = isLeaveType ? 'leave' : 'absent-no-leave'; + + let statusText = '', statusClass = ''; + if (isLeaveType) { statusText = typeInfo.label; statusClass = 'color:#a16207;'; } + else if (s.isPresent) { statusText = '출근'; statusClass = 'color:#10b981;'; } + else { statusText = '⚠️ 결근'; statusClass = 'color:#dc2626;font-weight:600;'; } + + let tag = ''; + if (s.isSaved) tag = '저장됨'; + else if (isLeaveType) tag = '연차'; + + return ` +
+
+ ${w.worker_name} ${tag} + ${statusText} +
+
+ + ${showOvertimeInput ? ` + + ` : ''} + ${totalHours}h +
+
+ `; + }).join(''); + } + + function renderDesktop() { + const tbody = document.getElementById('workerTableBody'); + const table = tbody.closest('table'); + table.style.display = ''; + + // 모바일 컨테이너 숨기기 + const mobileContainer = document.getElementById('mobileWorkCards'); + if (mobileContainer) mobileContainer.remove(); + + if (workers.length === 0) { + tbody.innerHTML = '작업자가 없습니다'; + return; + } + tbody.innerHTML = workers.map((w, idx) => { const s = workStatus[w.user_id]; - // 미입사 상태 처리 if (s.isNotHired) { return ` @@ -483,36 +586,18 @@ const baseHours = s.hours; const totalHours = s.type === 'overtime' ? baseHours + s.overtimeHours : baseHours; - // 행 클래스 결정 let rowClass = ''; - if (s.isSaved) { - rowClass = isLeaveType ? 'leave' : 'saved'; - } else if (!s.isPresent) { - // 출근 안 했는데 연차 정보도 없으면 경고 - rowClass = isLeaveType ? 'leave' : 'absent-no-leave'; - } + if (s.isSaved) rowClass = isLeaveType ? 'leave' : 'saved'; + else if (!s.isPresent) rowClass = isLeaveType ? 'leave' : 'absent-no-leave'; - // 출근 상태 텍스트 및 클래스 결정 - let statusText = ''; - let statusClass = ''; - if (isLeaveType) { - statusText = typeInfo.label; - statusClass = 'status-leave'; - } else if (s.isPresent) { - statusText = '출근'; - statusClass = 'status-present'; - } else { - statusText = '⚠️ 결근'; - statusClass = 'status-absent-warning'; - } + let statusText = '', statusClass = ''; + if (isLeaveType) { statusText = typeInfo.label; statusClass = 'status-leave'; } + else if (s.isPresent) { statusText = '출근'; statusClass = 'status-present'; } + else { statusText = '⚠️ 결근'; statusClass = 'status-absent-warning'; } - // 태그 표시 let tag = ''; - if (s.isSaved) { - tag = '저장됨'; - } else if (isLeaveType) { - tag = '연차'; - } + if (s.isSaved) tag = '저장됨'; + else if (isLeaveType) tag = '연차'; return ` @@ -521,9 +606,7 @@ ${w.worker_name} ${tag} - - ${statusText} - + ${statusText}