feat: apply new Мои Товары design system across all templates
Replace Pico CSS with custom design: dark sidebar layout, Golos Text + JetBrains Mono fonts, orange accent (#FF5500), new component classes (cards, tables, buttons, tags, toggles, alerts, tabs, login split-panel). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,173 +1,201 @@
|
||||
{% extends "base.html" %}
|
||||
{% block title %}Пользователи — Администрирование — ЭВОСИНК{% endblock %}
|
||||
{% block title %}Пользователи — Администрирование — Мои Товары{% endblock %}
|
||||
{% block page_title %}Пользователи{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="d-flex justify-between align-center mb-3">
|
||||
<h1 style="font-size:1.3rem; margin:0;"><i class="bi bi-people me-2"></i>Пользователи</h1>
|
||||
<button onclick="document.getElementById('create-user-dialog').showModal()" class="sm">
|
||||
<i class="bi bi-person-plus me-1"></i>Создать пользователя
|
||||
</button>
|
||||
<div class="pg-title">Пользователи</div>
|
||||
<div class="pg-sub">Управление аккаунтами и подключениями пользователей</div>
|
||||
|
||||
<!-- Topbar action -->
|
||||
<div style="display:flex;justify-content:flex-end;margin-bottom:16px;">
|
||||
<button class="btn btn-primary btn-sm" onclick="document.getElementById('create-user-dialog').showModal()">
|
||||
<i class="bi bi-person-plus"></i> Создать пользователя
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Create user dialog -->
|
||||
<dialog id="create-user-dialog">
|
||||
<article>
|
||||
<header>
|
||||
<button aria-label="Закрыть" rel="prev" onclick="document.getElementById('create-user-dialog').close()"></button>
|
||||
<h3>Создать пользователя</h3>
|
||||
</header>
|
||||
{% if create_errors %}
|
||||
<div role="alert" class="alert alert-danger mb-3">
|
||||
{% for e in create_errors %}<p>{{ e }}</p>{% endfor %}
|
||||
<div class="dialog-hd">
|
||||
<div class="dialog-title">Создать пользователя</div>
|
||||
<button class="dialog-close" onclick="document.getElementById('create-user-dialog').close()">
|
||||
<i class="bi bi-x-lg"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="dialog-body">
|
||||
{% if create_errors %}
|
||||
<div class="alert alert-rd" style="margin-bottom:14px;">
|
||||
<span><i class="bi bi-x-circle"></i></span>
|
||||
<div>{% for e in create_errors %}<div>{{ e }}</div>{% endfor %}</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<form method="post" action="/admin/users/create" novalidate>
|
||||
<div style="display:grid;grid-template-columns:1fr 1fr;gap:12px;">
|
||||
<div class="form-row">
|
||||
<label class="form-lbl" for="cu_first_name">Имя</label>
|
||||
<input class="inp" type="text" id="cu_first_name" name="first_name"
|
||||
value="{{ create_form.first_name if create_form else '' }}" required>
|
||||
</div>
|
||||
{% endif %}
|
||||
<form method="post" action="/admin/users/create" novalidate>
|
||||
<div class="row gap-2 mb-2">
|
||||
<div class="col">
|
||||
<label for="cu_first_name">Имя
|
||||
<input type="text" id="cu_first_name" name="first_name" value="{{ create_form.first_name if create_form else '' }}" required>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label for="cu_last_name">Фамилия
|
||||
<input type="text" id="cu_last_name" name="last_name" value="{{ create_form.last_name if create_form else '' }}">
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<label for="cu_email">Email
|
||||
<input type="text" id="cu_email" name="email" value="{{ create_form.email if create_form else '' }}" required>
|
||||
</label>
|
||||
<label for="cu_phone">Телефон
|
||||
<input type="tel" id="cu_phone" name="phone" value="{{ create_form.phone if create_form else '' }}" placeholder="+7 (999) 999-99-99">
|
||||
</label>
|
||||
<label for="cu_password">Пароль
|
||||
<input type="password" id="cu_password" name="password" required>
|
||||
</label>
|
||||
{% if user.role == 'system' %}
|
||||
<label for="cu_role">Роль
|
||||
<select id="cu_role" name="role">
|
||||
<option value="user" {% if not create_form or create_form.role == 'user' %}selected{% endif %}>Пользователь</option>
|
||||
<option value="admin" {% if create_form and create_form.role == 'admin' %}selected{% endif %}>Администратор</option>
|
||||
</select>
|
||||
</label>
|
||||
{% endif %}
|
||||
<footer class="d-flex gap-2 justify-end">
|
||||
<button type="button" class="outline secondary" onclick="document.getElementById('create-user-dialog').close()">Отмена</button>
|
||||
<button type="submit">Создать</button>
|
||||
</footer>
|
||||
</form>
|
||||
</article>
|
||||
<div class="form-row">
|
||||
<label class="form-lbl" for="cu_last_name">Фамилия</label>
|
||||
<input class="inp" type="text" id="cu_last_name" name="last_name"
|
||||
value="{{ create_form.last_name if create_form else '' }}">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label class="form-lbl" for="cu_email">Email</label>
|
||||
<input class="inp" type="text" id="cu_email" name="email"
|
||||
value="{{ create_form.email if create_form else '' }}" required>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label class="form-lbl" for="cu_phone">Телефон</label>
|
||||
<input class="inp" type="tel" id="cu_phone" name="phone"
|
||||
value="{{ create_form.phone if create_form else '' }}" placeholder="+7 (999) 999-99-99">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label class="form-lbl" for="cu_password">Пароль</label>
|
||||
<input class="inp" type="password" id="cu_password" name="password" required>
|
||||
</div>
|
||||
{% if user.role == 'system' %}
|
||||
<div class="form-row">
|
||||
<label class="form-lbl" for="cu_role">Роль</label>
|
||||
<select class="inp" id="cu_role" name="role">
|
||||
<option value="user" {% if not create_form or create_form.role == 'user' %}selected{% endif %}>Пользователь</option>
|
||||
<option value="admin" {% if create_form and create_form.role == 'admin' %}selected{% endif %}>Администратор</option>
|
||||
</select>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div style="display:flex;gap:8px;justify-content:flex-end;margin-top:16px;">
|
||||
<button type="button" class="btn btn-outline" onclick="document.getElementById('create-user-dialog').close()">Отмена</button>
|
||||
<button type="submit" class="btn btn-primary">Создать</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</dialog>
|
||||
|
||||
{% if create_errors %}
|
||||
<script>document.addEventListener('DOMContentLoaded', () => document.getElementById('create-user-dialog').showModal());</script>
|
||||
{% endif %}
|
||||
|
||||
<article class="card mb-3">
|
||||
<div class="card-body">
|
||||
<form method="get" action="/admin/users" class="d-flex gap-2 flex-wrap align-center">
|
||||
<input type="text" name="search" value="{{ search }}" placeholder="Поиск по имени, email, телефону" style="flex:1; min-width:200px; margin:0;">
|
||||
<select name="status" style="width:auto; margin:0;">
|
||||
<option value="">Все статусы</option>
|
||||
<option value="pending" {% if status_filter == 'pending' %}selected{% endif %}>Ожидает</option>
|
||||
<option value="active" {% if status_filter == 'active' %}selected{% endif %}>Активен</option>
|
||||
<option value="suspended" {% if status_filter == 'suspended' %}selected{% endif %}>Заблокирован</option>
|
||||
</select>
|
||||
<select name="role" style="width:auto; margin:0;">
|
||||
<option value="">Все роли</option>
|
||||
<option value="user" {% if role_filter == 'user' %}selected{% endif %}>Пользователь</option>
|
||||
<option value="admin" {% if role_filter == 'admin' %}selected{% endif %}>Администратор</option>
|
||||
<option value="system" {% if role_filter == 'system' %}selected{% endif %}>Системный</option>
|
||||
</select>
|
||||
<button type="submit" class="sm">Найти</button>
|
||||
{% if search or status_filter or role_filter %}
|
||||
<a href="/admin/users" role="button" class="outline secondary sm">Сбросить</a>
|
||||
{% endif %}
|
||||
</form>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="card">
|
||||
<div class="table-scroll">
|
||||
<table class="align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Имя</th>
|
||||
<th>Email</th>
|
||||
<th>Телефон</th>
|
||||
<th>Роль</th>
|
||||
<th>Статус</th>
|
||||
<th>Эвотор</th>
|
||||
<th>Дата</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for u in users %}
|
||||
<tr>
|
||||
<td class="text-muted small">{{ u.id }}</td>
|
||||
<td>{{ u.first_name }} {{ u.last_name }}</td>
|
||||
<td title="{{ u.email }}">
|
||||
{{ u.email }}
|
||||
{% if not u.is_email_confirmed %}
|
||||
<span class="badge badge-warning ms-1" title="Email не подтверждён"><i class="bi bi-exclamation-circle"></i></span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>{{ u.phone or '—' }}</td>
|
||||
<td>
|
||||
{% if u.role == 'system' %}<span class="badge badge-danger">Системный</span>
|
||||
{% elif u.role == 'admin' %}<span class="badge badge-warning">Админ</span>
|
||||
{% else %}<span class="badge badge-secondary">Польз.</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>
|
||||
{% if u.status == 'active' %}<span class="badge badge-success">Активен</span>
|
||||
{% elif u.status == 'pending' %}<span class="badge badge-warning">Ожидает</span>
|
||||
{% else %}<span class="badge badge-danger">Заблок.</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>
|
||||
{% if u.evotor_user_id %}
|
||||
<i class="bi bi-check-circle text-success" title="{{ u.evotor_user_id }}"></i>
|
||||
{% else %}
|
||||
<span class="text-muted">—</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="text-muted small">{{ u.created_at | datefmt }}</td>
|
||||
<td>
|
||||
<a href="/admin/users/{{ u.id }}" role="button" class="outline sm">
|
||||
<i class="bi bi-eye"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr>
|
||||
<td colspan="9" class="text-center text-muted py-4">Пользователи не найдены</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{% if total_pages > 1 %}
|
||||
<footer>
|
||||
<div class="d-flex gap-2 justify-center align-center">
|
||||
{% if page > 1 %}
|
||||
<a href="?page={{ page - 1 }}&search={{ search }}&status={{ status_filter }}&role={{ role_filter }}" role="button" class="outline sm">«</a>
|
||||
{% endif %}
|
||||
<span class="text-muted small">Стр. {{ page }} из {{ total_pages }}</span>
|
||||
{% if page < total_pages %}
|
||||
<a href="?page={{ page + 1 }}&search={{ search }}&status={{ status_filter }}&role={{ role_filter }}" role="button" class="outline sm">»</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</footer>
|
||||
<!-- Search / filter bar -->
|
||||
<div class="card" style="margin-bottom:14px;padding:14px 20px;">
|
||||
<form method="get" action="/admin/users" style="display:flex;gap:8px;flex-wrap:wrap;align-items:center;">
|
||||
<input class="inp" type="text" name="search" value="{{ search }}"
|
||||
placeholder="Поиск по имени, email, телефону" style="flex:1;min-width:200px;">
|
||||
<select class="inp" name="status" style="width:auto;">
|
||||
<option value="">Все статусы</option>
|
||||
<option value="pending" {% if status_filter == 'pending' %}selected{% endif %}>Ожидает</option>
|
||||
<option value="active" {% if status_filter == 'active' %}selected{% endif %}>Активен</option>
|
||||
<option value="suspended" {% if status_filter == 'suspended' %}selected{% endif %}>Заблокирован</option>
|
||||
</select>
|
||||
<select class="inp" name="role" style="width:auto;">
|
||||
<option value="">Все роли</option>
|
||||
<option value="user" {% if role_filter == 'user' %}selected{% endif %}>Пользователь</option>
|
||||
<option value="admin" {% if role_filter == 'admin' %}selected{% endif %}>Администратор</option>
|
||||
<option value="system" {% if role_filter == 'system' %}selected{% endif %}>Системный</option>
|
||||
</select>
|
||||
<button type="submit" class="btn btn-primary btn-sm">Найти</button>
|
||||
{% if search or status_filter or role_filter %}
|
||||
<a href="/admin/users" class="btn btn-outline btn-sm">Сбросить</a>
|
||||
{% endif %}
|
||||
</article>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- Users table -->
|
||||
<div class="card" style="padding:0;">
|
||||
<div class="table-wrap">
|
||||
<table class="tbl">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Пользователь</th>
|
||||
<th>Телефон</th>
|
||||
<th>Роль</th>
|
||||
<th>Статус</th>
|
||||
<th>Эвотор</th>
|
||||
<th>Дата</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for u in users %}
|
||||
<tr>
|
||||
<td><span class="mono" style="font-size:11px;color:#9EA8BE;">{{ u.id }}</span></td>
|
||||
<td>
|
||||
<div style="display:flex;align-items:center;gap:10px;">
|
||||
<div class="avatar" style="width:30px;height:30px;font-size:10px;">
|
||||
{{ u.first_name[0] if u.first_name else '?' }}{{ u.last_name[0] if u.last_name else '' }}
|
||||
</div>
|
||||
<div>
|
||||
<div class="tbl-name">{{ u.first_name }} {{ u.last_name }}</div>
|
||||
<div class="tbl-sub">
|
||||
{{ u.email }}
|
||||
{% if not u.is_email_confirmed %}
|
||||
<span class="tag tag-yl" style="font-size:9.5px;padding:0 5px;margin-left:4px;"><i class="bi bi-exclamation-circle"></i></span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td style="font-size:12px;color:#9EA8BE;">{{ u.phone or '—' }}</td>
|
||||
<td>
|
||||
{% if u.role == 'system' %}
|
||||
<span class="tag tag-rd" style="font-size:10.5px;">Системный</span>
|
||||
{% elif u.role == 'admin' %}
|
||||
<span class="tag tag-or" style="font-size:10.5px;">Админ</span>
|
||||
{% else %}
|
||||
<span class="tag tag-dim" style="font-size:10.5px;">Польз.</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>
|
||||
{% if u.status == 'active' %}
|
||||
<span class="tag tag-gr"><span class="dot g"></span>Активен</span>
|
||||
{% elif u.status == 'pending' %}
|
||||
<span class="tag tag-yl"><span class="dot y pulse"></span>Ожидает</span>
|
||||
{% else %}
|
||||
<span class="tag tag-rd"><span class="dot r"></span>Заблок.</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>
|
||||
{% if u.evotor_user_id %}
|
||||
<span class="tag tag-gr" style="font-size:10.5px;"><i class="bi bi-check-circle"></i></span>
|
||||
{% else %}
|
||||
<span style="color:#9EA8BE;font-size:12px;">—</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td><span class="mono" style="font-size:11px;color:#9EA8BE;">{{ u.created_at | datefmt }}</span></td>
|
||||
<td>
|
||||
<a href="/admin/users/{{ u.id }}" class="btn btn-outline btn-xs">
|
||||
<i class="bi bi-eye"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr>
|
||||
<td colspan="8" class="text-center" style="padding:32px;color:#9EA8BE;">Пользователи не найдены</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
{% if total_pages > 1 %}
|
||||
<div class="pagination">
|
||||
{% if page > 1 %}
|
||||
<a href="?page={{ page - 1 }}&search={{ search }}&status={{ status_filter }}&role={{ role_filter }}" class="btn btn-outline btn-sm">« Назад</a>
|
||||
{% endif %}
|
||||
<span style="font-size:12px;color:#9EA8BE;">Стр. {{ page }} из {{ total_pages }}</span>
|
||||
{% if page < total_pages %}
|
||||
<a href="?page={{ page + 1 }}&search={{ search }}&status={{ status_filter }}&role={{ role_filter }}" class="btn btn-outline btn-sm">Вперёд »</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if user.role == 'system' %}
|
||||
<div class="mt-3 text-end">
|
||||
<a href="/admin/roles" role="button" class="outline secondary sm">
|
||||
<i class="bi bi-shield-lock me-1"></i>Управление ролями
|
||||
</a>
|
||||
<div style="margin-top:14px;text-align:right;">
|
||||
<a href="/admin/roles" class="btn btn-outline btn-sm">
|
||||
<i class="bi bi-shield-lock"></i> Управление ролями
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
Reference in New Issue
Block a user