xto-fronted 0.4.109 → 0.4.111

package/src/directives/permission.ts

@@ -1,37 +1,37 @@
-/**
- * 权限指令
- * v-permission="['user:edit']" 或 v-permission="'user:edit'"
- */
-
-import type { Directive, DirectiveBinding } from 'vue'
-import { useUserStore } from '@/stores/user'
-import { useMenuStore } from '@/stores/menu'
-
-const permission: Directive = {
-  mounted(el: HTMLElement, binding: DirectiveBinding<string | string[]>) {
-    const userStore = useUserStore()
-    const menuStore = useMenuStore()
-
-    // 如果没有登录，移除元素
-    if (!userStore.isLoggedIn) {
-      el.parentNode?.removeChild(el)
-      return
-    }
-
-    // 获取权限标识
-    const value = binding.value
-    const permissions = Array.isArray(value) ? value : [value]
-
-    // 检查是否有权限
-    if (!menuStore.hasPermission(permissions)) {
-      el.parentNode?.removeChild(el)
-    }
-  }
-}
-
-export default permission
-
-// 注册指令
-export function setupPermissionDirective(app: any) {
-  app.directive('permission', permission)
+/**
+ * 权限指令
+ * v-permission="['user:edit']" 或 v-permission="'user:edit'"
+ */
+
+import type { Directive, DirectiveBinding } from 'vue'
+import { useUserStore } from '@/stores/user'
+import { useMenuStore } from '@/stores/menu'
+
+const permission: Directive = {
+  mounted(el: HTMLElement, binding: DirectiveBinding<string | string[]>) {
+    const userStore = useUserStore()
+    const menuStore = useMenuStore()
+
+    // 如果没有登录，移除元素
+    if (!userStore.isLoggedIn) {
+      el.parentNode?.removeChild(el)
+      return
+    }
+
+    // 获取权限标识
+    const value = binding.value
+    const permissions = Array.isArray(value) ? value : [value]
+
+    // 检查是否有权限
+    if (!menuStore.hasPermission(permissions)) {
+      el.parentNode?.removeChild(el)
+    }
+  }
+}
+
+export default permission
+
+// 注册指令
+export function setupPermissionDirective(app: any) {
+  app.directive('permission', permission)
 }

package/src/index.ts

@@ -39,7 +39,8 @@ export async function createXtoApp(config: Partial<XtoConfig>) {
   initAppConfig({
     appId: config.appId,
     clientId: config.clientId,
-    apiBaseUrl: baseUrl || config.apiBaseUrl
+    apiBaseUrl: baseUrl || config.apiBaseUrl,
+    basePath: config.basePath
   })
 
   // 设置 base 路径（用于登录过期时正确跳转）

package/src/router/layoutRoute.ts

@@ -6,6 +6,7 @@ import { createRouter as vueCreateRouter, createWebHistory } from 'vue-router'
 import type { RouteRecordRaw, Router } from 'vue-router'
 import { h, defineComponent } from 'vue'
 import Layout from '@/components/Layout/index.vue'
+import { getBasePath } from '@/utils/config'
 
 interface LayoutRouteOptions {
   indexPath?: string
@@ -63,8 +64,10 @@ export function createLayoutRoute(
  * @returns 路由实例
  */
 export function createRouter(routes: RouteRecordRaw[], options: CreateRouterOptions = {}): Router {
+  // 优先使用传入的 base，否则使用全局配置的 basePath
+  const base = options.base || getBasePath()
   return vueCreateRouter({
-    history: createWebHistory(options.base),
+    history: createWebHistory(base),
     routes,
     scrollBehavior: () => ({ left: 0, top: 0 })
   })

package/src/stores/app.ts

@@ -1,180 +1,180 @@
-/**
- * 应用状态
- */
-
-import { defineStore } from 'pinia'
-import { ref, computed, watch } from 'vue'
-import { local } from '@/utils/storage'
-
-export type ThemeMode = 'light' | 'dark'
-export type LayoutMode = 'sidebar' | 'top' | 'mix'
-
-export const useAppStore = defineStore('app', () => {
-  // 状态
-  const appName = ref<string>(local.get<string>('appName') || 'XTO App')
-  const indexPath = ref<string>(local.get<string>('indexPath') || '/dashboard')
-  const loginPath = ref<string>(local.get<string>('loginPath') || '/login')
-  const isDark = ref<boolean>(local.get<boolean>('isDark') || false)
-  const theme = ref<ThemeMode>(local.get<ThemeMode>('theme') || 'light')
-  const layout = ref<LayoutMode>(local.get<LayoutMode>('layout') || 'sidebar')
-  const isCollapsed = ref<boolean>(local.get<boolean>('isCollapsed') || false)
-  const showTabs = ref<boolean>(local.get<boolean>('showTabs') ?? true)
-  const showFooter = ref<boolean>(local.get<boolean>('showFooter') ?? true)
-  const showBreadcrumb = ref<boolean>(local.get<boolean>('showBreadcrumb') ?? true)
-  const primaryColor = ref<string>(local.get<string>('primaryColor') || '#409eff')
-  const cachedViews = ref<string[]>([])
-  const mixSubMenus = ref<any[]>([])
-
-  // 计算属性
-  const themeClass = computed(() => (isDark.value ? 'dark' : 'light'))
-
-  // 设置应用名称
-  const setAppName = (name: string) => {
-    appName.value = name
-    local.set('appName', name)
-  }
-
-  // 设置默认首页路径
-  const setIndexPath = (path: string) => {
-    indexPath.value = path
-    local.set('indexPath', path)
-  }
-
-  // 设置登录页路径
-  const setLoginPath = (path: string) => {
-    loginPath.value = path
-    local.set('loginPath', path)
-  }
-
-  // 切换主题
-  const toggleTheme = () => {
-    isDark.value = !isDark.value
-    theme.value = isDark.value ? 'dark' : 'light'
-    updateTheme()
-  }
-
-  // 设置主题
-  const setTheme = (mode: ThemeMode) => {
-    theme.value = mode
-    isDark.value = mode === 'dark'
-    updateTheme()
-  }
-
-  // 更新主题
-  const updateTheme = () => {
-    const html = document.documentElement
-    if (isDark.value) {
-      html.classList.add('dark')
-    } else {
-      html.classList.remove('dark')
-    }
-    local.set('isDark', isDark.value)
-    local.set('theme', theme.value)
-  }
-
-  // 切换菜单折叠
-  const toggleCollapse = () => {
-    isCollapsed.value = !isCollapsed.value
-    local.set('isCollapsed', isCollapsed.value)
-  }
-
-  // 设置布局
-  const setLayout = (mode: LayoutMode) => {
-    layout.value = mode
-    local.set('layout', mode)
-  }
-
-  // 切换标签页
-  const toggleTabs = () => {
-    showTabs.value = !showTabs.value
-    local.set('showTabs', showTabs.value)
-  }
-
-  // 切换底部
-  const toggleFooter = () => {
-    showFooter.value = !showFooter.value
-    local.set('showFooter', showFooter.value)
-  }
-
-  // 切换面包屑
-  const toggleBreadcrumb = () => {
-    showBreadcrumb.value = !showBreadcrumb.value
-    local.set('showBreadcrumb', showBreadcrumb.value)
-  }
-
-  // 设置主题色
-  const setPrimaryColor = (color: string) => {
-    primaryColor.value = color
-    document.documentElement.style.setProperty('--color-primary', color)
-    local.set('primaryColor', color)
-  }
-
-  // 添加缓存页面
-  const addCachedView = (name: string) => {
-    if (!cachedViews.value.includes(name)) {
-      cachedViews.value.push(name)
-    }
-  }
-
-  // 移除缓存页面
-  const removeCachedView = (name: string) => {
-    const index = cachedViews.value.indexOf(name)
-    if (index > -1) {
-      cachedViews.value.splice(index, 1)
-    }
-  }
-
-  // 清除缓存页面
-  const clearCachedViews = () => {
-    cachedViews.value = []
-  }
-
-  // 设置混合模式子菜单
-  const setMixSubMenus = (menus: any[]) => {
-    mixSubMenus.value = menus
-  }
-
-  // 初始化主题
-  const initTheme = () => {
-    updateTheme()
-    if (primaryColor.value !== '#409eff') {
-      document.documentElement.style.setProperty('--color-primary', primaryColor.value)
-    }
-  }
-
-  // 监听主题变化
-  watch(isDark, updateTheme)
-
-  return {
-    appName,
-    indexPath,
-    loginPath,
-    isDark,
-    theme,
-    layout,
-    isCollapsed,
-    showTabs,
-    showFooter,
-    showBreadcrumb,
-    primaryColor,
-    cachedViews,
-    mixSubMenus,
-    themeClass,
-    setAppName,
-    setIndexPath,
-    setLoginPath,
-    toggleTheme,
-    toggleCollapse,
-    setTheme,
-    setLayout,
-    toggleTabs,
-    toggleFooter,
-    toggleBreadcrumb,
-    setPrimaryColor,
-    addCachedView,
-    removeCachedView,
-    clearCachedViews,
-    setMixSubMenus,
-    initTheme
-  }
+/**
+ * 应用状态
+ */
+
+import { defineStore } from 'pinia'
+import { ref, computed, watch } from 'vue'
+import { local } from '@/utils/storage'
+
+export type ThemeMode = 'light' | 'dark'
+export type LayoutMode = 'sidebar' | 'top' | 'mix'
+
+export const useAppStore = defineStore('app', () => {
+  // 状态
+  const appName = ref<string>(local.get<string>('appName') || 'XTO App')
+  const indexPath = ref<string>(local.get<string>('indexPath') || '/dashboard')
+  const loginPath = ref<string>(local.get<string>('loginPath') || '/login')
+  const isDark = ref<boolean>(local.get<boolean>('isDark') || false)
+  const theme = ref<ThemeMode>(local.get<ThemeMode>('theme') || 'light')
+  const layout = ref<LayoutMode>(local.get<LayoutMode>('layout') || 'sidebar')
+  const isCollapsed = ref<boolean>(local.get<boolean>('isCollapsed') || false)
+  const showTabs = ref<boolean>(local.get<boolean>('showTabs') ?? true)
+  const showFooter = ref<boolean>(local.get<boolean>('showFooter') ?? true)
+  const showBreadcrumb = ref<boolean>(local.get<boolean>('showBreadcrumb') ?? true)
+  const primaryColor = ref<string>(local.get<string>('primaryColor') || '#409eff')
+  const cachedViews = ref<string[]>([])
+  const mixSubMenus = ref<any[]>([])
+
+  // 计算属性
+  const themeClass = computed(() => (isDark.value ? 'dark' : 'light'))
+
+  // 设置应用名称
+  const setAppName = (name: string) => {
+    appName.value = name
+    local.set('appName', name)
+  }
+
+  // 设置默认首页路径
+  const setIndexPath = (path: string) => {
+    indexPath.value = path
+    local.set('indexPath', path)
+  }
+
+  // 设置登录页路径
+  const setLoginPath = (path: string) => {
+    loginPath.value = path
+    local.set('loginPath', path)
+  }
+
+  // 切换主题
+  const toggleTheme = () => {
+    isDark.value = !isDark.value
+    theme.value = isDark.value ? 'dark' : 'light'
+    updateTheme()
+  }
+
+  // 设置主题
+  const setTheme = (mode: ThemeMode) => {
+    theme.value = mode
+    isDark.value = mode === 'dark'
+    updateTheme()
+  }
+
+  // 更新主题
+  const updateTheme = () => {
+    const html = document.documentElement
+    if (isDark.value) {
+      html.classList.add('dark')
+    } else {
+      html.classList.remove('dark')
+    }
+    local.set('isDark', isDark.value)
+    local.set('theme', theme.value)
+  }
+
+  // 切换菜单折叠
+  const toggleCollapse = () => {
+    isCollapsed.value = !isCollapsed.value
+    local.set('isCollapsed', isCollapsed.value)
+  }
+
+  // 设置布局
+  const setLayout = (mode: LayoutMode) => {
+    layout.value = mode
+    local.set('layout', mode)
+  }
+
+  // 切换标签页
+  const toggleTabs = () => {
+    showTabs.value = !showTabs.value
+    local.set('showTabs', showTabs.value)
+  }
+
+  // 切换底部
+  const toggleFooter = () => {
+    showFooter.value = !showFooter.value
+    local.set('showFooter', showFooter.value)
+  }
+
+  // 切换面包屑
+  const toggleBreadcrumb = () => {
+    showBreadcrumb.value = !showBreadcrumb.value
+    local.set('showBreadcrumb', showBreadcrumb.value)
+  }
+
+  // 设置主题色
+  const setPrimaryColor = (color: string) => {
+    primaryColor.value = color
+    document.documentElement.style.setProperty('--color-primary', color)
+    local.set('primaryColor', color)
+  }
+
+  // 添加缓存页面
+  const addCachedView = (name: string) => {
+    if (!cachedViews.value.includes(name)) {
+      cachedViews.value.push(name)
+    }
+  }
+
+  // 移除缓存页面
+  const removeCachedView = (name: string) => {
+    const index = cachedViews.value.indexOf(name)
+    if (index > -1) {
+      cachedViews.value.splice(index, 1)
+    }
+  }
+
+  // 清除缓存页面
+  const clearCachedViews = () => {
+    cachedViews.value = []
+  }
+
+  // 设置混合模式子菜单
+  const setMixSubMenus = (menus: any[]) => {
+    mixSubMenus.value = menus
+  }
+
+  // 初始化主题
+  const initTheme = () => {
+    updateTheme()
+    if (primaryColor.value !== '#409eff') {
+      document.documentElement.style.setProperty('--color-primary', primaryColor.value)
+    }
+  }
+
+  // 监听主题变化
+  watch(isDark, updateTheme)
+
+  return {
+    appName,
+    indexPath,
+    loginPath,
+    isDark,
+    theme,
+    layout,
+    isCollapsed,
+    showTabs,
+    showFooter,
+    showBreadcrumb,
+    primaryColor,
+    cachedViews,
+    mixSubMenus,
+    themeClass,
+    setAppName,
+    setIndexPath,
+    setLoginPath,
+    toggleTheme,
+    toggleCollapse,
+    setTheme,
+    setLayout,
+    toggleTabs,
+    toggleFooter,
+    toggleBreadcrumb,
+    setPrimaryColor,
+    addCachedView,
+    removeCachedView,
+    clearCachedViews,
+    setMixSubMenus,
+    initTheme
+  }
 })