150 lines
6.0 KiB
Markdown
150 lines
6.0 KiB
Markdown
|
## 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** 页面自动切换到"周"视图（可选功能）
|