index.ts 4.12 KB
import { createRouter, createWebHistory } from 'vue-router'
import type { RouteRecordRaw } from 'vue-router'
import Login from '@/views/login/index.vue'
import MainLayout from '@/layouts/MainLayout.vue'
import Dashboard from '@/views/dashboard/index.vue'
import Users from '@/views/users/index.vue'
import Test from '@/views/Test.vue'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'

// 配置NProgress
NProgress.configure({ showSpinner: false })

// 静态路由
const staticRoutes: RouteRecordRaw[] = [
  {
    path: '/',
    name: 'Login',
    component: Login,
    meta: {
      title: '登录',
      requiresAuth: false
    }
  },
  {
    path: '/main',
    component: MainLayout,
    children: [
      {
        path: 'dashboard',
        name: 'Dashboard',
        component: Dashboard,
        meta: {
          title: '首页',
          requiresAuth: true
        }
      },
      {
        path: 'users',
        name: 'Users',
        component: Users,
        meta: {
          title: '用户管理',
          requiresAuth: true
        }
      },
      {
        path: 'sys/role',
        name: 'Role',
        component: () => import('@/views/sys/role/index.vue'),
        meta: {
          title: '角色管理',
          requiresAuth: true
        }
      },
      {
        path: 'sys/menu',
        name: 'Menu',
        component: () => import('@/views/sys/menu/index.vue'),
        meta: {
          title: '菜单管理',
          requiresAuth: true
        }
      },
      {
        path: 'sys/dict',
        name: 'Dict',
        component: () => import('@/views/sys/dict/index.vue'),
        meta: {
          title: '字典管理',
          requiresAuth: true
        }
      },
      {
        path: 'sys/dict-item',
        name: 'DictItem',
        component: () => import('@/views/sys/dict-item/index.vue'),
        meta: {
          title: '字典项管理',
          requiresAuth: true
        }
      },
      {
        path: 'sys/log',
        name: 'Log',
        component: () => import('@/views/sys/log/index.vue'),
        meta: {
          title: '日志管理',
          requiresAuth: true
        }
      },
      {
        path: 'dicts',
        name: 'Dicts',
        component: () => import('@/views/dicts/index.vue'),
        meta: {
          title: '字典管理',
          requiresAuth: true
        }
      },
      {
        path: 'logs',
        name: 'Logs',
        component: () => import('@/views/logs/index.vue'),
        meta: {
          title: '日志管理',
          requiresAuth: true
        }
      },
      {
        path: 'settings',
        name: 'Settings',
        component: () => import('@/views/settings/index.vue'),
        meta: {
          title: '系统设置',
          requiresAuth: true
        }
      }
    ]
  },
  {
    path: '/dashboard',
    redirect: '/main/dashboard'
  },
  {
    path: '/test',
    name: 'Test',
    component: Test,
    meta: {
      title: '测试页面',
      requiresAuth: false
    }
  }
]

// 创建路由实例
const router = createRouter({
  history: createWebHistory(),
  routes: staticRoutes,
  scrollBehavior: () => ({ top: 0 })
})

// 优化的路由守卫
router.beforeEach((to, from, next) => {
  // 只在路由真正变化时记录日志
  if (to.path !== from.path) {
    console.log('路由变化:', { from: from.path, to: to.path })
  }
  
  // 开始进度条
  NProgress.start()
  
  // 设置页面标题
  if (to.meta.title) {
    document.title = `${to.meta.title} - Apple经销商ERP系统`
  }
  
  // 检查认证状态
  if (to.meta.requiresAuth) {
    const token = localStorage.getItem('token')
    if (!token) {
      console.log('未认证,跳转到登录页')
      next('/')
      return
    }
  }
  
  // 如果已登录且访问登录页,跳转到首页
  if (to.path === '/' && localStorage.getItem('token')) {
    console.log('已登录,跳转到首页')
    next('/main/dashboard')
    return
  }
  
  // 继续导航
  next()
})

router.afterEach(() => {
  // 结束进度条
  NProgress.done()
})

// 路由错误处理
router.onError((error) => {
  console.error('路由错误:', error)
  NProgress.done()
})

export default router