mirror of
https://github.com/fantastic-admin/basic.git
synced 2026-10-06 18:13:28 +08:00
fix: 修复后端返回路由页面无法正常显示
This commit is contained in:
Hooray
@@ -23,7 +23,7 @@ export default defineFakeRoute([
|
||||
component: 'Layout',
|
||||
name: 'multilevelMenuExample',
|
||||
meta: {
|
||||
title: 'route.multimenu.root',
|
||||
title: '多级导航',
|
||||
icon: 'heroicons-solid:menu-alt-3',
|
||||
},
|
||||
children: [
|
||||
@@ -33,14 +33,14 @@ export default defineFakeRoute([
|
||||
name: 'multilevelMenuExample1',
|
||||
component: 'multilevel_menu_example/page.vue',
|
||||
meta: {
|
||||
title: 'route.multimenu.page',
|
||||
title: '导航1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'level2',
|
||||
name: 'multilevelMenuExample2',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.root',
|
||||
title: '导航2',
|
||||
},
|
||||
children: [
|
||||
// 次导航（三级路由）
|
||||
@@ -49,14 +49,14 @@ export default defineFakeRoute([
|
||||
name: 'multilevelMenuExample2-1',
|
||||
component: 'multilevel_menu_example/level2/page.vue',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.page',
|
||||
title: '导航2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'level3',
|
||||
name: 'multilevelMenuExample2-2',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.level3.root',
|
||||
title: '导航2-2',
|
||||
},
|
||||
children: [
|
||||
// 次导航（四级路由）
|
||||
@@ -65,172 +65,13 @@ export default defineFakeRoute([
|
||||
name: 'multilevelMenuExample2-2-1',
|
||||
component: 'multilevel_menu_example/level2/level3/page1.vue',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.level3.page1',
|
||||
title: '导航2-2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'page2',
|
||||
name: 'multilevelMenuExample2-2-2',
|
||||
component: 'multilevel_menu_example/level2/level3/page2.vue',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.level3.page2',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/permission_example',
|
||||
component: 'Layout',
|
||||
name: 'permissionExample',
|
||||
meta: {
|
||||
title: 'route.permission',
|
||||
icon: 'ri:shield-keyhole-line',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'permissionExampleIndex',
|
||||
component: 'permission_example/index.vue',
|
||||
meta: {
|
||||
title: 'route.permission',
|
||||
menu: false,
|
||||
breadcrumb: false,
|
||||
activeMenu: '/permission_example',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'test',
|
||||
name: 'permissionExampleTest',
|
||||
component: 'permission_example/test.vue',
|
||||
meta: {
|
||||
title: '测试页面',
|
||||
auth: ['permission.browse'],
|
||||
menu: false,
|
||||
breadcrumb: false,
|
||||
activeMenu: '/permission_example',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
meta: {
|
||||
title: '页面',
|
||||
icon: 'ri:pages-line',
|
||||
auth: 'permission.browse',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '/pages_example/general',
|
||||
component: 'Layout',
|
||||
name: 'pagesExampleGeneral',
|
||||
meta: {
|
||||
title: '通用',
|
||||
icon: 'ri:function-line',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'manager',
|
||||
name: 'pagesExampleGeneralManager',
|
||||
meta: {
|
||||
title: '管理员管理',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
name: 'pagesExampleGeneralManagerList',
|
||||
component: 'pages_example/manager/list.vue',
|
||||
meta: {
|
||||
title: '管理员列表',
|
||||
menu: false,
|
||||
breadcrumb: false,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'detail',
|
||||
name: 'pagesExampleGeneralManagerCreate',
|
||||
component: 'pages_example/manager/detail.vue',
|
||||
meta: {
|
||||
title: '新增管理员',
|
||||
menu: false,
|
||||
activeMenu: '/pages_example/general/manager',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'detail/:id',
|
||||
name: 'pagesExampleGeneralManagerEdit',
|
||||
component: 'pages_example/manager/detail.vue',
|
||||
meta: {
|
||||
title: '编辑管理员',
|
||||
menu: false,
|
||||
activeMenu: '/pages_example/general/manager',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
url: '/fake/app/menu/list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
error: '',
|
||||
status: 1,
|
||||
data: [
|
||||
{
|
||||
meta: {
|
||||
title: '演示',
|
||||
icon: 'uim:box',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
meta: {
|
||||
title: '多级导航',
|
||||
icon: 'heroicons-solid:menu-alt-3',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '/multilevel_menu_example/page',
|
||||
meta: {
|
||||
title: '导航1',
|
||||
},
|
||||
},
|
||||
{
|
||||
meta: {
|
||||
title: '导航2',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '/multilevel_menu_example/level2/page',
|
||||
meta: {
|
||||
title: '导航2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
meta: {
|
||||
title: '导航2-2',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '/multilevel_menu_example/level2/level3/page1',
|
||||
meta: {
|
||||
title: '导航2-2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/multilevel_menu_example/level2/level3/page2',
|
||||
meta: {
|
||||
title: '导航2-2-2',
|
||||
},
|
||||
@@ -241,13 +82,6 @@ export default defineFakeRoute([
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/permission_example',
|
||||
meta: {
|
||||
title: '权限验证',
|
||||
icon: 'ri:shield-keyhole-line',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
|
||||
+69
@@ -0,0 +1,69 @@
|
||||
import type { RouteRecordRaw } from 'vue-router'
|
||||
|
||||
function Layout() {
|
||||
return import('@/layouts/index.vue')
|
||||
}
|
||||
|
||||
const routes: RouteRecordRaw = {
|
||||
path: '/multilevel_menu_example',
|
||||
component: Layout,
|
||||
name: 'multilevelMenuExample',
|
||||
meta: {
|
||||
title: '多级导航',
|
||||
icon: 'i-heroicons-solid:menu-alt-3',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'page',
|
||||
name: 'multilevelMenuExample1',
|
||||
component: () => import('@/views/multilevel_menu_example/page.vue'),
|
||||
meta: {
|
||||
title: '导航1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'level2',
|
||||
name: 'multilevelMenuExample2',
|
||||
meta: {
|
||||
title: '导航2',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'page',
|
||||
name: 'multilevelMenuExample2-1',
|
||||
component: () => import('@/views/multilevel_menu_example/level2/page.vue'),
|
||||
meta: {
|
||||
title: '导航2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'level3',
|
||||
name: 'multilevelMenuExample2-2',
|
||||
meta: {
|
||||
title: '导航2-2',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'page1',
|
||||
name: 'multilevelMenuExample2-2-1',
|
||||
component: () => import('@/views/multilevel_menu_example/level2/level3/page1.vue'),
|
||||
meta: {
|
||||
title: '导航2-2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'page2',
|
||||
name: 'multilevelMenuExample2-2-2',
|
||||
component: () => import('@/views/multilevel_menu_example/level2/level3/page2.vue'),
|
||||
meta: {
|
||||
title: '导航2-2-2',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
}
|
||||
|
||||
export default routes
|
||||
@@ -1,6 +1,7 @@
|
||||
import type { RouteRecordMainRaw } from '@fantastic-admin/types'
|
||||
import type { RouteRecordRaw } from 'vue-router'
|
||||
import pinia from '@/store'
|
||||
import MultilevelMenuExample from './modules/multilevel.menu.example'
|
||||
|
||||
// 固定路由（默认路由）
|
||||
const constantRoutes: RouteRecordRaw[] = [
|
||||
@@ -54,7 +55,17 @@ const systemRoutes: RouteRecordRaw[] = [
|
||||
]
|
||||
|
||||
// 动态路由（异步路由、导航菜单路由）
|
||||
const asyncRoutes: RouteRecordMainRaw[] = []
|
||||
const asyncRoutes: RouteRecordMainRaw[] = [
|
||||
{
|
||||
meta: {
|
||||
title: '演示',
|
||||
icon: 'i-ri:function-ai-line',
|
||||
},
|
||||
children: [
|
||||
MultilevelMenuExample,
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
export {
|
||||
asyncRoutes,
|
||||
|
||||
@@ -97,7 +97,7 @@ export const useAppRouteStore = defineStore(
|
||||
isGenerate.value = true
|
||||
}
|
||||
// 格式化后端路由数据
|
||||
function formatBackRoutes(routes: any, views = import.meta.glob('../../views/**/*.vue')): RouteRecordMainRaw[] {
|
||||
function formatBackRoutes(routes: any, views = import.meta.glob('@/views/**/*.vue')): RouteRecordMainRaw[] {
|
||||
return routes.map((route: any) => {
|
||||
switch (route.component) {
|
||||
case 'Layout':
|
||||
@@ -105,7 +105,7 @@ export const useAppRouteStore = defineStore(
|
||||
break
|
||||
default:
|
||||
if (route.component) {
|
||||
route.component = views[`../../views/${route.component}`]
|
||||
route.component = views[`/src/views/${route.component}`]
|
||||
}
|
||||
else {
|
||||
delete route.component
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<FaPageMain>
|
||||
导航2-2-1
|
||||
</FaPageMain>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,10 @@
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<FaPageMain>
|
||||
导航2-2-2
|
||||
</FaPageMain>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,10 @@
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<FaPageMain>
|
||||
导航2-1
|
||||
</FaPageMain>
|
||||
</div>
|
||||
</template>
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<FaPageMain>
|
||||
导航1
|
||||
</FaPageMain>
|
||||
</div>
|
||||
</template>
|
||||
@@ -23,7 +23,7 @@ export default defineFakeRoute([
|
||||
component: 'Layout',
|
||||
name: 'multilevelMenuExample',
|
||||
meta: {
|
||||
title: 'route.multimenu.root',
|
||||
title: '多级导航',
|
||||
icon: 'heroicons-solid:menu-alt-3',
|
||||
},
|
||||
children: [
|
||||
@@ -33,14 +33,14 @@ export default defineFakeRoute([
|
||||
name: 'multilevelMenuExample1',
|
||||
component: 'multilevel_menu_example/page.vue',
|
||||
meta: {
|
||||
title: 'route.multimenu.page',
|
||||
title: '导航1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'level2',
|
||||
name: 'multilevelMenuExample2',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.root',
|
||||
title: '导航2',
|
||||
},
|
||||
children: [
|
||||
// 次导航（三级路由）
|
||||
@@ -49,14 +49,14 @@ export default defineFakeRoute([
|
||||
name: 'multilevelMenuExample2-1',
|
||||
component: 'multilevel_menu_example/level2/page.vue',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.page',
|
||||
title: '导航2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'level3',
|
||||
name: 'multilevelMenuExample2-2',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.level3.root',
|
||||
title: '导航2-2',
|
||||
},
|
||||
children: [
|
||||
// 次导航（四级路由）
|
||||
@@ -65,113 +65,13 @@ export default defineFakeRoute([
|
||||
name: 'multilevelMenuExample2-2-1',
|
||||
component: 'multilevel_menu_example/level2/level3/page1.vue',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.level3.page1',
|
||||
title: '导航2-2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'page2',
|
||||
name: 'multilevelMenuExample2-2-2',
|
||||
component: 'multilevel_menu_example/level2/level3/page2.vue',
|
||||
meta: {
|
||||
title: 'route.multimenu.level2.level3.page2',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/permission_example',
|
||||
component: 'Layout',
|
||||
name: 'permissionExample',
|
||||
meta: {
|
||||
title: 'route.permission',
|
||||
icon: 'ri:shield-keyhole-line',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'permissionExampleIndex',
|
||||
component: 'permission_example/index.vue',
|
||||
meta: {
|
||||
title: 'route.permission',
|
||||
menu: false,
|
||||
breadcrumb: false,
|
||||
activeMenu: '/permission_example',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'test',
|
||||
name: 'permissionExampleTest',
|
||||
component: 'permission_example/test.vue',
|
||||
meta: {
|
||||
title: '测试页面',
|
||||
auth: ['permission.browse'],
|
||||
menu: false,
|
||||
breadcrumb: false,
|
||||
activeMenu: '/permission_example',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
url: '/fake/app/menu/list',
|
||||
method: 'get',
|
||||
response: () => {
|
||||
return {
|
||||
error: '',
|
||||
status: 1,
|
||||
data: [
|
||||
{
|
||||
meta: {
|
||||
title: '演示',
|
||||
icon: 'uim:box',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
meta: {
|
||||
title: '多级导航',
|
||||
icon: 'heroicons-solid:menu-alt-3',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '/multilevel_menu_example/page',
|
||||
meta: {
|
||||
title: '导航1',
|
||||
},
|
||||
},
|
||||
{
|
||||
meta: {
|
||||
title: '导航2',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '/multilevel_menu_example/level2/page',
|
||||
meta: {
|
||||
title: '导航2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
meta: {
|
||||
title: '导航2-2',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '/multilevel_menu_example/level2/level3/page1',
|
||||
meta: {
|
||||
title: '导航2-2-1',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/multilevel_menu_example/level2/level3/page2',
|
||||
meta: {
|
||||
title: '导航2-2-2',
|
||||
},
|
||||
@@ -182,13 +82,6 @@ export default defineFakeRoute([
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/permission_example',
|
||||
meta: {
|
||||
title: '权限验证',
|
||||
icon: 'ri:shield-keyhole-line',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
|
||||
@@ -1,86 +0,0 @@
|
||||
import { faker } from '@faker-js/faker'
|
||||
import { defineFakeRoute } from 'vite-plugin-fake-server/client'
|
||||
|
||||
// 标准模块
|
||||
const standardModuleList: any[] = []
|
||||
for (let i = 0; i < 50; i++) {
|
||||
standardModuleList.push({
|
||||
id: i + 1,
|
||||
title: faker.book.title(),
|
||||
})
|
||||
}
|
||||
|
||||
export default defineFakeRoute([
|
||||
{
|
||||
url: '/fake/standard_module/list',
|
||||
method: 'get',
|
||||
response: ({ query }) => {
|
||||
const { title, from, limit } = query
|
||||
const list = standardModuleList.filter((item) => {
|
||||
return title ? item.title.includes(title) : true
|
||||
})
|
||||
const pageList = list.filter((_item, index) => {
|
||||
return index >= ~~from && index < (~~from + ~~limit)
|
||||
})
|
||||
return {
|
||||
error: '',
|
||||
status: 1,
|
||||
data: {
|
||||
list: pageList,
|
||||
total: list.length,
|
||||
},
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
url: '/fake/standard_module/detail',
|
||||
method: 'get',
|
||||
response: ({ query }) => {
|
||||
const info = standardModuleList.filter(item => item.id === ~~query.id)
|
||||
return {
|
||||
error: '',
|
||||
status: 1,
|
||||
data: info[0],
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
url: '/fake/standard_module/create',
|
||||
method: 'post',
|
||||
response: () => {
|
||||
return {
|
||||
error: '',
|
||||
status: 1,
|
||||
data: {
|
||||
isSuccess: true,
|
||||
},
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
url: '/fake/standard_module/edit',
|
||||
method: 'post',
|
||||
response: () => {
|
||||
return {
|
||||
error: '',
|
||||
status: 1,
|
||||
data: {
|
||||
isSuccess: true,
|
||||
},
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
url: '/fake/standard_module/delete',
|
||||
method: 'post',
|
||||
response: () => {
|
||||
return {
|
||||
error: '',
|
||||
status: 1,
|
||||
data: {
|
||||
isSuccess: true,
|
||||
},
|
||||
}
|
||||
},
|
||||
},
|
||||
])
|
||||
@@ -1,33 +0,0 @@
|
||||
import api from '../index'
|
||||
|
||||
export default {
|
||||
list: (data: {
|
||||
title?: string
|
||||
from: number
|
||||
limit: number
|
||||
}) => api.get('standard_module/list', {
|
||||
params: data,
|
||||
fake: true,
|
||||
}),
|
||||
|
||||
detail: (id: number | string) => api.get('standard_module/detail', {
|
||||
params: {
|
||||
id,
|
||||
},
|
||||
fake: true,
|
||||
}),
|
||||
|
||||
create: (data: any) => api.post('standard_module/create', data, {
|
||||
fake: true,
|
||||
}),
|
||||
|
||||
edit: (data: any) => api.post('standard_module/edit', data, {
|
||||
fake: true,
|
||||
}),
|
||||
|
||||
delete: (id: number | string) => api.post('standard_module/delete', {
|
||||
id,
|
||||
}, {
|
||||
fake: true,
|
||||
}),
|
||||
}
|
||||
@@ -40,7 +40,7 @@ const routes: RouteRecordRaw = {
|
||||
path: 'level3',
|
||||
name: 'multilevelMenuExample2-2',
|
||||
meta: {
|
||||
title: '导航3',
|
||||
title: '导航2-2',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
|
||||
@@ -97,7 +97,7 @@ export const useAppRouteStore = defineStore(
|
||||
isGenerate.value = true
|
||||
}
|
||||
// 格式化后端路由数据
|
||||
function formatBackRoutes(routes: any, views = import.meta.glob('../../views/**/*.vue')): RouteRecordMainRaw[] {
|
||||
function formatBackRoutes(routes: any, views = import.meta.glob('@/views/**/*.vue')): RouteRecordMainRaw[] {
|
||||
return routes.map((route: any) => {
|
||||
switch (route.component) {
|
||||
case 'Layout':
|
||||
@@ -105,7 +105,7 @@ export const useAppRouteStore = defineStore(
|
||||
break
|
||||
default:
|
||||
if (route.component) {
|
||||
route.component = views[`../../views/${route.component}`]
|
||||
route.component = views[`/src/views/${route.component}`]
|
||||
}
|
||||
else {
|
||||
delete route.component
|
||||
|
||||
@@ -19,7 +19,7 @@ async function accountSwitch(val: any) {
|
||||
}
|
||||
function goTest() {
|
||||
router.push({
|
||||
name: 'permissionExampleTest',
|
||||
name: 'authExampleTest',
|
||||
})
|
||||
}
|
||||
function permissionCheck(permissions: string | string[]) {
|
||||
|
||||
Reference in New Issue
Block a user