+
프로젝트명
@@ -209,19 +178,16 @@
-
-
-
+
-
+
프로젝트 위치
-
-
-
+
위도 18.068579
+
경도 102.65966
@@ -233,7 +199,7 @@
-
+
저장공간 관련 문의: GSIM 개발팀 이호성 수석연구원
undefined
-
diff --git a/index.html b/index.html
deleted file mode 100644
index 6847292..0000000
--- a/index.html
+++ /dev/null
@@ -1,142 +0,0 @@
-
-
-
-
-
-
-
Project Master Portal
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/js/common.js b/js/common.js
new file mode 100644
index 0000000..94ef6aa
--- /dev/null
+++ b/js/common.js
@@ -0,0 +1,9 @@
+// 공통 네비게이션 및 유틸리티 로직
+function navigateTo(path) {
+ location.href = path;
+}
+
+// 상단바 클릭 시 홈으로 이동 등 공통 이벤트 설정
+document.addEventListener('DOMContentLoaded', () => {
+ // 필요한 경우 공통 초기화 로직 추가
+});
diff --git a/js/dashboard.js b/js/dashboard.js
new file mode 100644
index 0000000..c28f0ff
--- /dev/null
+++ b/js/dashboard.js
@@ -0,0 +1,267 @@
+let rawData = [];
+
+const continentMap = {
+ "라오스": "아시아", "미얀마": "아시아", "베트남": "아시아", "사우디아라비아": "아시아",
+ "우즈베키스탄": "아시아", "이라크": "아시아", "캄보디아": "아시아",
+ "키르기스스탄": "아시아", "파키스탄": "아시아", "필리핀": "아시아",
+ "아르헨티나": "아메리카", "온두라스": "아메리카", "볼리비아": "아메리카", "콜롬비아": "아메리카",
+ "파라과이": "아메리카", "페루": "아메리카", "엘살바도르": "아메리카",
+ "가나": "아프리카", "기니": "아프리카", "우간다": "아프리카", "에티오피아": "아프리카", "탄자니아": "아프리카"
+};
+
+const continentOrder = {
+ "아시아": 1,
+ "아프리카": 2,
+ "아메리카": 3,
+ "지사": 4
+};
+
+async function init() {
+ const container = document.getElementById('projectAccordion');
+ if (!container) return;
+
+ // 서버에서 최신 sheet.csv 데이터 가져오기 (캐시 방지 위해 timestamp 추가)
+ try {
+ const response = await fetch(`/project-data?t=${new Date().getTime()}`);
+ rawData = await response.json();
+ console.log("Loaded rawData:", rawData);
+ if (rawData.error) throw new Error(rawData.error);
+ } catch (e) {
+ console.error("데이터 로드 실패:", e);
+ alert("데이터를 가져오는 데 실패했습니다.");
+ return;
+ }
+
+ container.innerHTML = ''; // 초기화
+ const groupedData = {};
+
+ rawData.forEach((item, index) => {
+ const projectName = item[0];
+ let continent = "";
+ let country = "";
+
+ if (projectName.endsWith("사무소")) {
+ continent = "지사";
+ country = projectName.split(" ")[0];
+ } else if (projectName.startsWith("메콩유역")) {
+ country = "캄보디아";
+ continent = "아시아";
+ } else {
+ country = projectName.split(" ")[0];
+ continent = continentMap[country] || "기타";
+ }
+
+ if (!groupedData[continent]) groupedData[continent] = {};
+ if (!groupedData[continent][country]) groupedData[continent][country] = [];
+
+ groupedData[continent][country].push({ item, index });
+ });
+
+ const sortedContinents = Object.keys(groupedData).sort((a, b) => (continentOrder[a] || 99) - (continentOrder[b] || 99));
+
+ sortedContinents.forEach(continent => {
+ const continentGroup = document.createElement('div');
+ continentGroup.className = 'continent-group';
+
+ let continentHtml = `
+
+
+ `;
+
+ const sortedCountries = Object.keys(groupedData[continent]).sort((a, b) => a.localeCompare(b));
+
+ sortedCountries.forEach(country => {
+ continentHtml += `
+
+
+
+
+
+ `;
+
+ const sortedProjects = groupedData[continent][country].sort((a, b) => a.item[0].localeCompare(b.item[0]));
+
+ sortedProjects.forEach(({ item, index }) => {
+ const projectName = item[0];
+ const dept = item[1];
+ const admin = item[2];
+ const recentLogRaw = item[3];
+ const fileCount = item[4];
+
+ const recentLog = recentLogRaw === "X" ? "기록 없음" : recentLogRaw;
+ const logTime = recentLog !== "기록 없음" ? recentLog.split(',')[0] : "기록 없음";
+
+ let statusClass = "";
+ if (fileCount === 0) statusClass = "status-error";
+ else if (recentLog === "기록 없음") statusClass = "status-warning";
+
+ continentHtml += `
+
+
+
+
+
+
참여 인원 상세
+
+ | 이름 | 소속 | 사용자권한 |
|---|
+
+ | ${admin} | ${dept} | 관리자 |
+ | 김철수 | ${dept} | 부관리자 |
+ | 박지민 | ${dept} | 일반참여자 |
+ | 최유리 | ${dept} | 참관자 |
+
+
+
+
+
최근 문의사항 및 파일 변경 로그
+
+ | 유형 | 내용 | 일시 |
|---|
+
+ | 로그 | 데이터 동기화 완료 | ${logTime} |
+ | 문의 | 프로젝트 접근 권한 요청 | 2026-02-23 |
+ | 파일 | 설계도면 v2.pdf 업로드 | 2026-02-22 |
+
+
+
+
+
+
+ `;
+ });
+
+ continentHtml += `
+
+
+
+ `;
+ });
+
+ continentHtml += `
+
+ `;
+
+ continentGroup.innerHTML = continentHtml;
+ container.appendChild(continentGroup);
+ });
+
+ const allContinents = container.querySelectorAll('.continent-group');
+ allContinents.forEach(continent => {
+ continent.classList.add('active');
+ });
+
+ const allCountries = container.querySelectorAll('.country-group');
+ allCountries.forEach(country => {
+ country.classList.add('active');
+ });
+}
+
+function toggleGroup(header) {
+ const group = header.parentElement;
+ group.classList.toggle('active');
+}
+
+function toggleAccordion(header) {
+ const item = header.parentElement;
+ const container = item.parentElement;
+
+ const allItems = container.querySelectorAll('.accordion-item');
+ allItems.forEach(el => {
+ if (el !== item) el.classList.remove('active');
+ });
+
+ item.classList.toggle('active');
+}
+
+async function syncData() {
+ const btn = document.getElementById('syncBtn');
+ const logConsole = document.getElementById('logConsole');
+ const logBody = document.getElementById('logBody');
+
+ btn.classList.add('loading');
+ btn.innerHTML = `
동기화 중 (진행 상황 확인 중...)`;
+ btn.disabled = true;
+
+ logConsole.style.display = 'block';
+ logBody.innerHTML = '';
+
+ function addLog(msg) {
+ const logItem = document.createElement('div');
+ logItem.innerText = `[${new Date().toLocaleTimeString()}] ${msg}`;
+ logBody.appendChild(logItem);
+ logConsole.scrollTop = logConsole.scrollHeight;
+ }
+
+ try {
+ const response = await fetch(`/sync`);
+
+ const reader = response.body.getReader();
+ const decoder = new TextDecoder();
+
+ while (true) {
+ const { done, value } = await reader.read();
+ if (done) break;
+
+ const chunk = decoder.decode(value);
+ const lines = chunk.split('\n');
+
+ for (const line of lines) {
+ if (line.startsWith('data: ')) {
+ const payload = JSON.parse(line.substring(6));
+
+ if (payload.type === 'log') {
+ addLog(payload.message);
+ } else if (payload.type === 'done') {
+ const newData = payload.data;
+ newData.forEach(scrapedItem => {
+ const target = rawData.find(item =>
+ item[0].replace(/\s/g, '').includes(scrapedItem.projectName.replace(/\s/g, '')) ||
+ scrapedItem.projectName.replace(/\s/g, '').includes(item[0].replace(/\s/g, ''))
+ );
+
+ if (target) {
+ if (scrapedItem.recentLog !== "기존데이터유지") {
+ target[3] = scrapedItem.recentLog;
+ }
+ target[4] = scrapedItem.fileCount;
+ }
+ });
+
+ document.getElementById('projectAccordion').innerHTML = '';
+ init();
+ addLog(">>> 모든 동기화 작업이 완료되었습니다!");
+ alert(`총 ${newData.length}개 프로젝트 동기화 완료!`);
+ logConsole.style.display = 'none';
+ }
+ }
+ }
+ }
+ } catch (e) {
+ addLog(`오류 발생: ${e.message}`);
+ alert("서버 연결 실패. 백엔드 서버가 실행 중인지 확인하세요.");
+ console.error(e);
+ } finally {
+ btn.classList.remove('loading');
+ btn.innerHTML = `
데이터 동기화 (크롤링)`;
+ btn.disabled = false;
+ }
+}
+
+document.addEventListener('DOMContentLoaded', init);
diff --git a/js/mail.js b/js/mail.js
new file mode 100644
index 0000000..4f90140
--- /dev/null
+++ b/js/mail.js
@@ -0,0 +1,403 @@
+let currentFiles = [];
+let editingIndex = -1;
+
+const HIERARCHY = {
+ "행정": {
+ "계약": ["계약관리", "기성관리", "업무지시서", "인원관리"],
+ "업무관리": ["업무일지(2025)", "업무일지(2025년 이전)", "발주처 정기보고", "본사업무보고", "공사감독일지", "양식서류"]
+ },
+ "설계성과품": {
+ "시방서": ["공사시방서", "장비 반입허가 검토서"],
+ "설계도면": ["공통", "토공", "비탈면안전공", "배수공", "교량공", "포장공", "교통안전시설공", "부대공", "용지공 & 기타공"],
+ "수량산출서": ["토공", "비탈면안전공", "배수공", "교량공", "포장공", "교통안전시설공", "부대공", "용지공 & 기타공"],
+ "내역서": ["단가산출서"],
+ "보고서": ["실시설계보고서", "지반조사보고서", "구조계산서", "수리 및 전기계산서", "기타보고서", "기술자문 및 심의"],
+ "측량계산부": ["측량계산부"],
+ "설계단계 수행협의": ["회의·협의"]
+ },
+ "시공성과품": {
+ "설계도면": ["공통", "토공", "비탈면안전공", "배수공", "교량공", "포장공", "교통안전시설공", "부대공", "용지공 & 기타공"]
+ },
+ "시공검측": {
+ "토공": ["검측 (깨기)", "검측 (연약지반)", "검측 (발파)", "검측 (노체)", "검측 (노상)", "검측 (토취장)"],
+ "배수공": ["검측 (V형측구)", "검측 (산마루측구)", "검측 (U형측구)", "검측 (U형측구)(안)", "검측 (L형측구, J형측구)", "검측 (도수로)", "검측 (도수로)(안)", "검측 (횡배수관)", "검측 (종배수관)", "검측 (맹암거)", "검측 (통로암거)", "검측 (수로암거)", "검측 (호안공)", "검측 (옹벽공)", "검측 (용수개거)"],
+ "구조물공": ["검측 (평목교-거더, 부대공)", "검측 (평목교)(안)", "검측 (개착터널, 생태통로)"],
+ "포장공": ["검측 (기층, 보조기층)"],
+ "부대공": ["검측 (환경)", "검측 (지장가옥,건물 철거)", "검측 (방음벽 등)"],
+ "비탈면안전공": ["검측 (식생보호공)", "검측 (구조물보호공)"],
+ "교통안전시설공": ["검측 (낙석방지책)"],
+ "검측 양식서류": ["검측 양식서류"]
+ },
+ "설계변경": {
+ "실정보고(어천~공주)": ["토공", "배수공", "교량공(평목교)", "구조물공", "포장공", "교통안전공", "부대공", "전기공사", "미확정공", "안전관리", "환경관리", "품질관리", "자재관리", "지장물", "기타"],
+ "실정보고(대술~정안)": ["토공", "배수공", "비탈면안전공", "포장공", "부대공", "안전관리", "환경관리", "자재관리", "기타"],
+ "기술지원 검토": ["토공", "배수공", "교량공(평목교)", "구조물&부대공", "기타"],
+ "시공계획(어천~공주)": ["토공", "배수공", "교량공(평목교)", "구조물&부대&포장&교통안전공", "환경 및 품질관리"]
+ },
+ "공사관리": {
+ "공정·일정": ["공정표", "월간 공정보고", "작업일보"],
+ "품질 관리": ["품질시험계획서", "품질시험 실적보고", "콘크리트 타설현황[어천~공주(4차)]", "품질관리비 사용내역", "균열관리", "품질관리 양식서류"],
+ "안전 관리": ["안전관리계획서", "안전관리 실적보고", "위험성 평가", "사전작업허가서", "안전관리비 사용내역", "안전관리수준평가", "안전관리 양식서류"],
+ "환경 관리": ["환경영향평가", "사전재해영향성검토", "유지관리 및 보수점검", "환경보전비 사용내역", "건설폐기물 관리"],
+ "자재 관리 (관급)": ["자재구매요청 (레미콘, 철근)", "자재구매요청 (그 외)", "납품기한", "계약 변경", "자재 반입·수불 관리", "자재관리 양식서류"],
+ "자재 관리 (사급)": ["자재공급원 승인", "자재 반입·수불 관리", "자재 검수·확인"],
+ "점검 (정리중)": ["내부점검", "외부점검"],
+ "공문": ["접수(수신)", "발송(발신)", "하도급", "인력", "방침"]
+ },
+ "민원관리": {
+ "민원(어천~공주)": ["처리대장", "보상", "공사일반", "환경분쟁"],
+ "실정보고(어천~공주)": ["민원"],
+ "실정보고(대술~정안)": ["민원"]
+ }
+};
+
+async function loadAttachments() {
+ try {
+ const res = await fetch('/attachments');
+ currentFiles = await res.json();
+ renderFiles();
+ } catch (e) {
+ console.error("Failed to load attachments:", e);
+ }
+}
+
+function renderFiles() {
+ const isAiActive = document.getElementById('aiToggle').checked;
+ const container = document.getElementById('attachmentList');
+ if (!container) return;
+ container.innerHTML = '';
+
+ currentFiles.forEach((file, index) => {
+ const item = document.createElement('div');
+ item.className = 'attachment-item-wrap';
+ item.style.marginBottom = "8px";
+
+ let pathText = "경로를 선택해주세요";
+ let modeClass = "manual-mode";
+
+ if (file.analysis) {
+ const prefix = file.analysis.isManual ? "선택 경로: " : "추천: ";
+ pathText = `${prefix}${file.analysis.suggested_path}`;
+ modeClass = file.analysis.isManual ? "manual-mode" : "smart-mode";
+ } else if (isAiActive) {
+ pathText = "AI 분석 대기 중...";
+ modeClass = "smart-mode";
+ }
+
+ item.innerHTML = `
+
+
📄
+
+
${file.name}
+
${file.size}
+
+
+ ${pathText}
+ ${isAiActive ? `` : ''}
+
+
+
+
+ `;
+ container.appendChild(item);
+ });
+}
+
+function switchMailTab(el, tabType) {
+ document.querySelectorAll('.mail-tab').forEach(tab => tab.classList.remove('active'));
+ el.classList.add('active');
+ console.log(`Switched to ${tabType}`);
+ // 실제 데이터 필터링 로직이 있다면 여기에 추가
+}
+
+function togglePreview(show) {
+ const previewArea = document.getElementById('mailPreviewArea');
+ if (show) {
+ previewArea.classList.add('active');
+ } else {
+ previewArea.classList.remove('active');
+ }
+}
+
+function showPreview(index, event) {
+ // 버튼이나 경로 클릭 시 미리보기 방지
+ if (event.target.closest('.btn-group') || event.target.closest('.path-display')) return;
+
+ const file = currentFiles[index];
+ const previewContainer = document.getElementById('previewContainer');
+ const fullViewBtn = document.getElementById('fullViewBtn');
+
+ // 이전에 active 상태인 아이템 해제
+ document.querySelectorAll('.attachment-item').forEach(item => item.classList.remove('active'));
+ // 현재 클릭한 아이템 active
+ event.currentTarget.classList.add('active');
+
+ togglePreview(true);
+
+ const isPdf = file.name.toLowerCase().endsWith('.pdf');
+ const fileUrl = `/sample_files/${encodeURIComponent(file.name)}`;
+
+ // 전체보기 버튼 설정
+ if (fullViewBtn) {
+ fullViewBtn.style.display = 'block';
+ fullViewBtn.onclick = () => {
+ window.open(fileUrl, 'PMFullView', 'width=1000,height=800,scrollbars=yes');
+ };
+ }
+
+ if (isPdf) {
+ // PDF의 경우 #page=1 옵션을 사용하여 첫 페이지부터 노출 (10페이지 제한은 UI 문구로 처리)
+ // 실제 브라우저 뷰어 사양에 따라 다르지만 보통 전체가 로드되므로, 안내 문구와 함께 제공
+ previewContainer.innerHTML = `
+
+ `;
+ } else {
+ previewContainer.innerHTML = `
+
+
+
${file.name}
+
본 화면은 미리보기 예시입니다.
+
+ `;
+ }
+}
+
+function openPathModal(index, event) {
+ if (event) event.stopPropagation();
+ editingIndex = index;
+ const modal = document.getElementById('pathModal');
+ const tabSelect = document.getElementById('tabSelect');
+ if (!tabSelect) return;
+ tabSelect.innerHTML = Object.keys(HIERARCHY).map(tab => `
`).join('');
+ updateCategories();
+ modal.style.display = 'flex';
+}
+
+function updateCategories() {
+ const tabSelect = document.getElementById('tabSelect');
+ const catSelect = document.getElementById('categorySelect');
+ if (!tabSelect || !catSelect) return;
+ const tab = tabSelect.value;
+ const cats = Object.keys(HIERARCHY[tab]);
+ catSelect.innerHTML = cats.map(cat => `
`).join('');
+ updateSubs();
+}
+
+function updateSubs() {
+ const tabSelect = document.getElementById('tabSelect');
+ const catSelect = document.getElementById('categorySelect');
+ const subSelect = document.getElementById('subSelect');
+ if (!tabSelect || !catSelect || !subSelect) return;
+ const tab = tabSelect.value;
+ const cat = catSelect.value;
+ const subs = HIERARCHY[tab][cat];
+ subSelect.innerHTML = subs.map(sub => `
`).join('');
+}
+
+function applyPathSelection() {
+ const tabSelect = document.getElementById('tabSelect');
+ const catSelect = document.getElementById('categorySelect');
+ const subSelect = document.getElementById('subSelect');
+ if (!tabSelect || !catSelect || !subSelect) return;
+ const tab = tabSelect.value;
+ const cat = catSelect.value;
+ const sub = subSelect.value;
+ const fullPath = `${tab} > ${cat} > ${sub}`;
+
+ if (!currentFiles[editingIndex].analysis) {
+ currentFiles[editingIndex].analysis = {};
+ }
+ currentFiles[editingIndex].analysis.suggested_path = fullPath;
+ currentFiles[editingIndex].analysis.isManual = true;
+
+ renderFiles();
+ closeModal();
+}
+
+function closeModal() {
+ const modal = document.getElementById('pathModal');
+ if (modal) modal.style.display = 'none';
+}
+
+async function startAnalysis(index, event) {
+ if (event) event.stopPropagation();
+ const file = currentFiles[index];
+ const logArea = document.getElementById(`log-area-${index}`);
+ const logContent = document.getElementById(`log-content-${index}`);
+ const recLabel = document.getElementById(`recommend-${index}`);
+
+ if (!logArea || !logContent || !recLabel) return;
+
+ logArea.classList.add('active');
+ logContent.innerHTML = '
>>> 3중 레이어 AI 분석 엔진 가동...
';
+ recLabel.innerText = '분석 중...';
+
+ try {
+ const res = await fetch(`/analyze-file?filename=${encodeURIComponent(file.name)}`);
+ const analysis = await res.json();
+ if (analysis.error) throw new Error(analysis.error);
+
+ const result = analysis.final_result;
+ const steps = [
+ `1. 파일 포맷 분석: ${file.name.split('.').pop().toUpperCase()} 감지`,
+ `2. 페이지 스캔: 총 ${analysis.total_pages}페이지 분석 완료`,
+ `3. 문맥 추론: ${result.reason}`
+ ];
+
+ steps.forEach(step => {
+ const line = document.createElement('div');
+ line.className = 'log-line';
+ line.innerText = " " + step;
+ logContent.appendChild(line);
+ });
+
+ const resultLine = document.createElement('div');
+ resultLine.className = 'log-line log-success';
+ resultLine.style.marginTop = "8px";
+ resultLine.innerHTML = `[최종 결과] ${result.suggested_path}
└ 신뢰도: 100%`;
+ logContent.appendChild(resultLine);
+
+ const snippetArea = document.createElement('div');
+ snippetArea.style.cssText = "margin-top:10px; padding:10px; background:#1a202c; color:#a0aec0; font-size:11px; border-radius:4px; border-left:3px solid #63b3ed; max-height:100px; overflow-y:auto;";
+ snippetArea.innerHTML = `
[AI가 읽은 핵심 내용]${result.snippet || "텍스트 추출 불가"}`;
+ logContent.appendChild(snippetArea);
+
+ currentFiles[index].analysis = {
+ suggested_path: result.suggested_path,
+ isManual: false
+ };
+ renderFiles();
+
+ } catch (e) {
+ logContent.innerHTML += `
ERR: ${e.message}
`;
+ recLabel.innerText = '분석 실패';
+ }
+}
+
+function confirmUpload(index, event) {
+ if (event) event.stopPropagation();
+ const file = currentFiles[index];
+
+ if (!file.analysis || !file.analysis.suggested_path) {
+ alert("경로를 설정해주세요.");
+ return;
+ }
+
+ const path = file.analysis.suggested_path;
+ const message = `정해진 위치로 업로드하시겠습니까?\n\n위치: ${path}`;
+ if (confirm(message)) alert("업로드가 완료되었습니다.");
+}
+
+let addressBookData = [
+ { name: "이태훈", dept: "PM Overseas / 선임연구원", email: "th.lee@projectmaster.com", phone: "010-1234-5678" },
+ { name: "Pany S.", dept: "라오스 농림부 / 국장", email: "pany.s@lao.gov.la", phone: "+856-20-1234-5678" },
+ { name: "김철수", dept: "현대건설 / 현장소장", email: "cs.kim@hdec.co.kr", phone: "010-9876-5432" },
+ { name: "Nguyen Van A", dept: "베트남 전력청 / 팀장", email: "nva@evn.com.vn", phone: "+84-90-1234-5678" }
+];
+let contactEditingIndex = -1;
+
+function openAddressBook() {
+ const modal = document.getElementById('addressBookModal');
+ if (modal) {
+ renderAddressBook();
+ modal.style.display = 'flex';
+ }
+}
+
+function closeAddressBook() {
+ const modal = document.getElementById('addressBookModal');
+ if (modal) {
+ modal.style.display = 'none';
+ document.getElementById('addContactForm').style.display = 'none';
+ contactEditingIndex = -1;
+ }
+}
+
+function renderAddressBook() {
+ const body = document.getElementById('addressBookBody');
+ if (!body) return;
+ body.innerHTML = addressBookData.map((c, idx) => `
+
+ | ${c.name} |
+ ${c.dept} |
+ ${c.email} |
+ ${c.phone} |
+
+
+
+ |
+
+ `).join('');
+}
+
+function toggleAddContactForm() {
+ const form = document.getElementById('addContactForm');
+ if (form.style.display === 'none') {
+ form.style.display = 'block';
+ } else {
+ form.style.display = 'none';
+ contactEditingIndex = -1;
+ // 필드 초기화
+ document.getElementById('newContactName').value = '';
+ document.getElementById('newContactDept').value = '';
+ document.getElementById('newContactEmail').value = '';
+ document.getElementById('newContactPhone').value = '';
+ }
+}
+
+function editContact(index) {
+ const contact = addressBookData[index];
+ contactEditingIndex = index;
+
+ document.getElementById('newContactName').value = contact.name;
+ document.getElementById('newContactDept').value = contact.dept;
+ document.getElementById('newContactEmail').value = contact.email;
+ document.getElementById('newContactPhone').value = contact.phone;
+
+ document.getElementById('addContactForm').style.display = 'block';
+}
+
+function deleteContact(index) {
+ if (confirm(`'${addressBookData[index].name}'님을 주소록에서 삭제하시겠습니까?`)) {
+ addressBookData.splice(index, 1);
+ renderAddressBook();
+ }
+}
+
+function addContact() {
+ const name = document.getElementById('newContactName').value;
+ const dept = document.getElementById('newContactDept').value;
+ const email = document.getElementById('newContactEmail').value;
+ const phone = document.getElementById('newContactPhone').value;
+
+ if (!name) {
+ alert("이름을 입력해주세요.");
+ return;
+ }
+
+ const newData = { name, dept, email, phone };
+
+ if (contactEditingIndex > -1) {
+ addressBookData[contactEditingIndex] = newData;
+ contactEditingIndex = -1;
+ } else {
+ addressBookData.push(newData);
+ }
+
+ renderAddressBook();
+ toggleAddContactForm();
+}
+
+function togglePreviewAuto() {
+ const area = document.getElementById('mailPreviewArea');
+ const icon = document.getElementById('previewToggleIcon');
+ const isActive = area.classList.toggle('active');
+
+ if (icon) {
+ icon.innerText = isActive ? '▶' : '◀';
+ }
+}
+
+document.addEventListener('DOMContentLoaded', loadAttachments);
diff --git a/mailTest.html b/mailTest.html
deleted file mode 100644
index 2f66671..0000000
--- a/mailTest.html
+++ /dev/null
@@ -1,410 +0,0 @@
-
-
-
-
-
-
Project Mail Manager
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 라오스 농림부
- 오후 2:30
-
-
ITTC 교육센터 착공식 일정 협의
-
안녕하세요. 착공식 관련하여 첨부 드리는 공문을...
-
-
-
-
-
-
- 안녕하세요. 이태훈 선임연구원님.
- 라오스 ITTC 관개 교육센터 착공식과 관련하여 정부 측 인사의 일정을 반영한 최종 공문을 송부합니다.
- 첨부파일의 세부 계획안을 검토하신 후, 프로젝트 대시보드의 '과업계획' 탭에 업로드 및 공유 부탁드립니다.
-
-
-
-
-
첨부파일 리스트
-
- AI 판단
-
-
-
-
-
-
-
-
-
-
diff --git a/server.py b/server.py
index ee03c03..721d9de 100644
--- a/server.py
+++ b/server.py
@@ -9,13 +9,29 @@ from fastapi import FastAPI
from fastapi.middleware.cors import CORSMiddleware
from fastapi.responses import StreamingResponse, FileResponse
from fastapi.staticfiles import StaticFiles
+from fastapi.templating import Jinja2Templates
from analyze import analyze_file_content
from crawler_service import run_crawler_service
+import asyncio
+from fastapi import Request
app = FastAPI(title="Project Master Overseas API")
+templates = Jinja2Templates(directory="templates")
+
+# --- 유틸리티: 동기 함수를 스레드 풀에서 실행 ---
+async def run_in_threadpool(func, *args):
+ loop = asyncio.get_event_loop()
+ return await loop.run_in_executor(None, func, *args)
# 정적 파일 및 미들웨어 설정
app.mount("/style", StaticFiles(directory="style"), name="style")
+app.mount("/js", StaticFiles(directory="js"), name="js")
+app.mount("/sample_files", StaticFiles(directory="sample"), name="sample_files")
+
+@app.get("/sample.png")
+async def get_sample_img():
+ return FileResponse("sample.png")
+
app.add_middleware(
CORSMiddleware,
allow_origins=["*"],
@@ -25,18 +41,54 @@ app.add_middleware(
)
# --- HTML 라우팅 ---
+import csv
+
+@app.get("/project-data")
+async def get_project_data():
+ """
+ sheet.csv 파일을 읽어서 프로젝트 현황 데이터를 반환
+ """
+ projects = []
+ try:
+ with open("sheet.csv", mode="r", encoding="utf-8-sig") as f:
+ reader = csv.reader(f)
+ rows = [row for row in reader if row] # 빈 행 제외
+
+ # 실제 데이터가 시작되는 지점 찾기 (No. 로 시작하는 행 다음부터)
+ start_idx = -1
+ for i, row in enumerate(rows):
+ if row and "No." in row[0]:
+ start_idx = i + 1
+ break
+
+ if start_idx != -1:
+ for row in rows[start_idx:]:
+ if len(row) >= 8:
+ # [프로젝트명, 담당부서, 담당자, 최근활동로그, 파일수] 형식으로 추출
+ projects.append([
+ row[1], # 프로젝트 명
+ row[2], # 담당부서
+ row[3], # 담당자
+ row[5], # 최근 활동로그
+ int(row[7]) if row[7].isdigit() else 0 # 파일 수
+ ])
+ except Exception as e:
+ return {"error": str(e)}
+
+ return projects
+
@app.get("/")
-async def root():
- return FileResponse("index.html")
+async def root(request: Request):
+ return templates.TemplateResponse("index.html", {"request": request})
@app.get("/dashboard")
-async def get_dashboard():
- return FileResponse("dashboard.html")
+async def get_dashboard(request: Request):
+ return templates.TemplateResponse("dashboard.html", {"request": request})
@app.get("/mailTest")
@app.get("/mailTest.html")
-async def get_mail_test():
- return FileResponse("mailTest.html")
+async def get_mail_test(request: Request):
+ return templates.TemplateResponse("mailTest.html", {"request": request})
# --- 데이터 API ---
@app.get("/attachments")
@@ -57,9 +109,9 @@ async def get_attachments():
@app.get("/analyze-file")
async def analyze_file(filename: str):
"""
- 분석 서비스(analyze.py) 호출
+ 분석 서비스(analyze.py) 호출 - 스레드 풀에서 비차단 방식으로 실행
"""
- return analyze_file_content(filename)
+ return await run_in_threadpool(analyze_file_content, filename)
@app.get("/sync")
async def sync_data():
diff --git a/sheet.csv b/sheet.csv
index fa073d9..775627a 100644
--- a/sheet.csv
+++ b/sheet.csv
@@ -1,4 +1,4 @@
-[PM Overseas 프로젝트 현황],,2026.02.24,,,,,,<<활동로그가 없는 프로젝트 (9),,
+[PM Overseas 프로젝트 현황],,2026.03.04,,,,,,<<활동로그가 없는 프로젝트 (8),,
,,,,,,,,,,
No.,프로젝트 명,담당부서,담당자,종료(예정)일,최근 활동로그,과업개요 작성 유무,파일 수,비고,,
1,라오스 ITTC 관개 교육센터 PMC,수자원1부,방노성,2025.12.20,"2026.01.29, 폴더 삭제",O,16,2026.01.29 로그는 테스트 활동 추정,종료(예정)일 지남,진행
@@ -6,19 +6,19 @@ No.,프로젝트 명,담당부서,담당자,종료(예정)일,최근 활동로
3,미얀마 만달레이 철도 개량 감리 CS,철도사업부,김태헌,2027.11.17,"2025.11.17, 폴더이름변경",O,298,,,
4,베트남 푸옥호아 양수 발전 FS,수력부,이철호,2025.11.30,"2026.02.23, 폴더이름변경",O,139,준공도서 3월 작성예정,종료(예정)일 지남,준공
5,사우디아라비아 아시르 지잔 고속도로 FS,도로부,공태원,2025.11.21,"2026.02.09, 파일다운로드",O,73,,종료(예정)일 지남,준공
-6,우즈베키스탄 타슈켄트 철도 FS,철도사업부,김태헌,2026.03.20,"2026.02.05, 파일업로드",O,51,,,
-7,우즈베키스탄 지방 도로 복원 MP,도로부,장진영,2029.04.28,X,X,0,,,
+6,우즈베키스탄 지방 도로 복원 MP,도로부,장진영,2029.04.28,X,X,0,,,
+7,우즈베키스탄 타슈켄트 철도 FS,철도사업부,김태헌,2026.03.20,"2026.02.05, 파일업로드",O,51,,,
8,이라크 Habbaniyah Shuaiba AirBase PD,도로부,강동구,2026.12.31,X,X,0,,,
-9,캄보디아 반테 민체이 관개 홍수저감 MP,수자원1부,이대주,2026.08.28,"2025.12.07, 파일업로드",X,44,,,
-10,캄보디아 시엠립 하수처리 개선 DD,물환경사업1부,변역근,2028.12.18,"2026.02.06, AI 요약",O,221,,,
-11,메콩유역 수자원 관리 기후적응 MP,수자원1부,정귀한,2025.12.31,X,X,0,,종료(예정)일 지남,준공
+9,메콩유역 수자원 관리 기후적응 MP,수자원1부,정귀한,2025.12.31,X,X,0,,종료(예정)일 지남,준공
+10,캄보디아 반테 민체이 관개 홍수저감 MP,수자원1부,이대주,2026.08.28,"2025.12.07, 파일업로드",X,44,,,
+11,캄보디아 시엠립 하수처리 개선 DD,물환경사업1부,변역근,2028.12.18,"2026.02.06, AI 요약",O,221,,,
12,키르기스스탄 잘랄아바드 상수도 계획 MP,물환경사업1부,변기상,2025.12.31,"2026.02.12, 파일업로드",X,60,,종료(예정)일 지남,준공
-13,파키스탄 CAREC 도로 감리 DD,도로부,황효섭,2026.10.26,X,X,0,,,
-14,파키스탄 펀잡 홍수 방재 PMC,수자원1부,방노성,2027.12.31,"2025.12.08, 폴더삭제",O,0,,,
-15,파키스탄 KP 아보타바드 상수도 PMC,물환경사업2부,변기상,2026.12.31,"2026.02.12, 파일업로드",O,234,,,
-16,필리핀 홍수 관리 Package5B MP,수자원1부,이희철,2026.05.31,"2025.12.02, 폴더이름변경",O,14,,,
-17,필리핀 PGN 해상교량 BID2 IDC,구조부,이상희,2026.05.31,"2026.02.11, 파일다운로드",O,631,,,
-18,필리핀 홍수 복원 InFRA2 DD,수자원1부,이대주,2026.08.07,"2025.12.01, 폴더삭제",O,6,최근로그 >> 폴더자동삭제(파일 개수 미달),,
+13,파키스탄 펀잡 홍수 방재 PMC,수자원1부,방노성,2027.12.31,"2025.12.08, 폴더삭제",O,0,,,
+14,파키스탄 KP 아보타바드 상수도 PMC,물환경사업2부,변기상,2026.12.31,"2026.02.26, 파일업로드",O,240,,,
+15,파키스탄 CAREC 도로 감리 DD,도로부,황효섭,2026.10.26,X,X,0,,,
+16,필리핀 홍수 복원 InFRA2 DD,수자원1부,이대주,2026.08.07,"2025.12.01, 폴더삭제",O,6,최근로그 >> 폴더자동삭제(파일 개수 미달),,
+17,필리핀 홍수 관리 Package5B MP,수자원1부,이희철,2026.05.31,"2025.12.02, 폴더이름변경",O,14,,,
+18,필리핀 PGN 해상교량 BID2 IDC,구조부,이상희,2026.05.31,"2026.02.11, 파일다운로드",O,631,,,
19,가나 테치만 상수도 확장 DS,물환경사업2부,-,2029.04.25,X,X,0,책임자 및 담당자 설정X,,
20,기니 벼 재배단지 PMC,수자원1부,이대주,2028.12.20,"2025.12.08, 파일업로드",O,43,최근로그 >> 폴더자동삭제(파일 개수 미달),,
21,우간다 벼 재배단지 PMC,수자원1부,방노성,2028.12.20,"2025.12.08, 파일업로드",O,52,,,
@@ -26,7 +26,7 @@ No.,프로젝트 명,담당부서,담당자,종료(예정)일,최근 활동로
23,에티오피아 지하수 관개 환경설계 DD,물환경사업2부,변기상,2026.06.23,X,X,0,,,
24,에티오피아 도도타군 관개 PMC,수자원1부,방노성,2026.12.31,"2025.12.01, 폴더이름변경",O,144,탭 1개에 모든파일 업로드 // 최근로그 >> 폴더자동삭제(파일 개수 미달),,
25,에티오피아 Adeaa-Becho 지하수 관개 MP,수자원1부,방노성,2026.07.31,"2025.11.21, 파일업로드",O,146,최근로그 >> 폴더자동삭제(파일 개수 미달),,
-26,탄자니아 Iringa 상하수도 개선 CS,물환경사업1부,백운영,2029.06.08,"2026.02.03, 폴더 생성",X,0,,,
+26,탄자니아 Iringa 상하수도 개선 CS,물환경사업1부,백운영,2029.06.08,"2026.02.03, 폴더생성",X,0,,,
27,탄자니아 Dodoma 하수 설계감리 DD,물환경사업2부,변기상,2027.07.08,"2026.02.04, 폴더삭제",X,32,,,
28,탄자니아 잔지바르 쌀 생산 PMC,수자원1부,방노성,2027.12.20,"2025.12.08, 파일 업로드",O,23,,,
29,탄자니아 도도마 유수율 상수도개선 PMC,물환경사업1부,박순석,2026.12.31,"2026.02.12, 부관리자권한추가",X,35,,,
@@ -35,8 +35,8 @@ No.,프로젝트 명,담당부서,담당자,종료(예정)일,최근 활동로
32,볼리비아 에스꼬마 차라짜니 도로 CS,도로부,전홍찬,2029.12.15,"2026.02.06, 파일업로드",X,1,,,
33,볼리비아 마모레 교량도로 FS,도로부,황효섭,2025.10.17,"2026.02.06, 파일업로드",X,120,,종료(예정)일 지남,준공
34,볼리비아 Bombeo-Colomi 도로설계 DD,도로부,황효섭,2026.07.24,"2025.12.05, 파일삭제",O,48,"더미파일(폴더유지용) 12개, 실 관리부서는 해외사업부",,
-35,콜롬비아 AI 폐기물 FS,플랜트1부,서재희,2026.02.27,X,X,0,,,
-36,파라과이 도로 통행료 현대화 MP,교통계획부,오제훈,2025.10.24,X,X,0,,종료(예정)일 지남,준공
+35,콜롬비아 AI 폐기물 FS,플랜트1부,서재희,2026.02.27,X,X,0,,종료(예정)일 지남,
+36,파라과이 도로 통행료 현대화 MP,교통계획부,오제훈,2025.10.24,"2025.02.25, 폴더삭제",X,0,,종료(예정)일 지남,준공
37,페루 Barranca 상하수도 확장 DD,물환경사업2부,변기상,2026.03.08,"2025.11.14, 파일업로드",O,44,"더미파일(폴더유지용) 27개, 실 관리부서는 해외사업부",,
-38,엘살바도르 태평양 철도 FS,철도사업부,김태헌,2025.12.31,"2026.02.04, 파일이름변경",X,102,,종료(예정)일 지남,준공
-39,필리핀 사무소,해외사업부,한형남,,"2026.02.23, 파일업로드",과업개요 페이지 없음,813,,,
\ No newline at end of file
+38,엘살바도르 태평양 철도 FS,철도사업부,김태헌,2025.12.31,"2026.02.24, 폴더자동삭제",X,101,,종료(예정)일 지남,준공
+39,필리핀 사무소,해외사업부,한형남,,"2026.03.04, 파일다운로드",과업개요 페이지 없음,817,,,
\ No newline at end of file
diff --git a/style/common.css b/style/common.css
new file mode 100644
index 0000000..090f80c
--- /dev/null
+++ b/style/common.css
@@ -0,0 +1,281 @@
+:root {
+ /* Design Tokens */
+ --primary-color: #1E5149;
+ --primary-lv-0: #e9eeed;
+ --primary-lv-1: #D2DCDB;
+ --primary-lv-8: #193833;
+ --bg-default: #FFFFFF;
+ --bg-muted: #F9FAFB;
+ --text-main: #2D3748;
+ --text-sub: #718096;
+ --border-color: #E2E8F0;
+ --hover-bg: #F7FAFC;
+ --header-gradient: linear-gradient(90deg, #193833 0%, #1e5149 100%);
+ --ai-gradient: linear-gradient(180deg, #da8cf1 0%, #8bb1f2 100%);
+ --space-xs: 4px;
+ --space-sm: 8px;
+ --space-md: 16px;
+ --space-lg: 32px;
+ --space-xl: 64px;
+ --radius-sm: 4px;
+ --radius-lg: 8px;
+ --fz-h1: 20px;
+ --fz-h2: 16px;
+ --fz-body: 13px;
+ --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
+ --box-shadow-lg: 0 10px 20px rgba(0, 0, 0, 0.1);
+}
+
+/* Base Reset */
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+body {
+ font-family: 'Pretendard', sans-serif;
+ font-size: var(--fz-body);
+ color: var(--text-main);
+ background: var(--bg-default);
+ min-height: 100vh;
+}
+
+/* 메일 관리자 전용: 전체 스크롤 방지 */
+body:has(.mail-wrapper) {
+ height: 100vh;
+ overflow: hidden;
+}
+
+input, select, textarea, button {
+ font-family: 'Pretendard', sans-serif;
+}
+
+a {
+ text-decoration: none;
+ color: inherit;
+}
+
+button {
+ cursor: pointer;
+ border: none;
+ font-family: inherit;
+ transition: all 0.2s ease;
+}
+
+/* Layout Utilities */
+.flex-center {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.flex-between {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+}
+
+/* Components: Topbar */
+.topbar {
+ width: 100%;
+ background: var(--header-gradient);
+ color: #fff;
+ padding: 0 var(--space-lg);
+ position: fixed;
+ top: 0;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ z-index: 1000;
+}
+
+.topbar-header {
+ margin-right: 60px;
+ font-weight: 700;
+}
+
+.topbar-header h2 {
+ font-size: 16px;
+ color: white;
+}
+
+.nav-list {
+ display: flex;
+ list-style: none;
+ gap: var(--space-sm);
+}
+
+.nav-item {
+ padding: 4px 8px;
+ border-radius: 4px;
+ color: rgba(255, 255, 255, 0.8);
+ transition: 0.2s;
+ font-size: 14px;
+ cursor: pointer;
+}
+
+.nav-item:hover {
+ background: var(--primary-lv-1);
+ color: #fff;
+}
+
+.nav-item.active {
+ background: var(--primary-lv-0);
+ color: var(--primary-color) !important;
+ font-weight: 700;
+}
+
+/* Modals */
+.modal-overlay {
+ display: none;
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: rgba(0, 0, 0, 0.6);
+ z-index: 2000;
+ justify-content: center;
+ align-items: center;
+}
+
+.modal-content {
+ background: white;
+ padding: 24px;
+ border-radius: 12px;
+ width: 90%;
+ max-width: 500px;
+ box-shadow: var(--box-shadow-lg);
+}
+
+.modal-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 20px;
+ border-bottom: 1px solid var(--border-color);
+ padding-bottom: 12px;
+}
+
+.modal-header h3 {
+ margin: 0;
+ font-size: 16px;
+}
+
+.modal-close {
+ cursor: pointer;
+ font-size: 20px;
+}
+
+/* Modal Form Elements */
+.select-group {
+ margin-bottom: 16px;
+ text-align: left;
+}
+
+.select-group label {
+ display: block;
+ font-size: 12px;
+ font-weight: 700;
+ color: var(--text-sub);
+ margin-bottom: 6px;
+}
+
+.modal-select {
+ width: 100%;
+ padding: 10px;
+ border: 1px solid var(--border-color);
+ border-radius: 6px;
+ font-size: 14px;
+ background: #fff;
+ outline: none;
+}
+
+.modal-select:focus {
+ border-color: var(--primary-color);
+}
+
+/* Data Tables inside Modals */
+.data-table {
+ width: 100%;
+ border-collapse: collapse;
+ font-size: 12px;
+}
+
+.data-table th,
+.data-table td {
+ padding: 10px 8px;
+ border-bottom: 1px solid var(--border-color);
+ text-align: left;
+}
+
+.data-table th {
+ color: var(--text-sub);
+ font-weight: 600;
+ background: var(--bg-muted);
+}
+
+.data-table tr:hover {
+ background: var(--hover-bg);
+}
+
+/* Utils: Buttons */
+._button-xsmall {
+ padding: 2px 8px;
+ font-size: 11px;
+ border-radius: 4px;
+ background: var(--bg-muted);
+ border: 1px solid var(--border-color);
+}
+
+._button-small {
+ padding: 6px 14px;
+ font-size: 12px;
+ border-radius: 6px;
+ background: var(--primary-color);
+ color: #fff;
+ font-weight: 600;
+}
+
+._button-medium {
+ padding: 10px 20px;
+ background: var(--primary-color);
+ color: #fff;
+ border-radius: 6px;
+ font-weight: 700;
+}
+
+.btn-confirm {
+ width: 100%;
+ padding: 12px;
+ background: var(--primary-color);
+ color: white;
+ border: none;
+ border-radius: 8px;
+ font-weight: 700;
+ cursor: pointer;
+ margin-top: 10px;
+}
+
+/* Spinner */
+.spinner {
+ display: none;
+ width: 16px;
+ height: 16px;
+ border: 2px solid rgba(255, 255, 255, .3);
+ border-radius: 50%;
+ border-top-color: #fff;
+ animation: spin 1s ease-in-out infinite;
+}
+
+@keyframes spin {
+ to { transform: rotate(360deg); }
+}
+
+.badge {
+ background: #eee;
+ padding: 2px 6px;
+ border-radius: 4px;
+ font-size: 11px;
+}
diff --git a/style/dashboard.css b/style/dashboard.css
new file mode 100644
index 0000000..7c45dc1
--- /dev/null
+++ b/style/dashboard.css
@@ -0,0 +1,264 @@
+/* Portal (Index) */
+.portal-container {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ height: calc(100vh - 36px);
+ background: var(--bg-muted);
+ padding: var(--space-lg);
+ margin-top: 36px;
+}
+
+.portal-header {
+ text-align: center;
+ margin-bottom: 50px;
+}
+
+.portal-header h1 {
+ font-size: 28px;
+ color: var(--primary-color);
+ margin-bottom: 10px;
+}
+
+.portal-header p {
+ color: var(--text-sub);
+ font-size: 15px;
+}
+
+.button-grid {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ gap: 30px;
+ width: 100%;
+ max-width: 800px;
+}
+
+.portal-card {
+ background: #fff;
+ border: 1px solid var(--border-color);
+ border-radius: 12px;
+ padding: 40px;
+ text-align: center;
+ transition: 0.3s;
+ width: 100%;
+ box-shadow: var(--box-shadow);
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 20px;
+}
+
+.portal-card:hover {
+ transform: translateY(-5px);
+ border-color: var(--primary-color);
+ box-shadow: var(--box-shadow-lg);
+}
+
+.portal-card .icon {
+ font-size: 32px;
+ width: 64px;
+ height: 64px;
+ background: var(--bg-muted);
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ transition: 0.3s;
+}
+
+.portal-card:hover .icon {
+ background: var(--primary-color);
+ color: #fff;
+}
+
+.portal-card h2 {
+ font-size: 20px;
+ font-weight: 700;
+}
+
+.portal-card p {
+ color: var(--text-sub);
+ font-size: 14px;
+ line-height: 1.5;
+}
+
+@media screen and (max-width: 600px) {
+ .button-grid {
+ grid-template-columns: 1fr;
+ }
+}
+
+/* Dashboard List & Console */
+.log-console {
+ background: #000;
+ color: #0f0;
+ font-family: monospace;
+ padding: 15px;
+ margin-bottom: 20px;
+ border-radius: 4px;
+ max-height: 200px;
+ overflow-y: auto;
+ font-size: 12px;
+ line-height: 1.5;
+}
+
+.log-console-header {
+ color: #fff;
+ border-bottom: 1px solid #333;
+ margin-bottom: 10px;
+ padding-bottom: 5px;
+ font-weight: bold;
+}
+
+.accordion-container {
+ border-top: 1px solid var(--border-color);
+}
+
+.accordion-list-header,
+.accordion-header {
+ display: grid;
+ grid-template-columns: 2.5fr 1fr 1fr 0.8fr 2fr;
+ gap: var(--space-md);
+ padding: var(--space-md) var(--space-lg);
+ align-items: center;
+ cursor: pointer;
+}
+
+.accordion-list-header {
+ font-size: 11px;
+ font-weight: 700;
+ color: var(--text-sub);
+ border-bottom: 1px solid var(--text-main);
+ cursor: default;
+}
+
+.accordion-item {
+ border-bottom: 1px solid var(--border-color);
+}
+
+.accordion-item:hover {
+ background: var(--primary-lv-0);
+}
+
+.repo-title {
+ font-weight: 700;
+ color: var(--primary-color);
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.repo-files {
+ text-align: center;
+ font-weight: 600;
+}
+
+.repo-log {
+ font-size: 11px;
+ color: var(--text-sub);
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.accordion-body {
+ display: none;
+ padding: var(--space-lg);
+ background: var(--bg-muted);
+ border-top: 1px solid var(--border-color);
+}
+
+.accordion-item.active .accordion-body {
+ display: block;
+}
+
+.status-warning {
+ background: #fff9e6;
+}
+
+.status-error {
+ background: #fee9e7;
+}
+
+.warning-text {
+ color: #f21d0d !important;
+ font-weight: 700;
+}
+
+/* Accordion Multi-level (Continent/Country) */
+.continent-group,
+.country-group {
+ margin-bottom: 10px;
+}
+
+.continent-header,
+.country-header {
+ background: #fff;
+ padding: 12px 20px;
+ border: 1px solid var(--border-color);
+ border-radius: 8px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ cursor: pointer;
+ font-weight: 700;
+ transition: all 0.2s;
+}
+
+.continent-header {
+ background: var(--primary-color);
+ color: white;
+ border: none;
+ font-size: 15px;
+}
+
+.country-header {
+ font-size: 14px;
+ color: var(--text-main);
+ margin-top: 5px;
+}
+
+.continent-body,
+.country-body {
+ display: none;
+ padding: 10px 0 10px 20px;
+}
+
+.active>.continent-body,
+.active>.country-body {
+ display: block;
+}
+
+/* Detail Views */
+.detail-grid {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: 20px;
+}
+
+.detail-section h4 {
+ font-size: 13px;
+ margin-bottom: 10px;
+ color: var(--text-main);
+ border-left: 3px solid var(--primary-color);
+ padding-left: 8px;
+}
+
+.data-table {
+ width: 100%;
+ border-collapse: collapse;
+ font-size: 12px;
+}
+
+.data-table th,
+.data-table td {
+ padding: 8px;
+ border-bottom: 1px solid var(--border-color);
+ text-align: left;
+}
+
+.data-table th {
+ color: var(--text-sub);
+ font-weight: 600;
+}
diff --git a/style/mail.css b/style/mail.css
new file mode 100644
index 0000000..47d1fa2
--- /dev/null
+++ b/style/mail.css
@@ -0,0 +1,404 @@
+/* Mail Manager Layout */
+.mail-wrapper {
+ display: flex;
+ height: calc(100vh - 36px);
+ margin-top: 36px;
+ background: #fff;
+ overflow: hidden;
+}
+
+.mail-sidebar {
+ display: none; /* 사이드바 삭제 */
+}
+
+.mail-list-area {
+ width: 320px;
+ border-right: 1px solid var(--border-color);
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ background: #fff;
+}
+
+.mail-tabs {
+ display: flex;
+ border-bottom: 1px solid var(--border-color);
+ background: #f8f9fa;
+ flex-shrink: 0;
+ width: 100%;
+}
+
+.mail-tab {
+ flex: 1;
+ padding: 12px 0;
+ text-align: center;
+ cursor: pointer;
+ font-weight: 700;
+ color: #a0aec0;
+ font-size: 11px;
+ transition: all 0.2s ease;
+ border-bottom: 2px solid transparent;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 4px;
+}
+
+.mail-tab:hover {
+ background: #edf2f7;
+ color: var(--primary-color);
+}
+
+.mail-tab.active {
+ color: var(--primary-color);
+ border-bottom: 2px solid var(--primary-color);
+ background: #fff;
+}
+
+.search-bar {
+ padding: var(--space-md);
+ border-bottom: 1px solid var(--border-color);
+ background: #fff;
+ flex-shrink: 0;
+ margin-bottom: 8px; /* 하단 리스트와 간격 추가 */
+}
+
+.mail-items-container {
+ flex: 1;
+ overflow-y: auto;
+}
+
+.mail-item {
+ padding: var(--space-md);
+ border-bottom: 1px solid var(--border-color);
+ cursor: pointer;
+ transition: 0.2s;
+}
+
+.mail-item:hover {
+ background: var(--bg-muted);
+}
+
+.mail-item.active {
+ background: #E9EEED;
+ border-left: 4px solid var(--primary-color);
+}
+
+.address-book-footer {
+ padding: 12px;
+ border-top: 1px solid var(--border-color);
+ background: #fff;
+ flex-shrink: 0;
+}
+
+.mail-content-area {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ overflow-y: auto;
+ border-right: 1px solid var(--border-color);
+}
+
+/* Mail Preview & Toggle Handle */
+.mail-preview-area {
+ width: 0;
+ background: #f1f3f5;
+ display: flex;
+ flex-direction: column;
+ transition: all 0.3s ease;
+ overflow: visible;
+ position: relative;
+ border-left: 0px solid transparent;
+}
+
+.mail-preview-area.active {
+ width: 500px;
+ border-left: 1px solid var(--border-color);
+}
+
+/* 닫혔을 때 내부 내용이 비치는 것 방지 */
+.mail-preview-area > *:not(.preview-toggle-handle) {
+ opacity: 0;
+ transition: opacity 0.2s;
+ pointer-events: none;
+}
+
+.mail-preview-area.active > * {
+ opacity: 1;
+ pointer-events: auto;
+}
+
+.preview-toggle-handle {
+ position: absolute;
+ left: -20px;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 20px;
+ height: 60px;
+ background: var(--primary-color);
+ color: #fff;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ border-radius: 8px 0 0 8px;
+ font-size: 10px;
+ box-shadow: -2px 0 5px rgba(0,0,0,0.1);
+ z-index: 10;
+}
+
+.preview-toggle-handle:hover {
+ background: var(--primary-lv-8);
+}
+
+.preview-header {
+ padding: 12px 16px;
+ background: #fff;
+ border-bottom: 1px solid var(--border-color);
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+
+.preview-header h3 {
+ font-size: 14px;
+ font-weight: 700;
+ color: var(--primary-color);
+}
+
+.preview-content {
+ flex: 1;
+ padding: 20px;
+ overflow-y: auto;
+ display: flex;
+ justify-content: center;
+ align-items: flex-start;
+}
+
+.a4-container {
+ width: 100%;
+ background: #fff;
+ box-shadow: 0 0 20px rgba(0,0,0,0.1);
+ position: relative;
+ aspect-ratio: 1 / 1.414; /* A4 Ratio */
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.preview-placeholder {
+ color: var(--text-sub);
+ font-size: 13px;
+ text-align: center;
+ padding: 20px;
+}
+
+.preview-image {
+ max-width: 100%;
+ max-height: 100%;
+ object-fit: contain;
+}
+
+.mail-content-header {
+ padding: var(--space-lg);
+ border-bottom: 1px solid var(--border-color);
+}
+
+.mail-body {
+ padding: var(--space-lg);
+ line-height: 1.6;
+ min-height: 200px;
+}
+
+/* Attachments & AI Analysis */
+.attachment-area {
+ padding: var(--space-lg);
+ border-top: 1px solid var(--border-color);
+ background: var(--bg-muted);
+}
+
+.attachment-item {
+ display: flex;
+ align-items: center;
+ gap: var(--space-md);
+ background: #fff;
+ padding: var(--space-sm) var(--space-md);
+ border-radius: var(--radius-lg);
+ border: 1px solid var(--border-color);
+ margin-bottom: var(--space-sm);
+ cursor: pointer;
+ transition: 0.2s;
+}
+
+.attachment-item:hover {
+ border-color: var(--primary-color);
+ box-shadow: var(--box-shadow);
+}
+
+.attachment-item.active {
+ background: var(--primary-lv-0);
+ border-color: var(--primary-color);
+}
+
+.file-icon {
+ font-size: 20px;
+ flex-shrink: 0;
+}
+
+.file-details {
+ flex: 1;
+ overflow: hidden;
+}
+
+.file-name {
+ font-size: 12px;
+ font-weight: 700;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.file-size {
+ font-size: 10px;
+ color: var(--text-sub);
+}
+
+.btn-group {
+ display: flex;
+ gap: var(--space-xs);
+ flex: 1;
+ justify-content: flex-end;
+}
+
+.btn-upload {
+ padding: 6px 12px;
+ border-radius: 4px;
+ font-size: 11px;
+ font-weight: 700;
+ color: #fff;
+}
+
+.btn-ai {
+ background: var(--ai-gradient);
+}
+
+.btn-normal {
+ background: var(--primary-color);
+}
+
+.ai-recommend {
+ font-size: 11px;
+ padding: 2px 6px;
+ border-radius: 4px;
+ font-weight: 700;
+ margin-left: 10px;
+}
+
+.ai-recommend.smart-mode {
+ background: linear-gradient(135deg, #f6f8ff 0%, #f0f4ff 100%);
+ color: #4a69bd;
+ border: 1px solid #d1d9ff;
+}
+
+.ai-recommend.manual-mode {
+ background: var(--hover-bg);
+ color: var(--text-sub);
+ border: 1px dashed var(--border-color);
+ font-weight: 400;
+}
+
+.path-display {
+ cursor: pointer;
+ padding: 4px 10px;
+ border-radius: 6px;
+ transition: all 0.2s ease;
+}
+
+.file-log-area {
+ display: none;
+ width: 100%;
+ margin-top: 10px;
+ background: #1a202c;
+ border-radius: 4px;
+ padding: 12px;
+ font-family: monospace;
+ font-size: 11px;
+ color: #cbd5e0;
+}
+
+.file-log-area.active {
+ display: block;
+}
+
+.log-line {
+ margin-bottom: 2px;
+}
+
+.log-success {
+ color: #48bb78;
+ font-weight: 700;
+}
+
+.log-info {
+ color: #63b3ed;
+}
+
+/* Toggle Switch */
+.switch {
+ position: relative;
+ display: inline-block;
+ width: 34px;
+ height: 20px;
+}
+
+.switch input {
+ opacity: 0;
+ width: 0;
+ height: 0;
+}
+
+.slider {
+ position: absolute;
+ cursor: pointer;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background-color: #ccc;
+ transition: .4s;
+ border-radius: 20px;
+}
+
+.slider:before {
+ position: absolute;
+ content: "";
+ height: 14px;
+ width: 14px;
+ left: 3px;
+ bottom: 3px;
+ background-color: white;
+ transition: .4s;
+ border-radius: 50%;
+}
+
+input:checked+.slider {
+ background: var(--ai-gradient);
+}
+
+input:checked+.slider:before {
+ transform: translateX(14px);
+}
+
+.ai-toggle-wrap {
+ display: flex;
+ align-items: center;
+ gap: var(--space-sm);
+ font-size: 12px;
+ font-weight: 600;
+ color: var(--text-sub);
+}
+
+input:checked~.ai-label {
+ color: #6d3dc2;
+}
diff --git a/style/style.css b/style/style.css
index 1e08b79..21bee0b 100644
--- a/style/style.css
+++ b/style/style.css
@@ -1,123 +1,3 @@
-:root {
- /* Design Tokens */
- --primary-color: #1E5149; --primary-lv-0: #e9eeed; --primary-lv-1: #D2DCDB; --primary-lv-8: #193833;
- --bg-default: #FFFFFF; --bg-muted: #F9FAFB;
- --text-main: #2D3748; --text-sub: #718096; --border-color: #E2E8F0;
- --header-gradient: linear-gradient(90deg, #193833 0%, #1e5149 100%);
- --ai-gradient: linear-gradient(180deg, #da8cf1 0%, #8bb1f2 100%);
- --space-xs: 4px; --space-sm: 8px; --space-md: 16px; --space-lg: 32px; --space-xl: 64px;
- --radius-sm: 4px; --radius-lg: 8px;
- --fz-h1: 20px; --fz-h2: 16px; --fz-body: 13px;
-}
-
-/* Base Reset */
-* { margin: 0; padding: 0; box-sizing: border-box; }
-body { font-family: 'Pretendard', sans-serif; font-size: var(--fz-body); color: var(--text-main); background: var(--bg-default); min-height: 100vh; }
-a { text-decoration: none; color: inherit; }
-button { cursor: pointer; border: none; font-family: inherit; }
-
-/* Components: Topbar */
-.topbar { width: 100%; background: var(--header-gradient); color: #fff; padding: 0 var(--space-lg); position: fixed; top: 0; height: 36px; display: flex; align-items: center; z-index: 1000; }
-.topbar-header { margin-right: 60px; font-weight: 700; }
-.nav-list { display: flex; list-style: none; gap: var(--space-sm); }
-.nav-item { padding: 4px 8px; border-radius: 4px; color: rgba(255,255,255,0.8); transition: 0.2s; font-size: 14px; }
-.nav-item:hover { background: var(--primary-lv-1); color: #fff; }
-.nav-item.active { background: var(--primary-lv-0); color: var(--primary-color) !important; font-weight: 700; }
-
-/* Global Layout */
-.main-content { margin-top: 36px; padding: var(--space-lg) var(--space-xl); max-width: 1400px; margin-left: auto; margin-right: auto; }
-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: var(--space-lg); padding-bottom: var(--space-sm); border-bottom: 1px solid var(--border-color); }
-header h1 { font-size: var(--fz-h1); color: var(--primary-color); }
-
-/* Portal (Index) */
-.portal-container { display: flex; flex-direction: column; align-items: center; justify-content: center; height: calc(100vh - 36px); background: var(--bg-muted); padding: var(--space-lg); }
-.portal-card { background: #fff; border: 1px solid var(--border-color); border-radius: 12px; padding: 40px; text-align: center; transition: 0.3s; width: 100%; max-width: 380px; box-shadow: 0 4px 6px rgba(0,0,0,0.05); }
-.portal-card:hover { transform: translateY(-5px); border-color: var(--primary-color); box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
-.portal-card .icon { font-size: 32px; margin-bottom: 20px; width: 64px; height: 64px; background: var(--bg-muted); border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: 0.3s; margin-left: auto; margin-right: auto; }
-.portal-card:hover .icon { background: var(--primary-color); color: #fff; }
-
-/* Dashboard List & Console */
-.log-console { background:#000; color:#0f0; font-family:monospace; padding:15px; margin-bottom:20px; border-radius:4px; max-height:200px; overflow-y:auto; font-size:12px; }
-.accordion-container { border-top: 1px solid var(--border-color); }
-.accordion-list-header, .accordion-header { display: grid; grid-template-columns: 2.5fr 1fr 1fr 0.8fr 2fr; gap: var(--space-md); padding: var(--space-md) var(--space-lg); align-items: center; }
-.accordion-list-header { font-size: 11px; font-weight: 700; color: var(--text-sub); border-bottom: 1px solid var(--text-main); }
-.accordion-item { border-bottom: 1px solid var(--border-color); }
-.accordion-item:hover { background: var(--primary-lv-0); }
-.repo-title { font-weight: 700; color: var(--primary-color); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.repo-files { text-align: center; font-weight: 600; }
-.repo-log { font-size: 11px; color: var(--text-sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.accordion-body { display: none; padding: var(--space-lg); background: var(--bg-muted); border-top: 1px solid var(--border-color); }
-.accordion-item.active .accordion-body { display: block; }
-.status-warning { background: #fff9e6; } .status-error { background: #fee9e7; }
-.warning-text { color: #f21d0d !important; font-weight: 700; }
-
-/* Mail Manager Refined */
-.mail-wrapper { display: flex; height: calc(100vh - 36px); margin-top: 36px; background: #fff; overflow: hidden; }
-.mail-sidebar { width: 240px; border-right: 1px solid var(--border-color); padding: var(--space-md); background: var(--bg-muted); }
-.project-select { width: 100%; padding: var(--space-sm); border-radius: var(--radius-sm); border: 1px solid var(--border-color); margin-bottom: var(--space-lg); font-weight: 700; background: #fff; }
-.folder-item { padding: var(--space-sm) var(--space-md); border-radius: 4px; cursor: pointer; margin-bottom: 2px; font-weight: 500; display: flex; justify-content: space-between; }
-.folder-item:hover { background: var(--primary-lv-0); }
-.folder-item.active { background: var(--primary-color); color: #fff; }
-
-.mail-list-area { width: 380px; border-right: 1px solid var(--border-color); display: flex; flex-direction: column; }
-.search-bar { padding: var(--space-md); border-bottom: 1px solid var(--border-color); background: var(--bg-muted); }
-.search-bar input { width: 100%; padding: 8px; border-radius: 4px; border: 1px solid var(--border-color); margin-bottom: var(--space-sm); }
-.mail-item { padding: var(--space-md); border-bottom: 1px solid var(--border-color); cursor: pointer; transition: 0.2s; }
-.mail-item:hover { background: var(--bg-muted); }
-.mail-item.active { background: #E9EEED; border-left: 4px solid var(--primary-color); }
-
-.mail-content-area { flex: 1; display: flex; flex-direction: column; overflow-y: auto; }
-.mail-content-header { padding: var(--space-lg); border-bottom: 1px solid var(--border-color); }
-.mail-body { padding: var(--space-lg); line-height: 1.6; min-height: 200px; }
-
-.attachment-area { padding: var(--space-lg); border-top: 1px solid var(--border-color); background: var(--bg-muted); }
-.attachment-item { display: flex; align-items: center; justify-content: space-between; background: #fff; padding: var(--space-sm) var(--space-md); border-radius: var(--radius-lg); border: 1px solid var(--border-color); margin-bottom: var(--space-sm); }
-.file-info { display: flex; align-items: center; gap: var(--space-sm); flex: 1; }
-.ai-recommend { font-size: 11px; color: #6d3dc2; background: #f1ecf9; padding: 2px 6px; border-radius: 4px; font-weight: 700; margin-left: 10px; }
-
-.ai-log-console {
- margin-top: var(--space-md);
- background: #1a202c; /* dark gray */
- color: #a0aec0;
- padding: var(--space-md);
- border-radius: var(--radius-lg);
- font-family: 'Courier New', Courier, monospace;
- font-size: 11px;
- line-height: 1.5;
- max-height: 150px;
- overflow-y: auto;
-}
-.ai-log-console .log-entry { margin-bottom: 4px; border-left: 2px solid #4a5568; padding-left: 8px; }
-.ai-log-console .highlight { color: #63b3ed; font-weight: 700; }
-.ai-log-console .success { color: #48bb78; }
-
-.btn-group { display: flex; gap: var(--space-xs); }
-.btn-upload { padding: 6px 12px; border-radius: 4px; font-size: 11px; font-weight: 700; color: #fff; }
-.btn-ai { background: var(--ai-gradient); }
-.btn-normal { background: var(--primary-color); }
-.btn-upload:hover { opacity: 0.9; transform: translateY(-1px); }
-
-/* File-specific Log Accordion */
-.file-log-area { display: none; width: 100%; margin-top: 10px; background: #1a202c; border-radius: 4px; padding: 12px; font-family: monospace; font-size: 11px; color: #cbd5e0; }
-.file-log-area.active { display: block; }
-.log-line { margin-bottom: 2px; }
-.log-success { color: #48bb78; font-weight: 700; }
-.log-info { color: #63b3ed; }
-
-/* Toggle Switch */
-.switch { position: relative; display: inline-block; width: 34px; height: 20px; }
-.switch input { opacity: 0; width: 0; height: 0; }
-.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; transition: .4s; border-radius: 20px; }
-.slider:before { position: absolute; content: ""; height: 14px; width: 14px; left: 3px; bottom: 3px; background-color: white; transition: .4s; border-radius: 50%; }
-input:checked + .slider { background: var(--ai-gradient); }
-input:checked + .slider:before { transform: translateX(14px); }
-
-.ai-toggle-wrap { display: flex; align-items: center; gap: var(--space-sm); font-size: 12px; font-weight: 600; color: var(--text-sub); }
-input:checked ~ .ai-label { color: #6d3dc2; }
-
-/* Utils */
-.sync-btn { background: var(--primary-color); color: #fff; padding: 8px 16px; border-radius: var(--radius-lg); font-weight: 700; }
-.badge { background: #eee; padding: 2px 6px; border-radius: 4px; font-size: 11px; }
-.toggle-icon { transition: 0.2s; }
-.active > .continent-header .toggle-icon, .active > .country-header .toggle-icon { transform: rotate(180deg); }
-
+@import url('common.css');
+@import url('dashboard.css');
+@import url('mail.css');
diff --git a/templates/dashboard.html b/templates/dashboard.html
new file mode 100644
index 0000000..42dc757
--- /dev/null
+++ b/templates/dashboard.html
@@ -0,0 +1,61 @@
+
+
+
+
+
+
+
Project Master Overseas 관리자
+
+
+
+
+
+
+
+
+
+
+
+
+
프로젝트 현황
+
+
+
+
접속자: 이태훈[전체관리자]
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
new file mode 100644
index 0000000..b3972f6
--- /dev/null
+++ b/templates/index.html
@@ -0,0 +1,46 @@
+
+
+
+
+
+
+
Project Master Portal
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/templates/mailTest.html b/templates/mailTest.html
new file mode 100644
index 0000000..ed533cf
--- /dev/null
+++ b/templates/mailTest.html
@@ -0,0 +1,140 @@
+
+
+
+
+
+
+
Project Mail Manager
+
+
+
+
+
+
+ {% include 'modals/path_selector.html' %}
+
+
+
+
+
+
+
+
📥 수신
+
📤 발신
+
📝 임시
+
🗑️ 휴지통
+
+
+
+ 라오스 농림부
+ 오후 2:30
+
+
ITTC 교육센터 착공식 일정 협의
+
+ 안녕하세요. 착공식 관련하여 첨부 드리는 공문을...
+
+
+
+
+
+
+
+ 안녕하세요. 이태훈 선임연구원님.
+ 라오스 ITTC 관개 교육센터 착공식과 관련하여 정부 측 인사의 일정을 반영한 최종 공문을 송부합니다.
+
+
+
+
+
첨부파일 리스트
+
+ AI 판단
+
+
+
+
+
+
+
+
+
+
+
+ {% include 'modals/address_book.html' %}
+
+
+
+
+
+
\ No newline at end of file
diff --git a/templates/modals/address_book.html b/templates/modals/address_book.html
new file mode 100644
index 0000000..d196892
--- /dev/null
+++ b/templates/modals/address_book.html
@@ -0,0 +1,54 @@
+
+
diff --git a/templates/modals/path_selector.html b/templates/modals/path_selector.html
new file mode 100644
index 0000000..50fa9c4
--- /dev/null
+++ b/templates/modals/path_selector.html
@@ -0,0 +1,22 @@
+
+
