feat: 新增视图切换状态管理及颜色/日期工具

- date.js: 新增 startOfWeek, startOfMonth, hhmmToMinutes 辅助函数
- colors.js (新增): 基于 uid 哈希的事件颜色分配, 12 色调色板
- useCalendar.js: 新增 viewMode (edit/month/week) 和 previewDate 状态,
  以及 setViewMode/prevMonth/nextMonth/prevWeek/nextWeek 操作
This commit is contained in:
zikai
2026-07-22 04:04:29 +00:00
parent 50fc8de9eb
commit f4c11bdc3e
3 changed files with 112 additions and 0 deletions

View File

@@ -3,6 +3,7 @@ import { parseICS, serializeICS } from '../lib/ical-io.js'
import { organize as organizeEvents } from '../lib/organize.js'
import { createEvent, cloneEvent } from '../lib/event-factory.js'
import { splitRecurringEvent } from '../lib/split.js'
import { todayISO, addDays, startOfMonth, startOfWeek, parseISODate, pad2 } from '../lib/date.js'
const MAX_HISTORY = 50
@@ -15,6 +16,8 @@ const state = reactive({
redoStack: [],
fileName: null,
dirty: false,
viewMode: 'edit', // 'edit' | 'month' | 'week'
previewDate: todayISO(), // 预览锚定日期 (月预览取当月, 周预览取当周)
})
// ------------------------------------------------------------------ //
@@ -142,6 +145,33 @@ function markSaved() {
state.dirty = false
}
// ------------------------------------------------------------------ //
// 视图切换 / 预览导航
// ------------------------------------------------------------------ //
function setViewMode(mode) {
state.viewMode = mode
}
function prevMonth() {
const { year, month } = parseISODate(startOfMonth(state.previewDate))
const d = new Date(year, month - 2, 1) // month-2 = 上个月 (0 基)
state.previewDate = `${d.getFullYear()}-${pad2(d.getMonth() + 1)}-01`
}
function nextMonth() {
const { year, month } = parseISODate(startOfMonth(state.previewDate))
const d = new Date(year, month, 1) // month = 下个月 (0 基)
state.previewDate = `${d.getFullYear()}-${pad2(d.getMonth() + 1)}-01`
}
function prevWeek() {
state.previewDate = addDays(state.previewDate, -7)
}
function nextWeek() {
state.previewDate = addDays(state.previewDate, 7)
}
// ------------------------------------------------------------------ //
// 计算属性
// ------------------------------------------------------------------ //
@@ -177,5 +207,10 @@ export function useCalendar() {
redo,
serialize,
markSaved,
setViewMode,
prevMonth,
nextMonth,
prevWeek,
nextWeek,
}
}