public/lab8/task3/script.js - main - MashkoA/web-nodejs

public/lab8/task3/script.js
115 строк4 KB
vSUS1w8OErscaPzljeOMKk86GKFCBmeQUlgjKJCmRenysib5Ll
8 lab
17 апр 2026, 08:17
17 апр 2026, 08:173aa355e
'use strict';

const processBtn = document.getElementById('processBtn');
const loadMatchesBtn = document.getElementById('loadMatchesBtn');
const matchesTableBody = document.getElementById('matchesTableBody');

// Обработка матчей
processBtn.addEventListener('click', async () => {
    try {
        processBtn.disabled = true;
        processBtn.textContent = 'Обработка...';
        
        const response = await fetch('/api/lab8/task3/process');
        const result = await response.json();
        
        if (!response.ok) {
            throw new Error(result.error);
        }
        
        showSuccess(`Матчи успешно обработаны. Обработано матчей: ${result.data.matchesCount}`);
        
    } catch (error) {
        showError(`Ошибка обработки матчей: ${error.message}`);
    } finally {
        processBtn.disabled = false;
        processBtn.textContent = 'Обработать матчи';
    }
});

// Загрузка и отображение матчей
loadMatchesBtn.addEventListener('click', async () => {
    try {
        const response = await fetch('/api/lab8/task3/matches');
        const matches = await response.json();
        
        if (!response.ok) {
            throw new Error(matches.error);
        }
        
        displayMatchesTable(matches);
        showSuccess(`Загружено матчей: ${matches.length}`);
        
    } catch (error) {
        showError(`Ошибка загрузки матчей: ${error.message}`);
        matchesTableBody.innerHTML = '<tr><td colspan="7" class="error">Ошибка загрузки данных</td></tr>';
    }
});

// Отображение таблицы матчей
function displayMatchesTable(matches) {
    if (!matches || matches.length === 0) {
        matchesTableBody.innerHTML = '<tr><td colspan="7" class="no-data">Нет данных о матчах</td></tr>';
        return;
    }

    const rows = matches.map(match => `
        <tr class="match-row ${match.result}">
            <td>${escapeHtml(match.group)}</td>
            <td>${escapeHtml(match.date)}</td>
            <td>${escapeHtml(match.time)}</td>
            <td>${escapeHtml(match.team1)}</td>
            <td><strong>${escapeHtml(match.score)}</strong></td>
            <td>${escapeHtml(match.team2)}</td>
            <td>${escapeHtml(match.stadium)}</td>
        </tr>
    `).join('');

    matchesTableBody.innerHTML = rows;
}

// Вспомогательные функции
function showError(message) {
    let errorDiv = document.getElementById('errorMessage');
    if (!errorDiv) {
        errorDiv = document.createElement('div');
        errorDiv.id = 'errorMessage';
        errorDiv.className = 'error';
        document.querySelector('.control-panel').after(errorDiv);
    }
    errorDiv.textContent = message;
    
    setTimeout(() => {
        if (errorDiv && errorDiv.parentNode) {
            errorDiv.remove();
        }
    }, 5000);
}

function showSuccess(message) {
    let successDiv = document.getElementById('successMessage');
    if (!successDiv) {
        successDiv = document.createElement('div');
        successDiv.id = 'successMessage';
        successDiv.className = 'success';
        document.querySelector('.control-panel').after(successDiv);
    }
    successDiv.textContent = message;
    
    setTimeout(() => {
        if (successDiv && successDiv.parentNode) {
            successDiv.remove();
        }
    }, 3000);
}

function escapeHtml(unsafe) {
    if (unsafe === null || unsafe === undefined) return '';
    return unsafe
        .toString()
        .replace(/&/g, "&amp;")
        .replace(/</g, "&lt;")
        .replace(/>/g, "&gt;")
        .replace(/"/g, "&quot;")
        .replace(/'/g, "&#039;");
}