mirror of
https://codeberg.org/PostERG/xamxam.git
synced 2026-06-25 16:19:19 +02:00
Add sidebar TOC, simplify Données Secondaires section
- Rename 'Éditer Données Secondaires' → 'Données Secondaires', remove fieldset wrapper on Mots-clés link - Create admin-toc.php partial: IntersectionObserver-based sidebar nav - Include TOC on contenus.php, acces.php, parametres.php - Add .admin-with-toc flex layout (sidebar + main) and .admin-toc CSS - Fonts (Ductus, BBB DM Sans): verified loaded via variables.css → common.css import chain - TOC: move inside <main> as <aside>, content in <article>, fix scrolling - Lazy load: hx-trigger='load delay:100ms' with spinner (htmx-indicator) for tags/langues - Inline rename: edit button in Nom cell, HTMX post for rename, validate+ cancel buttons - Checkbox column: width:1% / fit-content - Remove per-row merge forms/selects, only bulk merge when ≥2 checkboxes selected - Remove per-row merge dialogs, keep only bulk merge and delete dialogs - Add htmx-settling CSS transition for lazy-load fade-in - Update acces.php/parametres.php: article layout, TOC inside main - TOC: DOMContentLoaded guard, use <nav>+<a> directly instead of <ul>/<li> - Section spacing: margin-bottom on sections and fieldsets in admin-main--toc - Language dedup: GROUP BY LOWER(name) in getAllLanguagesWithCount and searchLanguages - deduplicateLanguages() merges duplicate names and reassigns thesis_languages - Sticky bulk-actions: position:sticky;top:0;z-index:10 - Tags toolbar: title left, stat count right (margin-left:auto), search bar under - Tags count stat updated via hx-swap-oob from fragment - Remove margin/max-width from .admin-main--toc - Gap between TOC and article: --space-xs, sticky top: --space-xs - Main padding: --space-s / --space-m / --space-xl (was --space-l/--space-l/--space-2xl) - Article padding-top: --space-m
This commit is contained in:
Pontoporeia
@@ -47,10 +47,10 @@ try {
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col"><input type="checkbox" onchange="languesToggleAll(this)"></th>
|
||||
<th scope="col" style="width:1%"><input type="checkbox" onchange="languesToggleAll(this)"></th>
|
||||
<th scope="col">Nom</th>
|
||||
<th scope="col">TFE Associé</th>
|
||||
<th scope="col">Actions</th>
|
||||
<th scope="col" style="width:1%;white-space:nowrap">TFE Associé</th>
|
||||
<th scope="col" style="width:1%">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@@ -59,42 +59,17 @@ try {
|
||||
<?php else: ?>
|
||||
<?php foreach ($languages as $lang): ?>
|
||||
<tr>
|
||||
<td><input type="checkbox" name="selected_langs[]" value="<?= (int)$lang['id'] ?>" onchange="languesUpdateBulk()"></td>
|
||||
<td><?= htmlspecialchars($lang['name']) ?></td>
|
||||
<td class="admin-tags-count"><?= (int)$lang['thesis_count'] ?></td>
|
||||
<td class="admin-actions-col">
|
||||
<td style="width:1%"><input type="checkbox" name="selected_langs[]" value="<?= (int)$lang['id'] ?>" onchange="languesUpdateBulk()"></td>
|
||||
<td id="lang-name-<?= (int)$lang['id'] ?>" data-name="<?= htmlspecialchars($lang['name']) ?>">
|
||||
<span class="tag-name-cell"><?= htmlspecialchars($lang['name']) ?></span>
|
||||
<button type="button" class="admin-icon-btn admin-icon-btn--edit" title="Renommer"
|
||||
onclick="languesStartRename(<?= (int)$lang['id'] ?>)">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" viewBox="0 0 256 256"><path d="M248,92.68a15.86,15.86,0,0,0-4.69-11.31L174.63,12.68a16,16,0,0,0-22.63,0L123.57,41.11l-58,21.77A16.06,16.06,0,0,0,55.35,75.23L32.11,214.68A8,8,0,0,0,40,224a8.4,8.4,0,0,0,1.32-.11l139.44-23.24a16,16,0,0,0,12.35-10.17l21.77-58L243.31,104A15.87,15.87,0,0,0,248,92.68Zm-69.87,92.19L63.32,204l47.37-47.37a28,28,0,1,0-11.32-11.32L52,192.7,71.13,77.86,126,57.29,198.7,130ZM112,132a12,12,0,1,1,12,12A12,12,0,0,1,112,132Zm96-15.32L139.31,48l24-24L232,92.68Z"></path></svg>
|
||||
</button>
|
||||
</td>
|
||||
<td class="admin-tags-count" style="width:1%;white-space:nowrap"><?= (int)$lang['thesis_count'] ?></td>
|
||||
<td class="admin-actions-col" style="width:1%">
|
||||
<div class="admin-actions">
|
||||
<form method="post" action="actions/language.php" class="admin-inline-form">
|
||||
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
|
||||
<input type="hidden" name="action" value="rename">
|
||||
<input type="hidden" name="return" value="/admin/contenus.php">
|
||||
<input type="hidden" name="language_id" value="<?= (int)$lang['id'] ?>">
|
||||
<input class="admin-input--inline" type="text" name="new_name"
|
||||
value="<?= htmlspecialchars($lang['name']) ?>" required>
|
||||
<button type="submit" class="admin-icon-btn admin-icon-btn--edit" title="Renommer">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" viewBox="0 0 256 256"><path d="M248,92.68a15.86,15.86,0,0,0-4.69-11.31L174.63,12.68a16,16,0,0,0-22.63,0L123.57,41.11l-58,21.77A16.06,16.06,0,0,0,55.35,75.23L32.11,214.68A8,8,0,0,0,40,224a8.4,8.4,0,0,0,1.32-.11l139.44-23.24a16,16,0,0,0,12.35-10.17l21.77-58L243.31,104A15.87,15.87,0,0,0,248,92.68Zm-69.87,92.19L63.32,204l47.37-47.37a28,28,0,1,0-11.32-11.32L52,192.7,71.13,77.86,126,57.29,198.7,130ZM112,132a12,12,0,1,1,12,12A12,12,0,0,1,112,132Zm96-15.32L139.31,48l24-24L232,92.68Z"></path></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<form method="post" action="actions/language.php" class="admin-inline-form">
|
||||
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
|
||||
<input type="hidden" name="action" value="merge">
|
||||
<input type="hidden" name="return" value="/admin/contenus.php">
|
||||
<input type="hidden" name="source_id" value="<?= (int)$lang['id'] ?>">
|
||||
<select name="target_id" class="admin-select--inline" required>
|
||||
<option value="">— Fusionner dans… —</option>
|
||||
<?php foreach ($languages as $other): ?>
|
||||
<?php if ($other['id'] !== $lang['id']): ?>
|
||||
<option value="<?= (int)$other['id'] ?>"><?= htmlspecialchars($other['name']) ?></option>
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
<button type="button" class="admin-icon-btn admin-icon-btn--merge" title="Fusionner"
|
||||
onclick="return languesConfirmMerge(this)">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" viewBox="0 0 256 256"><path d="M216,32H88a8,8,0,0,0-8,8V80H40a8,8,0,0,0-8,8V216a8,8,0,0,0,8,8H168a8,8,0,0,0,8-8V176h40a8,8,0,0,0,8-8V40A8,8,0,0,0,216,32ZM160,208H48V96H160Zm48-48H176V88a8,8,0,0,0-8-8H96V48H208Z"></path></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<form method="post" action="actions/language.php" class="admin-inline-form">
|
||||
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
|
||||
<input type="hidden" name="action" value="delete">
|
||||
|
||||
@@ -14,6 +14,7 @@ $allowedPageSlugs = ['about', 'licenses'];
|
||||
|
||||
try {
|
||||
$db = new Database();
|
||||
$db->deduplicateLanguages();
|
||||
$allPages = $db->getAllPages();
|
||||
$pages = array_values(array_filter($allPages, fn($p) => in_array($p['slug'], $allowedPageSlugs, true)));
|
||||
$aproposKeys = $db->getAllAproposContents();
|
||||
|
||||
@@ -9,5 +9,6 @@ require_once __DIR__ . '/../../bootstrap.php';
|
||||
require_once __DIR__ . '/../../src/AdminAuth.php';
|
||||
|
||||
AdminAuth::requireLogin();
|
||||
App::boot();
|
||||
|
||||
require_once APP_ROOT . '/public/partage/language-search-fragment.php';
|
||||
|
||||
@@ -3,6 +3,7 @@
|
||||
* tags-fragment.php
|
||||
*
|
||||
* HTMX fragment: returns the tags table, optionally filtered by search query.
|
||||
* Uses lazy-load pattern: the wrapping div already shows a spinner via hx-indicator.
|
||||
*/
|
||||
require_once __DIR__ . '/../../bootstrap.php';
|
||||
require_once __DIR__ . '/../../src/AdminAuth.php';
|
||||
@@ -19,10 +20,12 @@ $searchQuery = trim($_GET['q'] ?? '');
|
||||
try {
|
||||
$db = new Database();
|
||||
$tags = ($searchQuery !== '') ? $db->searchTags($searchQuery) : $db->getAllTagsWithCount();
|
||||
$totalCount = count($tags);
|
||||
} catch (Exception $e) {
|
||||
die('<div class="flash-error">Erreur : ' . htmlspecialchars($e->getMessage()) . '</div>');
|
||||
}
|
||||
?>
|
||||
<span id="tags-total-count" hx-swap-oob="true"><?= $searchQuery !== '' ? htmlspecialchars($totalCount) . ' résultat(s)' : htmlspecialchars($totalCount) . ' mot(s)-clé(s)' ?></span>
|
||||
<div id="tags-bulk-actions" class="admin-bulk-actions" style="display:none">
|
||||
<strong><span id="tags-selected-count">0</span> mot(s)-clé(s) sélectionné(s)</strong>
|
||||
<div class="admin-bulk-btns">
|
||||
@@ -45,10 +48,10 @@ try {
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col"><input type="checkbox" onchange="tagsToggleAll(this)"></th>
|
||||
<th scope="col" style="width:1%"><input type="checkbox" onchange="tagsToggleAll(this)"></th>
|
||||
<th scope="col">Nom</th>
|
||||
<th scope="col">TFE associés</th>
|
||||
<th scope="col">Actions</th>
|
||||
<th scope="col" style="width:1%;white-space:nowrap">TFE associés</th>
|
||||
<th scope="col" style="width:1%">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@@ -57,40 +60,17 @@ try {
|
||||
<?php else: ?>
|
||||
<?php foreach ($tags as $tag): ?>
|
||||
<tr>
|
||||
<td><input type="checkbox" name="selected_tags[]" value="<?= (int)$tag['id'] ?>" onchange="tagsUpdateBulk()"></td>
|
||||
<td><?= htmlspecialchars($tag['name']) ?></td>
|
||||
<td class="admin-tags-count"><?= (int)$tag['thesis_count'] ?></td>
|
||||
<td class="admin-actions-col">
|
||||
<td style="width:1%"><input type="checkbox" name="selected_tags[]" value="<?= (int)$tag['id'] ?>" onchange="tagsUpdateBulk()"></td>
|
||||
<td id="tag-name-<?= (int)$tag['id'] ?>" data-name="<?= htmlspecialchars($tag['name']) ?>">
|
||||
<span class="tag-name-cell"><?= htmlspecialchars($tag['name']) ?></span>
|
||||
<button type="button" class="admin-icon-btn admin-icon-btn--edit" title="Renommer"
|
||||
onclick="tagsStartRename(<?= (int)$tag['id'] ?>)">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" viewBox="0 0 256 256"><path d="M248,92.68a15.86,15.86,0,0,0-4.69-11.31L174.63,12.68a16,16,0,0,0-22.63,0L123.57,41.11l-58,21.77A16.06,16.06,0,0,0,55.35,75.23L32.11,214.68A8,8,0,0,0,40,224a8.4,8.4,0,0,0,1.32-.11l139.44-23.24a16,16,0,0,0,12.35-10.17l21.77-58L243.31,104A15.87,15.87,0,0,0,248,92.68Zm-69.87,92.19L63.32,204l47.37-47.37a28,28,0,1,0-11.32-11.32L52,192.7,71.13,77.86,126,57.29,198.7,130ZM112,132a12,12,0,1,1,12,12A12,12,0,0,1,112,132Zm96-15.32L139.31,48l24-24L232,92.68Z"></path></svg>
|
||||
</button>
|
||||
</td>
|
||||
<td class="admin-tags-count" style="width:1%;white-space:nowrap"><?= (int)$tag['thesis_count'] ?></td>
|
||||
<td class="admin-actions-col" style="width:1%">
|
||||
<div class="admin-actions">
|
||||
<form method="post" action="actions/tag.php" class="admin-inline-form">
|
||||
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
|
||||
<input type="hidden" name="action" value="rename">
|
||||
<input type="hidden" name="tag_id" value="<?= (int)$tag['id'] ?>">
|
||||
<input class="admin-input--inline" type="text" name="new_name"
|
||||
value="<?= htmlspecialchars($tag['name']) ?>" required>
|
||||
<button type="submit" class="admin-icon-btn admin-icon-btn--edit" title="Renommer">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" viewBox="0 0 256 256"><path d="M248,92.68a15.86,15.86,0,0,0-4.69-11.31L174.63,12.68a16,16,0,0,0-22.63,0L123.57,41.11l-58,21.77A16.06,16.06,0,0,0,55.35,75.23L32.11,214.68A8,8,0,0,0,40,224a8.4,8.4,0,0,0,1.32-.11l139.44-23.24a16,16,0,0,0,12.35-10.17l21.77-58L243.31,104A15.87,15.87,0,0,0,248,92.68Zm-69.87,92.19L63.32,204l47.37-47.37a28,28,0,1,0-11.32-11.32L52,192.7,71.13,77.86,126,57.29,198.7,130ZM112,132a12,12,0,1,1,12,12A12,12,0,0,1,112,132Zm96-15.32L139.31,48l24-24L232,92.68Z"></path></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<form method="post" action="actions/tag.php" class="admin-inline-form">
|
||||
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
|
||||
<input type="hidden" name="action" value="merge">
|
||||
<input type="hidden" name="source_id" value="<?= (int)$tag['id'] ?>">
|
||||
<select name="target_id" class="admin-select--inline" required>
|
||||
<option value="">— Fusionner dans… —</option>
|
||||
<?php foreach ($tags as $other): ?>
|
||||
<?php if ($other['id'] !== $tag['id']): ?>
|
||||
<option value="<?= (int)$other['id'] ?>"><?= htmlspecialchars($other['name']) ?></option>
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
<button type="button" class="admin-icon-btn admin-icon-btn--merge" title="Fusionner"
|
||||
onclick="return tagsConfirmMerge(this)">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" viewBox="0 0 256 256"><path d="M216,32H88a8,8,0,0,0-8,8V80H40a8,8,0,0,0-8,8V216a8,8,0,0,0,8,8H168a8,8,0,0,0,8-8V176h40a8,8,0,0,0,8-8V40A8,8,0,0,0,216,32ZM160,208H48V96H160Zm48-48H176V88a8,8,0,0,0-8-8H96V48H208Z"></path></svg>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<form method="post" action="actions/tag.php" class="admin-inline-form">
|
||||
<input type="hidden" name="csrf_token" value="<?= htmlspecialchars($_SESSION['csrf_token']) ?>">
|
||||
<input type="hidden" name="action" value="delete">
|
||||
|
||||
@@ -48,7 +48,7 @@
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
padding: var(--space-l) var(--space-l) var(--space-2xl);
|
||||
padding: var(--space-s) var(--space-m) var(--space-xl);
|
||||
width: 100%;
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
@@ -331,6 +331,9 @@
|
||||
border-radius: var(--radius);
|
||||
margin-bottom: var(--space-s);
|
||||
font-size: var(--step--1);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.admin-bulk-btns {
|
||||
@@ -338,6 +341,14 @@
|
||||
gap: var(--space-2xs);
|
||||
}
|
||||
|
||||
.admin-stat--inline {
|
||||
font-size: var(--step--1);
|
||||
color: var(--text-secondary);
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
/* ── Table ──────────────────────────────────────────────────────────────── */
|
||||
/* Base table/th/td styles live in common.css */
|
||||
.admin-body main > table {
|
||||
@@ -1992,26 +2003,32 @@ th.admin-ap-col {
|
||||
|
||||
/* ── Sidebar TOC ───────────────────────────────────────────────────────────── */
|
||||
|
||||
.admin-with-toc {
|
||||
.admin-main--toc {
|
||||
display: flex;
|
||||
gap: var(--space-m);
|
||||
gap: var(--space-xs);
|
||||
align-items: flex-start;
|
||||
max-width: var(--content-max-width, 1200px);
|
||||
margin: 0 auto;
|
||||
padding: 0 var(--space-s);
|
||||
}
|
||||
|
||||
.admin-with-toc > main {
|
||||
.admin-main--toc > article {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
padding-top: var(--space-m);
|
||||
}
|
||||
|
||||
.admin-main--toc > article > section {
|
||||
margin-bottom: var(--space-xl);
|
||||
}
|
||||
|
||||
.admin-main--toc > article > section > fieldset {
|
||||
margin-bottom: var(--space-m);
|
||||
}
|
||||
|
||||
.admin-toc {
|
||||
position: sticky;
|
||||
top: var(--space-m);
|
||||
top: var(--space-xs);
|
||||
width: 160px;
|
||||
flex-shrink: 0;
|
||||
padding-top: var(--space-s);
|
||||
padding-top: var(--space-m);
|
||||
}
|
||||
|
||||
.admin-toc-list {
|
||||
@@ -2042,3 +2059,11 @@ th.admin-ap-col {
|
||||
font-weight: 600;
|
||||
border-left-color: var(--accent, var(--color-primary));
|
||||
}
|
||||
|
||||
/* ── Lazy-load transition ─────────────────────────────────────────────────── */
|
||||
.htmx-settling img {
|
||||
opacity: 0;
|
||||
}
|
||||
.htmx-indicator img {
|
||||
transition: opacity 300ms ease-in;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user