test-mcp/js/mail.js

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 = `
            <div class="attachment-item" onclick="showPreview(${index}, event)">
                <span class="file-icon">📄</span>
                <div class="file-details">
                    <div class="file-name" title="${file.name}">${file.name}</div>
                    <div class="file-size">${file.size}</div>
                </div>
                <div class="btn-group">
                    <span id="recommend-${index}" class="ai-recommend path-display ${modeClass}" onclick="openPathModal(${index}, event)">${pathText}</span>
                    ${isAiActive ? `<button class="btn-upload btn-ai" onclick="startAnalysis(${index}, event)">AI 분석</button>` : ''}
                    <button class="btn-upload btn-normal" onclick="confirmUpload(${index}, event)">파일 업로드</button>
                </div>
            </div>
            <div id="log-area-${index}" class="file-log-area">
                <div id="log-content-${index}"></div>
            </div>
        `;
        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 = `
            <iframe src="${fileUrl}#page=1" style="width:100%; height:100%; border:none;"></iframe>
        `;
    } else {
        previewContainer.innerHTML = `
            <div style="width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px; text-align:center;">
                <img src="/sample.png" class="preview-image" onerror="this.src='https://via.placeholder.com/400x560?text=File+Preview'">
                <div style="margin-top:20px; font-weight:700; color:var(--primary-color);">${file.name}</div>
                <div style="font-size:12px; color:var(--text-sub); margin-top:8px;">본 화면은 미리보기 예시입니다.</div>
            </div>
        `;
    }
}

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 => `<option value="${tab}">${tab}</option>`).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 => `<option value="${cat}">${cat}</option>`).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 => `<option value="${sub}">${sub}</option>`).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 = '<div class="log-line log-info">>>> 3중 레이어 AI 분석 엔진 가동...</div>';
    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}<br>└ 신뢰도: 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 = `<strong>[AI가 읽은 핵심 내용]</strong><br>${result.snippet || "텍스트 추출 불가"}`;
        logContent.appendChild(snippetArea);

        currentFiles[index].analysis = {
            suggested_path: result.suggested_path,
            isManual: false
        };
        renderFiles();

    } catch (e) {
        logContent.innerHTML += `<div class="log-line" style="color:red;">ERR: ${e.message}</div>`;
        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) => `
        <tr>
            <td><strong>${c.name}</strong></td>
            <td>${c.dept}</td>
            <td>${c.email}</td>
            <td>${c.phone}</td>
            <td style="text-align:right; white-space:nowrap;">
                <button class="_button-xsmall" style="background:#edf2f7; color:var(--text-main); margin-right:4px;" onclick="editContact(${idx})">수정</button>
                <button class="_button-xsmall" style="background:#fee2e2; color:#e53e3e;" onclick="deleteContact(${idx})">삭제</button>
            </td>
        </tr>
    `).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);