bug修复迭代

docs/superpowers/specs/2026-06-30-page-optimization-design.md

@@ -0,0 +1,30 @@
+# H5 Page Optimization Design
+
+## Goal
+
+Improve the existing hotel business H5 pages as a high-frequency mobile operations tool, keeping the current Vue 3, Vant, and green verification-oriented brand language.
+
+## Direction
+
+Use a practical business-tool polish rather than a marketing redesign. The UI should feel clearer, steadier, and more tactile for staff who repeatedly check orders, scan verification codes, and review events.
+
+## Scope
+
+- Keep the existing route structure, APIs, Vant components, icons, and data flow.
+- Upgrade global design tokens while preserving existing variable names for compatibility.
+- Improve common surfaces: page shell, panels, list cards, buttons, tabs, search, forms, empty states, and fixed actions.
+- Polish key pages: home, order list/detail, event list/create, verify scan/confirm/result, mine, and login.
+- Avoid new dependencies and framework migration.
+
+## Visual System
+
+- Primary tone remains green, with more precise neutrals and status colors.
+- Cards use tighter radius, clearer borders, subtle tinted shadows, and pressed feedback.
+- Typography gains a clearer scale and tabular numeric rendering for order IDs, amounts, and counts.
+- Loading and empty states should use composed surfaces rather than isolated spinners.
+- Mobile constraints target narrow phones first, then the existing 560px page max width.
+
+## Verification
+
+- Run TypeScript/build verification.
+- Start the local dev server and inspect representative pages in a mobile viewport.