Both expert screens are built in user-app and user-app-v2, with byte-identical
template and script and a per-app style block only — verified by diffing
everything above <style>:
ChildOrdersView "سفارش مشتریان" — legacy ChildOrders.vue. Keeps the
reference's title, search, infinite paging, and per-card item count, total
weight, customer name and the fixed «تحویل مسئول فروش» chip (the endpoint
only returns that status, ApiMobileController:766).
CustomerChoiceView "لیست مشتریان" — legacy customerChoice.vue. Keeps its
title, per-search re-query and the reference's choice to LIST inactive
customers (its active() scope is commented out at :187).
Reachable from inside the app, not just by URL: routes carry the reference's own
paths and names, the dashboard grows the two entries only for an expert (v1 as
tiles, v2 as its own rows), and a router guard sends an ordinary customer back
to their dashboard. None of that is relied on for safety — the server scopes
both endpoints on the AdminUser id in the token and answers 403 otherwise.
Not ported, both recorded in D21: the act-as api_token minting (:197-201) and
the child-order edit drawer, which recomputed an order's money from client-sent
values. The card opens a read-only summary instead.
APP-02 fixed: user-app-v2 gained getHomeSlider and now prefers admin-configured
slides, keeping its category-derived hero as the fallback and its own design.
Session stores stay byte-identical across the apps.
build 5/5, jest 45/45, expert login 36/36, apps smoke 43/43, typecheck clean.
[ref: henza_pwa/src/views/user/src/components/ChildOrders.vue, customerChoice.vue]
[ref: henza_pwa/src/router/index.ts:171-188]
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
126 lines
6.0 KiB
TypeScript
126 lines
6.0 KiB
TypeScript
import { createRouter, createWebHistory } from 'vue-router';
|
|
import { useSessionStore } from '../stores/session';
|
|
import { useNavStore } from '../stores/navStore';
|
|
import { useTransitionStore } from '../stores/transitionStore';
|
|
|
|
// Legacy lazy-loaded every route component (`component: () => import(...)`) so
|
|
// the initial bundle only carries the entry route. Matched here.
|
|
export const router = createRouter({
|
|
history: createWebHistory(),
|
|
// Ported from legacy router/index.ts:225-237 — restore saved scroll on
|
|
// back/forward, otherwise jump to top on every navigation.
|
|
scrollBehavior(_to, _from, savedPosition) {
|
|
if (savedPosition) return savedPosition;
|
|
return { top: 0 };
|
|
},
|
|
routes: [
|
|
// legacy's actual home route is /home (name: 'home'), not '/' — matched here.
|
|
{ path: '/home', name: 'home', component: () => import('../views/HomeView.vue') },
|
|
{
|
|
path: '/product/:id',
|
|
name: 'singleProduct',
|
|
component: () => import('../components/product/SingleProduct.vue'),
|
|
props: true,
|
|
meta: { layout: 'FullPage' },
|
|
},
|
|
{ path: '/newest', name: 'newestProduct', component: () => import('../views/NewestView.vue'), meta: { layout: 'FullPage' } },
|
|
{ path: '/cart', name: 'cart', component: () => import('../views/CartView.vue') },
|
|
{ path: '/login', name: 'login', component: () => import('../views/user/LoginRegisterView.vue'), meta: { layout: 'FullPage' } },
|
|
{ path: '/user', name: 'userPage::hasSubRoute', component: () => import('../views/user/DashboardView.vue') },
|
|
{ path: '/orders', name: 'ordersList', component: () => import('../views/user/OrdersView.vue'), meta: { requiresAuth: true } },
|
|
{
|
|
path: '/transactions',
|
|
name: 'transactionsList',
|
|
component: () => import('../views/user/TransactionsView.vue'),
|
|
meta: { requiresAuth: true },
|
|
},
|
|
{ path: '/profile', name: 'profileData', component: () => import('../views/user/ProfileView.vue'), meta: { requiresAuth: true } },
|
|
{ path: '/favorites', name: 'favoritesList', component: () => import('../views/user/FavoritesView.vue'), meta: { requiresAuth: true } },
|
|
// D21 — the sales expert's two screens. Reference paths and names kept
|
|
// (henza_pwa router/index.ts:171-188). requiresExpert is enforced by the
|
|
// guard below AND by the server, which scopes both endpoints on the
|
|
// AdminUser id in the token and answers 403 for anyone else.
|
|
{
|
|
path: '/ChildOrder',
|
|
name: 'ChildOrder',
|
|
component: () => import('../views/expert/ChildOrdersView.vue'),
|
|
meta: { title: 'سفارش مشتریان', layout: 'FullPage', requiresAuth: true, requiresExpert: true },
|
|
},
|
|
{
|
|
path: '/customerChoice',
|
|
name: 'customerChoice',
|
|
component: () => import('../views/expert/CustomerChoiceView.vue'),
|
|
meta: { title: 'انتخاب مشتری', layout: 'FullPage', requiresAuth: true, requiresExpert: true },
|
|
},
|
|
{ path: '/notifications', name: 'notifications', component: () => import('../views/user/NotificationsView.vue') },
|
|
{ path: '/search', name: 'search', component: () => import('../views/search/SearchView.vue') },
|
|
{ path: '/collection/:id?', name: 'collection', component: () => import('../views/search/CollectionView.vue') },
|
|
// legacy redirects any unmatched path (including '/') to the home route by name.
|
|
{ path: '/', redirect: { name: 'home' } },
|
|
{ path: '/:pathMatch(.*)*', redirect: { name: 'home' } },
|
|
],
|
|
});
|
|
|
|
// Ported from legacy's main router guard: redirects an already-logged-in
|
|
// user away from /login, and blocks unauthenticated access to routes that
|
|
// require a session (legacy blocked ordersList/transactionsList/profileData/
|
|
// favoritesList/completeProfile the same way).
|
|
router.beforeEach((to) => {
|
|
const session = useSessionStore();
|
|
const nav = useNavStore();
|
|
|
|
if (to.name === 'login' && session.isLoggedIn) {
|
|
return { name: 'home' };
|
|
}
|
|
if (to.meta.requiresAuth && !session.isLoggedIn) {
|
|
return { name: 'login', query: { redirect: to.fullPath } };
|
|
}
|
|
|
|
// D21 — an ordinary customer typing the URL is sent back to their
|
|
// dashboard. This is convenience, not security: the server refuses both
|
|
// expert endpoints for a non-expert token regardless of what the app does.
|
|
if (to.meta.requiresExpert && !session.isSalesExpert) {
|
|
return { name: 'userPage::hasSubRoute' };
|
|
}
|
|
|
|
// legacy router/index.ts:268-270 — the product page slides down into view.
|
|
if (to.name === 'singleProduct') nav.setPgaTransition('slideDown');
|
|
else nav.setPgaTransition(undefined);
|
|
});
|
|
|
|
// 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();
|
|
|
|
transition.setTransitionFlag(false);
|
|
transition.setTransitionEnded(false);
|
|
setTimeout(() => {
|
|
transition.setTransitionFlag(true);
|
|
}, 100);
|
|
|
|
// Unconditional on both branches: this hook is the single source of truth for
|
|
// tab-bar visibility. A screen may hide the bar for its own reasons while it
|
|
// is open (SearchView does, for its filter sheet), and this is what clears
|
|
// that override on the way out — the old `if (!nav.showNav)` guard made the
|
|
// same write, just phrased as if something else might own the flag.
|
|
const route = nav.navBarRoutes.find((x) => to.name === x.name);
|
|
if (route) {
|
|
nav.setActiveLink(route.index);
|
|
nav.setNavVisibility(true);
|
|
} else {
|
|
nav.setNavVisibility(false);
|
|
}
|
|
});
|