feat: 适配5.x后端，重构前端架构

主要变更：
1. 重构API目录结构，采用模块化设计，适配5.x后端接口规范
2. 优化布局组件，提升用户界面体验
3. 增强国际化支持，完善多语言配置
4. 新增权限控制功能，支持前端路由权限管理
5. 优化认证流程，支持JWT认证机制
6. 新增中间件和插件，提升系统扩展性
7. 优化状态管理，采用更清晰的模块化设计
8. 新增搜索框、广告等组件，丰富页面功能
9. 更改包管理工具从npm到pnpm，提升依赖管理效率
10. 完善配置系统，支持多环境配置

适配5.x后端特性：
- 采用新的API接口规范
- 支持JWT认证机制
- 适配后端权限控制体系
- 支持后端国际化接口
- 优化数据交互方式

app/stores/system.ts

@@ -1,229 +1,123 @@
 import { defineStore } from 'pinia'
+import { useNuxtApp } from 'nuxt/app'
 import storage from '@/utils/storage'
 import type { Menus } from './interface'
+import { LinkTarget, MenuType } from './interface'
+import { getNavigationList } from '~/api/site'
+import { useMemberStore } from './member'
+import { useConfigStore } from './config'
 
 interface System {
   lang: string
   site: Record<string, any>
 }
 
-// 支持的语言列表
 const availableLanguages = [
   { name: 'zh-cn', value: '中文' },
   { name: 'en', value: 'English' }
 ]
 
