document.addEventListener('DOMContentLoaded', () => {
    // Initialize Lucide Icons
    lucide.createIcons();

    // 1. Visitor Chart (Line)
    const ctxVisitor = document.getElementById('visitorChart').getContext('2d');
    new Chart(ctxVisitor, {
        type: 'line',
        data: {
            labels: ['3/21', '3/22', '3/23', '3/24', '3/25', '3/26', '3/27'],
            datasets: [{
                label: '방문자 수',
                data: [850, 920, 1100, 1240, 1350, 1120, 1480],
                borderColor: '#2563eb',
                backgroundColor: 'rgba(37, 99, 235, 0.1)',
                fill: true,
                tension: 0.4,
                borderWidth: 3,
                pointRadius: 4,
                pointBackgroundColor: '#2563eb'
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            plugins: {
                legend: { display: false }
            },
            scales: {
                y: { beginAtZero: false, grid: { color: '#e2e8f0' } },
                x: { grid: { display: false } }
            }
        }
    });

    // 2. Inflow Chart (Doughnut)
    const ctxInflow = document.getElementById('inflowChart').getContext('2d');
    new Chart(ctxInflow, {
        type: 'doughnut',
        data: {
            labels: ['네이버 검색', 'SNS 광고', '직접 유입'],
            datasets: [{
                data: [45, 32, 23],
                backgroundColor: ['#2563eb', '#60a5fa', '#cbd5e1'],
                borderWidth: 0,
                hoverOffset: 4
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false,
            cutout: '70%',
            plugins: {
                legend: { position: 'bottom', labels: { boxWidth: 12, padding: 15 } }
            }
        }
    });

    // 3. Mini Calendar Render
    const miniCalendar = document.getElementById('miniCalendar');
    const daysInMonth = 31;
    const startDay = 0; // Sun=0, 2026-03-01 is Sunday
    
    // Add empty slots for days before the 1st
    for (let i = 0; i < startDay; i++) {
        const div = document.createElement('div');
        div.className = 'cal-day';
        miniCalendar.appendChild(div);
    }

    for (let d = 1; d <= daysInMonth; d++) {
        const div = document.createElement('div');
        div.className = 'cal-day';
        div.innerText = d;
        if (d === 15 || d === 27) div.classList.add('active'); // Highlight deposit dates
        miniCalendar.appendChild(div);
    }

    // 4. Set Generated Images
    document.getElementById('placeholder-a').style.backgroundImage = 'url("exposure_a.png")';
    document.getElementById('placeholder-b').style.backgroundImage = 'url("exposure_b.png")';

    // 5. Backend Integration (Load data)
    const companyId = 'WEHAGO_001';
    const textarea = document.querySelector('.styled-textarea');
    
    fetch(`http://localhost:5000/api/report/${companyId}`)
        .then(res => res.json())
        .then(data => {
            if (data.content) textarea.value = data.content;
        })
        .catch(err => console.log('Error loading data:', err));

    // 6. Interactions
    // Save functionality
    document.querySelector('.btn-outline').addEventListener('click', () => {
        const content = textarea.value;
        fetch('http://localhost:5000/api/report', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ companyId, content })
        })
        .then(res => res.json())
        .then(() => alert('저장되었습니다.'))
        .catch(err => alert('저장 실패: ' + err.message));
    });

    document.querySelector('.btn-primary').addEventListener('click', () => {
        window.print();
    });

    // PDF Export with html2pdf
    document.querySelector('.btn-pdf').addEventListener('click', () => {
        const element = document.querySelector('.main-content');
        const opt = {
            margin:       [10, 10],
            filename:     'Business_Report.pdf',
            image:        { type: 'jpeg', quality: 0.98 },
            html2canvas:  { scale: 2, useCORS: true },
            jsPDF:        { unit: 'mm', format: 'a3', orientation: 'portrait' }
        };
        
        // Temporarily hide actions for cleaner PDF
        document.querySelector('.sidebar').style.display = 'none';
        document.body.style.backgroundColor = 'white';
        
        html2pdf().set(opt).from(element).save().then(() => {
            document.querySelector('.sidebar').style.display = 'flex';
            document.body.style.backgroundColor = '';
        });
    });

    document.querySelector('.btn-excel').addEventListener('click', () => {
        alert('입금 내역이 엑셀 파일(XLSX)로 다운로드되었습니다.');
    });
});