user-app: extend the redesign across the account screens

Phase 2, completing the app-wide rollout of the home/product-detail design
language (LESS colour tokens, BEM class names, hairline-bordered cards,
SectionHead, dashed empty states) onto the account side: dashboard, orders,
transactions, profile, login and register.

Reuse over re-implementation: the dashboard's live rate block is now
components/home/RateStrip.vue rather than a second hand-built strip, and
every screen uses components/ui/PageBar.vue for its chrome.

OrderCard and OrderItemCard are restyled to match. OrderItemCard drops its
always-empty note row: our OrderItem schema has no note field (legacy's
per-item note was a real column there; ours is not), so it could only ever
print a dash.

OrdersView swaps ant Tabs for the same scrolling chip rail the rest of the
redesign uses, and its full-screen Modal with hand-written CSS overrides for
a bottom Drawer, matching how every other detail surface opens.

Deleted AppHeader.vue, orphaned once every screen moved to PageBar. Its
shutter animation was driven by transitionFlag, which nothing reads any
more — the router afterEach comment claiming otherwise is corrected rather
than left asserting something untrue, and the now-inert half is flagged in
place. ScrollFetchSearch loses its isFav prop: it gated two empty-state
branches that rendered the identical image, and its only caller
(FavoritesView) now renders its own.

Behaviour is preserved throughout. Orders still reads GET
/customers/:id/orders and filters client-side; transactions still reads
GET /customers/:id/ledger-entries with legacy's CREDIT/DEBIT colour meaning
intact; profile stays read-only over real fields; login keeps the real
customer lookup plus the documented OTP stub; register stays stubbed with
copy that does not claim an account was created.

Verified in a real browser against the running API and native database:
dashboard 4 tiles with a real balance, orders 1 real order card, profile 4
real spec rows, transactions the correct empty state for a customer with no
ledger rows, and login/register confirmed with the session cleared (the
guard bounces a signed-in user away from /login, which is why they needed a
separate pass). No console errors, no horizontal overflow. vue-tsc and vite
build both clean.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
s.esmaeili
2026-09-15 01:34:30 +03:30
co-authored by Claude Opus 5
parent cc62975dd0
commit 0e5f9ccd7b
11 changed files with 1853 additions and 714 deletions
+12 -6
View File
@@ -64,12 +64,18 @@ router.beforeEach((to) => {
else nav.setPgaTransition(undefined);
});
// Ported from legacy router/index.ts:273-286. This hook is what actually
// drives two animations, and its absence was why neither ran:
// 1. cycling transitionFlag false->true replays AppHeader's "shutter" enter
// animation on every navigation;
// 2. setActiveLink moves the bottom-nav GSAP notch + bubble to the current
// tab (it is the ONLY caller of setActiveLink in the whole app).
// Ported from legacy router/index.ts:273-286.
//
// setActiveLink moves the bottom-nav GSAP notch + bubble to the current tab,
// and this hook is its ONLY caller in the whole app — that part is live.
//
// The transitionFlag cycling below used to replay AppHeader's "shutter" enter
// animation. AppHeader was deleted when every screen moved to the redesigned
// components/ui/PageBar.vue, and nothing reads transitionFlag any more, so
// that half is currently inert. It is left in place rather than ripped out
// because transitionStore is still the shared home for this kind of
// page-transition state; flagged here so the next reader doesn't assume it
// still drives a visible animation.
router.afterEach((to) => {
const nav = useNavStore();
const transition = useTransitionStore();