diff --git a/src/lib/components/admin/DatePicker.svelte b/src/lib/components/admin/DatePicker.svelte index 615bc00..e2cd769 100644 --- a/src/lib/components/admin/DatePicker.svelte +++ b/src/lib/components/admin/DatePicker.svelte @@ -9,22 +9,25 @@ let isOpen = $state(false); - let displayDate = $state(new Date()); + let currentMonth = $state(new Date().getMonth()); + let currentYear = $state(new Date().getFullYear()); $effect(() => { - if (value) { - const parsed = new Date(value); - if (!isNaN(parsed.getTime())) { - displayDate = parsed; + if (isOpen) { + if (value) { + const parsed = new Date(value); + if (!isNaN(parsed.getTime())) { + currentMonth = parsed.getMonth(); + currentYear = parsed.getFullYear(); + } + } else { + const now = new Date(); + currentMonth = now.getMonth(); + currentYear = now.getFullYear(); } - } else { - displayDate = new Date(); } }); - let currentMonth = $state(displayDate.getMonth()); - let currentYear = $state(displayDate.getFullYear()); - let container: HTMLDivElement; function handleOutsideClick(e: MouseEvent) { @@ -66,6 +69,9 @@ let daysInMonth = $derived(new Date(currentYear, currentMonth + 1, 0).getDate()); let firstDayOfWeek = $derived(new Date(currentYear, currentMonth, 1).getDay()); // 0 is Sunday + let emptyDays = $derived(Array.from({ length: firstDayOfWeek }).map((v, i) => i)); + let monthDays = $derived(Array.from({ length: daysInMonth }).map((v, i) => i + 1)); + const weekDays = ['日', '一', '二', '三', '四', '五', '六']; @@ -100,16 +106,15 @@
- {#each weekDays as wd} + {#each weekDays as wd (wd)}
{wd}
{/each} - {#each Array(firstDayOfWeek) as _} + {#each emptyDays as i (i)}
{/each} - {#each Array(daysInMonth) as _, i} - {@const day = i + 1} + {#each monthDays as day (day)} {@const isSelected = value === `${currentYear}-${String(currentMonth + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`}