dynamic table

This commit is contained in:
root
2026-01-10 19:43:04 +03:00
parent 5f5a28e292
commit d27f66953c
9 changed files with 387 additions and 251 deletions
-92
View File
@@ -1,92 +0,0 @@
{# app/Modules/Clients/Views/_table.twig #}
{# Определяем тип запроса: AJAX = только tbody + footer #}
{% set isAjax = app.request.headers.get('X-Requested-With') == 'XMLHttpRequest' %}
{# Настройки пагинации - ИСПОЛЬЗУЕМ pagerDetails напрямую #}
{% if pagerDetails is defined %}
{% set pagination = pagerDetails %}
{% else %}
{# Fallback если pagerDetails нет #}
{% set pagination = {
currentPage: 1,
totalPages: 1,
total: clients|length|default(0),
perPage: perPage|default(10),
from: 1,
to: clients|length|default(0)
} %}
{% endif %}
{# Проверка на пустое состояние #}
{% set isEmpty = clients is empty or clients|length == 0 %}
{# AJAX запрос - tbody + footer #}
<tbody>
{% if isEmpty %}
<tr>
<td colspan="4" class="text-center py-5">
<i class="fa-solid fa-users text-muted mb-3" style="font-size: 3rem;"></i>
<p class="text-muted mb-3">
{% if filters.name or filters.email or filters.phone %}
Клиенты не найдены
{% else %}
Клиентов пока нет
{% endif %}
</p>
<a href="{{ base_url('/clients/new') }}" class="btn btn-primary">
<i class="fa-solid fa-plus me-2"></i>Добавить клиента
</a>
</td>
</tr>
{% else %}
{% for client in clients %}
<tr>
<td>
<div class="d-flex align-items-center">
<div class="bg-primary text-white rounded-circle d-flex justify-content-center align-items-center me-3" style="width:40px;height:40px;">
{{ client.name|first|upper }}
</div>
<div>
<strong>{{ client.name }}</strong>
{% if client.notes %}
<br><small class="text-muted">{{ client.notes|slice(0, 50) }}{{ client.notes|length > 50 ? '...' : '' }}</small>
{% endif %}
</div>
</div>
</td>
<td>
{% if client.email %}
<a href="mailto:{{ client.email }}">{{ client.email }}</a>
{% else %}
<span class="text-muted">—</span>
{% endif %}
</td>
<td>
{% if client.phone %}
<a href="tel:{{ client.phone }}">{{ client.phone }}</a>
{% else %}
<span class="text-muted">—</span>
{% endif %}
</td>
<td class="text-end">
<a href="{{ base_url('/clients/edit/' ~ client.id) }}" class="btn btn-sm btn-outline-primary" title="Редактировать">
<i class="fa-solid fa-pen"></i>
</a>
<a href="{{ base_url('/clients/delete/' ~ client.id) }}" class="btn btn-sm btn-outline-danger" title="Удалить" onclick="return confirm('Вы уверены что хотите удалить этого клиента?');">
<i class="fa-solid fa-trash"></i>
</a>
</td>
</tr>
{% endfor %}
{% endif %}
</tbody>
<tfoot>
<tr>
<td colspan="4">
{{ include('@components/table/pagination.twig', { pagination: pagination, id: 'clients-table' }) }}
</td>
</tr>
</tfoot>
+5 -60
View File
@@ -3,7 +3,7 @@
{% block content %}
<div class="d-flex justify-content-between align-items-center mb-4">
<div>
<h1 class="h3 mb-0">Клиенты</h1>
<h1 class="h3 mb-0">{{ title }}</h1>
<p class="text-muted mb-0">Управление клиентами вашей организации</p>
</div>
<a href="{{ base_url('/clients/new') }}" class="btn btn-primary">
@@ -20,63 +20,8 @@
</div>
</div>
{# Формируем строки таблицы из клиентов #}
{% set tableRows = [] %}
{% if clients is defined and clients|length > 0 %}
{% for client in clients %}
{% set tableRows = tableRows|merge([{
cells: [
{
content: '<div class="d-flex align-items-center">
<div class="bg-primary text-white rounded-circle d-flex justify-content-center align-items-center me-3" style="width:40px;height:40px;">' ~ client.name|first|upper ~ '</div>
<div><strong>' ~ client.name ~ '</strong>' ~ (client.notes ? '<br><small class="text-muted">' ~ client.notes|slice(0, 50) ~ (client.notes|length > 50 ? '...' : '') ~ '</small>') ~ '</div>
</div>',
class: ''
},
{
content: client.email ? '<a href="mailto:' ~ client.email ~ '">' ~ client.email ~ '</a>' : '<span class="text-muted">—</span>',
class: ''
},
{
content: client.phone ? '<a href="tel:' ~ client.phone ~ '">' ~ client.phone ~ '</a>' : '<span class="text-muted">—</span>',
class: ''
}
],
actions: '<a href="' ~ base_url('/clients/edit/' ~ client.id) ~ '" class="btn btn-sm btn-outline-primary" title="Редактировать"><i class="fa-solid fa-pen"></i></a>
<a href="' ~ base_url('/clients/delete/' ~ client.id) ~ '" class="btn btn-sm btn-outline-danger" title="Удалить" onclick="return confirm(\'Вы уверены что хотите удалить этого клиента?\');"><i class="fa-solid fa-trash"></i></a>'
}]) %}
{% endfor %}
{% endif %}
<div id="clients-table">
{{ include('@components/table/table.twig', {
id: 'clients-table',
url: '/clients/table',
perPage: perPage|default(10),
sort: sort|default(''),
order: order|default('asc'),
filters: filters|default({}),
columns: {
name: { label: 'Имя / Название', width: '40%' },
email: { label: 'Email', width: '25%' },
phone: { label: 'Телефон', width: '20%' }
},
rows: tableRows,
pagerDetails: {
currentPage: pagerDetails.currentPage|default(1),
pageCount: pagerDetails.pageCount|default(1),
total: pagerDetails.total|default(0),
perPage: perPage|default(10),
from: pagerDetails.from|default(1),
to: pagerDetails.to|default(clients|length|default(0))
},
actions: { label: 'Действия', width: '15%' },
emptyMessage: 'Клиентов пока нет',
emptyIcon: 'fa-solid fa-users',
emptyActionUrl: base_url('/clients/new'),
emptyActionLabel: 'Добавить клиента',
emptyActionIcon: 'fa-solid fa-plus'
}) }}
{{ tableHtml|raw }}
{# CSRF токен для AJAX запросов #}
{{ csrf_field()|raw }}
</div>
@@ -97,16 +42,16 @@ document.addEventListener('DOMContentLoaded', function() {
const id = container.id;
const url = container.dataset.url;
const perPage = parseInt(container.dataset.perPage) || 10;
if (window.dataTables && window.dataTables[id]) {
return;
}
const table = new DataTable(id, {
url: url,
perPage: perPage
});
window.dataTables = window.dataTables || {};
window.dataTables[id] = table;
});