Files
magistr/frontend/admin/js/views/auditorium-workload.js

160 lines
6.3 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import { initMultiSelect } from '../utils.js';
export function initAuditoriumWorkload() {
// Дата по умолчанию — текущий день.
const dateInput = document.getElementById('workload-date');
if (dateInput) {
const today = new Date();
const yyyy = today.getFullYear();
const mm = String(today.getMonth() + 1).padStart(2, '0');
const dd = String(today.getDate()).padStart(2, '0');
dateInput.value = `${yyyy}-${mm}-${dd}`;
}
// Инициализация мультиселектов.
initMultiSelect('building-box', 'building-menu', 'building-text', 'building-checkboxes');
initMultiSelect('capacity-box', 'capacity-menu', 'capacity-text', 'capacity-checkboxes');
initMultiSelect('equipment-box', 'equipment-menu', 'equipment-text', 'equipment-checkboxes');
// Заполнение фильтров начальными данными.
populateFilters();
// Отрисовка mock-данных в нужной ориентации сетки.
renderMockGrid();
}
function populateFilters() {
// Корпуса.
const buildingsContainer = document.getElementById('building-checkboxes');
const buildings = [
{ id: 1, name: "Корпус 1 (Главный)" },
{ id: 2, name: "Корпус 2 (Физ-мат)" },
{ id: 3, name: "Корпус 3 (Гуманитарный)" }
];
buildingsContainer.innerHTML = buildings.map(item => `
<label class="checkbox-item">
<input type="checkbox" value="${item.id}">
<span class="checkmark"></span>
<span class="checkbox-label">${item.name}</span>
</label>
`).join('');
// Вместимость.
const capacityContainer = document.getElementById('capacity-checkboxes');
const capacities = [
{ id: 'small', name: "До 30 мест" },
{ id: 'medium', name: "30 - 60 мест" },
{ id: 'large', name: "60 - 100 мест" },
{ id: 'xlarge', name: "Более 100 мест" }
];
capacityContainer.innerHTML = capacities.map(item => `
<label class="checkbox-item">
<input type="checkbox" value="${item.id}">
<span class="checkmark"></span>
<span class="checkbox-label">${item.name}</span>
</label>
`).join('');
// Оборудование.
const equipmentContainer = document.getElementById('equipment-checkboxes');
const equipmentList = [
{ id: 1, name: "Проектор" },
{ id: 2, name: "Компьютерные места" },
{ id: 3, name: "Интерактивная доска" },
{ id: 4, name: "Микрофон" }
];
equipmentContainer.innerHTML = equipmentList.map(item => `
<label class="checkbox-item">
<input type="checkbox" value="${item.id}">
<span class="checkmark"></span>
<span class="checkbox-label">${item.name}</span>
</label>
`).join('');
}
function renderMockGrid() {
// В будущем данные будут загружаться из API.
const timeslots = [
"8:00-9:30",
"9:40-11:10",
"11:40-13:10",
"13:20-14:50",
"15:00-16:30",
"16:50-18:20",
"18:30-19:50",
"20:00-21:20"
];
const auditoriums = [
"201", "202", "204", "205", "206", "207", "208"
];
// Mock-расписание по аудитории и времени.
// Ключ: "roomId_timeSlotId", значение: объект занятия
const mockSchedule = {
"201_8:00-9:30": { subject: "Физика", group: "ИБ-41м", teacher: "Атлетов А.Р." },
"201_9:40-11:10": { subject: "Физика", group: "ИВТ-21-1", teacher: "Атлетов А.Р." },
"201_11:40-13:10": { subject: "Физика", group: "ИБ-41м", teacher: "Физик В.Г." },
"201_13:20-14:50": { subject: "Физика", group: "ИБ-41м", teacher: "Физик В.Г." },
"202_9:40-11:10": { subject: "Химия", group: "ИВТ-21-1", teacher: "Химоза Я.В." },
"202_13:20-14:50": { subject: "Математика", group: "ИВТ-21-1", teacher: "Рутина Л.П." },
"202_15:00-16:30": { subject: "Химия", group: "ИВТ-21-1", teacher: "Химоза Я.В." },
"202_16:50-18:20": { subject: "Физика", group: "ИВТ-21-1", teacher: "Атлетов А.Р." },
"205_9:40-11:10": { subject: "Организация аудита ИБ", group: "ИБ-41м", teacher: "Таныгин М.О." },
};
// В столбцах отображаются временные слоты, в строках — аудитории.
const headerRow = document.getElementById('workload-header-row');
headerRow.innerHTML = `
<th class="top-left-cell">
<span class="top-label">Время</span>
<span class="bottom-label">Аудитория</span>
</th>
`;
timeslots.forEach(time => {
const th = document.createElement('th');
th.textContent = time;
headerRow.appendChild(th);
});
// Строки таблицы.
const tbody = document.getElementById('workload-tbody');
tbody.innerHTML = '';
auditoriums.forEach((room) => {
const tr = document.createElement('tr');
// Ячейка аудитории.
const tdRoom = document.createElement('td');
tdRoom.className = 'axis-cell';
tdRoom.textContent = room;
tr.appendChild(tdRoom);
// Ячейки временных слотов для аудитории.
timeslots.forEach(time => {
const td = document.createElement('td');
const scheduleKey = `${room}_${time}`;
const lesson = mockSchedule[scheduleKey];
if (lesson) {
// Карточка занятия.
td.innerHTML = `
<div class="lesson-card">
<div class="lesson-subject">${lesson.subject}</div>
<div class="lesson-group">${lesson.group}</div>
<div class="lesson-teacher">${lesson.teacher}</div>
</div>
`;
}
tr.appendChild(td);
});
tbody.appendChild(tr);
});
}