109 lines
4.5 KiB
HTML
109 lines
4.5 KiB
HTML
<!---
|
|
index.html — CRUD-интерфейс для таблицы в PostgreSQL (Flask + Jinja2).
|
|
|
|
Логика:
|
|
1. Если POST-запрос с action — выполняем create/update/delete
|
|
и редиректим на GET (POST-redirect-GET паттерн)
|
|
2. Если GET-запрос с ?edit=ID — загружаем запись для редактирования
|
|
3. Всегда показываем список всех записей + форму добавления/редактирования
|
|
|
|
Безопасность:
|
|
- Параметризованные запросы (%s) в app.py → защита от SQL-инъекций
|
|
- redirect после POST → защита от повторной отправки формы
|
|
- Jinja2 автоэкранирование → XSS-защита
|
|
|
|
Переменные (из app.py):
|
|
- table_name — имя таблицы
|
|
- rows — список записей [(id, value), ...]
|
|
- edit_row — запись для редактирования {} или None
|
|
- version — версия приложения
|
|
--->
|
|
<!DOCTYPE html>
|
|
<html lang="ru">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>CRUD Flask Example — {{ table_name }}</title>
|
|
<link rel="icon" type="image/svg+xml" href="{{ url_for('static', filename='favicon.svg') }}" />
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}" />
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
|
|
<div class="header">
|
|
<img src="{{ url_for('static', filename='logo.svg') }}" alt="Nubes" />
|
|
<h1>CRUD Flask Example</h1>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-header">Записи</div>
|
|
<div class="card-body" style="padding: 0;">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>VALUE</th>
|
|
<th style="text-align:center;"></th>
|
|
<th style="text-align:center;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for row in rows %}
|
|
<tr>
|
|
<td>{{ row.id }}</td>
|
|
<td>{{ row.value }}</td>
|
|
<td style="text-align:center;">
|
|
<a href="?edit={{ row.id }}" class="btn btn-sm">✏️</a>
|
|
</td>
|
|
<td style="text-align:center;">
|
|
<form method="post" style="display:inline">
|
|
<input type="hidden" name="action" value="delete" />
|
|
<input type="hidden" name="id" value="{{ row.id }}" />
|
|
<button type="submit" class="btn btn-sm" onclick="return confirm('Удалить {{ row.id }}?')">🗑️</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
{% if not rows %}
|
|
<div class="empty-cell">Нет записей. Создайте первую.</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
{% if edit_row %}
|
|
<div class="card-header">Редактировать #{{ edit_row.id }}</div>
|
|
<div class="card-body">
|
|
<form method="post" class="form-grid">
|
|
<input type="hidden" name="action" value="update" />
|
|
<input type="hidden" name="id" value="{{ edit_row.id }}" />
|
|
<div class="form-row">
|
|
<input type="text" name="value" value="{{ edit_row.value }}" required placeholder="Значение" />
|
|
<button type="submit" class="btn btn-primary">Сохранить</button>
|
|
<a href="/" class="btn">Отмена</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
{% else %}
|
|
<div class="card-header">Добавить</div>
|
|
<div class="card-body">
|
|
<form method="post" class="form-grid">
|
|
<input type="hidden" name="action" value="create" />
|
|
<div class="form-row">
|
|
<input type="text" name="value" placeholder="Значение" required />
|
|
<button type="submit" class="btn btn-primary">Добавить</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="footer">
|
|
v{{ version }} — {{ table_name }}
|
|
</div>
|
|
</body>
|
|
</html>
|