134 lines
4.6 KiB
HTML
134 lines
4.6 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Список записавшихся родителей</title>
|
||
<link rel="stylesheet" href="style.css">
|
||
<style>
|
||
.info-container {
|
||
padding: 2rem;
|
||
}
|
||
.filters-info {
|
||
background: white;
|
||
padding: 1.5rem;
|
||
border-radius: 1rem;
|
||
margin-bottom: 2rem;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 1rem;
|
||
align-items: flex-end;
|
||
}
|
||
.filter-group {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.3rem;
|
||
min-width: 180px;
|
||
}
|
||
.filter-group label {
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
text-transform: uppercase;
|
||
color: #475569;
|
||
}
|
||
.filter-group input, .filter-group select {
|
||
padding: 0.5rem 0.8rem;
|
||
border-radius: 0.5rem;
|
||
border: 1px solid #cbd5e1;
|
||
}
|
||
.registrations-table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
background: white;
|
||
border-radius: 1rem;
|
||
overflow: auto;
|
||
display: block;
|
||
}
|
||
.registrations-table th, .registrations-table td {
|
||
border: 1px solid #e2e8f0;
|
||
padding: 0.75rem;
|
||
text-align: left;
|
||
}
|
||
.registrations-table th {
|
||
background: #f1f5f9;
|
||
font-weight: 600;
|
||
}
|
||
.export-btn {
|
||
background: #2d6a4f;
|
||
margin-left: auto;
|
||
}
|
||
.header-actions {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-bottom: 1rem;
|
||
}
|
||
.reset-btn {
|
||
background: #f1f5f9;
|
||
color: #1e293b;
|
||
border: 1px solid #cbd5e1;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<header>
|
||
<h1>Список записавшихся родителей</h1>
|
||
<div id="userInfo"></div>
|
||
<button id="logoutBtn">Выйти</button>
|
||
</header>
|
||
<main class="info-container">
|
||
<div class="filters-info">
|
||
<div class="filter-group">
|
||
<label>ФИО родителя</label>
|
||
<input type="text" id="filterParentName" placeholder="Введите имя">
|
||
</div>
|
||
<div class="filter-group">
|
||
<label>Класс</label>
|
||
<select id="filterClass">
|
||
<option value="">Все классы</option>
|
||
</select>
|
||
</div>
|
||
<div class="filter-group">
|
||
<label>Предмет</label>
|
||
<select id="filterSubject">
|
||
<option value="">Все предметы</option>
|
||
</select>
|
||
</div>
|
||
<div class="filter-group">
|
||
<label>Учитель</label>
|
||
<select id="filterTeacher">
|
||
<option value="">Все учителя</option>
|
||
</select>
|
||
</div>
|
||
<button id="applyFiltersBtn" class="primary">Применить</button>
|
||
<button id="resetFiltersBtn" class="reset-btn">Сбросить</button>
|
||
<button id="exportBtn" class="export-btn">📎 Выгрузить в Excel (CSV)</button>
|
||
</div>
|
||
<div class="header-actions">
|
||
<h2>Все записи</h2>
|
||
<span id="recordsCount"></span>
|
||
</div>
|
||
<div style="overflow-x: auto;">
|
||
<table class="registrations-table" id="registrationsTable">
|
||
<thead>
|
||
<tr>
|
||
<th>ФИО родителя</th>
|
||
<th>Телефон</th>
|
||
<th>Класс</th>
|
||
<th>Предмет</th>
|
||
<th>Учитель</th>
|
||
<th>Тема урока</th>
|
||
<th>Дата урока</th>
|
||
<th>Время</th>
|
||
<th>Дата регистрации</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="tableBody">
|
||
<tr><td colspan="9">Загрузка...</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</main>
|
||
<script src="info.js"></script>
|
||
</body>
|
||
</html> |