Vista Interactiva de Tareas en Obsidian por Fecha Seleccionada con Meta Bind y DataviewJS
Meta Bind y DataviewJS permiten crear una página con un selector de fechas interactivo para visualizar tareas. En modo lectura, los usuarios hacen clic en un calendario, seleccionan una fecha y la lista se actualiza automáticamente. Esta solución utiliza propiedades YAML como almacenamiento intermedio entre el widget de entrada y el script de salida.
Esto elimina la edición manual de consultas de Tareas o Dataview, donde la fecha debe cambiarse en el código cada vez.
Configuración: Instalar Complementos y Bloque YAML
Instala los complementos Meta Bind y Dataview desde la configuración de Obsidian. En Dataview, habilita Consultas JavaScript.
Crea un archivo, por ejemplo, DynamicTasks.md, con un bloque YAML:
---
selected-date: 2025-12-30
---
El valor inicial será sobrescrito por el widget.
Widget Meta Bind para Selección de Fecha
Debajo del YAML, inserta:
INPUT[datePicker: selected-date]
En modo lectura, aparece un calendario. Al hacer clic se abre un selector de fecha, y el valor se guarda en selected-date.
Script DataviewJS: Filtrado y Renderizado de Tareas
Después del widget, añade un script para buscar tareas:
const targetDate = dv.current().file.frontmatter["selected-date"];
const pages = dv.pages('"Work"')
.where(p => p.file.tasks
.where(t => !t.completed && t.due && t.due.toISODate() === targetDate)
.length > 0);
for (let page of pages) {
dv.el("div", dv.fileLink(page.file.path, false), {
attr: {
style: "display:inline-block; margin:8px 0 4px 0; padding:3px 8px; border-radius:6px; background:#e0f0ff; color:#0366d6; font-weight:500;"
}
});
dv.taskList(
page.file.tasks
.where(t => !t.completed && t.due && t.due.toISODate() === targetDate),
false
);
}
Desglose del Script
- Lectura de la fecha:
dv.current().file.frontmatter["selected-date"]devuelve una cadenaYYYY-MM-DD.
- Búsqueda de archivos:
dv.pages('"Work"')escanea la carpeta. El filtro verifica tareas incompletas condueentargetDatemediante.toISODate().
- Renderizado: Para cada archivo, un enlace con estilo CSS y
dv.taskListsin agrupación (false). Reemplaza"Work"con tu carpeta.
Integración en un Panel de Canvas
Arrastra el archivo a un Canvas; Obsidian crea una tarjeta interactiva. Ajusta el tamaño. Trabaja directamente en el panel o haz clic para navegar.
Requisitos y Características
- Sintaxis de tareas: Usa el emoji
📅 YYYY-MM-DDparadue. Las casillas de verificación sin fechas se ignoran. - Actualizaciones: DataviewJS se reinicia con un retraso de ~1 segundo tras cambiar la fecha.
Puntos Clave
- El datePicker interactivo de Meta Bind actualiza YAML sin edición manual.
- DataviewJS filtra tareas por coincidencia exacta
due.toISODate() === targetDate. - Agrupación por archivos con insignias personalizadas para control de interfaz.
- Renderizado automático en Canvas sin complementos adicionales.
- Adecuado para verificar carga de trabajo en fechas futuras (vacaciones, reuniones).
Ventajas sobre Consultas Estáticas
| Enfoque | Cambiar Fecha | Modo Lectura | Actualización Automática |
|----------|---------------|--------------|-------------|
| Tareas due on DATE | Manual en código | No | No |
| Dataview due = date() | Manual en código | No | No |
| YAML + Meta Bind + DataviewJS | Calendario por clic | Sí | Sí |
La solución es escalable: añade filtros para etiquetas o estados en .where().
— Editorial Team
Aún no hay comentarios.