script.js - master - artyom.khandygo/Project1

script.js
154 строки6 KB
artyom.khandygo
create script.js
27 дек 2025, 09:37
27 дек 2025, 09:37a6f588c
document.addEventListener('DOMContentLoaded', function() {
    const form = document.getElementById('emailForm');
    const resultsSection = document.getElementById('results');
    const loading = document.getElementById('loading');
    const imapServer = document.getElementById('imapServer');
    const customServer = document.getElementById('customServer');

    // Обработка выбора кастомного сервера
    imapServer.addEventListener('change', function() {
        customServer.style.display = this.value === 'custom' ? 'block' : 'none';
    });

    // Отправка формы
    form.addEventListener('submit', async function(e) {
        e.preventDefault();
        
        const emailData = {
            email: document.getElementById('email').value,
            password: document.getElementById('password').value,
            imapServer: imapServer.value === 'custom' 
                ? customServer.value 
                : imapServer.value,
            port: parseInt(document.getElementById('port').value)
        };

        // Показываем индикатор загрузки
        loading.style.display = 'block';
        resultsSection.style.display = 'none';

        try {
            const response = await fetch('/analyze-emails', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                },
                body: JSON.stringify(emailData)
            });

            const data = await response.json();

            if (data.success) {
                displayResults(data);
            } else {
                alert('Ошибка: ' + data.error);
            }
        } catch (error) {
            alert('Ошибка подключения: ' + error.message);
        } finally {
            loading.style.display = 'none';
        }
    });
});

// Отображение результатов
function displayResults(data) {
    // Обновляем статистику
    document.getElementById('safeCount').textContent = data.safe;
    document.getElementById('dangerousCount').textContent = data.dangerous;
    document.getElementById('totalCount').textContent = data.total;

    // Отображаем опасные письма
    const dangerousTab = document.getElementById('dangerousTab');
    dangerousTab.innerHTML = '';
    
    data.dangerousEmails.forEach(email => {
        dangerousTab.appendChild(createEmailCard(email, true));
    });

    // Отображаем безопасные письма
    const safeTab = document.getElementById('safeTab');
    safeTab.innerHTML = '';
    
    data.safeEmails.forEach(email => {
        safeTab.appendChild(createEmailCard(email, false));
    });

    // Показываем результаты
    document.getElementById('results').style.display = 'block';
    
    // По умолчанию показываем опасные письма
    showTab('dangerous');
}

// Создание карточки письма
function createEmailCard(email, isDangerous) {
    const card = document.createElement('div');
    card.className = `email-card ${isDangerous ? 'dangerous' : 'safe'}`;

    const date = new Date(email.date).toLocaleString('ru-RU');
    
    let keywordsHtml = '';
    if (email.foundKeywords && email.foundKeywords.length > 0) {
        keywordsHtml = `
            <div class="email-keywords">
                <strong>Найдены ключевые слова:</strong><br>
                ${email.foundKeywords.map(keyword => 
                    `<span class="keyword-tag">${keyword}</span>`
                ).join(' ')}
            </div>
        `;
    }

    let linksHtml = '';
    if (email.links && email.links.length > 0) {
        linksHtml = `
            <div class="email-links">
                <strong>Ссылки в письме:</strong><br>
                ${email.links.slice(0, 3).map(link => 
                    `<div style="word-break: break-all; font-size: 0.9em; color: #666; margin: 5px 0;">${link}</div>`
                ).join('')}
            </div>
        `;
    }

    card.innerHTML = `
        <div class="email-header">
            <div class="email-subject">${email.subject || 'Без темы'}</div>
            <div class="email-date">${date}</div>
        </div>
        <div class="email-from"><strong>От:</strong> ${email.from}</div>
        <div class="email-body-preview">
            ${(email.body || '').substring(0, 200)}...
        </div>
        ${keywordsHtml}
        ${linksHtml}
        ${isDangerous ? 
            `<div class="email-danger">Опасность: ${email.dangerScore} баллов</div>` 
            : '<div style="color: #56ab2f; margin-top: 10px;">✓ Безопасное письмо</div>'
        }
    `;

    return card;
}

// Переключение вкладок
function showTab(tabName) {
    // Обновляем активные кнопки
    document.querySelectorAll('.tab-btn').forEach(btn => {
        btn.classList.remove('active');
    });
    
    if (tabName === 'dangerous') {
        document.querySelector('.tab-btn:nth-child(1)').classList.add('active');
    } else {
        document.querySelector('.tab-btn:nth-child(2)').classList.add('active');
    }

    // Показываем выбранную вкладку
    document.querySelectorAll('.tab-content').forEach(content => {
        content.style.display = 'none';
    });
    
    document.getElementById(`${tabName}Tab`).style.display = 'block';
}