78 lines
3.3 KiB
Markdown
78 lines
3.3 KiB
Markdown
|
## MODIFIED Requirements
|
||
|
|
|
||
|
|
### Requirement: Daily trend chart must display expense/income over time
|
||
|
|
The system SHALL render a line chart showing daily transaction totals for the selected time period (week/month/year).
|
||
|
|
|
||
|
|
#### Scenario: Week view shows 7 days
|
||
|
|
- **WHEN** user selects "Week" time period
|
||
|
|
- **THEN** chart displays 7 data points (Mon-Sun) with expense and income lines
|
||
|
|
|
||
|
|
#### Scenario: Month view shows daily trend
|
||
|
|
- **WHEN** user selects "Month" time period
|
||
|
|
- **THEN** chart displays 28-31 data points (one per day) with expense and income lines
|
||
|
|
|
||
|
|
#### Scenario: Year view shows monthly trend
|
||
|
|
- **WHEN** user selects "Year" time period
|
||
|
|
- **THEN** chart displays 12 data points (one per month) with expense and income lines
|
||
|
|
|
||
|
|
#### Scenario: Chart highlights max expense day
|
||
|
|
- **WHEN** user views daily trend
|
||
|
|
- **THEN** the day with highest expense has a highlighted marker
|
||
|
|
|
||
|
|
#### Scenario: Chart supports zooming
|
||
|
|
- **WHEN** user pinches on mobile or scrolls on desktop
|
||
|
|
- **THEN** chart zooms in/out to show more/less detail
|
||
|
|
|
||
|
|
### Requirement: Expense category pie chart must show spending breakdown
|
||
|
|
The system SHALL render a pie chart displaying expense amounts grouped by category for the selected time period.
|
||
|
|
|
||
|
|
#### Scenario: Pie chart shows all expense categories
|
||
|
|
- **WHEN** user has expenses in multiple categories
|
||
|
|
- **THEN** chart displays one slice per category with percentage labels
|
||
|
|
|
||
|
|
#### Scenario: Pie chart uses category colors
|
||
|
|
- **WHEN** categories have custom colors defined
|
||
|
|
- **THEN** chart slices use the corresponding category colors
|
||
|
|
|
||
|
|
#### Scenario: Pie chart shows "Others" for small categories
|
||
|
|
- **WHEN** more than 8 categories exist
|
||
|
|
- **THEN** categories below 3% are grouped into "Others" slice
|
||
|
|
|
||
|
|
#### Scenario: Tapping slice shows category detail
|
||
|
|
- **WHEN** user taps a pie slice
|
||
|
|
- **THEN** app navigates to category detail view with transaction list
|
||
|
|
|
||
|
|
### Requirement: Monthly expense bar chart must compare months
|
||
|
|
The system SHALL render a vertical bar chart comparing expense totals across recent months.
|
||
|
|
|
||
|
|
#### Scenario: Bar chart shows 6 recent months
|
||
|
|
- **WHEN** user views monthly expense card
|
||
|
|
- **THEN** chart displays 6 bars representing the last 6 months
|
||
|
|
|
||
|
|
#### Scenario: Current month bar is highlighted
|
||
|
|
- **WHEN** user views monthly expense card
|
||
|
|
- **THEN** current month's bar uses primary color, previous months use gray
|
||
|
|
|
||
|
|
#### Scenario: Bar height reflects expense amount
|
||
|
|
- **WHEN** a month has higher expenses
|
||
|
|
- **THEN** its bar is proportionally taller
|
||
|
|
|
||
|
|
#### Scenario: Bar shows tooltip with formatted amount
|
||
|
|
- **WHEN** user hovers/taps a bar
|
||
|
|
- **THEN** tooltip displays month name and expense amount formatted as "¥X,XXX.XX"
|
||
|
|
|
||
|
|
### Requirement: Charts must maintain existing responsive behavior
|
||
|
|
The system SHALL ensure all statistics charts adapt to different screen sizes and orientations.
|
||
|
|
|
||
|
|
#### Scenario: Chart scales on narrow screens
|
||
|
|
- **WHEN** screen width is less than 375px
|
||
|
|
- **THEN** chart font sizes scale down proportionally while maintaining readability
|
||
|
|
|
||
|
|
#### Scenario: Chart reflows on orientation change
|
||
|
|
- **WHEN** device orientation changes from portrait to landscape
|
||
|
|
- **THEN** chart re-renders to fill available width within 300ms
|
||
|
|
|
||
|
|
#### Scenario: Chart labels truncate on small screens
|
||
|
|
- **WHEN** category names are longer than 12 characters
|
||
|
|
- **THEN** labels show ellipsis (e.g., "Entertainment..." ) and full text in tooltip
|