a820a164cb
- Frontend: 하드코딩된 localhost API URL을 동적 URL 생성으로 변경 - reports-daily.html: 3곳 수정 (프로젝트 로드, 미리보기, 보고서 생성) - issues-archive.html: 프로젝트 로드 함수 수정 - issues-dashboard.html: 2곳 수정 (프로젝트 로드, 진행중 이슈 로드) - issues-inbox.html: 프로젝트 로드 함수 수정 - daily-work.html: 프로젝트 로드 함수 수정 - permissions.js: 2곳 수정 (권한 부여, 사용자 권한 조회) - Backup System: 완전한 백업/복구 시스템 구축 - backup_script.sh: 자동 백업 스크립트 (DB, 볼륨, 설정 파일) - restore_script.sh: 백업 복구 스크립트 - setup_auto_backup.sh: 자동 백업 스케줄 설정 (매일 오후 9시) - 백업 정책: 최신 10개 버전만 유지하여 용량 절약 - Migration: 5장 사진 지원 마이그레이션 파일 업데이트 이제 Cloudflare 환경(m.hyungi.net)에서 HTTPS 프로토콜로 API 호출하여 Mixed Content 오류 없이 모든 기능이 정상 작동합니다.
538 lines
24 KiB
HTML
538 lines
24 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>
|
|
|
|
<!-- Tailwind CSS -->
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
|
|
<!-- Font Awesome -->
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
|
|
<!-- Custom Styles -->
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
|
|
|
|
body {
|
|
font-family: 'Inter', sans-serif;
|
|
}
|
|
|
|
.report-card {
|
|
transition: all 0.2s ease;
|
|
border-left: 4px solid transparent;
|
|
}
|
|
|
|
.report-card:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
|
|
border-left-color: #10b981;
|
|
}
|
|
|
|
.stats-card {
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
.stats-card:hover {
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.issue-row {
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
.issue-row:hover {
|
|
background-color: #f9fafb;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="bg-gray-50 min-h-screen">
|
|
<!-- 공통 헤더가 여기에 자동으로 삽입됩니다 -->
|
|
|
|
<!-- Main Content -->
|
|
<main class="container mx-auto px-4 py-8" style="padding-top: 80px;">
|
|
<!-- 페이지 헤더 -->
|
|
<div class="bg-white rounded-xl shadow-sm p-6 mb-6">
|
|
<div class="flex items-center justify-between mb-4">
|
|
<div>
|
|
<h1 class="text-2xl font-bold text-gray-900 flex items-center">
|
|
<i class="fas fa-file-excel text-green-500 mr-3"></i>
|
|
일일보고서
|
|
</h1>
|
|
<p class="text-gray-600 mt-1">프로젝트별 진행중/완료 항목을 엑셀로 내보내세요</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 프로젝트 선택 -->
|
|
<div class="bg-white rounded-xl shadow-sm p-6 mb-6">
|
|
<div class="space-y-6">
|
|
<!-- 프로젝트 선택 -->
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-3">
|
|
<i class="fas fa-folder text-blue-500 mr-2"></i>보고서 생성할 프로젝트 선택
|
|
</label>
|
|
<select id="reportProjectSelect" class="w-full max-w-md px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-green-500 text-lg">
|
|
<option value="">프로젝트를 선택하세요</option>
|
|
</select>
|
|
<p class="text-sm text-gray-500 mt-2">
|
|
<i class="fas fa-info-circle mr-1"></i>
|
|
진행 중인 항목 + 완료되고 한번도 추출 안된 항목이 포함됩니다.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- 버튼 -->
|
|
<div class="flex items-center space-x-4">
|
|
<button id="previewBtn"
|
|
onclick="loadPreview()"
|
|
class="px-6 py-3 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed hidden">
|
|
<i class="fas fa-eye mr-2"></i>미리보기
|
|
</button>
|
|
<button id="generateReportBtn"
|
|
onclick="generateDailyReport()"
|
|
class="px-6 py-3 bg-green-600 text-white font-medium rounded-lg hover:bg-green-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed hidden">
|
|
<i class="fas fa-download mr-2"></i>일일보고서 생성
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 미리보기 섹션 -->
|
|
<div id="previewSection" class="hidden">
|
|
<!-- 통계 카드 -->
|
|
<div class="bg-white rounded-xl shadow-sm p-6 mb-6">
|
|
<h2 class="text-xl font-semibold text-gray-900 mb-4">
|
|
<i class="fas fa-chart-bar text-blue-500 mr-2"></i>추출 항목 통계
|
|
</h2>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
|
|
<div class="stats-card bg-blue-50 p-4 rounded-lg text-center">
|
|
<div class="text-3xl font-bold text-blue-600 mb-1" id="previewTotalCount">0</div>
|
|
<div class="text-sm text-blue-700 font-medium">총 추출 수량</div>
|
|
</div>
|
|
<div class="stats-card bg-orange-50 p-4 rounded-lg text-center">
|
|
<div class="text-3xl font-bold text-orange-600 mb-1" id="previewInProgressCount">0</div>
|
|
<div class="text-sm text-orange-700 font-medium">진행 중</div>
|
|
</div>
|
|
<div class="stats-card bg-green-50 p-4 rounded-lg text-center">
|
|
<div class="text-3xl font-bold text-green-600 mb-1" id="previewCompletedCount">0</div>
|
|
<div class="text-sm text-green-700 font-medium">완료 (미추출)</div>
|
|
</div>
|
|
<div class="stats-card bg-red-50 p-4 rounded-lg text-center">
|
|
<div class="text-3xl font-bold text-red-600 mb-1" id="previewDelayedCount">0</div>
|
|
<div class="text-sm text-red-700 font-medium">지연 중</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 항목 목록 -->
|
|
<div class="bg-white rounded-xl shadow-sm p-6">
|
|
<h2 class="text-xl font-semibold text-gray-900 mb-4">
|
|
<i class="fas fa-list text-gray-500 mr-2"></i>추출될 항목 목록
|
|
</h2>
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full">
|
|
<thead class="bg-gray-50">
|
|
<tr class="border-b">
|
|
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">No</th>
|
|
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">부적합명</th>
|
|
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">상태</th>
|
|
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">추출이력</th>
|
|
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">담당부서</th>
|
|
<th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase">신고일</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="previewTableBody" class="divide-y divide-gray-200">
|
|
<!-- 동적으로 채워짐 -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 포함 항목 안내 -->
|
|
<div class="bg-white rounded-xl shadow-sm p-6 mb-6">
|
|
<h2 class="text-xl font-semibold text-gray-900 mb-4">
|
|
<i class="fas fa-list-check text-gray-500 mr-2"></i>보고서 포함 항목 안내
|
|
</h2>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
|
<div class="report-card bg-blue-50 p-4 rounded-lg">
|
|
<div class="flex items-center mb-2">
|
|
<i class="fas fa-check-circle text-blue-500 mr-2"></i>
|
|
<span class="font-medium text-blue-800">진행 중 항목</span>
|
|
</div>
|
|
<p class="text-sm text-blue-600">모든 진행 중인 항목이 포함됩니다 (추출 이력과 무관)</p>
|
|
</div>
|
|
<div class="report-card bg-green-50 p-4 rounded-lg">
|
|
<div class="flex items-center mb-2">
|
|
<i class="fas fa-check-circle text-green-500 mr-2"></i>
|
|
<span class="font-medium text-green-800">완료됨 항목</span>
|
|
</div>
|
|
<p class="text-sm text-green-600">한번도 추출 안된 완료 항목만 포함, 이후 자동 제외</p>
|
|
</div>
|
|
<div class="report-card bg-yellow-50 p-4 rounded-lg">
|
|
<div class="flex items-center mb-2">
|
|
<i class="fas fa-info-circle text-yellow-500 mr-2"></i>
|
|
<span class="font-medium text-yellow-800">추출 이력 기록</span>
|
|
</div>
|
|
<p class="text-sm text-yellow-600">추출 시 자동으로 이력이 기록됩니다</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<!-- JavaScript -->
|
|
<script src="/static/js/core/auth-manager.js"></script>
|
|
<script src="/static/js/core/permissions.js"></script>
|
|
<script src="/static/js/components/common-header.js"></script>
|
|
<script src="/static/js/api.js"></script>
|
|
|
|
<script>
|
|
let projects = [];
|
|
let selectedProjectId = null;
|
|
let previewData = null;
|
|
|
|
// 페이지 초기화
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
console.log('일일보고서 페이지 로드 시작');
|
|
|
|
// AuthManager 로드 대기
|
|
const checkAuthManager = async () => {
|
|
if (window.authManager) {
|
|
try {
|
|
// 인증 확인
|
|
const isAuthenticated = await window.authManager.checkAuth();
|
|
if (!isAuthenticated) {
|
|
window.location.href = '/login.html';
|
|
return;
|
|
}
|
|
|
|
// 프로젝트 목록 로드
|
|
await loadProjects();
|
|
|
|
// 공통 헤더 초기화
|
|
try {
|
|
const user = JSON.parse(localStorage.getItem('currentUser') || '{}');
|
|
if (window.commonHeader && user.id) {
|
|
await window.commonHeader.init(user, 'reports_daily');
|
|
}
|
|
} catch (headerError) {
|
|
console.error('공통 헤더 초기화 오류:', headerError);
|
|
}
|
|
|
|
console.log('일일보고서 페이지 로드 완료');
|
|
} catch (error) {
|
|
console.error('페이지 초기화 오류:', error);
|
|
}
|
|
} else {
|
|
setTimeout(checkAuthManager, 100);
|
|
}
|
|
};
|
|
checkAuthManager();
|
|
});
|
|
|
|
// 프로젝트 목록 로드
|
|
async function loadProjects() {
|
|
try {
|
|
const apiUrl = window.API_BASE_URL || (() => {
|
|
const hostname = window.location.hostname;
|
|
const protocol = window.location.protocol;
|
|
const port = window.location.port;
|
|
|
|
if ((hostname === 'localhost' || hostname === '127.0.0.1') && port) {
|
|
return `${protocol}//${hostname}:${port}/api`;
|
|
}
|
|
if (hostname === 'm.hyungi.net') {
|
|
return 'https://m-api.hyungi.net/api';
|
|
}
|
|
return '/api';
|
|
})();
|
|
|
|
const response = await fetch(`${apiUrl}/projects/`, {
|
|
headers: {
|
|
'Authorization': `Bearer ${localStorage.getItem('access_token')}`
|
|
}
|
|
});
|
|
|
|
if (response.ok) {
|
|
projects = await response.json();
|
|
populateProjectSelect();
|
|
} else {
|
|
console.error('프로젝트 로드 실패:', response.status);
|
|
}
|
|
} catch (error) {
|
|
console.error('프로젝트 로드 오류:', error);
|
|
}
|
|
}
|
|
|
|
// 프로젝트 선택 옵션 채우기
|
|
function populateProjectSelect() {
|
|
const select = document.getElementById('reportProjectSelect');
|
|
|
|
if (!select) {
|
|
console.error('reportProjectSelect 요소를 찾을 수 없습니다!');
|
|
return;
|
|
}
|
|
|
|
select.innerHTML = '<option value="">프로젝트를 선택하세요</option>';
|
|
|
|
projects.forEach(project => {
|
|
const option = document.createElement('option');
|
|
option.value = project.id;
|
|
option.textContent = project.project_name || project.name;
|
|
select.appendChild(option);
|
|
});
|
|
}
|
|
|
|
// 프로젝트 선택 시 이벤트
|
|
document.addEventListener('change', async function(e) {
|
|
if (e.target.id === 'reportProjectSelect') {
|
|
selectedProjectId = e.target.value;
|
|
const previewBtn = document.getElementById('previewBtn');
|
|
const generateBtn = document.getElementById('generateReportBtn');
|
|
const previewSection = document.getElementById('previewSection');
|
|
|
|
if (selectedProjectId) {
|
|
previewBtn.classList.remove('hidden');
|
|
generateBtn.classList.remove('hidden');
|
|
previewSection.classList.add('hidden');
|
|
previewData = null;
|
|
} else {
|
|
previewBtn.classList.add('hidden');
|
|
generateBtn.classList.add('hidden');
|
|
previewSection.classList.add('hidden');
|
|
previewData = null;
|
|
}
|
|
}
|
|
});
|
|
|
|
// 미리보기 로드
|
|
async function loadPreview() {
|
|
if (!selectedProjectId) {
|
|
alert('프로젝트를 선택해주세요.');
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const apiUrl = window.API_BASE_URL || (() => {
|
|
const hostname = window.location.hostname;
|
|
const protocol = window.location.protocol;
|
|
const port = window.location.port;
|
|
|
|
if ((hostname === 'localhost' || hostname === '127.0.0.1') && port) {
|
|
return `${protocol}//${hostname}:${port}/api`;
|
|
}
|
|
if (hostname === 'm.hyungi.net') {
|
|
return 'https://m-api.hyungi.net/api';
|
|
}
|
|
return '/api';
|
|
})();
|
|
const response = await fetch(`${apiUrl}/reports/daily-preview?project_id=${selectedProjectId}`, {
|
|
headers: {
|
|
'Authorization': `Bearer ${localStorage.getItem('access_token')}`
|
|
}
|
|
});
|
|
|
|
if (response.ok) {
|
|
previewData = await response.json();
|
|
displayPreview(previewData);
|
|
} else {
|
|
alert('미리보기 로드에 실패했습니다.');
|
|
}
|
|
} catch (error) {
|
|
console.error('미리보기 로드 오류:', error);
|
|
alert('미리보기 로드 중 오류가 발생했습니다.');
|
|
}
|
|
}
|
|
|
|
// 미리보기 표시
|
|
function displayPreview(data) {
|
|
// 통계 업데이트
|
|
const inProgressCount = data.issues.filter(i => i.review_status === 'in_progress').length;
|
|
const completedCount = data.issues.filter(i => i.review_status === 'completed').length;
|
|
|
|
document.getElementById('previewTotalCount').textContent = data.total_issues;
|
|
document.getElementById('previewInProgressCount').textContent = inProgressCount;
|
|
document.getElementById('previewCompletedCount').textContent = completedCount;
|
|
document.getElementById('previewDelayedCount').textContent = data.stats.delayed_count;
|
|
|
|
// 테이블 업데이트
|
|
const tbody = document.getElementById('previewTableBody');
|
|
tbody.innerHTML = '';
|
|
|
|
data.issues.forEach(issue => {
|
|
const row = document.createElement('tr');
|
|
row.className = 'issue-row';
|
|
|
|
const statusBadge = getStatusBadge(issue);
|
|
const exportBadge = getExportBadge(issue);
|
|
const department = getDepartmentText(issue.responsible_department);
|
|
const reportDate = issue.report_date ? new Date(issue.report_date).toLocaleDateString('ko-KR') : '-';
|
|
|
|
row.innerHTML = `
|
|
<td class="px-4 py-3 text-sm text-gray-900">${issue.project_sequence_no || issue.id}</td>
|
|
<td class="px-4 py-3 text-sm text-gray-900">${issue.final_description || issue.description || '-'}</td>
|
|
<td class="px-4 py-3 text-sm">${statusBadge}</td>
|
|
<td class="px-4 py-3 text-sm">${exportBadge}</td>
|
|
<td class="px-4 py-3 text-sm text-gray-900">${department}</td>
|
|
<td class="px-4 py-3 text-sm text-gray-500">${reportDate}</td>
|
|
`;
|
|
|
|
tbody.appendChild(row);
|
|
});
|
|
|
|
// 미리보기 섹션 표시
|
|
document.getElementById('previewSection').classList.remove('hidden');
|
|
}
|
|
|
|
// 상태 배지 (지연/진행중/완료 구분)
|
|
function getStatusBadge(issue) {
|
|
// 완료됨
|
|
if (issue.review_status === 'completed') {
|
|
return '<span class="px-2 py-1 text-xs font-medium bg-green-100 text-green-800 rounded">완료됨</span>';
|
|
}
|
|
|
|
// 진행 중인 경우 지연 여부 확인
|
|
if (issue.review_status === 'in_progress') {
|
|
if (issue.expected_completion_date) {
|
|
const today = new Date();
|
|
today.setHours(0, 0, 0, 0);
|
|
const expectedDate = new Date(issue.expected_completion_date);
|
|
expectedDate.setHours(0, 0, 0, 0);
|
|
|
|
if (expectedDate < today) {
|
|
return '<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">지연중</span>';
|
|
}
|
|
}
|
|
return '<span class="px-2 py-1 text-xs font-medium bg-orange-100 text-orange-800 rounded">진행중</span>';
|
|
}
|
|
|
|
return '<span class="px-2 py-1 text-xs font-medium bg-gray-100 text-gray-800 rounded">' + (issue.review_status || '-') + '</span>';
|
|
}
|
|
|
|
// 추출 이력 배지
|
|
function getExportBadge(issue) {
|
|
if (issue.last_exported_at) {
|
|
const exportDate = new Date(issue.last_exported_at).toLocaleDateString('ko-KR');
|
|
return `<span class="px-2 py-1 text-xs font-medium bg-blue-100 text-blue-800 rounded">추출됨 (${issue.export_count || 1}회)</span>`;
|
|
} else {
|
|
return '<span class="px-2 py-1 text-xs font-medium bg-gray-100 text-gray-800 rounded">미추출</span>';
|
|
}
|
|
}
|
|
|
|
// 부서명 변환
|
|
function getDepartmentText(department) {
|
|
const map = {
|
|
'production': '생산',
|
|
'quality': '품질',
|
|
'purchasing': '구매',
|
|
'design': '설계',
|
|
'sales': '영업'
|
|
};
|
|
return map[department] || '-';
|
|
}
|
|
|
|
// 일일보고서 생성
|
|
async function generateDailyReport() {
|
|
if (!selectedProjectId) {
|
|
alert('프로젝트를 선택해주세요.');
|
|
return;
|
|
}
|
|
|
|
// 미리보기 데이터가 있고 항목이 0개인 경우
|
|
if (previewData && previewData.total_issues === 0) {
|
|
alert('추출할 항목이 없습니다.');
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const button = document.getElementById('generateReportBtn');
|
|
const originalText = button.innerHTML;
|
|
button.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i>생성 중...';
|
|
button.disabled = true;
|
|
|
|
const apiUrl = window.API_BASE_URL || (() => {
|
|
const hostname = window.location.hostname;
|
|
const protocol = window.location.protocol;
|
|
const port = window.location.port;
|
|
|
|
if ((hostname === 'localhost' || hostname === '127.0.0.1') && port) {
|
|
return `${protocol}//${hostname}:${port}/api`;
|
|
}
|
|
if (hostname === 'm.hyungi.net') {
|
|
return 'https://m-api.hyungi.net/api';
|
|
}
|
|
return '/api';
|
|
})();
|
|
const response = await fetch(`${apiUrl}/reports/daily-export`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'Authorization': `Bearer ${localStorage.getItem('access_token')}`
|
|
},
|
|
body: JSON.stringify({
|
|
project_id: parseInt(selectedProjectId)
|
|
})
|
|
});
|
|
|
|
if (response.ok) {
|
|
const blob = await response.blob();
|
|
const url = window.URL.createObjectURL(blob);
|
|
const a = document.createElement('a');
|
|
a.style.display = 'none';
|
|
a.href = url;
|
|
|
|
// 파일명 생성
|
|
const project = projects.find(p => p.id == selectedProjectId);
|
|
const today = new Date().toISOString().split('T')[0];
|
|
a.download = `${project.project_name}_일일보고서_${today}.xlsx`;
|
|
|
|
document.body.appendChild(a);
|
|
a.click();
|
|
window.URL.revokeObjectURL(url);
|
|
document.body.removeChild(a);
|
|
|
|
// 성공 메시지
|
|
showSuccessMessage('일일보고서가 성공적으로 생성되었습니다!');
|
|
|
|
// 미리보기 새로고침
|
|
if (previewData) {
|
|
setTimeout(() => loadPreview(), 1000);
|
|
}
|
|
|
|
} else {
|
|
const error = await response.text();
|
|
console.error('보고서 생성 실패:', error);
|
|
alert('보고서 생성에 실패했습니다. 다시 시도해주세요.');
|
|
}
|
|
} catch (error) {
|
|
console.error('보고서 생성 오류:', error);
|
|
alert('보고서 생성 중 오류가 발생했습니다.');
|
|
} finally {
|
|
const button = document.getElementById('generateReportBtn');
|
|
button.innerHTML = '<i class="fas fa-download mr-2"></i>일일보고서 생성';
|
|
button.disabled = false;
|
|
}
|
|
}
|
|
|
|
// 성공 메시지 표시
|
|
function showSuccessMessage(message) {
|
|
const successDiv = document.createElement('div');
|
|
successDiv.className = 'fixed top-4 right-4 bg-green-500 text-white px-6 py-3 rounded-lg shadow-lg z-50';
|
|
successDiv.innerHTML = `
|
|
<div class="flex items-center">
|
|
<i class="fas fa-check-circle mr-2"></i>
|
|
<span>${message}</span>
|
|
</div>
|
|
`;
|
|
|
|
document.body.appendChild(successDiv);
|
|
|
|
setTimeout(() => {
|
|
successDiv.remove();
|
|
}, 3000);
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|