117 lines
5.3 KiB
JavaScript
117 lines
5.3 KiB
JavaScript
/**
|
|
===============================================================================
|
|
FILE: modules/web_api/static/js/tasks.js
|
|
PROJECT: SCUD Orion AI (Unified Architecture)
|
|
MODULE: web_api / static / js
|
|
ROLE: Загрузка, фильтрация и рендеринг списка задач в боковой панели (Drawer).
|
|
===============================================================================
|
|
*/
|
|
|
|
let currentTaskFilter = 'IN_PROGRESS';
|
|
|
|
async function loadTasks() {
|
|
const token = typeof API_TOKEN !== 'undefined' && API_TOKEN ? API_TOKEN : localStorage.getItem("scud_api_auth_token");
|
|
if (!token) return;
|
|
|
|
try {
|
|
const res = await fetch("/api/v1/tasks", {
|
|
headers: { "Authorization": "Bearer " + token }
|
|
});
|
|
if (res.ok) {
|
|
const data = await res.json();
|
|
renderSidebarTasks(data.tasks || []);
|
|
} else {
|
|
renderSidebarError("Ошибка доступа. Авторизуйтесь снова.");
|
|
}
|
|
} catch (e) {
|
|
console.error("Ошибка загрузки задач:", e);
|
|
renderSidebarError("Ошибка сети. Сервер недоступен.");
|
|
}
|
|
}
|
|
|
|
function renderSidebarError(msg) {
|
|
// Поддерживаем оба варианта ID (новый и старый) для обратной совместимости
|
|
const container = document.getElementById("tasks-list") || document.getElementById("tasks-list-container");
|
|
if (container) {
|
|
container.innerHTML = `<div class="text-center py-8 text-xs text-rose-500 font-semibold">${msg}</div>`;
|
|
}
|
|
}
|
|
|
|
function filterTasksByTab(status) {
|
|
currentTaskFilter = status;
|
|
|
|
// Сброс стилей всех кнопок-вкладок
|
|
document.querySelectorAll('.task-tab-btn').forEach(btn => {
|
|
btn.classList.remove('text-indigo-600', 'bg-indigo-50');
|
|
btn.classList.add('text-slate-600');
|
|
});
|
|
|
|
// Установка активного стиля для выбранной вкладки
|
|
const activeBtnId = {
|
|
'IN_PROGRESS': 'tab-in-progress',
|
|
'BACKLOG': 'tab-backlog',
|
|
'COMPLETED': 'tab-completed',
|
|
'ALL': 'tab-all'
|
|
}[status];
|
|
|
|
if (activeBtnId) {
|
|
const btn = document.getElementById(activeBtnId);
|
|
if (btn) {
|
|
btn.classList.remove('text-slate-600', 'hover:bg-slate-100');
|
|
btn.classList.add('text-indigo-600', 'bg-indigo-50');
|
|
}
|
|
}
|
|
|
|
loadTasks();
|
|
}
|
|
|
|
function renderSidebarTasks(tasks) {
|
|
const container = document.getElementById("tasks-list") || document.getElementById("tasks-list-container");
|
|
if (!container) return;
|
|
|
|
let filtered = tasks;
|
|
if (currentTaskFilter !== 'ALL') {
|
|
filtered = tasks.filter(t => t.status === currentTaskFilter);
|
|
}
|
|
|
|
if (filtered.length === 0) {
|
|
container.innerHTML = `<div class="text-center py-8 text-[11px] font-medium text-slate-400 bg-slate-50 rounded-xl border border-dashed border-slate-200">Нет задач в этой категории</div>`;
|
|
return;
|
|
}
|
|
|
|
container.innerHTML = filtered.map(t => {
|
|
const isCompleted = t.status === 'COMPLETED';
|
|
const priorityColor = t.priority === 'HIGH' || t.priority === 'CRITICAL'
|
|
? 'text-rose-600 bg-rose-50 border-rose-200'
|
|
: t.priority === 'MEDIUM'
|
|
? 'text-amber-600 bg-amber-50 border-amber-200'
|
|
: 'text-slate-600 bg-slate-50 border-slate-200';
|
|
|
|
return `
|
|
<div class="p-3 bg-white border border-slate-200 rounded-xl shadow-sm hover:border-indigo-400 hover:shadow-md transition cursor-pointer flex flex-col gap-2 group"
|
|
onclick="handleActionButtonClick('покажи задачу ${t.id}')">
|
|
|
|
<div class="flex items-start justify-between gap-2">
|
|
<span class="text-[10px] font-bold text-slate-400 uppercase tracking-wider group-hover:text-indigo-500 transition">#${t.id}</span>
|
|
${isCompleted
|
|
? `<span class="text-[10px] font-bold px-1.5 py-0.5 rounded-md bg-emerald-50 text-emerald-600 border border-emerald-200 shadow-sm"><i class="fa-solid fa-check mr-0.5"></i> Готово</span>`
|
|
: `<span class="text-[10px] font-bold px-1.5 py-0.5 rounded-md ${priorityColor} shadow-sm">${t.priority || 'LOW'}</span>`
|
|
}
|
|
</div>
|
|
|
|
<div class="text-xs font-semibold text-slate-700 leading-snug line-clamp-3">${escapeHtml(t.title || 'Без названия')}</div>
|
|
|
|
<div class="flex items-center justify-between text-[10px] text-slate-400 mt-1">
|
|
<span class="bg-slate-100 px-1.5 py-0.5 rounded font-mono truncate max-w-[120px]">${escapeHtml(t.module || 'general')}</span>
|
|
${t.due_date ? `<span class="shrink-0 font-medium text-slate-500"><i class="fa-regular fa-calendar mr-1"></i>${escapeHtml(t.due_date)}</span>` : ''}
|
|
</div>
|
|
</div>
|
|
`;
|
|
}).join('');
|
|
}
|
|
|
|
// Глобальная инициализация при загрузке DOM
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
// Небольшая задержка, чтобы гарантировать применение токена
|
|
setTimeout(loadTasks, 200);
|
|
}); |