hyb-oa/.trellis/spec/hyb-oa/frontend-react-vite-design.md

Frontend React / Vite / Design

Source Of Truth

UI work must read docs/产品设计规则.md first and align with the Hyinda brand style. For PC/mobile/WeCom pages, add Playwright or visual verification when reasonable.

Rules

• Use existing React/Vite/Tailwind patterns and shared components before adding page-local UI systems.
• PC pages should keep dense but orderly OA layouts: clear header, filters, table/list, status, details and predictable actions.
• Mobile pages must use the unified mobile shell, card/list rows, safe-area and sticky action patterns from the design rules.
• Do not add decorative landing-page styling to operational OA pages.
• Run cd client && npm run typecheck && npm run build for frontend changes.

Frozen / Boundary Items

Frozen modules and Enterprise WeChat-owned HR/attendance entries must be labeled or hidden according to the active Issue; do not silently re-enable them.

• Use the shared WorkspaceNotice pattern for trial boundaries, safety notes, and post-trial capabilities instead of page-local warning blocks.
• Trial-facing PC lists must hide obvious TEST/SMOKE records by default when a page-level toggle exists; the toggle may reveal them for troubleshooting.