-const menus = [
-  {
-    "id": 1,
-    "name": "community",
-    "type": "menu",
-    "path": "https://madong.tech",
-    "title": "社区",
-    "url": "https://www.baidu.com",
-    "icon": "i-dashboard",
-    "meta": {
-      "id": 1,
-      "type": "menu",
-      "menu_type": "tab"
-    }
-  },
-  {
-    "id": 2,
-    "name": "community",
-    "type": "menu",
-    "path": "/",
-    "title": "模块市场",
-    "url": "",
-    "icon": "i-dashboard",
-    "meta": {
-      "id": 2,
-      "type": "menu",
-      "menu_type": "tab"
-    }
-  },
-    {
-    "id": 3,
-    "name": "docs",
-    "type": "menu",
-    "path": "/",
-    "title": "文档",
-    "url": "",
-    "icon": "i-dashboard",
-    "meta": {
-      "id": 3,
-      "type": "menu",
-      "menu_type": "tab"
-    }
-  },
-  {
-    "id": 4,
-    "name": "demo",
-    "type": "directory",
-    "title": "演示站",
-    "url": "",
-    "icon": "i-settings",
-    "meta": {
-      "id": 4,
-      "type": "directory",
-      "menu_type": "tab"
-    },
-    "children": [
-      {
-        "id": 201,
-        "name": "demo1",
-        "type": "page",
-        "path": "/demo/test1",
-        "title": "演示站1",
-        "url": "",
-        "icon": "i-users",
-        "meta": {
-          "id": 201,
-          "type": "page",
-          "menu_type": "tab"
-        },
-        "children": []
-      },
-      {
-        "id": 202,
-        "name": "demo2",
-        "type": "page",
-        "path": "/demo/test2",
-        "title": "演示站2",
-        "url": "",
-        "icon": "i-users",
-        "meta": {
-          "id": 202,
-          "type": "page",
-          "menu_type": "tab"
-        },
-        "children": []
-      }
-    ]
-  },
-  {
-    "id": 5,
-    "name": "code",
-    "type": "directory",
-    "title": "代码仓库",
-    "url": "",
-    "icon": "i-link",
-    "meta": {
-      "id": 5,
-      "type": "directory",
-      "menu_type": "tab"
-    },
-    "children": [
-      {
-        "id": 501,
-        "name": "gitee",
-        "type": "page",
-        "path": "/code/gitee",
-        "title": "Gitee",
-        "url": "https://gitee.com",
-        "icon": "i-book",
-        "meta": {
-          "id": 501,
-          "type": "page",
-          "menu_type": "link"
-        },
-        "children": []
-      },
-      {
-        "id": 502,
-        "name": "github",
-        "type": "page",
-        "path": "/external/support",
-        "title": "GitHub",
-        "url": "https://github.com",
-        "icon": "i-help-circle",
-        "meta": {
-          "id": 502,
-          "type": "page",
-          "menu_type": "link"
-        },
-        "children": []
-      }
-    ]
-  }
-] as Menus[]
-
 export const useSystemStore = defineStore('system', {
   state: (): System => {
+    const storedLang = storage.get('lang');
     return {
-      lang: storage.get('lang') ?? 'zh-cn',
+      lang: storedLang ?? 'zh-cn',
       site: {
-        site_name: '通用多应用管理系统后台框架',
+        site_name: 'madong',
         record_number: 'test',
         version: 'v1.0.1',
         upload: {
           mode: 'local',
         },
-        head_nav: menus,
+        nav_menu: [],
+        member_menu: [],
         initialize: false,
         user_initialize: false,
+        menu_expand: false
       }
     }
   },
 
+  // persist: {
+  //   key: 'system-store',
+  //   pick: ['lang', 'site']
+  // },
+
   getters: {
-    /**
-     * 获取支持的语言列表
-     */
     getLanguages: () => availableLanguages,
 
-    /**
-     * 获取当前语言信息
-     */
     getCurrentLanguage: (state) => {
-      return availableLanguages.find(lang => lang.code === state.lang) || availableLanguages[0]
+      return availableLanguages.find(lang => lang.name === state.lang) || availableLanguages[0]
+    },
+
+    headNav: (state) => {
+      return state.site.nav_menu || []
+    },
+
+    navMenu: (state) => {
+      return state.site.nav_menu || []
+    },
+
+    memberMenu: (state) => {
+      return state.site.member_menu || []
+    },
+
+    isInitialized: (state) => {
+      return state.site.initialize
     }
   },
 
   actions: {
-    /**
-     * 切换语言
-     * @param name 语言名称
-     */
+    // 初始化语言设置（仅在客户端执行）
+    initLanguage() {
+      if (process.client) {
+        const storedLang = storage.get('lang');
+        if (storedLang && storedLang !== this.lang) {
+          this.lang = storedLang;
+          this.updateI18nLocale(storedLang);
+        }
+      }
+    },
+
     setLanguage(name: string) {
-      // 验证语言代码是否支持
       if (!availableLanguages.some(lang => lang.name === name)) {
         console.warn(`不支持的语言代码: ${name}`)
         return false
       }
 
       this.lang = name
-      // 保存到本地存储
       storage.set({ key: 'lang', data: name })
-      
-      // 触发 i18n 语言切换
       this.updateI18nLocale(name)
-
-      // 触发语言切换事件，让组件重新渲染
       this.triggerLanguageChange()
-      
+
       return true
     },
 
-    /**
-     * 更新 i18n 语言设置
-     * @param locale 语言代码
-     */
     updateI18nLocale(locale: string) {
-
-      // 获取 i18n 实例并切换语言
       const nuxtApp = useNuxtApp()
       const i18n = (nuxtApp as any).$i18n
+      
+      // 检查 i18n 的 locale 是否是响应式的
       if (i18n && i18n.locale !== locale) {
-        i18n.locale = locale
+        // 尝试使用不同的方式更新 locale
+        if (typeof i18n.setLocale === 'function') {
+          i18n.setLocale(locale)
+        } else if (i18n.locale && typeof i18n.locale.value !== 'undefined') {
+          i18n.locale.value = locale
+        } else {
+          i18n.locale = locale
+        }
+        
+        // 手动触发组件重新渲染
+        if (process.client) {
+          window.dispatchEvent(new CustomEvent('languageChanged', {
+            detail: { locale: locale }
+          }))
+        }
       }
     },
-    
-    /**
-     * 触发语言切换事件
-     */
+
     triggerLanguageChange() {
-      // 触发自定义事件，通知组件重新渲染
       if (process.client) {
         window.dispatchEvent(new CustomEvent('languageChanged', {
           detail: { locale: this.lang }
@@ -231,9 +125,314 @@ export const useSystemStore = defineStore('system', {
       }
     },
 
-    async getSiteInfoFn() {
-      // 原有逻辑保持不变
+    toggleMenuExpand(_expand: boolean) {
+      const status = this.site.menu_expand
+      this.site.menu_expand = _expand !== undefined ? _expand : !status
+    },
+
+    async getSiteInfoFn(forceRefresh = false) {
+      try {
+        // 检查是否已经初始化且不需要强制刷新
+        if (this.site.initialize && !forceRefresh) {
+          // 确保menu_expand状态被正确恢复
+          const savedMenuExpand = storage.get('system-store')?.site?.menu_expand
+          if (savedMenuExpand !== undefined) {
+            this.site.menu_expand = savedMenuExpand
+          }
+          return {
+            nav_menu: this.site.nav_menu || [],
+            member_menu: this.site.member_menu || []
+          }
+        }
+
+        // 保存当前的menu_expand状态
+        const currentMenuExpand = this.site.menu_expand
+
+        // 获取后端返回的二维数组菜单
+        const allMenus = await getNavigationList() as any[] || []
+
+        // 根据 category 字段分类菜单
+        // category = 1: 导航菜单 (NAV)
+        // category = 2: 会员菜单 (MEMBER)
+        const navMenuItems = allMenus.filter((menu: any) => menu.category === 1) || []
+        const memberMenuItems = allMenus.filter((menu: any) => menu.category === 2) || []
+
+        // 构建层级菜单树
+        const navMenu = this.buildMenuTree(navMenuItems)
+        const memberMenu = this.buildMenuTree(memberMenuItems)
+
+        // 初始化时不做权限过滤，因为还没有登录，没有会员信息
+        // 后续会在其他地方进行权限检查
+        const processedNavMenu = this.processNavMenu(navMenu)
+
+        // 更新状态，保留当前的menu_expand状态
+        this.site = {
+          ...this.site,
+          nav_menu: processedNavMenu,
+          member_menu: memberMenu,
+          initialize: true,
+          menu_expand: currentMenuExpand
+        }
+
+        // 加载前端配置（搜索、统计等）
+        const configStore = useConfigStore()
+        await configStore.initAllConfigs()
+
+        return {
+          nav_menu: processedNavMenu,
+          member_menu: memberMenu
+        }
+      } catch (error) {
+        console.error('获取站点信息失败:', error)
+        return null
+      }
+    },
+
+    /**
+     * 构建层级菜单树
+     */
+    buildMenuTree(menuItems: any[]): Menus[] {
+      const menuMap = new Map<string, Menus>()
+      const rootMenus: Menus[] = []
+
+      // 第一步：转换所有菜单项为前端格式并放入映射
+      menuItems.forEach((item: any) => {
+        const menu: Menus = {
+          id: item.id,
+          name: item.name || '',
+          type: this.convertMenuType(item.type),
+          path: item.url || item.path || '',
+          title: item.name || '',
+          url: item.url || '',
+          icon: item.icon || '',
+          meta: {
+            type: this.convertMenuType(item.type),
+            target: item.target ? this.convertTarget(item.target) : LinkTarget.SELF,
+            permissions: item.meta?.permissions || item.code || [],
+            ...(item.meta || {})
+          },
+          children: []
+        }
+        // 统一 ID 类型为字符串，避免类型不匹配问题
+        menuMap.set(String(item.id), menu)
+      })
+
+      // 第二步：构建树结构
+      menuItems.forEach((item: any) => {
+        const menu = menuMap.get(String(item.id))
+        if (!menu) return
+
+        // 检查是否为根菜单：pid 为 0、"0" 或空值
+        const pid = String(item.pid).trim()
+        if (pid === "0" || !pid) {
+          // 根菜单
+          rootMenus.push(menu)
+        } else {
+          // 子菜单
+          const parent = menuMap.get(pid)
+          if (parent) {
+            if (!parent.children) {
+              parent.children = []
+            }
+            parent.children.push(menu)
+          } else {
+            // 如果父菜单不存在，将当前菜单作为根菜单处理
+            rootMenus.push(menu)
+          }
+        }
+      })
+
+      // 第三步：排序菜单
+      return this.sortMenus(rootMenus)
+    },
+
+    /**
+     * 处理导航菜单
+     */
+    processNavMenu(navMenu: Menus[]): Menus[] {
+      const processedMenu = [...navMenu]
+      const hasHomeMenu = processedMenu.some((menu: Menus) => menu.url === '/' || menu.path === '/')
+
+      if (!hasHomeMenu) {
+        const homeMenu: Menus = {
+          id: '-1',
+          name: '首页',
+          type: MenuType.PAGE,
+          path: '/',
+          title: '首页',
+          url: '/',
+          meta: {
+            type: MenuType.PAGE,
+            target: LinkTarget.SELF
+          }
+        }
+        processedMenu.unshift(homeMenu)
+      } else {
+        const homeIndex = processedMenu.findIndex((menu: Menus) => menu.url === '/' || menu.path === '/')
+        if (homeIndex > 0) {
+          const homeMenu = processedMenu.splice(homeIndex, 1)[0]
+          if (homeMenu) {
+            processedMenu.unshift(homeMenu)
+          }
+        }
+      }
+
+      return processedMenu
+    },
+
+    /**
+     * 转换菜单类型
+     */
+    convertMenuType(type: any): MenuType {
+      const typeMap: Record<string, MenuType> = {
+        1: MenuType.DIRECTORY, // 目录
+        2: MenuType.PAGE,       // 导航菜单（内部链接）
+        3: MenuType.LINK,       // 外部链接
+        4: MenuType.PAGE        // 单页面（内部链接）
+      }
+      return typeMap[type] || MenuType.PAGE
+    },
+
+    /**
+     * 转换目标窗口
+     */
+    convertTarget(target: any): LinkTarget {
+      const targetMap: Record<string, LinkTarget> = {
+        1: LinkTarget.SELF,
+        2: LinkTarget.BLANK
+      }
+      return targetMap[target] || LinkTarget.SELF
+    },
+
+    /**
+     * 排序菜单
+     */
+    sortMenus(menus: Menus[]): Menus[] {
+      return menus.sort((a, b) => (a.sort || 0) - (b.sort || 0)).map(menu => {
+        if (menu.children && menu.children.length > 0) {
+          menu.children = this.sortMenus(menu.children)
+        }
+        return menu
+      })
+    },
+
+    isExternalLink(menu: Menus): boolean {
+      return menu.type === MenuType.LINK && !!menu.url
+    },
+
+    isDirectory(menu: Menus): boolean {
+      return menu.type === MenuType.DIRECTORY
+    },
+
+    hasChildren(menu: Menus): boolean {
+      return !!menu.children && menu.children.length > 0
+    },
+
+    getTarget(menu: Menus): string {
+      return menu.meta?.target || '_self'
+    },
+
+    shouldNavigate(menu: Menus): boolean {
+      if (this.isDirectory(menu)) {
+        return false
+      }
+      if (this.isExternalLink(menu)) {
+        return false
+      }
+      return !!menu.path
+    },
+
+    findMenuById(id: number, menus?: Menus[]): Menus | null {
+      const menuList = menus || this.headNav
+
+      for (const menu of menuList) {
+        if (menu.id === id) {
+          return menu
+        }
+        if (menu.children && menu.children.length > 0) {
+          const found = this.findMenuById(id, menu.children)
+          if (found) return found
+        }
+      }
+      return null
+    },
+
+    findMenuByPath(path: string, menus?: Menus[]): Menus | null {
+      const menuList = menus || this.headNav
+
+      for (const menu of menuList) {
+        if (menu.path === path) {
+          return menu
+        }
+        if (menu.children && menu.children.length > 0) {
+          const found = this.findMenuByPath(path, menu.children)
+          if (found) return found
+        }
+      }
+      return null
+    },
+
+    getMenuTarget(menu: Menus): string | null {
+      if (this.isDirectory(menu)) {
+        return null
+      }
+      if (this.isExternalLink(menu)) {
+        return menu.url || null
+      }
+      return menu.path || null
+    },
+
+    /**
+     * 检查菜单权限
+     */
+    checkMenuPermission(menu: Menus): boolean {
+      const memberStore = useMemberStore()
+      const permissions = memberStore.info?.permissions || []
+
+      // 如果用户有权限码 [*]，表示所有权限都有
+      if (permissions.includes('*')) {
+        return true
+      }
+
+      // 获取菜单权限码（支持字符串和数组）
+      let menuPermissions: string[] = []
+      if (menu.meta?.permissions) {
+        if (typeof menu.meta.permissions === 'string') {
+          // 如果是字符串，按逗号分割
+          menuPermissions = menu.meta.permissions.split(',').map(p => p.trim()).filter(p => p)
+        } else if (Array.isArray(menu.meta.permissions)) {
+          menuPermissions = menu.meta.permissions
+        }
+      }
+
+      // 如果菜单没有设置权限码，允许访问
+      if (menuPermissions.length === 0) {
+        return true
+      }
+
+      // 检查用户是否有菜单所需的任一权限
+      return menuPermissions.some(permission => permissions.includes(permission))
+    },
+
+    /**
+     * 过滤有权限的菜单
+     */
+    filterMenuByPermission(menus: Menus[]): Menus[] {
+      return menus.filter(menu => {
+        // 检查当前菜单权限
+        if (!this.checkMenuPermission(menu)) {
+          return false
+        }
+
+        // 递归检查子菜单
+        if (menu.children && menu.children.length > 0) {
+          menu.children = this.filterMenuByPermission(menu.children)
+          // 如果子菜单都被过滤掉了，当前菜单也不显示
+          return menu.children.length > 0
+        }
+
+        return true
+      })
     }
   }
 })
-