SuiteConsultance/Templates/partials/tasks_sidebar.html
2025-09-20 13:18:04 +02:00

74 lines
3 KiB
HTML

{# Sidebar offcanvas gauche pour afficher les tâches du jour #}
<div class="offcanvas offcanvas-start" tabindex="-1" id="tasksTodaySidebar" aria-labelledby="tasksTodaySidebarLabel" style="width:560px;">
<div class="offcanvas-header">
<h5 class="offcanvas-title" id="tasksTodaySidebarLabel">
<i class="fas fa-list-check me-2"></i>Tâches
</h5>
<a href="{{ url_for('tasks.tasks_index') }}" class="btn btn-warning btn-sm"><i class="fas fa-cog me-1"></i></a>
<a href="{{ url_for('tasks.email_drafts_list') }}" class="btn btn-success btn-sm"><i class="fa-solid fa-file-arrow-up"></i></a>
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Fermer"></button>
</div>
<div class="offcanvas-body">
<ul class="nav nav-tabs mb-3">
<li class="nav-item">
<a class="nav-link active" id="today-tab" data-bs-toggle="tab" href="#today">Aujourd'hui</a>
</li>
<li class="nav-item">
<a class="nav-link" id="tomorrow-tab" data-bs-toggle="tab" href="#tomorrow">Demain</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane fade show active" id="today">
<div id="tasksTodayContent">
<div class="placeholder">Chargement des tâches...</div>
</div>
</div>
<div class="tab-pane fade" id="tomorrow">
<div id="tasksTomorrowContent">
<div class="placeholder">Chargement des tâches...</div>
</div>
</div>
</div>
</div>
</div>
<script>
(function(){
const todayContainer = document.getElementById('tasksTodayContent');
const tomorrowContainer = document.getElementById('tasksTomorrowContent');
async function loadTasks(container, url) {
try {
const res = await fetch(url, {headers: {'X-Requested-With': 'XMLHttpRequest'}});
if (!res.ok) throw new Error('HTTP ' + res.status);
container.innerHTML = await res.text();
} catch (e) {
container.innerHTML = '<div class="text-muted">Impossible de charger les tâches.</div>';
}
}
async function loadTodayTasks() {
await loadTasks(todayContainer, '{{ url_for("tasks.today_fragment") }}');
}
async function loadTomorrowTasks() {
await loadTasks(tomorrowContainer, '{{ url_for("tasks.tomorrow_fragment") }}');
}
// Charger au premier affichage de la page
document.addEventListener('DOMContentLoaded', loadTodayTasks);
// Recharger à l'ouverture de l'offcanvas
const sidebar = document.getElementById('tasksTodaySidebar');
if (sidebar) {
sidebar.addEventListener('show.bs.offcanvas', () => {
loadTodayTasks();
loadTomorrowTasks();
});
}
// Gérer les changements d'onglets
const tomorrowTab = document.getElementById('tomorrow-tab');
tomorrowTab.addEventListener('shown.bs.tab', loadTomorrowTasks);
})();
</script>