deadline widget
This commit is contained in:
@@ -98,58 +98,81 @@ $departments = $pdo->query("SELECT DISTINCT department FROM employees WHERE depa
|
||||
<div class="page-wrapper">
|
||||
<div class="page-content">
|
||||
|
||||
<nav class="scad-breadcrumb" aria-label="breadcrumb">
|
||||
<ol class="breadcrumb mb-0">
|
||||
<li class="breadcrumb-item"><a href="scadenzario/index.php">Scadenzario</a></li>
|
||||
<li class="breadcrumb-item active" aria-current="page">Calendario</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<?php include(__DIR__ . '/include/my_deadlines_widget.php'); ?>
|
||||
|
||||
<div class="d-flex gap-2 mb-3">
|
||||
<a href="scadenzario/index.php" class="btn btn-scad-outline d-inline-flex align-items-center gap-2">
|
||||
<i class="fa-solid fa-list"></i><span>Lista Scadenze</span>
|
||||
</a>
|
||||
<div class="d-flex gap-2 mb-3 flex-wrap align-items-center">
|
||||
<button type="button" class="btn btn-scad-outline d-inline-flex align-items-center gap-2" data-bs-toggle="modal" data-bs-target="#filtersModal">
|
||||
<i class="fa-solid fa-filter"></i>
|
||||
<span>Filtri</span>
|
||||
<span id="filterCountBadge" class="badge bg-primary rounded-pill d-none" style="font-size:0.7rem">0</span>
|
||||
</button>
|
||||
<button id="btnResetFilters" type="button" class="btn btn-light border d-inline-flex align-items-center justify-content-center gap-1" title="Reset filtri" style="min-width:38px;height:38px">
|
||||
<i class="fa-solid fa-rotate-left"></i>
|
||||
<span class="d-none d-sm-inline">Reset</span>
|
||||
</button>
|
||||
<span id="activeFiltersSummary" class="text-muted small text-truncate d-none d-md-inline"></span>
|
||||
</div>
|
||||
<div id="activeFiltersSummaryMobile" class="text-muted small d-md-none mb-2" style="padding-left:0.25rem"></div>
|
||||
|
||||
<div class="filter-bar mb-3">
|
||||
<div class="row g-2 align-items-center">
|
||||
<div class="col-12 col-sm-6 col-md-auto">
|
||||
<select id="filterStatus" class="form-select" style="font-size:0.85rem;border-color:#d0d9e8;min-width:160px">
|
||||
<option value="non-completata" selected>Stato: Non completate</option>
|
||||
<option value="">Stato: Tutti</option>
|
||||
<option value="attiva">Attive</option>
|
||||
<option value="in-scadenza">In scadenza</option>
|
||||
<option value="scaduta">Scadute</option>
|
||||
<option value="completata">Completate</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 col-md-auto">
|
||||
<select id="filterDepartment" class="form-select" style="font-size:0.85rem;border-color:#d0d9e8;min-width:160px">
|
||||
<option value="">Reparto: Tutti</option>
|
||||
<?php foreach ($departments as $dept): ?>
|
||||
<option value="<?= htmlspecialchars($dept, ENT_QUOTES, 'UTF-8') ?>"><?= htmlspecialchars($dept, ENT_QUOTES, 'UTF-8') ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 col-md-auto">
|
||||
<select id="filterEmployee" class="form-select" style="font-size:0.85rem;border-color:#d0d9e8;min-width:160px">
|
||||
<option value="">Responsabile: Tutti</option>
|
||||
<?php foreach ($employees as $emp): ?>
|
||||
<option value="<?= htmlspecialchars(trim($emp['first_name'] . ' ' . $emp['last_name']), ENT_QUOTES, 'UTF-8') ?>"><?= htmlspecialchars(trim($emp['first_name'] . ' ' . $emp['last_name']), ENT_QUOTES, 'UTF-8') ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-12 col-sm-auto">
|
||||
<button id="btnResetFilters" class="btn btn-sm btn-light border w-100 w-sm-auto" title="Reset filtri">
|
||||
<i class="fa-solid fa-rotate-left me-1"></i> Reset
|
||||
</button>
|
||||
<!-- Filters Modal -->
|
||||
<div class="modal fade" id="filtersModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title"><i class="fa-solid fa-filter me-2"></i>Filtri calendario</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Chiudi"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label fw-semibold">Stato</label>
|
||||
<select id="filterStatus" class="form-select">
|
||||
<option value="non-completata" selected>Non completate</option>
|
||||
<option value="">Tutti</option>
|
||||
<option value="attiva">Attive</option>
|
||||
<option value="in-scadenza">In scadenza</option>
|
||||
<option value="scaduta">Scadute</option>
|
||||
<option value="completata">Completate</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label fw-semibold">Reparto</label>
|
||||
<select id="filterDepartment" class="form-select">
|
||||
<option value="">Tutti</option>
|
||||
<?php foreach ($departments as $dept): ?>
|
||||
<option value="<?= htmlspecialchars($dept, ENT_QUOTES, 'UTF-8') ?>"><?= htmlspecialchars($dept, ENT_QUOTES, 'UTF-8') ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-0">
|
||||
<label class="form-label fw-semibold">Responsabile</label>
|
||||
<select id="filterEmployee" class="form-select">
|
||||
<option value="">Tutti</option>
|
||||
<?php foreach ($employees as $emp): ?>
|
||||
<option value="<?= htmlspecialchars(trim($emp['first_name'] . ' ' . $emp['last_name']), ENT_QUOTES, 'UTF-8') ?>"><?= htmlspecialchars(trim($emp['first_name'] . ' ' . $emp['last_name']), ENT_QUOTES, 'UTF-8') ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-light border" id="btnResetFiltersModal">
|
||||
<i class="fa-solid fa-rotate-left me-1"></i> Reset
|
||||
</button>
|
||||
<button type="button" class="btn btn-scad-primary" data-bs-dismiss="modal">
|
||||
<i class="fa-solid fa-check me-1"></i> Applica
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card scad-card">
|
||||
<div class="card-header d-flex align-items-center justify-content-between">
|
||||
<h5><i class="fa-solid fa-calendar-days me-2"></i>Calendario Scadenze</h5>
|
||||
<div class="card-header d-flex align-items-center justify-content-between flex-wrap gap-2">
|
||||
<h5 class="d-none d-md-flex align-items-center mb-0"><i class="fa-solid fa-calendar-days me-2"></i>Calendario Scadenze</h5>
|
||||
<div class="header-actions d-flex gap-2 flex-wrap ms-auto">
|
||||
<a href="scadenzario/index.php" class="btn btn-scad-outline d-inline-flex align-items-center gap-2">
|
||||
<i class="fa-solid fa-list"></i><span>Lista Scadenze</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="legend">
|
||||
@@ -211,15 +234,41 @@ $departments = $pdo->query("SELECT DISTINCT department FROM employees WHERE depa
|
||||
calendar.render();
|
||||
|
||||
// Filters
|
||||
function updateFilterBadge() {
|
||||
var active = 0;
|
||||
var summary = [];
|
||||
var st = document.getElementById('filterStatus');
|
||||
var stv = st.value;
|
||||
if (stv && stv !== 'non-completata') { active++; summary.push(st.options[st.selectedIndex].text); }
|
||||
var dept = document.getElementById('filterDepartment').value;
|
||||
if (dept) { active++; summary.push('Reparto: ' + dept); }
|
||||
var emp = document.getElementById('filterEmployee').value;
|
||||
if (emp) { active++; summary.push('Responsabile: ' + emp); }
|
||||
|
||||
var badge = document.getElementById('filterCountBadge');
|
||||
if (active > 0) { badge.textContent = active; badge.classList.remove('d-none'); }
|
||||
else { badge.classList.add('d-none'); }
|
||||
|
||||
var summaryText = summary.length ? summary.slice(0, 2).join(' • ') + (summary.length > 2 ? ' +' + (summary.length - 2) : '') : '';
|
||||
document.getElementById('activeFiltersSummary').textContent = summaryText;
|
||||
document.getElementById('activeFiltersSummaryMobile').textContent = summaryText;
|
||||
}
|
||||
|
||||
document.querySelectorAll('#filterStatus, #filterDepartment, #filterEmployee').forEach(function(el) {
|
||||
el.addEventListener('change', function() { calendar.refetchEvents(); });
|
||||
el.addEventListener('change', function() { calendar.refetchEvents(); updateFilterBadge(); });
|
||||
});
|
||||
document.getElementById('btnResetFilters').addEventListener('click', function() {
|
||||
|
||||
function resetFilters() {
|
||||
document.getElementById('filterStatus').value = 'non-completata';
|
||||
document.getElementById('filterDepartment').value = '';
|
||||
document.getElementById('filterEmployee').value = '';
|
||||
calendar.refetchEvents();
|
||||
});
|
||||
updateFilterBadge();
|
||||
}
|
||||
document.getElementById('btnResetFilters').addEventListener('click', resetFilters);
|
||||
document.getElementById('btnResetFiltersModal').addEventListener('click', resetFilters);
|
||||
|
||||
updateFilterBadge();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user