feat: UI 系统中心化 + 趋势图重构 + 法律文档 H5 上线
- UI 系统: 新增 design_tokens / module_visuals / app_buttons / app_status_badge / app_toast / ai_content 六个共享模块; 28 个页面接入, SnackBar 全部替换为 AppToast - 趋势图: 直线折线 + 渐变填充 + 阴影; 去网格线; X 轴日+月份分隔; Y 轴整数刻度最多 4 个; 点击数据点/录入记录显示上方浮层, 选中点变实心 - 法律文档 H5: 后端 wwwroot 托管隐私政策/服务协议/关于/个人信息收集清单/第三方 SDK 清单 + 索引页; Program.cs 启用 UseDefaultFiles + UseStaticFiles - 其他: auth_provider 登录流程调整; api_client IP 适配; 主页智能体栏间距优化
This commit is contained in:
96
docs/superpowers/plans/2026-07-06-ui-system-first-pass.md
Normal file
96
docs/superpowers/plans/2026-07-06-ui-system-first-pass.md
Normal file
@@ -0,0 +1,96 @@
|
||||
# UI System First Pass Implementation Plan
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** Build the first pass of the app-wide UI system and migrate the highest-impact frontend surfaces to the agreed typography, color, icon, layout, button, feedback, and AI content rules.
|
||||
|
||||
**Architecture:** Centralize design decisions in token and common widget files, then migrate pages by replacing local hardcoded visuals with shared module visuals and components. Keep this pass focused on visible consistency and maintainability without adding the full accessibility-mode feature yet.
|
||||
|
||||
**Tech Stack:** Flutter, Riverpod, shadcn_ui Lucide icons, flutter_markdown.
|
||||
|
||||
---
|
||||
|
||||
### Task 1: Design Tokens And Common Widgets
|
||||
|
||||
**Files:**
|
||||
- Modify: `health_app/lib/core/app_colors.dart`
|
||||
- Modify: `health_app/lib/core/app_theme.dart`
|
||||
- Create: `health_app/lib/core/app_design_tokens.dart`
|
||||
- Create: `health_app/lib/core/app_module_visuals.dart`
|
||||
- Create: `health_app/lib/widgets/app_buttons.dart`
|
||||
- Create: `health_app/lib/widgets/app_status_badge.dart`
|
||||
- Create: `health_app/lib/widgets/app_toast.dart`
|
||||
- Create: `health_app/lib/widgets/ai_content.dart`
|
||||
|
||||
- [ ] Add typography, spacing, radius, shadow, module color, and module icon tokens.
|
||||
- [ ] Add reusable gradient-outline button and module-aware buttons.
|
||||
- [ ] Add top-center toast helper for light feedback.
|
||||
- [ ] Add shared AI Markdown renderer and plain text cleaner.
|
||||
- [ ] Run `flutter analyze`.
|
||||
|
||||
### Task 2: AI Conversation And Cards
|
||||
|
||||
**Files:**
|
||||
- Modify: `health_app/lib/pages/home/widgets/chat_messages_view.dart`
|
||||
- Modify: `health_app/lib/pages/home/home_page.dart`
|
||||
|
||||
- [ ] Apply shared AI content renderer to AI bubbles.
|
||||
- [ ] Normalize user bubble, AI bubble, attachments, AI generated note, and Markdown typography.
|
||||
- [ ] Update intelligent agent visuals to use shared module icons and colors, including `dumbbell` for exercise and `pill` for medication.
|
||||
- [ ] Preserve gradient-outline white-background buttons in agent welcome cards.
|
||||
- [ ] Keep today health card gradient outline and ensure empty medication windows still show a light status.
|
||||
- [ ] Run `flutter analyze lib/pages/home/widgets/chat_messages_view.dart lib/pages/home/home_page.dart`.
|
||||
|
||||
### Task 3: Sidebar
|
||||
|
||||
**Files:**
|
||||
- Modify: `health_app/lib/widgets/health_drawer.dart`
|
||||
|
||||
- [ ] Keep current structure: user header, health dashboard, common functions, conversation records.
|
||||
- [ ] Convert user header to no-frame layout with settings on the right.
|
||||
- [ ] Keep health dashboard as a light panel.
|
||||
- [ ] Convert common functions to a two-column light matrix without heavy per-item cards.
|
||||
- [ ] Keep conversation records as lightweight rows with summary left and date right.
|
||||
- [ ] Run `flutter analyze lib/widgets/health_drawer.dart`.
|
||||
|
||||
### Task 4: Core Management Pages
|
||||
|
||||
**Files:**
|
||||
- Modify: `health_app/lib/widgets/enterprise_widgets.dart`
|
||||
- Modify: `health_app/lib/pages/medication/medication_list_page.dart`
|
||||
- Modify: `health_app/lib/pages/medication/medication_checkin_page.dart`
|
||||
- Modify: `health_app/lib/pages/remaining_pages.dart`
|
||||
- Modify: `health_app/lib/pages/report/report_pages.dart`
|
||||
- Modify: `health_app/lib/pages/report/ai_analysis_page.dart`
|
||||
- Modify: `health_app/lib/pages/notifications/notification_center_page.dart`
|
||||
|
||||
- [ ] Update summary panels to avoid repeating page titles and reduce icon emphasis.
|
||||
- [ ] Apply module colors and Lucide icons to medication, exercise, reports, and notifications.
|
||||
- [ ] Apply shared AI content renderer to report AI text to prevent visible raw Markdown markers such as `**`.
|
||||
- [ ] Normalize list title/subtitle/tag sizes and row heights.
|
||||
- [ ] Run targeted `flutter analyze` on modified files.
|
||||
|
||||
### Task 5: Profile, Health Archive, Diet, Device
|
||||
|
||||
**Files:**
|
||||
- Modify: `health_app/lib/pages/profile/profile_page.dart`
|
||||
- Modify: `health_app/lib/pages/remaining_pages.dart`
|
||||
- Modify: `health_app/lib/pages/diet/diet_capture_page.dart`
|
||||
- Modify: `health_app/lib/pages/device/device_management_page.dart`
|
||||
- Modify: `health_app/lib/widgets/ble_sync_dialog.dart`
|
||||
|
||||
- [ ] Use two-column short-field layout where appropriate in profile/health archive surfaces already in scope.
|
||||
- [ ] Apply module tokens to diet and device surfaces.
|
||||
- [ ] Improve Bluetooth/device panels with shared radius, typography, and module colors.
|
||||
- [ ] Replace obvious bottom SnackBar style feedback in touched flows with top-center toast where low-risk.
|
||||
- [ ] Run targeted `flutter analyze` on modified files.
|
||||
|
||||
### Task 6: Full Verification
|
||||
|
||||
**Files:**
|
||||
- Test: `health_app`
|
||||
|
||||
- [ ] Run `flutter analyze`.
|
||||
- [ ] If available and practical, run a smoke test or build command for the Flutter app.
|
||||
- [ ] Summarize changed files and any deferred surfaces.
|
||||
|
||||
Reference in New Issue
Block a user