блоки 2 и 3 доработки интерфейса системы тестирования

flask_app/app/templates/index.html

@@ -1,45 +1,66 @@
 {% extends "base.html" %}
-{% block title %}Тестирование — главная{% endblock %}
+{% block title %}Главная — Тестирование персонала{% endblock %}
 
 {% block content %}
-  <section class="rounded-2xl bg-white shadow-sm border border-ink-300/60 p-6">
-    <h1 class="text-2xl font-semibold text-ink-900">Сервис тестирования персонала</h1>
-    <p class="mt-2 text-ink-500">
-      Этап 1 миграции: переход на единый стек (Flask + Jinja). Бизнес-функции
-      переносятся последовательно — авторизация, каталог тестов, редактор,
-      назначения, прохождение, импорт/AI.
-    </p>
+<h1 class="text-2xl font-semibold text-ink-900 mb-5">Тестирование персонала</h1>
 
-    <div class="mt-5 flex flex-wrap gap-2 text-sm">
-      <a href="{{ url_for('tests.tests_list_page') }}"
-         class="inline-flex items-center gap-2 px-3 py-1.5 rounded-lg bg-brand-600 hover:bg-brand-700 text-white transition">
-        <span class="material-symbols-outlined text-base">list_alt</span>
-        Каталог тестов
-      </a>
-      <a href="{{ url_for('main.health') }}"
-         class="inline-flex items-center gap-2 px-3 py-1.5 rounded-lg bg-brand-50 text-brand-700 hover:bg-brand-100 transition">
-        <span class="material-symbols-outlined text-base">monitoring</span>
-        Health-check
-      </a>
+<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
+
+  {# Статистика #}
+  <a href="{{ url_for('main.stats_page') }}"
+     class="rounded-2xl bg-white border border-ink-300/50 shadow-sm p-5 flex flex-col gap-3
+            hover:shadow-md hover:border-brand-300 transition-all group">
+    <div class="flex items-center gap-3">
+      <span class="material-symbols-outlined text-brand-500 text-2xl">bar_chart</span>
+      <h2 class="font-semibold text-ink-900">Статистика</h2>
     </div>
-  </section>
+    <p class="text-sm text-ink-500 flex-1">Прохождения по отделам, общая динамика и последняя активность.</p>
+    <span class="inline-flex items-center gap-1 text-xs font-medium text-brand-600 group-hover:underline">
+      Открыть <span class="material-symbols-outlined text-sm">arrow_forward</span>
+    </span>
+  </a>
 
-  <section class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3 mt-4">
-    {% for title, descr, icon in [
-        ('Авторизация', 'E1.1 — логин по HR/локальному пользователю.', 'login'),
-        ('Тесты', 'E1.2 — каталог, фильтры, карточки.', 'list_alt'),
-        ('Редактор', 'E1.3 — создание/правка теста, AI-помощник.', 'edit_note'),
-        ('Назначения', 'E1.4 — назначить сотрудникам, отслеживать.', 'assignment'),
-        ('Прохождение', 'E1.5 — UI прохождения теста сотрудником.', 'fact_check'),
-        ('Импорт/AI', 'E1.6 — генерация черновиков из документов.', 'auto_awesome'),
-      ] %}
-      <article class="rounded-xl bg-white border border-ink-300/60 p-4">
-        <div class="flex items-center gap-2">
-          <span class="material-symbols-outlined text-brand-600">{{ icon }}</span>
-          <h3 class="font-semibold">{{ title }}</h3>
-        </div>
-        <p class="mt-1 text-sm text-ink-500">{{ descr }}</p>
-      </article>
-    {% endfor %}
-  </section>
+  {# Тесты #}
+  <a href="{{ url_for('tests.tests_list_page') }}"
+     class="rounded-2xl bg-white border border-ink-300/50 shadow-sm p-5 flex flex-col gap-3
+            hover:shadow-md hover:border-brand-300 transition-all group">
+    <div class="flex items-center gap-3">
+      <span class="material-symbols-outlined text-brand-500 text-2xl">list_alt</span>
+      <h2 class="font-semibold text-ink-900">Тесты</h2>
+    </div>
+    <p class="text-sm text-ink-500 flex-1">Каталог тестов, создание, редактирование и прохождение.</p>
+    <span class="inline-flex items-center gap-1 text-xs font-medium text-brand-600 group-hover:underline">
+      Открыть <span class="material-symbols-outlined text-sm">arrow_forward</span>
+    </span>
+  </a>
+
+  {# Назначения #}
+  <a href="{{ url_for('main.assignments_page') }}"
+     class="rounded-2xl bg-white border border-ink-300/50 shadow-sm p-5 flex flex-col gap-3
+            hover:shadow-md hover:border-brand-300 transition-all group">
+    <div class="flex items-center gap-3">
+      <span class="material-symbols-outlined text-brand-500 text-2xl">assignment_ind</span>
+      <h2 class="font-semibold text-ink-900">Назначения</h2>
+    </div>
+    <p class="text-sm text-ink-500 flex-1">Выдача тестов сотрудникам и отделам.</p>
+    <span class="inline-flex items-center gap-1 text-xs font-medium text-brand-600 group-hover:underline">
+      Открыть <span class="material-symbols-outlined text-sm">arrow_forward</span>
+    </span>
+  </a>
+
+  {# Настройки ИИ #}
+  <a href="{{ url_for('settings.prompts_page') }}"
+     class="rounded-2xl bg-white border border-ink-300/50 shadow-sm p-5 flex flex-col gap-3
+            hover:shadow-md hover:border-brand-300 transition-all group">
+    <div class="flex items-center gap-3">
+      <span class="material-symbols-outlined text-brand-500 text-2xl">psychology</span>
+      <h2 class="font-semibold text-ink-900">Настройки ИИ</h2>
+    </div>
+    <p class="text-sm text-ink-500 flex-1">Редактор промптов — генерация вопросов, дистракторы, улучшение теста.</p>
+    <span class="inline-flex items-center gap-1 text-xs font-medium text-brand-600 group-hover:underline">
+      Открыть <span class="material-symbols-outlined text-sm">arrow_forward</span>
+    </span>
+  </a>
+
+</div>
 {% endblock %}