Files
tk-factory-services/system1-factory/web/static/js/tkfb-dashboard.js
Hyungi Ahn 9fda89a374 feat: 안전 코드 tksafety 이관 + 사용자 관리 정리 + UI Tailwind 전환
Phase 1: tksafety에 출입신청/체크리스트 API·웹 추가, tkfb 안전 코드 삭제
Phase 2: 사용자 관리 페이지 삭제, API 축소, 알림 수신자 tkuser 이관
Phase 3: tkuser 권한 페이지 정의 업데이트
Phase 4: 전체 34개 페이지 Tailwind CSS + tkfb-core.js 전환,
         미사용 CSS 20개·인프라 JS 10개·템플릿·컴포넌트 삭제

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-13 10:46:22 +09:00

128 lines
5.7 KiB
JavaScript

/* ===== Dashboard (대시보드) ===== */
const today = new Date().toISOString().substring(0, 10);
function updateDateTime() {
const now = new Date();
const days = ['일', '월', '화', '수', '목', '금', '토'];
const h = String(now.getHours()).padStart(2, '0');
const m = String(now.getMinutes()).padStart(2, '0');
const el = document.getElementById('dateTimeDisplay');
if (el) el.textContent = `${now.getFullYear()}${now.getMonth()+1}${now.getDate()}일 (${days[now.getDay()]}) ${h}:${m}`;
}
async function loadDashboard() {
updateDateTime();
const results = await Promise.allSettled([
api('/tbm/sessions/date/' + today).catch(() => ({ data: [] })),
api('/notifications/unread').catch(() => ({ data: [] })),
api('/equipments/repair-requests?status=pending').catch(() => ({ data: [] })),
api('/attendance/today-summary').catch(() => ({ data: {} })),
]);
const tbmData = results[0].status === 'fulfilled' ? results[0].value : { data: [] };
const notifData = results[1].status === 'fulfilled' ? results[1].value : { data: [] };
const repairData = results[2].status === 'fulfilled' ? results[2].value : { data: [] };
const attendData = results[3].status === 'fulfilled' ? results[3].value : { data: {} };
const tbmSessions = tbmData.data || [];
const notifications = notifData.data || [];
const repairs = repairData.data || [];
const attendance = attendData.data || {};
// Stats
document.getElementById('statTbm').textContent = tbmSessions.length;
document.getElementById('statWorkers').textContent = attendance.checked_in_count || 0;
document.getElementById('statRepairs').textContent = repairs.length;
document.getElementById('statNotifications').textContent = notifications.length;
// TBM list
renderTbmList(tbmSessions);
renderNotificationList(notifications);
renderRepairList(repairs);
}
function renderTbmList(sessions) {
const el = document.getElementById('tbmList');
if (!sessions.length) {
el.innerHTML = '<p class="text-gray-400 text-sm text-center py-4">금일 TBM이 없습니다</p>';
return;
}
el.innerHTML = sessions.slice(0, 5).map(s => {
const workers = s.team_member_count || 0;
return `<div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
<div>
<div class="text-sm font-medium text-gray-800">${escapeHtml(s.workplace_name || s.session_title || 'TBM')}</div>
<div class="text-xs text-gray-500">${escapeHtml(s.leader_name || '-')} · ${workers}명</div>
</div>
<span class="badge ${s.status === 'completed' ? 'badge-green' : 'badge-amber'}">${s.status === 'completed' ? '완료' : '진행중'}</span>
</div>`;
}).join('');
if (sessions.length > 5) {
el.innerHTML += `<a href="/pages/work/tbm.html" class="block text-center text-xs text-orange-600 hover:text-orange-700 mt-2">전체 보기 (${sessions.length}건)</a>`;
}
}
function renderNotificationList(notifications) {
const el = document.getElementById('notificationList');
if (!notifications.length) {
el.innerHTML = '<p class="text-gray-400 text-sm text-center py-4">새 알림이 없습니다</p>';
return;
}
const icons = { repair: 'fa-wrench text-amber-500', safety: 'fa-shield-alt text-red-500', system: 'fa-bell text-blue-500', equipment: 'fa-cog text-gray-500', maintenance: 'fa-tools text-green-500' };
el.innerHTML = notifications.slice(0, 5).map(n => {
const iconClass = icons[n.type] || 'fa-bell text-gray-400';
return `<div class="flex items-start gap-3 p-3 bg-gray-50 rounded-lg cursor-pointer hover:bg-gray-100" onclick="location.href='/pages/admin/notifications.html'">
<i class="fas ${iconClass} mt-0.5"></i>
<div class="flex-1 min-w-0">
<div class="text-sm font-medium text-gray-800 truncate">${escapeHtml(n.title)}</div>
<div class="text-xs text-gray-500 mt-0.5">${formatTimeAgo(n.created_at)}</div>
</div>
</div>`;
}).join('');
}
function renderRepairList(repairs) {
const el = document.getElementById('repairList');
if (!repairs.length) {
el.innerHTML = '<p class="text-gray-400 text-sm text-center py-4">대기 중인 수리 요청이 없습니다</p>';
return;
}
el.innerHTML = repairs.slice(0, 5).map(r => {
return `<div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
<div>
<div class="text-sm font-medium text-gray-800">${escapeHtml(r.equipment_name || r.title || '수리 요청')}</div>
<div class="text-xs text-gray-500">${formatDate(r.created_at)}</div>
</div>
<span class="badge badge-red">대기</span>
</div>`;
}).join('');
if (repairs.length > 5) {
el.innerHTML += `<a href="/pages/admin/repair-management.html" class="block text-center text-xs text-orange-600 hover:text-orange-700 mt-2">전체 보기 (${repairs.length}건)</a>`;
}
}
function formatTimeAgo(dateStr) {
if (!dateStr) return '';
const d = new Date(dateStr);
const now = new Date();
const diff = now - d;
const mins = Math.floor(diff / 60000);
const hours = Math.floor(diff / 3600000);
const days = Math.floor(diff / 86400000);
if (mins < 1) return '방금 전';
if (mins < 60) return `${mins}분 전`;
if (hours < 24) return `${hours}시간 전`;
if (days < 7) return `${days}일 전`;
return formatDate(dateStr);
}
/* ===== Init ===== */
(async function() {
if (!await initAuth()) return;
updateDateTime();
setInterval(updateDateTime, 60000);
loadDashboard();
})();