diff --git a/src/router/index.ts b/src/router/index.ts index 1ddc069..9bb4099 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -1,13 +1,38 @@ import { createRouter, createWebHistory } from 'vue-router' +import { useGenerateStore } from '@/stores/modules/generate' /** * 路由缓存机制: * 1. 设置路由的meta属性为{ cache: true },表示需要缓存 * 2. App.vue中使用RouteCache组件,通过路由的name来进行匹配 * 3. 路由的name默认是文件名,如果文件名与name不一致,通过defineOptions({ name: 'componentName' })来设置 + * + * 自定义验证规则: + * meta:{ verify: ()=> boolean || string } + * 1. boolean true 跳转 false 不跳转 + * 2. string 跳转的路由path */ - +/** 验证id + * @param num 验证id的数量1-5 + * 1. 顾客id + * 2. 进店记录id + * 3. 服装id + * 4. 模特照片id + * 5. 原始试穿id-优先AI魔改 + * @returns boolean + */ +const VerifyIDs = (num: number) => { + const ids = [ + !!useGenerateStore().customerId, + !!useGenerateStore().visitRecordId, + !!useGenerateStore().styleId, + // !!useGenerateStore().modelPhotoId, + true, + !!useGenerateStore().originalTryOnId, + ]; + return ids.splice(0, num).every(id => id) ? true : "/stylist/customer"; +} const router = createRouter({ history: createWebHistory('/'), // history: createWebHistory(import.meta.env.VITE_APP_URL), @@ -45,22 +70,25 @@ const router = createRouter({ { path: 'index', name: 'index', - component: () => import('@/views/stylist/index.vue') + component: () => import('@/views/stylist/index.vue'), + meta: { verify: ()=> VerifyIDs(2) } }, { path: 'sex', name: 'sex', - component: () => import('@/views/stylist/sex.vue') + component: () => import('@/views/stylist/sex.vue'), + meta: { verify: ()=> VerifyIDs(2) } }, { path: 'dressfor', name: 'dressfor', - component: () => import('@/views/stylist/dressfor.vue') + component: () => import('@/views/stylist/dressfor.vue'), + meta: { verify: ()=> VerifyIDs(2) } }, { path: 'customer', name: 'customer', - component: () => import('@/views/stylist/customer.vue') + component: () => import('@/views/stylist/customer.vue'), } ] }, @@ -68,7 +96,7 @@ const router = createRouter({ path: '/asistant', name: 'asistant', component: () => import('../views/asistant/index.vue'), - meta: { cache: true } + meta: { cache: true, verify: ()=> VerifyIDs(2) } }, { path: '/workshop', @@ -83,57 +111,67 @@ const router = createRouter({ path: '/workshop/selectStyle', name: 'SelectStyle', component: () => import('../views/Workshop/selectStyle.vue'), + meta: { verify: ()=> VerifyIDs(2) } }, { path: '/workshop/selectModel', name: 'SelectModel', - component: () => import('../views/Workshop/selectModel.vue') + component: () => import('../views/Workshop/selectModel.vue'), + meta: { verify: ()=> VerifyIDs(3) } }, { path: '/workshop/product', name: 'Product', - component: () => import('../views/Workshop/product.vue') + component: () => import('../views/Workshop/product.vue'), + meta: { verify: ()=> VerifyIDs(4) } }, { // 上传照片1 path: '/workshop/uploadFace', name: 'uploadFace', - component: () => import('../views/Workshop/uploadFace1.vue') + component: () => import('../views/Workshop/uploadFace1.vue'), + meta: { verify: ()=> VerifyIDs(5) } }, { // 上传照片2 path: '/workshop/uploadFace2', name: 'uploadFace2', - component: () => import('../views/Workshop/uploadFace2.vue') + component: () => import('../views/Workshop/uploadFace2.vue'), + meta: { verify: ()=> VerifyIDs(5) } }, { // 自定义创作 path: '/workshop/customize', name: 'customize', - component: () => import('../views/Workshop/customize.vue') + component: () => import('../views/Workshop/customize.vue'), + meta: { verify: ()=> VerifyIDs(5) } }, { // library path: '/workshop/library', name: 'library', - component: () => import('../views/Workshop/library.vue') + component: () => import('../views/Workshop/library.vue'), + meta: { verify: ()=> VerifyIDs(2) } }, { path: '/workshop/profile', name: 'profile', - component: () => import('../views/Workshop/profile.vue') + component: () => import('../views/Workshop/profile.vue'), + meta: { verify: ()=> VerifyIDs(1) } }, { // creation path: '/workshop/creation', name: 'creation', - component: () => import('../views/Workshop/creation/index.vue') + component: () => import('../views/Workshop/creation/index.vue'), + meta: { verify: ()=> VerifyIDs(2) } }, { // 完成创建 path: '/workshop/end', name: 'end', - component: () => import('../views/Workshop/end.vue') + component: () => import('../views/Workshop/end.vue'), + meta: { verify: ()=> VerifyIDs(2) } } ] } diff --git a/src/router/router-config.ts b/src/router/router-config.ts index 3fdf1ac..2bab148 100644 --- a/src/router/router-config.ts +++ b/src/router/router-config.ts @@ -5,10 +5,20 @@ const whiteList = ['/login'] console.log(whiteList) router.beforeEach((to, from, next) => { - next() + const verify = to.meta?.verify; + if (typeof verify === 'function') { + let res = verify() + if (res === false) { + return next(false) + } else if (typeof res === 'string') { + console.log(res) + return next({ path: res }) + } + } + next() }) router.afterEach(() => { - // finish progress bar - // NProgress.done() + // finish progress bar + // NProgress.done() }) diff --git a/src/views/Workshop/product.vue b/src/views/Workshop/product.vue index 6898005..022d94b 100644 --- a/src/views/Workshop/product.vue +++ b/src/views/Workshop/product.vue @@ -179,6 +179,7 @@ const { isLoading } = toRefs(data); width: 100%; height: 100%; object-fit: contain; + display: block; } > .operation{ position: absolute;