public/lab10/task2/script.js - main - Cooolprogrammers/web-nodejs-labs

public/lab10/task2/script.js
152 строки5 KB
darkvoid6@mail.ru
ЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫ
18 дек 2025, 07:59
18 дек 2025, 07:59f2c4f06
const API_BASE = '/api/lab10';

// Массив для отображения дней недели (индекс 1 = Понедельник)
const DAYS_MAP = [
    '',
    'Понедельник',
    'Вторник',
    'Среда',
    'Четверг',
    'Пятница',
    'Суббота',
    'Воскресенье'
];

/**
 * Инициализация страницы
 */
document.addEventListener('DOMContentLoaded', async () => {
    // 1. Загружаем списки для фильтров
    await loadDictionaries();

    // 2. Вешаем события на кнопки
    document.getElementById('searchBtn').addEventListener('click', loadSchedule);
    document.getElementById('resetBtn').addEventListener('click', resetFilters);

    // 3. Загружаем расписание сразу (все или пустое - по желанию)
    loadSchedule();
});

/**
 * Загрузка справочников (Группы и Преподаватели)
 */
async function loadDictionaries() {
    try {
        const response = await fetch(`${API_BASE}/schedule/dictionaries`);
        if (!response.ok) throw new Error('Ошибка загрузки справочников');

        const { groups, teachers } = await response.json();

        // Заполняем select групп
        const groupSelect = document.getElementById('groupFilter');
        groups.forEach(group => {
            const option = document.createElement('option');
            option.value = group.id;
            option.textContent = group.name;
            groupSelect.appendChild(option);
        });

        // Заполняем select преподавателей
        const teacherSelect = document.getElementById('teacherFilter');
        teachers.forEach(teacher => {
            const option = document.createElement('option');
            option.value = teacher.id;
            option.textContent = teacher.name;
            teacherSelect.appendChild(option);
        });

    } catch (err) {
        console.error(err);
        alert('Не удалось загрузить списки фильтров');
    }
}

/**
 * Загрузка расписания по фильтрам
 */
async function loadSchedule() {
    const groupId = document.getElementById('groupFilter').value;
    const teacherId = document.getElementById('teacherFilter').value;
    const day = document.getElementById('dayFilter').value;

    const loader = document.getElementById('loader');
    const tbody = document.getElementById('scheduleBody');
    const noResults = document.getElementById('noResults');
    const tableWrapper = document.querySelector('.table-wrapper');

    // UI: Показываем лоадер, скрываем таблицу
    loader.classList.remove('hidden');
    tbody.innerHTML = '';
    noResults.classList.add('hidden');
    tableWrapper.classList.add('hidden');

    try {
        // Формируем параметры запроса
        const params = new URLSearchParams();
        if (groupId) params.append('group_id', groupId);
        if (teacherId) params.append('teacher_id', teacherId);
        if (day) params.append('day', day);

        // Запрос к API
        const response = await fetch(`${API_BASE}/schedule?${params.toString()}`);
        if (!response.ok) throw new Error('Ошибка сети');

        const schedule = await response.json();

        loader.classList.add('hidden');

        if (schedule.length === 0) {
            noResults.classList.remove('hidden');
        } else {
            renderSchedule(schedule);
            tableWrapper.classList.remove('hidden');
        }

    } catch (err) {
        console.error(err);
        loader.textContent = 'Ошибка загрузки данных.';
    }
}

/**
 * Отрисовка таблицы
 */
function renderSchedule(data) {
    const tbody = document.getElementById('scheduleBody');

    data.forEach(item => {
        const tr = document.createElement('tr');

        // Определяем CSS класс для типа занятия
        let badgeClass = 'type-practice'; // дефолт
        const typeLower = item.lesson_type.toLowerCase();
        if (typeLower.includes('лек')) badgeClass = 'type-lecture';
        else if (typeLower.includes('лаб')) badgeClass = 'type-lab';

        tr.innerHTML = `
            <td><b>${DAYS_MAP[item.day_of_week] || '-'}</b></td>
            <td>${item.start_time} - ${item.end_time}</td>
            <td>${item.group_name}</td>
            <td>
                <div style="font-weight:600">${item.subject_name}</div>
            </td>
            <td>
                <span class="badge ${badgeClass}">${item.lesson_type}</span>
            </td>
            <td>${item.teacher_name}</td>
            <td>${item.building_name || ''}, ${item.classroom_number}</td>
        `;

        tbody.appendChild(tr);
    });
}

/**
 * Сброс фильтров
 */
function resetFilters() {
    document.getElementById('groupFilter').value = "";
    document.getElementById('teacherFilter').value = "";
    document.getElementById('dayFilter').value = "";
    loadSchedule();
}