## 주요 변경사항
### 1. 미사용 페이지 아카이브 (24개)
- admin 폴더 전체 (8개) → .archived-admin/
- 분석 페이지 (5개) → .archived-*
- 공통 페이지 (5개) → .archived-*
- 대시보드 페이지 (2개) → .archived-*
- 기타 (4개) → .archived-*
### 2. 새로운 폴더 구조
```
pages/
├── dashboard.html (메인 대시보드)
├── work/ (작업 관련)
│ ├── report-create.html (작업보고서 작성)
│ ├── report-view.html (작업보고서 조회)
│ └── analysis.html (작업 분석)
├── admin/ (관리 기능)
│ ├── index.html (관리 메뉴 허브)
│ ├── projects.html (프로젝트 관리)
│ ├── workers.html (작업자 관리)
│ ├── codes.html (코드 관리)
│ └── accounts.html (계정 관리)
└── profile/ (프로필)
├── info.html (내 정보)
└── password.html (비밀번호 변경)
```
### 3. 파일명 개선
- group-leader.html → dashboard.html
- daily-work-report.html → work/report-create.html
- daily-work-report-viewer.html → work/report-view.html
- work-analysis.html → work/analysis.html
- work-management.html → admin/index.html
- project-management.html → admin/projects.html
- worker-management.html → admin/workers.html
- code-management.html → admin/codes.html
- my-profile.html → profile/info.html
- change-password.html → profile/password.html
- admin-settings.html → admin/accounts.html
### 4. 내부 링크 전면 수정
- navbar.html 프로필 메뉴 링크 업데이트
- dashboard.html 빠른 작업 링크 업데이트
- admin/* 페이지 간 링크 업데이트
- load-navbar.js 대시보드 경로 수정
영향받는 파일: 39개
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
304 lines
8.6 KiB
HTML
304 lines
8.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>프로젝트 투입 분석 | (주)테크니컬코리아</title>
|
|
<link rel="stylesheet" href="/css/main-layout.css">
|
|
<link rel="stylesheet" href="/css/admin.css">
|
|
<link rel="stylesheet" href="/css/work-report.css">
|
|
<link rel="icon" type="image/png" href="/img/favicon.png">
|
|
<script src="/js/auth-check.js" defer></script>
|
|
<style>
|
|
.period-selector {
|
|
display: flex;
|
|
gap: 15px;
|
|
align-items: center;
|
|
margin-bottom: 20px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.period-selector label {
|
|
font-weight: bold;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.period-selector input[type="date"] {
|
|
padding: 8px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.analysis-tabs {
|
|
display: flex;
|
|
gap: 10px;
|
|
margin-bottom: 20px;
|
|
border-bottom: 1px solid #ddd;
|
|
}
|
|
|
|
.tab-button {
|
|
padding: 10px 20px;
|
|
border: none;
|
|
background: #f5f5f5;
|
|
cursor: pointer;
|
|
border-radius: 4px 4px 0 0;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.tab-button.active {
|
|
background: #007bff;
|
|
color: white;
|
|
}
|
|
|
|
.analysis-content {
|
|
display: none;
|
|
}
|
|
|
|
.analysis-content.active {
|
|
display: block;
|
|
}
|
|
|
|
.summary-cards {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
|
gap: 15px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.summary-card {
|
|
background: #f8f9fa;
|
|
padding: 15px;
|
|
border-radius: 8px;
|
|
text-align: center;
|
|
border-left: 4px solid #007bff;
|
|
}
|
|
|
|
.summary-card h4 {
|
|
margin: 0;
|
|
color: #333;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.summary-card .value {
|
|
font-size: 24px;
|
|
font-weight: bold;
|
|
color: #007bff;
|
|
margin: 5px 0;
|
|
}
|
|
|
|
.data-table th {
|
|
background: #f8f9fa;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.data-table .project-col {
|
|
max-width: 150px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.data-table .worker-col {
|
|
min-width: 80px;
|
|
}
|
|
|
|
.data-table .task-col {
|
|
max-width: 120px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.data-table .hours-col {
|
|
text-align: right;
|
|
font-weight: bold;
|
|
color: #007bff;
|
|
}
|
|
|
|
.loading {
|
|
text-align: center;
|
|
padding: 40px;
|
|
color: #666;
|
|
}
|
|
|
|
.no-data {
|
|
text-align: center;
|
|
padding: 40px;
|
|
color: #999;
|
|
}
|
|
|
|
.filter-section {
|
|
background: #f8f9fa;
|
|
padding: 15px;
|
|
border-radius: 8px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.filter-row {
|
|
display: flex;
|
|
gap: 15px;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.filter-row select {
|
|
padding: 8px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 4px;
|
|
min-width: 120px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="main-layout">
|
|
<div id="navbar-container"></div>
|
|
|
|
<div class="content-wrapper">
|
|
<div id="sidebar-container"></div>
|
|
|
|
<div id="content-container">
|
|
<div class="page-header">
|
|
<h1>📊 프로젝트 투입 분석</h1>
|
|
<p class="subtitle">기간별 프로젝트/작업자/작업 투입 현황을 분석합니다.</p>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h3>📅 분석 기간 설정</h3>
|
|
<div class="period-selector">
|
|
<label for="startDate">시작일:</label>
|
|
<input type="date" id="startDate">
|
|
|
|
<label for="endDate">종료일:</label>
|
|
<input type="date" id="endDate">
|
|
|
|
<button id="analyzeBtn" class="btn btn-primary">분석 실행</button>
|
|
<button id="quickMonth" class="btn btn-secondary">이번 달</button>
|
|
<button id="quickLastMonth" class="btn btn-secondary">지난 달</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card" id="analysisCard" style="display: none;">
|
|
<div class="summary-cards" id="summaryCards">
|
|
<!-- 요약 정보가 여기에 동적으로 추가됩니다 -->
|
|
</div>
|
|
|
|
<div class="filter-section">
|
|
<h4>🔍 필터 옵션</h4>
|
|
<div class="filter-row">
|
|
<label>프로젝트:</label>
|
|
<select id="projectFilter">
|
|
<option value="">전체</option>
|
|
</select>
|
|
|
|
<label>작업자:</label>
|
|
<select id="workerFilter">
|
|
<option value="">전체</option>
|
|
</select>
|
|
|
|
<label>작업 분류:</label>
|
|
<select id="taskFilter">
|
|
<option value="">전체</option>
|
|
</select>
|
|
|
|
<button id="applyFilter" class="btn btn-primary">필터 적용</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="analysis-tabs">
|
|
<button class="tab-button active" data-tab="project">프로젝트별</button>
|
|
<button class="tab-button" data-tab="worker">작업자별</button>
|
|
<button class="tab-button" data-tab="task">작업별</button>
|
|
<button class="tab-button" data-tab="detail">상세내역</button>
|
|
</div>
|
|
|
|
<div id="projectTab" class="analysis-content active">
|
|
<h4>📋 프로젝트별 투입 현황</h4>
|
|
<div class="table-responsive">
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th width="50">순번</th>
|
|
<th>프로젝트명</th>
|
|
<th width="100">투입 시간</th>
|
|
<th width="80">비율</th>
|
|
<th width="100">참여 인원</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="projectTableBody">
|
|
<tr><td colspan="5" class="no-data">분석을 실행해주세요</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="workerTab" class="analysis-content">
|
|
<h4>👥 작업자별 투입 현황</h4>
|
|
<div class="table-responsive">
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th width="50">순번</th>
|
|
<th>작업자명</th>
|
|
<th width="100">투입 시간</th>
|
|
<th width="80">비율</th>
|
|
<th width="100">참여 프로젝트</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="workerTableBody">
|
|
<tr><td colspan="5" class="no-data">분석을 실행해주세요</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="taskTab" class="analysis-content">
|
|
<h4>⚙️ 작업별 투입 현황</h4>
|
|
<div class="table-responsive">
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th width="50">순번</th>
|
|
<th>작업 분류</th>
|
|
<th width="100">투입 시간</th>
|
|
<th width="80">비율</th>
|
|
<th width="100">참여 인원</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="taskTableBody">
|
|
<tr><td colspan="5" class="no-data">분석을 실행해주세요</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="detailTab" class="analysis-content">
|
|
<h4>📄 상세 내역</h4>
|
|
<div class="table-responsive">
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th width="50">순번</th>
|
|
<th width="100">날짜</th>
|
|
<th>프로젝트</th>
|
|
<th>작업자</th>
|
|
<th>작업 분류</th>
|
|
<th width="80">시간</th>
|
|
<th>메모</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="detailTableBody">
|
|
<tr><td colspan="7" class="no-data">분석을 실행해주세요</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="module" src="/js/load-navbar.js"></script>
|
|
<script type="module" src="/js/load-sidebar.js"></script>
|
|
<script type="module" src="/js/project-analysis.js"></script>
|
|
</body>
|
|
</html> |