solocla/casadoc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update icon manage home

Browse Source
This commit is contained in:
Claudio
2025-05-21 16:43:42 +02:00
parent 9399e5b54a
commit b5e9901b8e
4 changed files with 370 additions and 181 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/userportal/tabs/documenti.php
+150 -49
View File
@@ -22,6 +22,10 @@ while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
// Imposta lo slug predefinito
$docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
// Recupera tutti i tag disponibili
$stmt = $pdo->query("SELECT tag_id, tag_name FROM tags ORDER BY tag_name");
$allTags = $stmt->fetchAll(PDO::FETCH_ASSOC);
?>
<!-- Contenuto del tab Documenti -->
@@ -64,9 +68,9 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
$name = ucfirst(htmlspecialchars($page['namepages']));
$iconClass = getCategoryIcon($index);
echo "<div class='category-icon' data-slug='{$slug}' data-index='{$index}'>
<i class='{$iconClass}'></i>
<div class='category-name'>{$name}</div>
</div>";
<i class='{$iconClass}'></i>
<div class='category-name'>{$name}</div>
</div>";
}
?>
</div>
@@ -78,12 +82,33 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
</div>
</div>
</div>
<!-- Campo di ricerca e checkbox -->
<!-- Campo di ricerca per nome/sezione, tag e checkbox -->
<div class="col-12">
<div class="position-relative mt-3">
<label for="documentSearch" class="form-label mb-1 fw-bold">Cerca:</label>
<input type="text" id="documentSearch" class="form-control w-100" placeholder="Sezione o documento..." autocomplete="off">
<div id="searchResults" class="list-group dropdown-menu show w-100" style="position: absolute; max-height: 200px; overflow-y: auto; z-index: 1000; display: none;"></div>
<div class="row">
<!-- Campo di ricerca per nome/sezione -->
<div class="col-md-6 position-relative mt-3">
<label for="documentSearch" class="form-label mb-1 fw-bold">Cerca per nome o sezione:</label>
<input type="text" id="documentSearch" class="form-control w-100" placeholder="Sezione o documento..." autocomplete="off">
<div id="searchResults" class="list-group dropdown-menu show w-100" style="position: absolute; max-height: 200px; overflow-y: auto; z-index: 1000; display: none;"></div>
</div>
<!-- Dropdown per i tag -->
<div class="col-md-6 position-relative mt-3">
<label class="form-label mb-1 fw-bold">Filtra per tag:</label>
<div class="dropdown">
<button class="btn btn-outline-secondary dropdown-toggle w-100" type="button" id="tagDropdown" data-bs-toggle="dropdown" aria-expanded="false">
Seleziona tag...
</button>
<div class="dropdown-menu w-100" aria-labelledby="tagDropdown">
<?php foreach ($allTags as $tag): ?>
<a class="dropdown-item tag-option" href="#" data-tag-id="<?php echo $tag['tag_id']; ?>" data-tag-name="<?php echo htmlspecialchars($tag['tag_name']); ?>">
<?php echo htmlspecialchars($tag['tag_name']); ?>
</a>
<?php endforeach; ?>
</div>
</div>
<!-- Contenitore per i badge selezionati -->
<div id="selectedTags" class="d-flex flex-wrap gap-2 mt-2"></div>
</div>
</div>
<!-- Checkbox -->
<div class="form-check form-switch mt-2">
@@ -239,14 +264,42 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
background-color: #f1f3f5;
}
/* Stile per il dropdown dei tag */
.dropdown-menu {
max-height: 200px;
overflow-y: auto;
}
.tag-option:hover {
background-color: #f1f3f5;
cursor: pointer;
}
/* Stile per i badge selezionati */
#selectedTags .tag-badge {
background-color: #e6f0fa;
/* Colore chiaro per i badge selezionati */
color: #2c3e50;
font-size: 0.9rem;
padding: 0.4em 0.8em;
border-radius: 10px;
display: flex;
align-items: center;
margin-bottom: 5px;
}
#selectedTags .tag-badge .remove-tag {
font-size: 0.7rem;
margin-left: 5px;
cursor: pointer;
color: #dc3545;
}
/* Stile per il titolo del documento */
.document-title {
font-weight: bold;
/* Grassetto per maggiore risalto */
font-size: 1.1rem;
/* Aumenta leggermente la dimensione */
color: #2c3e50;
/* Colore scuro per contrasto */
}
/* Stile per il preloader */
@@ -307,7 +360,11 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
.document-title {
font-size: 1rem;
/* Riduci leggermente su mobile */
}
.tag-badge {
font-size: 0.8rem;
padding: 0.3em 0.6em;
}
}
</style>
@@ -317,9 +374,9 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
let idhome = <?php echo $idhome; ?>;
let currentCategory = '<?php echo $docpage; ?>';
let currentSection = null;
let selectedTags = []; // Array per tenere traccia dei tag selezionati
// Caricamento iniziale: non carichiamo documenti finché non selezioniamo una sezione
// loadDocuments(currentCategory); // Rimuoviamo questa chiamata
// Caricamento iniziale: non carichiamo documenti finché non selezioniamo una categoria o cerchiamo
// Gestione del clic sulle icone delle categorie
$('.category-icon').on('click', function() {
@@ -331,29 +388,29 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
$('.category-icon').removeClass('active');
$(this).addClass('active');
$('.section-icons-container').hide().empty();
$('#documentSections').empty(); // Svuota i documenti quando selezioni una categoria
$('.preloader').show(); // Mostra il preloader
$('#documentSections').empty();
$('.preloader').show();
loadSections(slug);
});
// Gestione del clic sulle icone delle sezioni
$(document).on('click', '.section-icon', function() {
const sectionId = $(this).data('section-id');
const sectionName = $(this).find('.section-name').text(); // Recupera il nome della sezione
const sectionName = $(this).find('.section-name').text();
if (currentSection === sectionId) return;
currentSection = sectionId;
$('.section-icon').removeClass('active');
$(this).addClass('active');
$('.document-preloader').show(); // Mostra il preloader per i documenti
loadDocuments(currentCategory, sectionId, sectionName); // Carica i documenti della sezione
$('.document-preloader').show();
loadDocuments(currentCategory, sectionId, sectionName);
});
// Gestione del checkbox "Solo obbligatori"
$("#showOnlyRequired").on('change', function() {
if (currentSection) { // Carica solo se una sezione è selezionata
if (currentSection) {
const sectionName = $('.section-icon.active .section-name').text();
$('.document-preloader').show(); // Mostra il preloader
$('.document-preloader').show();
loadDocuments(currentCategory, currentSection, sectionName);
}
});
@@ -369,7 +426,7 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
},
dataType: 'json',
success: function(response) {
$('.preloader').hide(); // Nascondi il preloader
$('.preloader').hide();
if (response.error) {
console.error(response.error);
return;
@@ -385,7 +442,7 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
$('.section-icons-container').html(html).slideDown();
},
error: function(xhr, status, error) {
$('.preloader').hide(); // Nascondi il preloader in caso di errore
$('.preloader').hide();
console.error('Errore nel caricamento delle sezioni:', error);
}
});
@@ -395,23 +452,28 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
let allDocuments = [];
<?php
$stmt = $pdo->query("
SELECT d.document_id, d.document_name, p.slug, s.section_name
SELECT d.document_id, d.document_name, p.slug, s.section_name, GROUP_CONCAT(t.tag_name) AS tags
FROM documents d
LEFT JOIN sections s ON d.idsections = s.idsections
LEFT JOIN pages p ON d.page_id = p.idpages
LEFT JOIN document_tags dt ON d.document_id = dt.document_id
LEFT JOIN tags t ON dt.tag_id = t.tag_id
GROUP BY d.document_id, d.document_name, p.slug, s.section_name
ORDER BY s.section_name, d.document_name
");
while ($doc = $stmt->fetch(PDO::FETCH_ASSOC)) {
$tags = $doc['tags'] ? addslashes(htmlspecialchars($doc['tags'])) : '';
echo "allDocuments.push({
id: '{$doc['document_id']}',
name: '" . addslashes(htmlspecialchars($doc['document_name'])) . "',
section: '" . addslashes(htmlspecialchars($doc['section_name'])) . "',
slug: '" . addslashes(htmlspecialchars($doc['slug'])) . "'
slug: '" . addslashes(htmlspecialchars($doc['slug'])) . "',
tags: '{$tags}'
});\n";
}
?>
// Gestione della ricerca dinamica
// Gestione della ricerca dinamica per nome/sezione
$('#documentSearch').on('input', function() {
const searchTerm = $(this).val().toLowerCase().trim();
$('#searchResults').empty().hide();
@@ -428,8 +490,8 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
if (results.length > 0) {
let html = '';
results.forEach(result => {
html += `<a href="#" class="list-group-item list-group-item-action" data-slug="${result.slug}" data-section="${md5(result.section)}">
${result.name} (Sezione: ${result.section})
html += `<a href="#" class="list-group-item list-group-item-action" data-slug="${result.slug}" data-section="${md5(result.section)}" data-name="${result.name}">
${result.name} (Sezione: ${result.section}${result.tags ? ', Tag: ' + result.tags : ''})
</a>`;
});
$('#searchResults').html(html).show();
@@ -438,33 +500,69 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
e.preventDefault();
const slug = $(this).data('slug');
const sectionId = $(this).data('section');
const documentName = $(this).data('name');
currentCategory = slug;
currentSection = sectionId;
$('.category-icon').removeClass('active');
$('.category-icon[data-slug="' + slug + '"]').addClass('active');
$('.section-icons-container').hide().empty();
$('.preloader').show(); // Mostra il preloader durante la ricerca
loadSections(slug);
$('#documentSections').empty();
$('.document-preloader').show();
// Carica direttamente i documenti senza passare per le sezioni
loadDocuments(slug, sectionId, null, documentName);
$('#documentSearch').val('');
$('#searchResults').hide();
// Trova il nome della sezione e carica i documenti
setTimeout(() => {
const sectionElement = $(`.section-icon[data-section-id="${sectionId}"]`);
if (sectionElement.length) {
$('.section-icon').removeClass('active');
sectionElement.addClass('active');
const sectionName = sectionElement.find('.section-name').text();
$('.document-preloader').show(); // Mostra il preloader
loadDocuments(slug, sectionId, sectionName);
}
}, 500);
});
}
});
// Gestione del dropdown dei tag
$('.tag-option').on('click', function(e) {
e.preventDefault();
const tagId = $(this).data('tag-id');
const tagName = $(this).data('tag-name');
if (!selectedTags.some(t => t.id === tagId)) {
selectedTags.push({
id: tagId,
name: tagName
});
updateSelectedTags();
if (currentSection) {
const sectionName = $('.section-icon.active .section-name').text();
$('.document-preloader').show();
loadDocuments(currentCategory, currentSection, sectionName);
}
}
});
// Funzione per aggiornare i badge dei tag selezionati
function updateSelectedTags() {
$('#selectedTags').empty();
selectedTags.forEach(tag => {
$('#selectedTags').append(`
<span class="tag-badge">
${tag.name}
<span class="remove-tag" data-tag-id="${tag.id}">&times;</span>
</span>
`);
});
$('.remove-tag').on('click', function(e) {
e.preventDefault();
const tagId = $(this).data('tag-id');
selectedTags = selectedTags.filter(t => t.id !== tagId);
updateSelectedTags();
if (currentSection) {
const sectionName = $('.section-icon.active .section-name').text();
$('.document-preloader').show();
loadDocuments(currentCategory, currentSection, sectionName);
}
});
}
// Chiudi i risultati della ricerca se clicchi fuori
$(document).on('click', function(e) {
if (!$(e.target).closest('.input-group, #searchResults').length) {
@@ -472,8 +570,9 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
}
});
function loadDocuments(slug, targetSectionId = null, sectionName = null) {
function loadDocuments(slug, targetSectionId = null, sectionName = null, searchName = null) {
const showOnlyRequired = $("#showOnlyRequired").is(":checked");
const tagIds = selectedTags.map(t => t.id);
$.ajax({
url: 'get-documents.php',
@@ -482,11 +581,13 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
slug: slug,
idhome: idhome,
showOnlyRequired: showOnlyRequired,
sectionId: targetSectionId ? targetSectionId : null
sectionId: targetSectionId ? targetSectionId : null,
tags: tagIds.length > 0 ? tagIds.join(',') : null,
searchName: searchName ? searchName : null
},
dataType: 'json',
success: function(response) {
$('.document-preloader').hide(); // Nascondi il preloader
$('.document-preloader').hide();
if (response.error) {
Swal.fire({
icon: 'error',
@@ -515,7 +616,6 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
}
sectionCount++;
// Usa il nome della sezione passato come parametro
const displaySectionName = sectionName || sectionKey;
html += `
@@ -540,6 +640,7 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
<span class="document-title fw-bold">${document.document_name || 'Documento senza nome'}</span>
${document.is_required ? '<span class="badge bg-danger ms-2" style="font-size: 1rem; padding: 0.5em 0.8em;">Obbligatorio</span>' : ''}
${document.max_documents > 0 ? `<span class="badge bg-info ms-2" style="font-size: 1rem; padding: 0.5em 0.8em;">Max: ${document.max_documents}</span>` : ''}
${document.tags ? `<span class="badge bg-secondary ms-2" style="font-size: 1rem; padding: 0.5em 0.8em;">Tag: ${document.tags}</span>` : ''}
</div>
<button class="btn btn-sm btn-outline-primary toggle-dropzone" data-target="#dropzone-${document.document_id}">
<i class="fas fa-plus"></i>
@@ -602,9 +703,9 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
collapseElement.collapse('show');
$('html, body').animate({
scrollTop: collapseElement.offset().top - 100
}, 500);
}, 100);
}
}, 1000);
}, 100);
}
// Rinizializza Dropzone per ogni documento
@@ -877,7 +978,7 @@ $docpage = isset($_GET['docpage']) ? $_GET['docpage'] : 'legal';
};
},
error: function(xhr, status, error) {
$('.document-preloader').hide(); // Nascondi il preloader in caso di errore
$('.document-preloader').hide();
Swal.fire({
icon: 'error',
title: 'Errore',