Interaktywne zadania Obsidian z Meta Bind i DataviewJS — wybór daty

Interaktywny przegląd zadań w Obsidian według wybranej daty z Meta Bind i DataviewJS

Meta Bind i DataviewJS umożliwiają stworzenie strony z interaktywnym wyborem daty do przeglądania zadań. Użytkownik klika na kalendarz w trybie czytania, wybiera datę — lista aktualizuje się automatycznie. Rozwiązanie wykorzystuje właściwości YAML jako pośrednie przechowywanie między widżetem wprowadzania a skryptem wyjścia.

To eliminuje ręczne edytowanie zapytań Tasks lub Dataview, gdzie data zmienia się w kodzie za każdym razem.

Przygotowanie: instalacja wtyczek i blok YAML

Zainstaluj wtyczki Meta Bind i Dataview przez ustawienia Obsidian. W Dataview włącz JavaScript Queries.

Utwórz plik, na przykład DynamicTasks.md, z blokiem YAML:

---
selected-date: 2025-12-30
---

Początkowa wartość zostanie nadpisana przez widżet.

Widżet Meta Bind do wyboru daty

Pod YAML wstaw:

INPUT[datePicker: selected-date]

W trybie czytania pojawi się kalendarz. Klik otwiera wybór daty, wartość zapisuje się w selected-date.

Skrypt DataviewJS: filtrowanie i renderowanie zadań

Po widżecie dodaj skrypt do wyszukiwania zadań:

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

);

}

Analiza skryptu

• Odczyt daty: dv.current().file.frontmatter["selected-date"] zwraca ciąg YYYY-MM-DD.

• Wyszukiwanie plików: dv.pages('"Work"') skanuje folder. Filtr sprawdza obecność niezakończonych zadań z due na targetDate przez .toISODate().

• Renderowanie: Dla każdego pliku — odznaka-link z stylem CSS i dv.taskList bez grupowania (false). Zamień "Work" na swój folder.

Integracja w pulpicie Canvas

Przeciągnij plik na Canvas — Obsidian utworzy interaktywną kartę. Dostosuj rozmiar. Pracuj bezpośrednio na pulpicie lub klikaj, aby przejść.

Wymagania i cechy

• Składnia Tasks: Używaj emoji 📅 YYYY-MM-DD dla due. Zwykłe pola wyboru bez daty są ignorowane.
• Aktualizacja: DataviewJS uruchamia się ponownie z opóźnieniem ~1 sek po zmianie daty.

Co jest ważne

• Interaktywny datePicker od Meta Bind aktualizuje YAML bez edycji.
• DataviewJS filtruje zadania według dokładnego dopasowania due.toISODate() === targetDate.
• Grupowanie według plików z niestandardowymi odznakami dla kontroli UI.
• Automatyczne renderowanie w Canvas bez dodatkowych wtyczek.
• Nadaje się do sprawdzania obciążenia na przyszłe daty (urlop, negocjacje).

Zalety nad statycznymi zapytaniami

| Podejście | Zmiana daty | Tryb czytania | Autoaktualizacja |

|--------|---------------|--------------|---------------|

| Tasks due on DATE | Ręczne w kodzie | Nie | Nie |

| Dataview due = date() | Ręczne w kodzie | Nie | Nie |

| YAML + Meta Bind + DataviewJS | Klik-kalendarz | Tak | Tak |

Rozwiązanie jest skalowalne: dodaj filtry według tagów lub statusów w .where().

— Editorial Team