74d3a78aa3
- 페이지 폴더 재구성: safety/, attendance/ 폴더 신규 생성 - work/ → safety/: 이슈 신고, 출입 신청 관련 페이지 이동 - common/ → attendance/: 근태/휴가 관련 페이지 이동 - admin/ 정리: safety-* 파일들을 safety/로 이동 - 사이드바 네비게이션 메뉴 구현 - 카테고리별 메뉴: 작업관리, 안전관리, 근태관리, 시스템관리 - 접기/펼치기 기능 및 상태 저장 - 관리자 전용 메뉴 자동 표시/숨김 - 날씨 API 연동 (기상청 단기예보) - TBM 및 navbar에 현재 날씨 표시 - weatherService.js 추가 - 안전 체크리스트 확장 - 기본/날씨별/작업별 체크 유형 추가 - checklist-manage.html 페이지 추가 - 이슈 신고 시스템 구현 - workIssueController, workIssueModel, workIssueRoutes 추가 - DB 마이그레이션 파일 추가 (실행 대기) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
301 lines
13 KiB
HTML
301 lines
13 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>시스템 관리자 대시보드 - TK Portal</title>
|
|
<link rel="stylesheet" href="/css/main-layout.css">
|
|
<link rel="stylesheet" href="/css/admin.css">
|
|
<link rel="stylesheet" href="/css/system-dashboard.css">
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
|
|
<link rel="icon" type="image/png" href="/img/favicon.png">
|
|
<script type="module" src="/js/auth-check.js"></script>
|
|
</head>
|
|
<body>
|
|
<div class="main-layout">
|
|
<!-- 기존 네비게이션 바 사용 -->
|
|
<div id="navbar-container"></div>
|
|
|
|
<div class="content-wrapper">
|
|
<!-- 시스템 관리자 배너 -->
|
|
<div class="system-banner">
|
|
<div class="banner-content">
|
|
<div class="banner-left">
|
|
<div class="system-icon">🔧</div>
|
|
<div class="banner-text">
|
|
<h1>시스템 관리자</h1>
|
|
<p>시스템 전반의 설정, 모니터링 및 관리를 담당합니다</p>
|
|
</div>
|
|
</div>
|
|
<div class="banner-right">
|
|
<span class="system-badge">SYSTEM</span>
|
|
<div class="system-status">
|
|
<span class="status-dot online"></span>
|
|
<span>시스템 정상</span>
|
|
</div>
|
|
<div class="quick-actions">
|
|
<button class="quick-btn" onclick="window.location.href='/pages/admin/manage-user.html'" title="사용자 관리">
|
|
👤
|
|
</button>
|
|
<button class="quick-btn" onclick="window.location.href='/pages/analysis/work-report-analytics.html'" title="분석 대시보드">
|
|
📊
|
|
</button>
|
|
<button class="quick-btn" onclick="window.location.href='/pages/analysis/project-worktype-analysis.html'" title="프로젝트별 작업 시간 분석">
|
|
🏗️
|
|
</button>
|
|
<button class="quick-btn" onclick="refreshSystemStatus()" title="시스템 새로고침">
|
|
🔄
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 메인 컨텐츠 -->
|
|
<main class="main-content">
|
|
<!-- 시스템 상태 개요 -->
|
|
<section class="system-overview">
|
|
<h2><i class="fas fa-tachometer-alt"></i> 시스템 상태</h2>
|
|
<div class="status-grid">
|
|
<div class="status-card">
|
|
<div class="status-info">
|
|
<h3>서버 상태</h3>
|
|
<p class="status-value online">온라인</p>
|
|
<small>마지막 확인: <span id="server-check-time">--</span></small>
|
|
</div>
|
|
</div>
|
|
<div class="status-card">
|
|
<div class="status-info">
|
|
<h3>데이터베이스</h3>
|
|
<p class="status-value online">정상</p>
|
|
<small>연결 수: <span id="db-connections">--</span></small>
|
|
</div>
|
|
</div>
|
|
<div class="status-card">
|
|
<div class="status-info">
|
|
<h3>활성 사용자</h3>
|
|
<p class="status-value" id="active-users">--</p>
|
|
<small>총 사용자: <span id="total-users">--</span></small>
|
|
</div>
|
|
</div>
|
|
<div class="status-card">
|
|
<div class="status-info">
|
|
<h3>시스템 알림</h3>
|
|
<p class="status-value warning" id="system-alerts">--</p>
|
|
<small>미처리 알림</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- 주요 관리 기능 -->
|
|
<section class="management-section">
|
|
<h2><i class="fas fa-tools"></i> 시스템 관리</h2>
|
|
<div class="management-grid">
|
|
<!-- 계정 관리 -->
|
|
<div class="management-card primary">
|
|
<div class="card-header">
|
|
<i class="fas fa-user-cog"></i>
|
|
<h3>계정 관리</h3>
|
|
</div>
|
|
<div class="card-content">
|
|
<p>사용자 계정 생성, 수정, 삭제 및 권한 관리</p>
|
|
<div class="card-actions">
|
|
<button class="btn btn-primary" data-action="account-management">
|
|
<i class="fas fa-users"></i> 계정 관리
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 시스템 로그 -->
|
|
<div class="management-card">
|
|
<div class="card-header">
|
|
<i class="fas fa-file-alt"></i>
|
|
<h3>시스템 로그</h3>
|
|
</div>
|
|
<div class="card-content">
|
|
<p>로그인 이력, 시스템 활동 및 오류 로그 조회</p>
|
|
<div class="card-actions">
|
|
<button class="btn btn-secondary" data-action="system-logs">
|
|
<i class="fas fa-search"></i> 로그 조회
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 데이터베이스 관리 -->
|
|
<div class="management-card">
|
|
<div class="card-header">
|
|
<i class="fas fa-database"></i>
|
|
<h3>데이터베이스</h3>
|
|
</div>
|
|
<div class="card-content">
|
|
<p>데이터베이스 백업, 복원 및 최적화</p>
|
|
<div class="card-actions">
|
|
<button class="btn btn-secondary" data-action="database-management">
|
|
<i class="fas fa-cog"></i> DB 관리
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 시스템 설정 -->
|
|
<div class="management-card">
|
|
<div class="card-header">
|
|
<i class="fas fa-sliders-h"></i>
|
|
<h3>시스템 설정</h3>
|
|
</div>
|
|
<div class="card-content">
|
|
<p>전역 설정, 보안 정책 및 시스템 매개변수</p>
|
|
<div class="card-actions">
|
|
<button class="btn btn-secondary" data-action="system-settings">
|
|
<i class="fas fa-wrench"></i> 설정
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 백업 관리 -->
|
|
<div class="management-card">
|
|
<div class="card-header">
|
|
<i class="fas fa-shield-alt"></i>
|
|
<h3>백업 관리</h3>
|
|
</div>
|
|
<div class="card-content">
|
|
<p>자동 백업 설정 및 복원 관리</p>
|
|
<div class="card-actions">
|
|
<button class="btn btn-secondary" data-action="backup-management">
|
|
<i class="fas fa-download"></i> 백업
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 프로젝트별 작업 시간 분석 -->
|
|
<div class="management-card primary">
|
|
<div class="card-header">
|
|
<i class="fas fa-project-diagram"></i>
|
|
<h3>프로젝트 작업 분석</h3>
|
|
</div>
|
|
<div class="card-content">
|
|
<p>프로젝트별-작업별 시간 분석 및 에러율 모니터링</p>
|
|
<div class="card-actions">
|
|
<button class="btn btn-primary" onclick="window.location.href='/pages/analysis/project-worktype-analysis.html'">
|
|
<i class="fas fa-chart-bar"></i> 분석 보기
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 모니터링 -->
|
|
<div class="management-card">
|
|
<div class="card-header">
|
|
<i class="fas fa-chart-line"></i>
|
|
<h3>시스템 모니터링</h3>
|
|
</div>
|
|
<div class="card-content">
|
|
<p>성능 지표, 리소스 사용량 및 트래픽 분석</p>
|
|
<div class="card-actions">
|
|
<button class="btn btn-secondary" data-action="monitoring">
|
|
<i class="fas fa-eye"></i> 모니터링
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- 최근 활동 -->
|
|
<section class="recent-activity">
|
|
<h2><i class="fas fa-history"></i> 최근 시스템 활동</h2>
|
|
<div class="activity-container">
|
|
<div class="activity-list" id="recent-activities">
|
|
<!-- 동적으로 로드됨 -->
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<!-- 계정 관리 모달 -->
|
|
<div id="account-modal" class="modal">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h3><i class="fas fa-user-cog"></i> 계정 관리</h3>
|
|
<button class="close-btn" data-action="close-modal">×</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div id="account-management-content">
|
|
<!-- 계정 관리 내용이 여기에 로드됩니다 -->
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 시스템 관리자 스크립트 -->
|
|
<script>
|
|
console.log('🔧 시스템 관리자 대시보드 로드됨');
|
|
|
|
// 시스템 상태 새로고침 함수
|
|
function refreshSystemStatus() {
|
|
console.log('🔄 시스템 상태 새로고침 중...');
|
|
|
|
// 시각적 피드백
|
|
const statusDot = document.querySelector('.status-dot');
|
|
const refreshBtn = document.querySelector('.quick-btn[title="시스템 새로고침"]');
|
|
|
|
if (refreshBtn) {
|
|
refreshBtn.style.transform = 'rotate(360deg)';
|
|
setTimeout(() => {
|
|
refreshBtn.style.transform = '';
|
|
}, 1000);
|
|
}
|
|
|
|
// 실제 상태 업데이트 (시뮬레이션)
|
|
setTimeout(() => {
|
|
updateSystemTime();
|
|
console.log('✅ 시스템 상태 업데이트 완료');
|
|
}, 1000);
|
|
}
|
|
|
|
// 시스템 시간 업데이트
|
|
function updateSystemTime() {
|
|
const timeElement = document.getElementById('server-check-time');
|
|
if (timeElement) {
|
|
timeElement.textContent = new Date().toLocaleTimeString('ko-KR');
|
|
}
|
|
}
|
|
|
|
// 간단한 테스트 함수
|
|
function testClick() {
|
|
console.log('🎯 버튼 클릭 테스트 성공!');
|
|
alert('버튼이 정상적으로 작동합니다!');
|
|
}
|
|
|
|
// DOM 로드 후 초기화
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
console.log('📄 시스템 대시보드 DOM 로드 완료');
|
|
|
|
// 초기 시간 설정
|
|
updateSystemTime();
|
|
|
|
// 주기적 시간 업데이트 (30초마다)
|
|
setInterval(updateSystemTime, 30000);
|
|
|
|
// 계정 관리 버튼 이벤트
|
|
const accountBtn = document.querySelector('[data-action="account-management"]');
|
|
if (accountBtn) {
|
|
accountBtn.addEventListener('click', testClick);
|
|
console.log('✅ 계정 관리 버튼 이벤트 설정 완료');
|
|
}
|
|
|
|
console.log('🚀 시스템 관리자 대시보드 초기화 완료');
|
|
});
|
|
</script>
|
|
|
|
<script type="module" src="/js/load-navbar.js"></script>
|
|
<script type="module" src="/js/system-dashboard.js"></script>
|
|
</body>
|
|
</html>
|