juan-server/calendario-jp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MODIFICAR PENDIENTES Y COMPLETADOS

Browse Source
This commit is contained in:
juan-server
2026-08-12 10:54:20 -05:00
parent 5a0dca31cc
commit 91c9816b56
3 changed files with 272 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/script.js
+135 -13
View File
@@ -9,6 +9,7 @@ async function cargarPendientes() {
todosPendientes = await res.json();
renderCalendar();
renderLista();
renderCompletados();
}
function formatearFecha(fechaStr) {
@@ -68,13 +69,31 @@ function abrirModalDia(fecha, pendientes) {
document.getElementById('modalTitulo').textContent = 'Pendientes del ' + formatearFecha(fecha);
const cont = document.getElementById('modalPendientes');
cont.innerHTML = '';
const noCompletados = pendientes.filter(function(p) { return p.estado !== 'completado'; });
const completados = pendientes.filter(function(p) { return p.estado === 'completado'; });
if (!pendientes.length) {
cont.innerHTML = '<p>No hay pendientes para este dia.</p>';
} else {
pendientes.forEach(function(p) {
const div = crearCardPendiente(p);
cont.appendChild(div);
});
if (noCompletados.length) {
const tit = document.createElement('div');
tit.className = 'subsubtitulo';
tit.textContent = 'Pendientes (' + noCompletados.length + ')';
cont.appendChild(tit);
noCompletados.forEach(function(p) {
cont.appendChild(crearCardPendiente(p));
});
}
if (completados.length) {
const titC = document.createElement('div');
titC.className = 'subsubtitulo';
titC.textContent = 'Completados (' + completados.length + ')';
cont.appendChild(titC);
completados.forEach(function(p) {
cont.appendChild(crearCardPendiente(p));
});
}
}
document.getElementById('modalDia').classList.remove('hidden');
}
@@ -83,7 +102,9 @@ function crearCardPendiente(p) {
const vencido = esVencido(p);
const div = document.createElement('div');
div.className = 'pendiente-card ' + (vencido ? 'vencido' : p.urgencia);
let html = '<div class="pendiente-info">' +
let html = '<div class="pendiente-header">' +
'<div class="pendiente-info">' +
'<div><strong>' + escaparHtml(p.descripcion) + '</strong>';
if (vencido) {
html += '<span class="badge-vencido">Vencido</span>';
@@ -91,10 +112,41 @@ function crearCardPendiente(p) {
html += '</div>' +
'<div>' + formatearFecha(p.fecha) + ' - ' + p.estado + ' - Urgencia: ' + p.urgencia + '</div>' +
'</div>' +
'<div class="pendiente-actions">' +
'<div class="menu-wrapper">' +
'<button class="menu-btn" onclick="toggleMenu(' + p.id + ')">\u22EF</button>' +
'<div class="menu-dropdown" id="menu-' + p.id + '">' +
'<button onclick="editarPendiente(' + p.id + ')">Editar</button>' +
'<button onclick="eliminarPendiente(' + p.id + ')">Eliminar</button>' +
'<button class="menu-delete" onclick="eliminarPendiente(' + p.id + ')">Eliminar</button>' +
'</div>' +
'</div>' +
'</div>';
html += '<div class="acceso-rapido">';
html += '<div class="acceso-grupo">';
html += '<span class="acceso-label">Prioridad:</span>';
['alta', 'media', 'baja'].forEach(function(u) {
const activo = p.urgencia === u ? ' activo' : '';
const etiqueta = u.charAt(0).toUpperCase() + u.slice(1);
html += '<button class="quick-btn urgencia-' + u + activo + '" onclick="cambioRapido(' + p.id + ', \'urgencia\', \' + u + '\')">' + etiqueta + '</button>';
});
html += '</div>';
html += '<div class="acceso-grupo">';
html += '<span class="acceso-label">Estado:</span>';
[
{ val: 'pendiente', label: 'Pendiente' },
{ val: 'en progreso', label: 'En proceso' },
{ val: 'completado', label: 'Completado' }
].forEach(function(e) {
const activo = p.estado === e.val ? ' activo' : '';
const cls = e.val.replace(' ', '_');
html += '<button class="quick-btn estado-' + cls + activo + '" onclick="cambioRapido(' + p.id + ', \'estado\', \' + e.val + '\')">' + e.label + '</button>';
});
html += '</div>';
html += '</div>';
div.innerHTML = html;
return div;
}
@@ -105,6 +157,52 @@ function escaparHtml(texto) {
return div.innerHTML;
}
let menuAbiertoId = null;
function toggleMenu(id) {
if (menuAbiertoId === id) {
const m = document.getElementById('menu-' + menuAbiertoId);
if (m) m.classList.remove('show');
menuAbiertoId = null;
return;
}
if (menuAbiertoId !== null) {
const prev = document.getElementById('menu-' + menuAbiertoId);
if (prev) prev.classList.remove('show');
}
const menu = document.getElementById('menu-' + id);
if (menu) {
menu.classList.add('show');
menuAbiertoId = id;
}
}
document.addEventListener('click', function(e) {
if (menuAbiertoId !== null && !e.target.closest('.menu-wrapper')) {
const prev = document.getElementById('menu-' + menuAbiertoId);
if (prev) prev.classList.remove('show');
menuAbiertoId = null;
}
});
async function cambioRapido(id, campo, valor) {
const p = todosPendientes.find(function(x) { return x.id === id; });
if (!p) return;
const body = {
descripcion: p.descripcion,
fecha: p.fecha,
estado: p.estado,
urgencia: p.urgencia
};
body[campo] = valor;
await fetch(API + '/' + id, {
method: 'PUT',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(body)
});
cargarPendientes();
}
document.getElementById('cerrarModal').onclick = function() {
document.getElementById('modalDia').classList.add('hidden');
};
@@ -159,17 +257,23 @@ function renderLista() {
const cont = document.getElementById('listaPendientes');
cont.innerHTML = '';
const vencidos = todosPendientes.filter(function(p) { return esVencido(p); });
const normales = todosPendientes.filter(function(p) { return !esVencido(p); });
const noCompletados = todosPendientes.filter(function(p) { return p.estado !== 'completado'; });
const vencidos = noCompletados.filter(function(p) { return esVencido(p); });
const normales = noCompletados.filter(function(p) { return !esVencido(p); });
if (!todosPendientes.length) {
cont.innerHTML = '<p>No hay pendientes aun.</p>';
if (!noCompletados.length) {
cont.innerHTML = '<p>No hay pendientes.</p>';
return;
}
const titTotal = document.createElement('div');
titTotal.className = 'subtitulo';
titTotal.textContent = 'Pendientes (' + noCompletados.length + ')';
cont.appendChild(titTotal);
if (vencidos.length) {
const titVencidos = document.createElement('div');
titVencidos.className = 'subtitulo';
titVencidos.className = 'subsubtitulo';
titVencidos.textContent = 'Vencidos / Prioritarios (' + vencidos.length + ')';
cont.appendChild(titVencidos);
vencidos.forEach(function(p) {
@@ -179,7 +283,7 @@ function renderLista() {
if (normales.length) {
const titNormales = document.createElement('div');
titNormales.className = 'subtitulo';
titNormales.className = 'subsubtitulo';
titNormales.textContent = 'Pendientes (' + normales.length + ')';
cont.appendChild(titNormales);
normales.forEach(function(p) {
@@ -188,6 +292,24 @@ function renderLista() {
}
}
function renderCompletados() {
const cont = document.getElementById('listaCompletados');
if (!cont) return;
cont.innerHTML = '';
const completados = todosPendientes.filter(function(p) { return p.estado === 'completado'; });
if (!completados.length) {
cont.innerHTML = '<p>No hay completados aun.</p>';
return;
}
const tit = document.createElement('div');
tit.className = 'subtitulo';
tit.textContent = 'Completados (' + completados.length + ')';
cont.appendChild(tit);
completados.forEach(function(p) {
cont.appendChild(crearCardPendiente(p));
});
}
async function editarPendiente(id) {
const p = todosPendientes.find(function(x) { return x.id === id; });
if (!p) return;