xto-fronted 0.4.110 → 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/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
+  }
 })

package/src/stores/menu.ts

@@ -1,110 +1,110 @@
-/**
- * 菜单状态
- */
-
-import { defineStore } from 'pinia'
-import { ref, computed } from 'vue'
-import type { MenuItem } from '@/types/api'
-import { local } from '@/utils/storage'
-
-const MENU_LIST_KEY = 'menu_list'
-const PERMISSION_LIST_KEY = 'permission_list'
-
-// 首页菜单（参考 tineco-ui）
-const indexMenu: MenuItem = {
-  menuCode: 'home',
-  menuName: '首页',
-  menuUrl: '/dashboard',
-  icon: 'home',
-  closable: false,
-  isDefault: false,
-  isOut: false
-}
-
-/**
- * 过滤菜单项，只保留菜单（type !== 1），过滤掉功能按钮（type === 1）
- * @param menus 原始菜单列表
- * @returns 过滤后的菜单列表
- */
-function filterMenus(menus: MenuItem[]): MenuItem[] {
-  return menus
-    .filter(menu => menu.type !== 1) // 过滤掉功能按钮
-    .map(menu => ({
-      ...menu,
-      children: menu.children ? filterMenus(menu.children) : undefined
-    }))
-}
-
-/**
- * 提取所有功能权限（type === 1 的项）
- * @param menus 原始菜单列表
- * @returns 权限标识列表
- */
-function extractPermissions(menus: MenuItem[]): string[] {
-  const permissions: string[] = []
-
-  function traverse(items: MenuItem[]) {
-    items.forEach(item => {
-      // type === 1 表示功能按钮
-      if (item.type === 1 && item.menuCode) {
-        permissions.push(item.menuCode)
-      }
-      // 递归处理子项
-      if (item.children) {
-        traverse(item.children)
-      }
-    })
-  }
-
-  traverse(menus)
-  return permissions
-}
-
-export const useMenuStore = defineStore('menu', () => {
-  // 状态
-  const menuList = ref<MenuItem[]>(local.get<MenuItem[]>(MENU_LIST_KEY) || [])
-  // 功能权限列表
-  const permissions = ref<string[]>(local.get<string[]>(PERMISSION_LIST_KEY) || [])
-
-  // 计算属性
-  const hasMenu = computed(() => menuList.value.length > 0)
-
-  // 设置菜单（会自动过滤功能项，并提取权限）
-  const setMenuList = (menus: MenuItem[]) => {
-    // 提取功能权限
-    permissions.value = extractPermissions(menus)
-    local.set(PERMISSION_LIST_KEY, permissions.value)
-
-    // 过滤菜单，只保留菜单项（type !== 1）
-    const filteredMenus = filterMenus(menus)
-
-    // 添加首页菜单到开头
-    menuList.value = [indexMenu, ...filteredMenus]
-    local.set(MENU_LIST_KEY, menuList.value)
-  }
-
-  // 清除菜单
-  const clearMenu = () => {
-    menuList.value = []
-    permissions.value = []
-    local.remove(MENU_LIST_KEY)
-    local.remove(PERMISSION_LIST_KEY)
-  }
-
-  // 检查是否有某个权限
-  const hasPermission = (permission: string | string[]): boolean => {
-    if (Array.isArray(permission)) {
-      return permission.some(p => permissions.value.includes(p))
-    }
-    return permissions.value.includes(permission)
-  }
-
-  return {
-    menuList,
-    permissions,
-    hasMenu,
-    setMenuList,
-    clearMenu,
-    hasPermission
-  }
+/**
+ * 菜单状态
+ */
+
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import type { MenuItem } from '@/types/api'
+import { local } from '@/utils/storage'
+
+const MENU_LIST_KEY = 'menu_list'
+const PERMISSION_LIST_KEY = 'permission_list'
+
+// 首页菜单（参考 tineco-ui）
+const indexMenu: MenuItem = {
+  menuCode: 'home',
+  menuName: '首页',
+  menuUrl: '/dashboard',
+  icon: 'home',
+  closable: false,
+  isDefault: false,
+  isOut: false
+}
+
+/**
+ * 过滤菜单项，只保留菜单（type !== 1），过滤掉功能按钮（type === 1）
+ * @param menus 原始菜单列表
+ * @returns 过滤后的菜单列表
+ */
+function filterMenus(menus: MenuItem[]): MenuItem[] {
+  return menus
+    .filter(menu => menu.type !== 1) // 过滤掉功能按钮
+    .map(menu => ({
+      ...menu,
+      children: menu.children ? filterMenus(menu.children) : undefined
+    }))
+}
+
+/**
+ * 提取所有功能权限（type === 1 的项）
+ * @param menus 原始菜单列表
+ * @returns 权限标识列表
+ */
+function extractPermissions(menus: MenuItem[]): string[] {
+  const permissions: string[] = []
+
+  function traverse(items: MenuItem[]) {
+    items.forEach(item => {
+      // type === 1 表示功能按钮
+      if (item.type === 1 && item.menuCode) {
+        permissions.push(item.menuCode)
+      }
+      // 递归处理子项
+      if (item.children) {
+        traverse(item.children)
+      }
+    })
+  }
+
+  traverse(menus)
+  return permissions
+}
+
+export const useMenuStore = defineStore('menu', () => {
+  // 状态
+  const menuList = ref<MenuItem[]>(local.get<MenuItem[]>(MENU_LIST_KEY) || [])
+  // 功能权限列表
+  const permissions = ref<string[]>(local.get<string[]>(PERMISSION_LIST_KEY) || [])
+
+  // 计算属性
+  const hasMenu = computed(() => menuList.value.length > 0)
+
+  // 设置菜单（会自动过滤功能项，并提取权限）
+  const setMenuList = (menus: MenuItem[]) => {
+    // 提取功能权限
+    permissions.value = extractPermissions(menus)
+    local.set(PERMISSION_LIST_KEY, permissions.value)
+
+    // 过滤菜单，只保留菜单项（type !== 1）
+    const filteredMenus = filterMenus(menus)
+
+    // 添加首页菜单到开头
+    menuList.value = [indexMenu, ...filteredMenus]
+    local.set(MENU_LIST_KEY, menuList.value)
+  }
+
+  // 清除菜单
+  const clearMenu = () => {
+    menuList.value = []
+    permissions.value = []
+    local.remove(MENU_LIST_KEY)
+    local.remove(PERMISSION_LIST_KEY)
+  }
+
+  // 检查是否有某个权限
+  const hasPermission = (permission: string | string[]): boolean => {
+    if (Array.isArray(permission)) {
+      return permission.some(p => permissions.value.includes(p))
+    }
+    return permissions.value.includes(permission)
+  }
+
+  return {
+    menuList,
+    permissions,
+    hasMenu,
+    setMenuList,
+    clearMenu,
+    hasPermission
+  }
 })