Загрузка данных

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Дети сотрудника</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <style>
        body { background-color: #f8f9fa; }
        .container { max-width: 1000px; }

        /* Заголовки таблицы – новый цвет */
        .table thead th {
            background-color: #003274 !important;
            color: white !important;
            border-color: #003274 !important;
        }

        .child-table td { vertical-align: middle; }

        /* Кнопка "Экспортировать" – #003274 */
        #exportBtn {
            background-color: #003274;
            border-color: #003274;
            color: white;
        }
        #exportBtn:hover {
            background-color: #00255a;
            border-color: #00255a;
            color: white;
        }

        /* Кнопка "Назад" – #6CACE4 */
        #backBtn {
            background-color: #6CACE4;
            border-color: #6CACE4;
            color: white;
        }
        #backBtn:hover {
            background-color: #4a8fc9;
            border-color: #4a8fc9;
            color: white;
        }

        /* Дополнительно: радиокнопки и прочее – без изменений */
    </style>
</head>
<body>
    <div class="container mt-4">
        <h2>{{ worker[0] }} {{ worker[1] }} {{ worker[2] }}</h2>
        <p><strong>Таб. номер:</strong> {{ worker[3] }} | <strong>Должность:</strong> {{ worker[4] }}</p>

        <form method="get" action="/employee/{{ worker[3] }}/export" id="exportForm">
            <!-- Выбор формы -->
            <div class="mb-3">
                <label for="formSelect" class="form-label"><strong>Выберите форму для экспорта:</strong></label>
                <select class="form-select" id="formSelect" name="form" style="max-width: 350px;">
                    <option value="blank6">BLANK6.XLS (только работник)</option>
                    <option value="blank5">BLANK5_1.xlsx (работник + ребёнок)</option>
                    <option value="blank4_3">BLANK4_3.xlsx (работник, два блока)</option>
                </select>
            </div>

            <!-- Выбор падежа -->
            <div class="mb-3">
                <label class="form-label"><strong>Падеж ФИО работника:</strong></label>
                <div class="form-check">
                    <input class="form-check-input" type="radio" name="case" id="caseNomn" value="nomn" checked>
                    <label class="form-check-label" for="caseNomn">Именительный (Иванов)</label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" type="radio" name="case" id="caseGent" value="gent">
                    <label class="form-check-label" for="caseGent">Родительный (Иванова)</label>
                </div>
            </div>

            <!-- Список детей -->
            {% if children %}
            <h4>Выберите ребёнка (для BLANK5_1)</h4>
            <div class="table-responsive">
                <table class="table table-bordered child-table">
                    <thead>
                        <tr>
                            <th style="width: 50px;">Выбор</th>
                            <th>Фамилия</th>
                            <th>Имя</th>
                            <th>Отчество</th>
                            <th>Дата рождения</th>
                            <th>Степень родства</th>
                            <th>Пол</th>
                        </tr>
                    </thead>
                    <tbody>
                    {% for ch in children %}
                        <tr>
                            <td class="text-center">
                                <input type="radio" name="child_id" value="{{ ch[0] }}" required>
                            </td>
                            <td>{{ ch[1] }}</td>
                            <td>{{ ch[2] }}</td>
                            <td>{{ ch[3] }}</td>
                            <td>{{ ch[4] }}</td>
                            <td>{{ ch[5] }}</td>
                            <td>{{ ch[6] }}</td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
            {% else %}
            <div class="alert alert-warning">У этого сотрудника нет детей.</div>
            {% endif %}

            <div class="mt-3 d-flex gap-2">
                <button type="submit" class="btn" id="exportBtn">Экспортировать</button>
                <a href="/" class="btn" id="backBtn">← Назад</a>
            </div>
        </form>

        <script>
            // Управление обязательностью радиокнопок в зависимости от выбранной формы
            document.getElementById('formSelect').addEventListener('change', function() {
                var radios = document.querySelectorAll('input[name="child_id"]');
                var required = (this.value === 'blank5');
                radios.forEach(function(r) {
                    r.required = required;
                });
                if (!required) {
                    radios.forEach(function(r) { r.checked = false; });
                }
            });
            window.addEventListener('DOMContentLoaded', function() {
                var event = new Event('change');
                document.getElementById('formSelect').dispatchEvent(event);
            });
        </script>
    </div>
</body>
</html>