feat(proxy-input): 대리입력 리뉴얼 — 2단계 UI + UPSERT + 부적합

프론트엔드:
- Step 1: 날짜 선택 → 전체 작업자 목록 (완료/미입력/휴가 구분)
- Step 2: 선택 작업자 일괄 편집 (프로젝트/공종/시간/부적합/비고)
- 연차=선택불가, 반차=4h, 반반차=6h 기본값

백엔드:
- POST /api/proxy-input UPSERT 방식 (409 제거)
- 신규: TBM 세션 자동 생성 + 작업보고서 INSERT
- 기존: 작업보고서 UPDATE
- 부적합: work_report_defects INSERT (기존 defect 있으면 SKIP)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Hyungi Ahn
2026-03-31 14:50:04 +09:00
parent b8d3a516e1
commit 3cc38791c8
4 changed files with 386 additions and 773 deletions

View File

@@ -54,76 +54,98 @@ const ProxyInputController = {
const userIds = entries.map(e => e.user_id);
// 1. 중복 체크
const duplicates = await ProxyInputModel.checkDuplicateAssignments(conn, session_date, userIds);
if (duplicates.length > 0) {
await conn.rollback();
return res.status(409).json({
success: false,
message: `다음 작업자가 이미 해당 날짜에 TBM 배정되어 있습니다: ${duplicates.map(d => d.worker_name).join(', ')}`,
data: { duplicate_workers: duplicates }
// 1. 기존 보고서 확인 (UPSERT 분기)
const [existingReports] = await conn.query(
`SELECT id, user_id FROM daily_work_reports WHERE report_date = ? AND user_id IN (${userIds.map(() => '?').join(',')})`,
[session_date, ...userIds]
);
const existingMap = {};
existingReports.forEach(r => { existingMap[r.user_id] = r.id; });
// 2. 신규 작업자용 TBM 세션 생성 (기존 있으면 재사용)
let sessionId = null;
const newUserIds = userIds.filter(id => !existingMap[id]);
if (newUserIds.length > 0) {
const sessionResult = await ProxyInputModel.createProxySession(conn, {
session_date,
leader_id: leader_id || userId,
proxy_input_by: userId,
created_by: userId,
safety_notes: safety_notes || '',
work_location: work_location || ''
});
sessionId = sessionResult.insertId;
}
// 2. 작업자 존재 체크
const validWorkerIds = await ProxyInputModel.validateWorkers(conn, userIds);
const invalidIds = userIds.filter(id => !validWorkerIds.includes(id));
if (invalidIds.length > 0) {
await conn.rollback();
return res.status(400).json({
success: false,
message: `존재하지 않거나 비활성 작업자: ${invalidIds.join(', ')}`
});
}
// 3. TBM 세션 생성
const sessionResult = await ProxyInputModel.createProxySession(conn, {
session_date,
leader_id: leader_id || userId,
proxy_input_by: userId,
created_by: userId,
safety_notes: safety_notes || '',
work_location: work_location || ''
});
const sessionId = sessionResult.insertId;
// 4. 각 entry 처리
// 3. 각 entry 처리 (UPSERT)
const createdWorkers = [];
for (const entry of entries) {
// 팀 배정
const assignResult = await ProxyInputModel.createTeamAssignment(conn, {
session_id: sessionId,
user_id: entry.user_id,
project_id: entry.project_id,
work_type_id: entry.work_type_id,
task_id: entry.task_id || null,
workplace_id: entry.workplace_id || null,
work_hours: entry.work_hours
});
const assignmentId = assignResult.insertId;
const existingReportId = existingMap[entry.user_id];
// 작업보고서
const reportResult = await ProxyInputModel.createWorkReport(conn, {
report_date: session_date,
user_id: entry.user_id,
project_id: entry.project_id,
work_type_id: entry.work_type_id,
task_id: entry.task_id || null,
work_status_id: entry.work_status_id || 1,
work_hours: entry.work_hours,
start_time: entry.start_time || null,
end_time: entry.end_time || null,
note: entry.note || '',
tbm_session_id: sessionId,
tbm_assignment_id: assignmentId,
created_by: userId,
created_by_name: req.user.name || req.user.username || ''
});
if (existingReportId) {
// UPDATE 기존 보고서
await conn.query(`
UPDATE daily_work_reports SET
project_id = ?, work_type_id = ?, work_hours = ?,
work_status_id = ?, start_time = ?, end_time = ?, note = ?,
updated_at = NOW()
WHERE id = ?
`, [entry.project_id, entry.work_type_id, entry.work_hours,
entry.work_status_id || 1, entry.start_time || null, entry.end_time || null,
entry.note || '', existingReportId]);
createdWorkers.push({
user_id: entry.user_id,
report_id: reportResult.insertId
});
createdWorkers.push({ user_id: entry.user_id, report_id: existingReportId, action: 'updated' });
} else {
// INSERT 신규 — TBM 배정 + 작업보고서
const assignResult = await ProxyInputModel.createTeamAssignment(conn, {
session_id: sessionId,
user_id: entry.user_id,
project_id: entry.project_id,
work_type_id: entry.work_type_id,
task_id: entry.task_id || null,
workplace_id: entry.workplace_id || null,
work_hours: entry.work_hours
});
const assignmentId = assignResult.insertId;
const reportResult = await ProxyInputModel.createWorkReport(conn, {
report_date: session_date,
user_id: entry.user_id,
project_id: entry.project_id,
work_type_id: entry.work_type_id,
task_id: entry.task_id || null,
work_status_id: entry.work_status_id || 1,
work_hours: entry.work_hours,
start_time: entry.start_time || null,
end_time: entry.end_time || null,
note: entry.note || '',
tbm_session_id: sessionId,
tbm_assignment_id: assignmentId,
created_by: userId,
created_by_name: req.user.name || req.user.username || ''
});
createdWorkers.push({ user_id: entry.user_id, report_id: reportResult.insertId, action: 'created' });
}
// 부적합 처리 (defect_hours > 0 && 기존 defect 없을 때만)
const defectHours = parseFloat(entry.defect_hours) || 0;
const reportId = existingReportId || createdWorkers[createdWorkers.length - 1].report_id;
if (defectHours > 0) {
const [existingDefects] = await conn.query(
'SELECT defect_id FROM work_report_defects WHERE report_id = ?', [reportId]
);
if (existingDefects.length === 0) {
await conn.query(
`INSERT INTO work_report_defects (report_id, defect_hours, note) VALUES (?, ?, '대리입력')`,
[reportId, defectHours]
);
await conn.query(
'UPDATE daily_work_reports SET error_hours = ?, work_status_id = 2 WHERE id = ?',
[defectHours, reportId]
);
}
}
}
await conn.commit();

View File

@@ -1,256 +1,67 @@
/* proxy-input.css — 대리입력 페이지 */
/* proxy-input.css — 대리입력 리뉴얼 */
/* Header */
.pi-header {
background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
color: white;
padding: 14px 16px;
border-radius: 0 0 16px 16px;
margin: -16px -16px 0;
position: sticky;
top: 56px;
z-index: 20;
}
.pi-header-row { display: flex; align-items: center; gap: 12px; }
.pi-back-btn {
width: 32px; height: 32px;
display: flex; align-items: center; justify-content: center;
background: rgba(255,255,255,0.15);
border-radius: 8px;
border: none; color: white; cursor: pointer;
}
.pi-header h1 { font-size: 1.05rem; font-weight: 700; flex: 1; }
.pi-header-date { font-size: 0.75rem; opacity: 0.8; }
/* Title Row */
.pi-title-row { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.pi-title { font-size: 18px; font-weight: 700; color: #1f2937; flex: 1; }
.pi-back-btn { background: none; border: none; font-size: 18px; color: #6b7280; cursor: pointer; padding: 4px 8px; }
.pi-date-group { display: flex; align-items: center; gap: 6px; }
.pi-date-input { border: 1px solid #d1d5db; border-radius: 8px; padding: 6px 10px; font-size: 14px; }
.pi-refresh-btn { background: none; border: none; color: #6b7280; font-size: 14px; cursor: pointer; padding: 6px; }
/* Date Bar */
.pi-date-bar {
display: flex; align-items: center; justify-content: space-between;
padding: 10px 12px;
background: white;
border-radius: 10px;
margin: 12px 0 8px;
box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
.pi-date-info { display: flex; align-items: center; gap: 8px; }
.pi-date-input {
border: 1px solid #e5e7eb;
border-radius: 6px;
padding: 4px 8px;
font-size: 0.8rem;
color: #374151;
}
.pi-refresh-btn {
width: 28px; height: 28px;
display: flex; align-items: center; justify-content: center;
background: #f3f4f6; border: none; border-radius: 6px;
color: #6b7280; cursor: pointer; font-size: 0.75rem;
}
.pi-status-badge {
display: flex; align-items: center; gap: 4px;
font-size: 0.8rem; color: #374151;
}
/* Status Bar */
.pi-status-bar { display: flex; gap: 16px; background: white; border-radius: 10px; padding: 10px 14px; margin-bottom: 10px; font-size: 13px; color: #6b7280; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
/* Bulk Actions Bar */
.pi-bulk {
background: #eff6ff;
border: 1px solid #bfdbfe;
border-radius: 10px;
padding: 8px 12px;
margin-bottom: 8px;
display: flex; align-items: center; justify-content: space-between;
flex-wrap: wrap; gap: 6px;
}
.pi-bulk-label { font-size: 0.75rem; font-weight: 600; color: #1d4ed8; }
.pi-bulk-actions { display: flex; gap: 4px; }
.pi-bulk-btn {
padding: 4px 10px;
font-size: 0.7rem; font-weight: 600;
background: white; color: #2563eb;
border: 1px solid #bfdbfe;
border-radius: 6px;
cursor: pointer;
}
.pi-bulk-btn:active { background: #dbeafe; }
/* Select All */
.pi-select-all { padding: 6px 2px; font-size: 13px; color: #6b7280; }
.pi-select-all input { margin-right: 6px; }
/* Worker Cards */
.pi-cards { padding-bottom: 100px; }
/* Worker List */
.pi-worker-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 80px; }
.pi-worker { display: flex; align-items: center; gap: 10px; background: white; border-radius: 10px; padding: 10px 12px; cursor: pointer; border: 2px solid transparent; transition: border-color 0.15s; }
.pi-worker:hover { border-color: #93c5fd; }
.pi-worker.disabled { opacity: 0.45; cursor: not-allowed; }
.pi-check { width: 18px; height: 18px; flex-shrink: 0; accent-color: #2563eb; }
.pi-worker-info { flex: 1; display: flex; flex-direction: column; gap: 1px; }
.pi-worker-name { font-size: 14px; font-weight: 600; color: #1f2937; }
.pi-worker-job { font-size: 11px; color: #9ca3af; }
.pi-worker-badges { display: flex; gap: 4px; flex-shrink: 0; }
.pi-card {
background: white;
border-radius: 10px;
margin-bottom: 8px;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
overflow: hidden;
border: 2px solid transparent;
transition: border-color 0.15s;
}
.pi-card.selected { border-color: #2563eb; }
/* Badges */
.pi-badge { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 6px; }
.pi-badge.done { background: #dcfce7; color: #166534; }
.pi-badge.missing { background: #fee2e2; color: #991b1b; }
.pi-badge.vac { background: #dbeafe; color: #1e40af; }
.pi-badge.vac-half { background: #fef3c7; color: #92400e; }
.pi-card-header {
display: flex; align-items: center; gap: 10px;
padding: 12px;
cursor: pointer;
}
.pi-card-check {
width: 22px; height: 22px;
border: 2px solid #d1d5db;
border-radius: 6px;
display: flex; align-items: center; justify-content: center;
flex-shrink: 0;
transition: all 0.15s;
}
.pi-card.selected .pi-card-check {
background: #2563eb; border-color: #2563eb; color: white;
}
.pi-card-name { font-size: 0.875rem; font-weight: 600; color: #1f2937; }
.pi-card-meta { font-size: 0.7rem; color: #9ca3af; }
.pi-card-status {
margin-left: auto;
font-size: 0.65rem;
padding: 2px 6px;
border-radius: 4px;
}
.pi-card-status.both_missing { background: #fef2f2; color: #dc2626; }
.pi-card-status.tbm_only { background: #fefce8; color: #ca8a04; }
.pi-card-status.report_only { background: #fefce8; color: #ca8a04; }
/* Bottom Bar */
.pi-bottom-bar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 50; background: white; padding: 12px 16px; border-top: 1px solid #e5e7eb; box-shadow: 0 -2px 8px rgba(0,0,0,0.06); }
.pi-edit-btn, .pi-save-btn { width: 100%; padding: 12px; border: none; border-radius: 10px; font-size: 15px; font-weight: 600; color: white; cursor: pointer; }
.pi-edit-btn { background: #2563eb; }
.pi-edit-btn:hover { background: #1d4ed8; }
.pi-edit-btn:disabled { background: #9ca3af; cursor: not-allowed; }
.pi-save-btn { background: #10b981; }
.pi-save-btn:hover { background: #059669; }
.pi-save-btn:disabled { background: #9ca3af; }
/* Expanded Form */
.pi-card-form {
display: none;
padding: 0 12px 12px;
border-top: 1px solid #f3f4f6;
}
.pi-card.selected .pi-card-form { display: block; }
/* Edit Cards */
.pi-edit-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 80px; }
.pi-edit-card { background: white; border-radius: 12px; padding: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
.pi-edit-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 14px; }
.pi-edit-job { font-size: 11px; color: #9ca3af; }
.pi-edit-fields { display: flex; flex-direction: column; gap: 6px; }
.pi-edit-row { display: flex; gap: 6px; }
.pi-select { flex: 1; padding: 6px 8px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; background: white; }
.pi-field { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.pi-field span { font-size: 11px; color: #6b7280; font-weight: 600; }
.pi-input { padding: 6px 8px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px; text-align: center; }
.pi-note-input { width: 100%; padding: 6px 8px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 13px; }
.pi-field { margin-top: 8px; }
.pi-field label {
display: block;
font-size: 0.7rem; font-weight: 600;
color: #6b7280;
margin-bottom: 3px;
}
.pi-field select, .pi-field input, .pi-field textarea {
width: 100%;
border: 1px solid #e5e7eb;
border-radius: 6px;
padding: 6px 8px;
font-size: 0.8rem;
color: #374151;
background: white;
}
.pi-field textarea { resize: none; height: 48px; }
.pi-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pi-field-row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
/* Bottom Save */
.pi-bottom {
position: fixed;
bottom: 0; left: 0; right: 0;
padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
background: white;
border-top: 1px solid #e5e7eb;
z-index: 30;
max-width: 480px;
margin: 0 auto;
}
.pi-save-btn {
width: 100%;
padding: 12px;
background: #2563eb;
color: white;
font-size: 0.875rem;
font-weight: 700;
border: none;
border-radius: 10px;
cursor: pointer;
transition: background 0.15s;
}
.pi-save-btn:hover { background: #1d4ed8; }
.pi-save-btn:disabled { background: #d1d5db; cursor: not-allowed; }
.pi-save-btn .fa-spinner { display: none; }
.pi-save-btn.loading .fa-spinner { display: inline; }
.pi-save-btn.loading .fa-save { display: none; }
/* Skeleton */
.pi-skeleton { height: 52px; border-radius: 10px; background: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%); background-size: 200% 100%; animation: pi-shimmer 1.5s infinite; }
@keyframes pi-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
/* Empty */
.pi-empty {
display: flex; flex-direction: column; align-items: center;
gap: 8px; padding: 48px 16px; color: #9ca3af; font-size: 0.875rem;
}
.pi-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 48px 16px; color: #9ca3af; font-size: 14px; }
/* Modal */
.pi-modal-overlay {
position: fixed; inset: 0;
background: rgba(0,0,0,0.4);
z-index: 50;
display: flex; align-items: center; justify-content: center;
padding: 16px;
}
.pi-modal {
background: white;
border-radius: 12px;
width: 100%; max-width: 360px;
overflow: hidden;
}
.pi-modal-header {
display: flex; align-items: center; justify-content: space-between;
padding: 12px 16px;
border-bottom: 1px solid #f3f4f6;
font-weight: 700; font-size: 0.9rem;
}
.pi-modal-header button { background: none; border: none; color: #9ca3af; cursor: pointer; }
.pi-modal-body { padding: 16px; }
.pi-modal-body select, .pi-modal-body input {
width: 100%; border: 1px solid #e5e7eb; border-radius: 8px;
padding: 8px 10px; font-size: 0.85rem;
}
.pi-modal-footer {
display: flex; gap: 8px; padding: 12px 16px;
border-top: 1px solid #f3f4f6;
}
.pi-modal-cancel {
flex: 1; padding: 8px; border: 1px solid #e5e7eb;
border-radius: 8px; background: white; font-size: 0.8rem; cursor: pointer;
}
.pi-modal-confirm {
flex: 1; padding: 8px; background: #2563eb; color: white;
border: none; border-radius: 8px; font-size: 0.8rem; font-weight: 600; cursor: pointer;
}
/* Skeleton (reuse) */
.ds-skeleton {
height: 56px;
background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 50%, #f3f4f6 75%);
background-size: 200% 100%;
animation: ds-shimmer 1.5s infinite;
border-radius: 10px;
margin-bottom: 6px;
}
@keyframes ds-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
/* 휴무일 배너 */
.pi-holiday-banner {
padding: 8px 12px;
background: #f0fdf4;
border: 1px solid #bbf7d0;
border-radius: 8px;
font-size: 0.8rem;
font-weight: 600;
color: #166534;
text-align: center;
margin-bottom: 8px;
}
/* 연차 비활성화 */
.pi-card.vacation-disabled { opacity: 0.5; }
.pi-card.vacation-disabled .pi-card-form { pointer-events: none; }
.pi-card.vacation-disabled .pi-card-header { cursor: default; }
.pi-vac-badge {
font-size: 0.65rem; font-weight: 600;
padding: 2px 6px; border-radius: 4px;
background: #dcfce7; color: #166534;
margin-left: 4px;
}
.ds-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 48px 16px; color: #9ca3af; font-size: 0.875rem; }
.ds-link { color: #2563eb; font-size: 0.8rem; text-decoration: underline; }
@media (max-width: 480px) { body { max-width: 480px; margin: 0 auto; } }
/* Responsive */
@media (min-width: 640px) { .pi-bottom-bar { max-width: 640px; margin: 0 auto; } }

View File

@@ -1,447 +1,254 @@
/**
* proxy-input.js — 대리입력 (TBM + 작업보고서 동시 생성)
* Sprint 002 Section B
* proxy-input.js — 대리입력 리뉴얼
* Step 1: 날짜 선택 → 작업자 목록 (체크박스)
* Step 2: 선택 작업자 일괄 편집 → 저장 (TBM 자동 생성)
*/
// ===== Mock =====
const MOCK_ENABLED = false;
const MOCK_STATUS = {
success: true,
data: {
date: '2026-03-30',
summary: { total_active_workers: 45, tbm_completed: 38, tbm_missing: 7, report_completed: 35, report_missing: 10, both_completed: 33, both_missing: 5 },
workers: [
{ user_id: 15, worker_name: '김철수', job_type: '용접', department_name: '생산1팀', has_tbm: false, has_report: false, tbm_session_id: null, total_report_hours: 0, status: 'both_missing', proxy_history: null },
{ user_id: 22, worker_name: '이영희', job_type: '배관', department_name: '생산2팀', has_tbm: true, has_report: false, tbm_session_id: 140, total_report_hours: 0, status: 'tbm_only', proxy_history: null },
{ user_id: 35, worker_name: '정대호', job_type: '도장', department_name: '생산2팀', has_tbm: false, has_report: true, tbm_session_id: null, total_report_hours: 8, status: 'report_only', proxy_history: null },
{ user_id: 41, worker_name: '한지민', job_type: '사상', department_name: '생산2팀', has_tbm: false, has_report: false, tbm_session_id: null, total_report_hours: 0, status: 'both_missing', proxy_history: null },
]
}
};
const MOCK_PROJECTS = [
{ project_id: 1, project_name: 'JOB-2026-001 용기제작', job_no: 'JOB-2026-001' },
{ project_id: 2, project_name: 'JOB-2026-002 Skid 제작', job_no: 'JOB-2026-002' },
{ project_id: 3, project_name: 'JOB-2026-003 PKG 조립', job_no: 'JOB-2026-003' },
];
const MOCK_WORK_TYPES = [
{ id: 1, name: '절단' }, { id: 2, name: '용접' }, { id: 3, name: '배관' },
{ id: 4, name: '도장' }, { id: 5, name: '사상' }, { id: 6, name: '전기' },
];
const MOCK_TASKS = [
{ task_id: 1, work_type_id: 2, task_name: '취부&용접' },
{ task_id: 2, work_type_id: 2, task_name: '가우징' },
{ task_id: 3, work_type_id: 1, task_name: '절단작업' },
{ task_id: 4, work_type_id: 3, task_name: '배관설치' },
];
const MOCK_WORK_STATUSES = [
{ id: 1, name: '정상' }, { id: 2, name: '잔업' }, { id: 3, name: '특근' },
];
// ===== State =====
let currentDate = '';
let missingWorkers = [];
let allWorkers = [];
let selectedIds = new Set();
let projects = [], workTypes = [], tasks = [], workStatuses = [];
let workerFormData = {}; // { userId: { project_id, work_type_id, ... } }
let saving = false;
const ALLOWED_ROLES = ['support_team', 'admin', 'system'];
let projects = [];
let workTypes = [];
let editData = {}; // { userId: { project_id, work_type_id, work_hours, defect_hours, note } }
// ===== Init =====
document.addEventListener('DOMContentLoaded', async () => {
const urlDate = new URLSearchParams(location.search).get('date');
const urlUserId = new URLSearchParams(location.search).get('user_id');
currentDate = urlDate || formatDateStr(new Date());
document.addEventListener('DOMContentLoaded', () => {
const now = new Date();
currentDate = now.toISOString().substring(0, 10);
document.getElementById('dateInput').value = currentDate;
document.getElementById('headerDate').textContent = currentDate;
setTimeout(async () => {
const user = window.currentUser;
if (user && !ALLOWED_ROLES.includes(user.role)) {
document.getElementById('workerCards').classList.add('hidden');
document.getElementById('bottomSave').classList.add('hidden');
document.getElementById('noPermission').classList.remove('hidden');
return;
}
await loadMasterData();
await loadDropdownData();
await loadWorkers();
// URL에서 user_id가 있으면 자동 선택
if (urlUserId) toggleWorker(parseInt(urlUserId));
}, 500);
});
function formatDateStr(d) {
return d.getFullYear() + '-' + String(d.getMonth() + 1).padStart(2, '0') + '-' + String(d.getDate()).padStart(2, '0');
async function loadDropdownData() {
try {
const [pRes, wRes] = await Promise.all([
window.apiCall('/projects'),
window.apiCall('/daily-work-reports/work-types')
]);
projects = (pRes.data || pRes || []).filter(p => p.is_active !== 0);
workTypes = (wRes.data || wRes || []).filter(w => w.is_active !== 0);
} catch (e) { console.warn('드롭다운 로드 실패:', e); }
}
function onDateChange(val) {
if (!val) return;
currentDate = val;
document.getElementById('headerDate').textContent = val;
loadWorkers();
// ===== Step 1: Worker List =====
async function loadWorkers() {
currentDate = document.getElementById('dateInput').value;
if (!currentDate) return;
const list = document.getElementById('workerList');
list.innerHTML = '<div class="pi-skeleton"></div><div class="pi-skeleton"></div>';
selectedIds.clear();
updateEditButton();
try {
const res = await window.apiCall('/proxy-input/daily-status?date=' + currentDate);
if (!res.success) throw new Error(res.message);
allWorkers = res.data.workers || [];
const s = res.data.summary || {};
document.getElementById('totalNum').textContent = s.total_active_workers || 0;
document.getElementById('doneNum').textContent = s.report_completed || 0;
document.getElementById('missingNum').textContent = s.report_missing || 0;
document.getElementById('vacNum').textContent = allWorkers.filter(w => w.vacation_type_code === 'ANNUAL_FULL').length;
renderWorkerList();
} catch (e) {
list.innerHTML = '<div class="pi-empty"><i class="fas fa-exclamation-triangle text-2xl text-red-300"></i><p>데이터 로드 실패</p></div>';
}
}
// ===== Master Data =====
async function loadMasterData() {
if (MOCK_ENABLED) {
projects = MOCK_PROJECTS;
workTypes = MOCK_WORK_TYPES;
tasks = MOCK_TASKS;
workStatuses = MOCK_WORK_STATUSES;
function renderWorkerList() {
const list = document.getElementById('workerList');
if (!allWorkers.length) {
list.innerHTML = '<div class="pi-empty"><p>작업자가 없습니다</p></div>';
return;
}
try {
const [pRes, wtRes, tRes, wsRes] = await Promise.all([
window.apiCall('/projects'),
window.apiCall('/daily-work-reports/work-types'),
window.apiCall('/tasks'),
window.apiCall('/daily-work-reports/work-status-types'),
]);
projects = (pRes && pRes.data) || [];
workTypes = (wtRes && wtRes.data) || [];
tasks = (tRes && tRes.data) || [];
workStatuses = (wsRes && wsRes.data) || [];
} catch (e) {
console.error('마스터 데이터 로드 실패:', e);
}
}
// ===== Load Workers =====
async function loadWorkers() {
const cardsEl = document.getElementById('workerCards');
cardsEl.innerHTML = '<div class="ds-skeleton"></div><div class="ds-skeleton"></div>';
document.getElementById('emptyState').classList.add('hidden');
selectedIds.clear();
workerFormData = {};
updateSaveBtn();
updateBulkBar();
try {
let res;
if (MOCK_ENABLED) {
res = MOCK_STATUS;
} else {
res = await window.apiCall('/proxy-input/daily-status?date=' + currentDate);
}
if (!res || !res.success) { cardsEl.innerHTML = '<div class="pi-empty"><p>데이터를 불러올 수 없습니다</p></div>'; return; }
// 휴무일 정보 저장
window._isHoliday = res.data.is_holiday || false;
window._holidayName = res.data.holiday_name || null;
// 휴무일 뱃지 표시
var holidayBanner = document.getElementById('holidayBanner');
if (holidayBanner) {
if (window._isHoliday) {
holidayBanner.classList.remove('hidden');
holidayBanner.textContent = '휴무일' + (window._holidayName ? ' (' + window._holidayName + ')' : '');
} else {
holidayBanner.classList.add('hidden');
}
}
missingWorkers = (res.data.workers || []).filter(w => w.status !== 'complete');
// 휴무일에 both_missing인 작업자에게 휴무 플래그 추가
if (window._isHoliday) {
missingWorkers.forEach(function(w) {
if (w.status === 'both_missing' && !w.vacation_type_code) {
w._isHolidayOff = true;
}
});
}
document.getElementById('missingNum').textContent = missingWorkers.length;
if (missingWorkers.length === 0) {
cardsEl.innerHTML = '';
document.getElementById('emptyState').classList.remove('hidden');
return;
}
renderCards();
} catch (e) {
cardsEl.innerHTML = '<div class="pi-empty"><i class="fas fa-exclamation-triangle text-2xl text-red-300"></i><p>네트워크 오류</p></div>';
}
}
// ===== Render Cards =====
function renderCards() {
const cardsEl = document.getElementById('workerCards');
cardsEl.innerHTML = missingWorkers.map(w => {
const isFullVacation = w.vacation_type_code === 'ANNUAL_FULL';
const isHolidayOff = !!w._isHolidayOff;
const isDisabled = isFullVacation || isHolidayOff;
const hasVacation = !!w.vacation_type_code;
const statusLabel = isDisabled ? ''
: ({ both_missing: 'TBM+보고서 미입력', tbm_only: '보고서만 미입력', report_only: 'TBM만 미입력' }[w.status] || '');
const fd = workerFormData[w.user_id] || getDefaultFormData(w);
if (hasVacation && !isFullVacation && w.vacation_hours != null) {
fd.work_hours = w.vacation_hours;
}
workerFormData[w.user_id] = fd;
const sel = selectedIds.has(w.user_id);
var badgeText = isHolidayOff ? '휴무' : (hasVacation ? w.vacation_type_name : '');
const vacBadge = badgeText ? '<span class="pi-vac-badge">' + escHtml(badgeText) + '</span>' : '';
const disabledClass = isDisabled ? ' vacation-disabled' : '';
list.innerHTML = allWorkers.map(w => {
const isFullVac = w.vacation_type_code === 'ANNUAL_FULL';
const hasVac = !!w.vacation_type_code;
const vacBadge = isFullVac ? '<span class="pi-badge vac">연차</span>'
: hasVac ? `<span class="pi-badge vac-half">${esc(w.vacation_type_name)}</span>` : '';
const doneBadge = w.has_report ? `<span class="pi-badge done">${w.total_report_hours}h</span>` : '<span class="pi-badge missing">미입력</span>';
return `
<div class="pi-card ${sel ? 'selected' : ''}${disabledClass}" id="card-${w.user_id}">
<div class="pi-card-header" onclick="toggleWorker(${w.user_id})">
<div class="pi-card-check">${isDisabled ? '' : (sel ? '<i class="fas fa-check text-xs"></i>' : '')}</div>
<div>
<div class="pi-card-name">${escHtml(w.worker_name)} ${vacBadge}</div>
<div class="pi-card-meta">${escHtml(w.job_type)} · ${escHtml(w.department_name)}</div>
</div>
<div class="pi-card-status ${w.status}">${statusLabel}</div>
<label class="pi-worker ${isFullVac ? 'disabled' : ''}" data-uid="${w.user_id}">
<input type="checkbox" class="pi-check" value="${w.user_id}"
${isFullVac ? 'disabled' : ''}
onchange="onWorkerCheck(${w.user_id}, this.checked)">
<div class="pi-worker-info">
<span class="pi-worker-name">${esc(w.worker_name)}</span>
<span class="pi-worker-job">${esc(w.job_type || '')}</span>
</div>
<div class="pi-card-form">
<div class="pi-field">
<label>프로젝트 <span class="text-red-400">*</span></label>
<select id="proj-${w.user_id}" onchange="updateField(${w.user_id},'project_id',this.value)">
<option value="">선택</option>
${projects.map(p => `<option value="${p.project_id}" ${fd.project_id == p.project_id ? 'selected' : ''}>${escHtml(p.job_no)} ${escHtml(p.project_name)}</option>`).join('')}
</select>
</div>
<div class="pi-field-row">
<div class="pi-field">
<label>공종 <span class="text-red-400">*</span></label>
<select id="wt-${w.user_id}" onchange="updateField(${w.user_id},'work_type_id',this.value); updateTaskOptions(${w.user_id})">
<option value="">선택</option>
${workTypes.map(t => `<option value="${t.id}" ${fd.work_type_id == t.id ? 'selected' : ''}>${escHtml(t.name)}</option>`).join('')}
</select>
</div>
<div class="pi-field">
<label>작업</label>
<select id="task-${w.user_id}" onchange="updateField(${w.user_id},'task_id',this.value)">
<option value="">선택</option>
${tasks.filter(t => t.work_type_id == fd.work_type_id).map(t => `<option value="${t.task_id}" ${fd.task_id == t.task_id ? 'selected' : ''}>${escHtml(t.task_name)}</option>`).join('')}
</select>
</div>
</div>
<div class="pi-field-row3">
<div class="pi-field">
<label>시간 <span class="text-red-400">*</span></label>
<input type="number" min="0" max="24" step="0.5" value="${fd.work_hours}" onchange="updateField(${w.user_id},'work_hours',this.value)">
</div>
<div class="pi-field">
<label>시작</label>
<input type="time" value="${fd.start_time}" onchange="updateField(${w.user_id},'start_time',this.value)">
</div>
<div class="pi-field">
<label>종료</label>
<input type="time" value="${fd.end_time}" onchange="updateField(${w.user_id},'end_time',this.value)">
</div>
</div>
<div class="pi-field-row">
<div class="pi-field">
<label>작업 상태</label>
<select onchange="updateField(${w.user_id},'work_status_id',this.value)">
${workStatuses.map(s => `<option value="${s.id}" ${fd.work_status_id == s.id ? 'selected' : ''}>${escHtml(s.name)}</option>`).join('')}
</select>
</div>
<div class="pi-field">
<label>비고</label>
<input type="text" placeholder="메모" value="${escHtml(fd.note || '')}" onchange="updateField(${w.user_id},'note',this.value)">
</div>
</div>
<div class="pi-worker-badges">
${vacBadge}${doneBadge}
</div>
</div>`;
</label>`;
}).join('');
}
function getDefaultFormData(worker) {
return {
project_id: '', work_type_id: '', task_id: '',
work_hours: 8, start_time: '08:00', end_time: '17:00',
work_status_id: 1, note: ''
};
function onWorkerCheck(userId, checked) {
if (checked) selectedIds.add(userId);
else selectedIds.delete(userId);
updateEditButton();
}
function escHtml(s) { return (s || '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;'); }
// ===== Worker Toggle =====
function toggleWorker(userId) {
var worker = missingWorkers.find(function(w) { return w.user_id === userId; });
if (worker && (worker.vacation_type_code === 'ANNUAL_FULL' || worker._isHolidayOff)) return;
if (selectedIds.has(userId)) {
selectedIds.delete(userId);
} else {
selectedIds.add(userId);
}
renderCards();
updateSaveBtn();
updateBulkBar();
function toggleSelectAll(checked) {
allWorkers.forEach(w => {
if (w.vacation_type_code === 'ANNUAL_FULL') return;
const cb = document.querySelector(`.pi-check[value="${w.user_id}"]`);
if (cb) { cb.checked = checked; onWorkerCheck(w.user_id, checked); }
});
}
function updateField(userId, field, value) {
if (!workerFormData[userId]) workerFormData[userId] = getDefaultFormData({});
workerFormData[userId][field] = value;
function updateEditButton() {
const btn = document.getElementById('editBtn');
const n = selectedIds.size;
btn.disabled = n === 0;
document.getElementById('editBtnText').textContent = n > 0 ? `선택 작업자 편집 (${n}명)` : '작업자를 선택하세요';
}
function updateTaskOptions(userId) {
const wtId = workerFormData[userId]?.work_type_id;
const sel = document.getElementById('task-' + userId);
if (!sel) return;
const filtered = tasks.filter(t => t.work_type_id == wtId);
sel.innerHTML = '<option value="">선택</option>' + filtered.map(t => `<option value="${t.task_id}">${escHtml(t.task_name)}</option>`).join('');
workerFormData[userId].task_id = '';
// ===== Step 2: Edit Mode =====
function openEditMode() {
if (selectedIds.size === 0) return;
const selected = allWorkers.filter(w => selectedIds.has(w.user_id));
editData = {};
// 기본값 설정
selected.forEach(w => {
const isHalfVac = w.vacation_type_code === 'ANNUAL_HALF';
const isQuarterVac = w.vacation_type_code === 'ANNUAL_QUARTER';
editData[w.user_id] = {
project_id: '',
work_type_id: '',
work_hours: isHalfVac ? 4 : isQuarterVac ? 6 : 8,
defect_hours: 0,
note: '',
start_time: '08:00',
end_time: isHalfVac ? '12:00' : isQuarterVac ? '14:00' : '17:00',
work_status_id: 1
};
});
document.getElementById('editTitle').textContent = `일괄 편집 (${selected.length}명)`;
const projOpts = projects.map(p => `<option value="${p.project_id}">${esc(p.project_name)}</option>`).join('');
const typeOpts = workTypes.map(t => `<option value="${t.work_type_id}">${esc(t.work_type_name)}</option>`).join('');
document.getElementById('editList').innerHTML = selected.map(w => {
const d = editData[w.user_id];
const vacLabel = w.vacation_type_name ? ` <span class="pi-badge vac-half">${esc(w.vacation_type_name)}</span>` : '';
return `
<div class="pi-edit-card" data-uid="${w.user_id}">
<div class="pi-edit-header">
<strong>${esc(w.worker_name)}</strong>
<span class="pi-edit-job">${esc(w.job_type || '')}</span>
${vacLabel}
</div>
<div class="pi-edit-fields">
<div class="pi-edit-row">
<select id="proj_${w.user_id}" class="pi-select" required>
<option value="">프로젝트 *</option>${projOpts}
</select>
<select id="wtype_${w.user_id}" class="pi-select" required>
<option value="">공종 *</option>${typeOpts}
</select>
</div>
<div class="pi-edit-row">
<label class="pi-field"><span>시간</span><input type="number" id="hours_${w.user_id}" value="${d.work_hours}" step="0.5" min="0" max="24" class="pi-input"></label>
<label class="pi-field"><span>부적합</span><input type="number" id="defect_${w.user_id}" value="0" step="0.5" min="0" max="24" class="pi-input"></label>
</div>
<input type="text" id="note_${w.user_id}" placeholder="비고" class="pi-note-input" value="">
</div>
</div>`;
}).join('');
document.getElementById('step1').classList.add('hidden');
document.getElementById('step2').classList.remove('hidden');
}
// ===== Bulk Actions =====
function updateBulkBar() {
const bar = document.getElementById('bulkBar');
if (selectedIds.size > 0) {
bar.classList.remove('hidden');
document.getElementById('selectedCount').textContent = selectedIds.size;
} else {
bar.classList.add('hidden');
}
}
function bulkSet(type) {
const modal = document.getElementById('bulkModal');
const body = document.getElementById('bulkModalBody');
const title = document.getElementById('bulkModalTitle');
const confirm = document.getElementById('bulkConfirmBtn');
if (type === 'project') {
title.textContent = '프로젝트 일괄 설정';
body.innerHTML = `<select id="bulkValue">${projects.map(p => `<option value="${p.project_id}">${escHtml(p.job_no)} ${escHtml(p.project_name)}</option>`).join('')}</select>`;
confirm.onclick = () => applyBulk('project_id', document.getElementById('bulkValue').value);
} else if (type === 'workType') {
title.textContent = '공종 일괄 설정';
body.innerHTML = `<select id="bulkValue">${workTypes.map(t => `<option value="${t.id}">${escHtml(t.name)}</option>`).join('')}</select>`;
confirm.onclick = () => applyBulk('work_type_id', document.getElementById('bulkValue').value);
} else if (type === 'hours') {
title.textContent = '작업시간 일괄 설정';
body.innerHTML = '<input type="number" id="bulkValue" min="0" max="24" step="0.5" value="8">';
confirm.onclick = () => applyBulk('work_hours', document.getElementById('bulkValue').value);
}
modal.classList.remove('hidden');
}
function applyBulk(field, value) {
let hasExisting = false;
for (const uid of selectedIds) {
const fd = workerFormData[uid];
if (fd && fd[field] && fd[field] !== '' && String(fd[field]) !== String(value)) {
hasExisting = true;
break;
}
}
if (hasExisting) {
if (!confirm('이미 입력된 값이 있습니다. 덮어쓰시겠습니까?')) {
// 빈 필드만 채움 (연차/휴무 작업자 skip)
for (const uid of selectedIds) {
var bw = missingWorkers.find(function(w) { return w.user_id === uid; });
if (bw && (bw.vacation_type_code === 'ANNUAL_FULL' || bw._isHolidayOff)) continue;
if (!workerFormData[uid][field] || workerFormData[uid][field] === '') {
workerFormData[uid][field] = value;
}
}
closeBulkModal();
renderCards();
return;
}
}
for (const uid of selectedIds) {
var bw2 = missingWorkers.find(function(w) { return w.user_id === uid; });
if (bw2 && (bw2.vacation_type_code === 'ANNUAL_FULL' || bw2._isHolidayOff)) continue;
workerFormData[uid][field] = value;
if (field === 'work_type_id') workerFormData[uid].task_id = '';
}
closeBulkModal();
renderCards();
}
function closeBulkModal() {
document.getElementById('bulkModal').classList.add('hidden');
function closeEditMode() {
document.getElementById('step2').classList.add('hidden');
document.getElementById('step1').classList.remove('hidden');
}
// ===== Save =====
function updateSaveBtn() {
const btn = document.getElementById('saveBtn');
const text = document.getElementById('saveBtnText');
if (selectedIds.size === 0) {
btn.disabled = true;
text.textContent = '저장할 작업자를 선택하세요';
} else {
btn.disabled = false;
text.textContent = `${selectedIds.size}명 대리입력 저장`;
}
}
async function saveProxyInput() {
if (saving || selectedIds.size === 0) return;
// 연차 작업자 선택 해제 (안전장치)
for (const uid of selectedIds) {
const ww = missingWorkers.find(x => x.user_id === uid);
if (ww && (ww.vacation_type_code === 'ANNUAL_FULL' || ww._isHolidayOff)) {
selectedIds.delete(uid);
}
}
if (selectedIds.size === 0) { showToast('저장할 대상이 없습니다', 'error'); return; }
// 유효성 검사
for (const uid of selectedIds) {
const fd = workerFormData[uid];
const w = missingWorkers.find(x => x.user_id === uid);
if (!fd.project_id) { showToast(`${w?.worker_name || uid}: 프로젝트를 선택하세요`, 'error'); return; }
if (!fd.work_type_id) { showToast(`${w?.worker_name || uid}: 공종을 선택하세요`, 'error'); return; }
}
saving = true;
async function saveAll() {
const btn = document.getElementById('saveBtn');
btn.disabled = true;
btn.classList.add('loading');
document.getElementById('saveBtnText').textContent = '저장 중...';
const entries = [...selectedIds].map(uid => ({
user_id: uid,
project_id: parseInt(workerFormData[uid].project_id),
work_type_id: parseInt(workerFormData[uid].work_type_id),
task_id: workerFormData[uid].task_id ? parseInt(workerFormData[uid].task_id) : null,
work_hours: parseFloat(workerFormData[uid].work_hours) || 8,
start_time: workerFormData[uid].start_time || '08:00',
end_time: workerFormData[uid].end_time || '17:00',
work_status_id: parseInt(workerFormData[uid].work_status_id) || 1,
note: workerFormData[uid].note || ''
}));
const entries = [];
let hasError = false;
for (const uid of selectedIds) {
const projEl = document.getElementById('proj_' + uid);
const wtypeEl = document.getElementById('wtype_' + uid);
const hoursEl = document.getElementById('hours_' + uid);
const defectEl = document.getElementById('defect_' + uid);
const noteEl = document.getElementById('note_' + uid);
if (!projEl?.value || !wtypeEl?.value) {
showToast(`프로젝트/공종을 선택하세요`, 'error');
projEl?.focus();
hasError = true;
break;
}
const workHours = parseFloat(hoursEl?.value) || 0;
const defectHours = parseFloat(defectEl?.value) || 0;
if (defectHours > workHours) {
showToast('부적합 시간이 근무시간을 초과합니다', 'error');
hasError = true;
break;
}
entries.push({
user_id: uid,
project_id: parseInt(projEl.value),
work_type_id: parseInt(wtypeEl.value),
work_hours: workHours,
defect_hours: defectHours,
note: noteEl?.value || '',
start_time: '08:00',
end_time: '17:00',
work_status_id: defectHours > 0 ? 2 : 1
});
}
if (hasError) {
btn.disabled = false;
document.getElementById('saveBtnText').textContent = '전체 저장';
return;
}
try {
let res;
if (MOCK_ENABLED) {
await new Promise(r => setTimeout(r, 1000)); // simulate delay
res = {
success: true,
data: { session_id: 999, created_reports: entries.length, workers: entries.map(e => ({ user_id: e.user_id, worker_name: missingWorkers.find(w => w.user_id === e.user_id)?.worker_name || '', report_id: Math.floor(Math.random() * 1000) })) },
message: `${entries.length}명의 대리입력이 완료되었습니다.`
};
} else {
res = await window.apiCall('/proxy-input', 'POST', { session_date: currentDate, entries });
}
const res = await window.apiCall('/proxy-input', 'POST', {
session_date: currentDate,
entries
});
if (res && res.success) {
showToast(res.message || `${entries.length}대리입력 완료`, 'success');
if (res.success) {
showToast(res.message || `${entries.length}저장 완료`, 'success');
closeEditMode();
selectedIds.clear();
updateEditButton();
await loadWorkers();
} else {
showToast(res?.message || '저장 실패', 'error');
showToast(res.message || '저장 실패', 'error');
}
} catch (e) {
showToast('네트워크 오류. 다시 시도해주세요.', 'error');
} finally {
saving = false;
btn.classList.remove('loading');
updateSaveBtn();
showToast('저장 실패: ' + (e.message || e), 'error');
}
btn.disabled = false;
document.getElementById('saveBtnText').textContent = '전체 저장';
}
// ===== Toast =====
// showToast는 tkfb-core.js에서 제공 (중복 정의 제거)
function esc(s) { return (s || '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;'); }

View File

@@ -7,7 +7,7 @@
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link rel="stylesheet" href="/static/css/tkfb.css?v=2026033108">
<link rel="stylesheet" href="/css/proxy-input.css?v=2026033102">
<link rel="stylesheet" href="/css/proxy-input.css?v=2026033201">
</head>
<body class="bg-gray-50">
<header class="bg-orange-700 text-white sticky top-0 z-50">
@@ -32,93 +32,66 @@
<nav id="sideNav" class="hidden lg:flex flex-col gap-1 w-52 flex-shrink-0 pt-2 fixed lg:static z-40 bg-white lg:bg-transparent p-4 lg:p-0 rounded-lg lg:rounded-none shadow-lg lg:shadow-none top-14 left-0 bottom-0 overflow-y-auto"></nav>
<div class="flex-1 min-w-0">
<!-- Header -->
<div class="pi-header">
<div class="pi-header-row">
<button type="button" onclick="history.back()" class="pi-back-btn"><i class="fas fa-arrow-left"></i></button>
<h1>대리입력</h1>
<div class="pi-header-date" id="headerDate">-</div>
<!-- ═══ STEP 1: 작업자 선택 ═══ -->
<div id="step1">
<div class="pi-title-row">
<h2 class="pi-title">대리입력</h2>
<div class="pi-date-group">
<input type="date" id="dateInput" class="pi-date-input" onchange="loadWorkers()">
<button class="pi-refresh-btn" onclick="loadWorkers()"><i class="fas fa-sync-alt"></i></button>
</div>
</div>
<div class="pi-status-bar" id="statusBar">
<span>전체 <strong id="totalNum">0</strong></span>
<span>완료 <strong id="doneNum" class="text-green-600">0</strong></span>
<span>미입력 <strong id="missingNum" class="text-red-500">0</strong></span>
<span>휴가 <strong id="vacNum" class="text-blue-500">0</strong></span>
</div>
<div class="pi-select-all">
<label><input type="checkbox" id="selectAll" onchange="toggleSelectAll(this.checked)"> 전체 선택</label>
</div>
<div class="pi-worker-list" id="workerList">
<div class="pi-skeleton"></div>
<div class="pi-skeleton"></div>
<div class="pi-skeleton"></div>
</div>
<div class="pi-bottom-bar" id="editBar">
<button class="pi-edit-btn" id="editBtn" onclick="openEditMode()" disabled>
<i class="fas fa-pen mr-2"></i><span id="editBtnText">작업자를 선택하세요</span>
</button>
</div>
</div>
<!-- Date + Status -->
<div class="pi-date-bar">
<div class="pi-date-info">
<i class="fas fa-calendar-alt text-blue-500"></i>
<input type="date" id="dateInput" class="pi-date-input" onchange="onDateChange(this.value)">
<button type="button" class="pi-refresh-btn" onclick="loadWorkers()"><i class="fas fa-sync-alt"></i></button>
<!-- ═══ STEP 2: 일괄 편집 ═══ -->
<div id="step2" class="hidden">
<div class="pi-title-row">
<button class="pi-back-btn" onclick="closeEditMode()"><i class="fas fa-arrow-left"></i></button>
<h2 class="pi-title" id="editTitle">일괄 편집</h2>
</div>
<div class="pi-status-badge" id="statusBadge">
<i class="fas fa-exclamation-triangle text-amber-500"></i>
<span>미입력 <strong id="missingNum">0</strong></span>
<div class="pi-edit-list" id="editList"></div>
<div class="pi-bottom-bar">
<button class="pi-save-btn" id="saveBtn" onclick="saveAll()">
<i class="fas fa-save mr-2"></i><span id="saveBtnText">전체 저장</span>
</button>
</div>
</div>
<!-- Holiday Banner -->
<div class="pi-holiday-banner hidden" id="holidayBanner"></div>
<!-- Bulk Actions -->
<div class="pi-bulk hidden" id="bulkBar">
<span class="pi-bulk-label"><i class="fas fa-layer-group mr-1"></i>일괄 설정 (<span id="selectedCount">0</span>명)</span>
<div class="pi-bulk-actions">
<button type="button" class="pi-bulk-btn" onclick="bulkSet('project')"><i class="fas fa-folder mr-1"></i>프로젝트</button>
<button type="button" class="pi-bulk-btn" onclick="bulkSet('workType')"><i class="fas fa-wrench mr-1"></i>공종</button>
<button type="button" class="pi-bulk-btn" onclick="bulkSet('hours')"><i class="fas fa-clock mr-1"></i>시간</button>
</div>
</div>
<!-- Worker Cards -->
<div class="pi-cards" id="workerCards">
<div class="ds-skeleton"></div>
<div class="ds-skeleton"></div>
</div>
<!-- Empty State -->
<div class="pi-empty hidden" id="emptyState">
<i class="fas fa-check-circle text-3xl text-green-300"></i>
<p>미입력 작업자가 없습니다</p>
<a href="/pages/work/daily-status.html" class="ds-link">현황으로 돌아가기</a>
</div>
<!-- No Permission -->
<div class="ds-empty hidden" id="noPermission">
<i class="fas fa-lock text-3xl text-gray-300"></i>
<p>접근 권한이 없습니다</p>
<a href="/pages/dashboard.html" class="ds-link">대시보드로 이동</a>
</div>
<!-- Bottom Save -->
<div class="pi-bottom" id="bottomSave">
<button type="button" class="pi-save-btn" id="saveBtn" onclick="saveProxyInput()" disabled>
<i class="fas fa-spinner fa-spin mr-2" style="display:none"></i><i class="fas fa-save mr-2"></i><span id="saveBtnText">저장할 작업자를 선택하세요</span>
</button>
</div>
<!-- Toast -->
<div id="toastContainer" class="toast-container"></div>
<!-- Bulk Select Modal -->
<div class="pi-modal-overlay hidden" id="bulkModal">
<div class="pi-modal">
<div class="pi-modal-header">
<span id="bulkModalTitle">일괄 설정</span>
<button type="button" onclick="closeBulkModal()"><i class="fas fa-times"></i></button>
</div>
<div class="pi-modal-body" id="bulkModalBody"></div>
<div class="pi-modal-footer">
<button type="button" class="pi-modal-cancel" onclick="closeBulkModal()">취소</button>
<button type="button" class="pi-modal-confirm" id="bulkConfirmBtn">적용</button>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="/static/js/tkfb-core.js?v=2026033108"></script>
<script src="/js/api-base.js?v=2026031701"></script>
<script src="/js/proxy-input.js?v=2026033102"></script>
<script src="/js/proxy-input.js?v=2026033201"></script>
<script>initAuth();</script>
</body>
</html>