fix

openspec/changes/archive/2026-02-13-budget-page-v2/specs/budget-time-period-switching/spec.md

@@ -0,0 +1,149 @@
+## ADDED Requirements
+
+### Requirement: 支持周/月/年三种时间段切换
+预算页面 SHALL 支持周度、月度和年度三种时间段切换，每种时间段加载对应的预算数据。
+
+#### Scenario: 切换到周视图
+- **WHEN** 用户切换到周视图
+- **THEN** 页面加载当前周的预算数据（周一到周日）
+- **AND** 页头显示当前周的描述（如"2024年3月第1周"）
+
+#### Scenario: 切换到月视图
+- **WHEN** 用户切换到月视图
+- **THEN** 页面加载当前月的预算数据
+- **AND** 页头显示当前年月（如"2024年3月"）
+
+#### Scenario: 切换到年视图
+- **WHEN** 用户切换到年视图
+- **THEN** 页面加载当前年的预算数据（全年汇总）
+- **AND** 页头显示当前年份（如"2024年"）
+
+### Requirement: 周度视图以周一为起始日
+周度视图 SHALL 以周一作为一周的开始，周日作为结束。
+
+#### Scenario: 计算当前周的开始日期
+- **WHEN** 今天是 2024年3月13日（星期三）
+- **THEN** 当前周的开始日期是 2024年3月11日（星期一）
+
+#### Scenario: 跨月的周视图
+- **WHEN** 当前周跨越两个月（如 3月30日 到 4月5日）
+- **THEN** 页面正确加载这 7 天的预算数据
+
+### Requirement: 月度视图加载整月数据
+月度视图 SHALL 加载选中月份从第一天到最后一天的预算数据。
+
+#### Scenario: 加载当前月数据
+- **WHEN** 用户选择 2024年3月
+- **THEN** 页面加载 2024年3月1日 到 2024年3月31日 的预算数据
+
+#### Scenario: 加载不同月份长度
+- **WHEN** 用户选择 2024年2月（闰年）
+- **THEN** 页面加载 2024年2月1日 到 2024年2月29日 的预算数据
+
+### Requirement: 年度视图加载全年数据
+年度视图 SHALL 加载选中年份从1月到12月的预算数据汇总。
+
+#### Scenario: 加载当前年数据
+- **WHEN** 用户选择 2024年
+- **THEN** 页面加载 2024年1月1日 到 2024年12月31日 的预算数据
+
+### Requirement: 时间段切换时自动刷新数据
+每次切换时间段时，页面 SHALL 自动重新加载对应的预算数据。
+
+#### Scenario: 从月视图切换到周视图
+- **WHEN** 用户从月视图切换到周视图
+- **THEN** 页面显示加载状态
+- **AND** 自动加载当前周的预算数据
+- **AND** 更新所有统计卡片和列表
+
+#### Scenario: 从周视图切换到年视图
+- **WHEN** 用户从周视图切换到年视图
+- **THEN** 页面显示加载状态
+- **AND** 自动加载当前年的预算数据
+- **AND** 更新所有统计卡片和列表
+
+### Requirement: 切换时间周期时同步更新时间段
+使用页头左右箭头或滑动手势切换时间周期时，SHALL 根据当前时间段类型（周/月/年）切换到对应的上一个或下一个周期。
+
+#### Scenario: 月视图下点击左箭头
+- **WHEN** 当前是月视图，显示 2024年3月
+- **AND** 用户点击页头左箭头
+- **THEN** 切换到 2024年2月
+- **AND** 加载 2024年2月 的预算数据
+
+#### Scenario: 周视图下点击左箭头
+- **WHEN** 当前是周视图，显示 2024年3月11日-17日（第11周）
+- **AND** 用户点击页头左箭头
+- **THEN** 切换到 2024年3月4日-10日（第10周）
+- **AND** 加载该周的预算数据
+
+#### Scenario: 年视图下点击左箭头
+- **WHEN** 当前是年视图，显示 2024年
+- **AND** 用户点击页头左箭头
+- **THEN** 切换到 2023年
+- **AND** 加载 2023年 的预算数据
+
+#### Scenario: 右滑手势切换到上一个周期
+- **WHEN** 用户在内容区域向右滑动超过 50px
+- **THEN** 根据当前时间段类型（周/月/年）切换到上一个周期
+- **AND** 页面数据自动刷新
+
+### Requirement: 不能切换到未来的时间周期
+页面 SHALL 禁止用户切换到未来的时间周期（周/月/年）。
+
+#### Scenario: 当前月禁用下一月
+- **WHEN** 当前是 2024年3月，且今天是 2024年3月15日
+- **THEN** 页头右箭头不可点击
+
+#### Scenario: 当前周禁用下一周
+- **WHEN** 当前是本周（2024年3月11日-17日），且今天在这一周内
+- **THEN** 页头右箭头不可点击
+
+#### Scenario: 当前年禁用下一年
+- **WHEN** 当前是 2024年，且今天是 2024年3月15日
+- **THEN** 页头右箭头不可点击
+
+#### Scenario: 左滑到当前周期时不切换
+- **WHEN** 用户在当前月/周/年向左滑动
+- **THEN** 不切换到下一个周期
+
+### Requirement: 日期选择器根据时间段类型调整
+点击页头日期打开的日期选择器，SHALL 根据当前时间段类型（月/年）显示对应的选择模式。
+
+#### Scenario: 月视图下打开年月选择器
+- **WHEN** 当前是月视图
+- **AND** 用户点击页头日期
+- **THEN** 打开年月选择器（columns-type: ['year', 'month']）
+
+#### Scenario: 年视图下打开年份选择器
+- **WHEN** 当前是年视图
+- **AND** 用户点击页头日期
+- **THEN** 打开年份选择器（type: 'year'）
+
+#### Scenario: 周视图下打开年月选择器
+- **WHEN** 当前是周视图
+- **AND** 用户点击页头日期
+- **THEN** 打开年月选择器（选择月份后自动定位到当月的当前周）
+
+### Requirement: 日期选择器确认后更新页面数据
+用户在日期选择器中选择日期并确认后，页面 SHALL 自动更新到选中的时间周期并刷新数据。
+
+#### Scenario: 选择历史月份
+- **WHEN** 用户在月视图下打开日期选择器
+- **AND** 选择 2023年12月 并确认
+- **THEN** 页面切换到 2023年12月
+- **AND** 加载 2023年12月 的预算数据
+
+#### Scenario: 选择未来月份时显示提示
+- **WHEN** 用户在月视图下打开日期选择器
+- **AND** 尝试选择未来的月份（如 2024年4月，今天是 2024年3月15日）
+- **THEN** 显示提示"不能选择未来的月份"
+- **AND** 不切换页面日期
+
+### Requirement: 时间段类型持久化（可选）
+页面 SHOULD 在用户离开后记住上次选择的时间段类型（周/月/年），下次访问时自动恢复。
+
+#### Scenario: 记住上次选择的时间段
+- **WHEN** 用户选择了"周"视图
+- **AND** 离开预算页面，然后返回
+- **THEN** 页面自动切换到"周"视图（可选功能）