263 lines
7.6 KiB
Smarty
263 lines
7.6 KiB
Smarty
{* ============================================
|
|
ADMIN2000 - Kunden-Verwaltung
|
|
Moderne Darstellung der Kundenliste
|
|
============================================ *}
|
|
|
|
<div class="admin2000-card">
|
|
<div class="admin2000-list-header">
|
|
<h2 class="admin2000-card-title">👥 {$table_data.title}</h2>
|
|
|
|
{* Toolbar *}
|
|
<div class="admin2000-toolbar">
|
|
{* Search *}
|
|
{if isset($table_data.toolbar.search) && $table_data.toolbar.search}
|
|
<form class="admin2000-search-form">
|
|
<input type="text" class="admin2000-search-input admin2000-search" placeholder="Kunden suchen..." />
|
|
</form>
|
|
{/if}
|
|
|
|
{* New Customer Button *}
|
|
{if isset($table_data.toolbar.new) && $table_data.toolbar.new}
|
|
<a href="{$table_data.toolbar.new}" class="admin2000-btn admin2000-btn-success">
|
|
+ Neuer Kunde
|
|
</a>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
|
|
{* Filter Section *}
|
|
{if isset($table_data.list_filter) && $table_data.list_filter}
|
|
<div class="admin2000-filter-section">
|
|
<strong class="admin2000-filter-title">🔍 Filter:</strong>
|
|
<div class="admin2000-filter-grid">
|
|
{foreach from=$table_data.list_filter item=filter}
|
|
<div class="admin2000-filter-item">
|
|
<label class="admin2000-filter-label">{$filter.name}:</label>
|
|
<select class="admin2000-filter-element" data-field="{$filter.db_field}">
|
|
<option value="">Alle</option>
|
|
{foreach from=$filter.values item=filter_val key=key}
|
|
<option value="{$key}">{$filter_val}</option>
|
|
{/foreach}
|
|
</select>
|
|
</div>
|
|
{/foreach}
|
|
</div>
|
|
</div>
|
|
|
|
<button class="admin2000-filter-toggle">
|
|
🔍 Filter anzeigen/ausblenden
|
|
</button>
|
|
{/if}
|
|
|
|
{* Stats Row - Real customer statistics *}
|
|
<div class="admin2000-stats-row">
|
|
<div class="admin2000-stat-card admin2000-stat-primary">
|
|
<div class="admin2000-stat-label">Gesamt Kunden</div>
|
|
<div class="admin2000-stat-value">{$customer_stats.total|default:0}</div>
|
|
</div>
|
|
<div class="admin2000-stat-card admin2000-stat-success">
|
|
<div class="admin2000-stat-label">Aktiv / Gesperrt</div>
|
|
<div class="admin2000-stat-value">
|
|
{$customer_stats.active|default:0} / {$customer_stats.locked|default:0}
|
|
</div>
|
|
</div>
|
|
<div class="admin2000-stat-card admin2000-stat-info">
|
|
<div class="admin2000-stat-label">Neu (30 Tage)</div>
|
|
<div class="admin2000-stat-value">{$customer_stats.new_30days|default:0}</div>
|
|
</div>
|
|
</div>
|
|
|
|
{* Table *}
|
|
<div class="admin2000-table-wrapper">
|
|
<table class="admin2000-table admin2000-customer-table">
|
|
<thead>
|
|
<tr>
|
|
{foreach from=$table_data.list_fields item=field}
|
|
<th class="{if $field.sortable == 1}admin2000-sortable{/if}" data-field="{$field.db_field}">
|
|
<a href="#" class="admin2000-sort-link" data-field="{$field.db_field}">
|
|
{$field.name}
|
|
{if $field.sortable == 1}
|
|
<span class="admin2000-sort-arrow">⇅</span>
|
|
{/if}
|
|
</a>
|
|
</th>
|
|
{/foreach}
|
|
<th class="admin2000-table-actions">Aktionen</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="admin2000-table-body">
|
|
{* Content loaded via AJAX *}
|
|
<tr>
|
|
<td colspan="100" class="admin2000-loading-cell">
|
|
<div class="admin2000-loading">Lade Daten...</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
{* Pagination *}
|
|
<div class="admin2000-pagination">
|
|
<div class="admin2000-items-per-page">
|
|
<span class="admin2000-pagination-label">Einträge pro Seite:</span>
|
|
<a href="#" class="admin2000-limit-btn active" data-limit="20">20</a>
|
|
<a href="#" class="admin2000-limit-btn" data-limit="50">50</a>
|
|
<a href="#" class="admin2000-limit-btn" data-limit="100">100</a>
|
|
<a href="#" class="admin2000-limit-btn" data-limit="200">200</a>
|
|
</div>
|
|
|
|
<div class="admin2000-pagination-info">
|
|
Seite <span class="admin2000-current-page">1</span> von <span class="admin2000-total-pages">1</span>
|
|
</div>
|
|
|
|
<div class="admin2000-pagination-controls">
|
|
<a href="#" class="admin2000-pagination-btn admin2000-prev-page" data-page="prev">← Zurück</a>
|
|
<a href="#" class="admin2000-pagination-btn admin2000-next-page" data-page="next">Weiter →</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{* JavaScript for customer list *}
|
|
<script>
|
|
$(document).ready(function() {
|
|
// Settings
|
|
var settings = {
|
|
max_list_items: 20,
|
|
actual_page: 1,
|
|
sort_item: 'number',
|
|
sort_direction: 'down',
|
|
search_string: '',
|
|
list_filter: {}
|
|
};
|
|
|
|
// Load table data
|
|
function loadTableData() {
|
|
var params = $.param({
|
|
admin_modul: 'admin2000',
|
|
section: 'stammdaten',
|
|
page: 'kunden',
|
|
action: 'get_list_items',
|
|
max_list_items: settings.max_list_items,
|
|
actual_page: settings.actual_page,
|
|
sort_item: settings.sort_item,
|
|
sort_direction: settings.sort_direction,
|
|
search_string: settings.search_string,
|
|
list_filter: settings.list_filter
|
|
});
|
|
|
|
var url = 'index.php?' + params;
|
|
console.log('🔄 Loading data from:', url);
|
|
|
|
$('.admin2000-table-body').html('<tr><td colspan="100" class="admin2000-loading-cell"><div class="admin2000-loading">Lade Daten...</div></td></tr>');
|
|
|
|
$.get(url, function(data) {
|
|
console.log('✅ Data received:', data.substring(0, 200));
|
|
$('.admin2000-table-body').html(data);
|
|
updatePagination();
|
|
}).fail(function(xhr, status, error) {
|
|
console.error('❌ AJAX Error:', status, error);
|
|
$('.admin2000-table-body').html('<tr><td colspan="100" class="admin2000-error-cell"><strong>Fehler beim Laden der Daten</strong><br>' + error + '</td></tr>');
|
|
});
|
|
}
|
|
|
|
// Update pagination
|
|
function updatePagination() {
|
|
var paginationData = $('.admin2000-pagination-data');
|
|
if (paginationData.length) {
|
|
var page = paginationData.data('page');
|
|
var pages = paginationData.data('pages');
|
|
|
|
// Update pagination info (total count stays from backend PHP)
|
|
$('.admin2000-current-page').text(page);
|
|
$('.admin2000-total-pages').text(pages);
|
|
|
|
// Update settings
|
|
settings.actual_page = page;
|
|
}
|
|
}
|
|
|
|
// Sort handler
|
|
$('.admin2000-sort-link').click(function(e) {
|
|
e.preventDefault();
|
|
var field = $(this).data('field');
|
|
|
|
if (settings.sort_item === field) {
|
|
settings.sort_direction = (settings.sort_direction === 'up') ? 'down' : 'up';
|
|
} else {
|
|
settings.sort_item = field;
|
|
settings.sort_direction = 'down';
|
|
}
|
|
|
|
settings.actual_page = 1;
|
|
loadTableData();
|
|
});
|
|
|
|
// Search handler (jQuery 3.x - we can use .on() now!)
|
|
var searchTimeout;
|
|
$('.admin2000-search').on('keyup', function() {
|
|
clearTimeout(searchTimeout);
|
|
var searchValue = $(this).val();
|
|
|
|
searchTimeout = setTimeout(function() {
|
|
settings.search_string = searchValue;
|
|
settings.actual_page = 1;
|
|
loadTableData();
|
|
}, 500);
|
|
});
|
|
|
|
// Filter handler
|
|
$('.admin2000-filter-element').change(function() {
|
|
var field = $(this).data('field');
|
|
var value = $(this).val();
|
|
|
|
if (value) {
|
|
settings.list_filter[field] = value;
|
|
} else {
|
|
delete settings.list_filter[field];
|
|
}
|
|
|
|
settings.actual_page = 1;
|
|
loadTableData();
|
|
});
|
|
|
|
// Filter toggle
|
|
$('.admin2000-filter-toggle').click(function() {
|
|
$('.admin2000-filter-section').slideToggle();
|
|
});
|
|
|
|
// Items per page
|
|
$('.admin2000-limit-btn').click(function(e) {
|
|
e.preventDefault();
|
|
$('.admin2000-limit-btn').removeClass('active');
|
|
$(this).addClass('active');
|
|
|
|
settings.max_list_items = $(this).data('limit');
|
|
settings.actual_page = 1;
|
|
loadTableData();
|
|
});
|
|
|
|
// Pagination
|
|
$('.admin2000-prev-page').click(function(e) {
|
|
e.preventDefault();
|
|
if (settings.actual_page > 1) {
|
|
settings.actual_page--;
|
|
loadTableData();
|
|
}
|
|
});
|
|
|
|
$('.admin2000-next-page').click(function(e) {
|
|
e.preventDefault();
|
|
var paginationData = $('.admin2000-pagination-data');
|
|
var totalPages = paginationData.length ? paginationData.data('pages') : 1;
|
|
|
|
if (settings.actual_page < totalPages) {
|
|
settings.actual_page++;
|
|
loadTableData();
|
|
}
|
|
});
|
|
|
|
// Initial load
|
|
loadTableData();
|
|
});
|
|
</script>
|