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

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

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

app/components/icon/icon-usage.md

@@ -0,0 +1,141 @@
+# 图标组件使用说明
+
+## 功能特性
+
+- 支持多种图标库：Ant Design、Element Plus、Carbon、IC、Lucide、Ri 等
+- 支持自定义图标
+- 支持图标选择器组件
+- 支持离线模式
+
+## 安装依赖
+
+```bash
+pnpm add @iconify/vue @iconify/json
+```
+
+## 使用方式
+
+### 1. 基础图标组件 (Iconify)
+
+```vue
+<template>
+  <Iconify icon="ant-design:home-outlined" />
+  <Iconify icon="ep:home-filled" />
+  <Iconify icon="carbon:home" />
+  <Iconify icon="ic:baseline-home" />
+  <Iconify icon="lucide:home" />
+  <Iconify icon="ri:home-line" />
+</template>
+
+<script setup lang="ts">
+import Iconify from '~/components/iconify.vue'
+</script>
+```
+
+### 2. 自定义尺寸和颜色
+
+```vue
+<template>
+  <Iconify icon="ant-design:home-outlined" width="24" height="24" />
+  <Iconify icon="ant-design:home-outlined" width="32" height="32" color="#409eff" />
+  <Iconify icon="ant-design:home-outlined" size="1.5em" color="#67c23a" />
+</template>
+```
+
+### 3. 图标选择器 (IconSelector)
+
+```vue
+<template>
+  <IconSelector v-model="selectedIcon" text="选择图标" width="300px" />
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import IconSelector from '~/components/icon-selector.vue'
+
+const selectedIcon = ref('')
+</script>
+```
+
+### 4. 监听图标选择事件
+
+```vue
+<template>
+  <IconSelector v-model="selectedIcon" @get-icon="handleGetIcon" />
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import IconSelector from '~/components/icon-selector.vue'
+
+const selectedIcon = ref('')
+
+const handleGetIcon = (icon: string) => {
+  console.log('选择的图标:', icon)
+}
+</script>
+```
+
+## 支持的图标库
+
+| 图标库 | 前缀 | 示例 |
+|--------|------|------|
+| Ant Design | `ant-design` | `ant-design:home-outlined` |
+| Element Plus | `ep` | `ep:home-filled` |
+| Carbon | `carbon` | `carbon:home` |
+| IC | `ic` | `ic:baseline-home` |
+| Lucide | `lucide` | `lucide:home` |
+| Ri | `ri` | `ri:home-line` |
+
+## 自定义添加图标库
+
+### 1. 安装图标库
+
+```bash
+pnpm add @iconify-json/your-icon-library
+```
+
+### 2. 在 load-icon.ts 中添加
+
+```typescript
+import YourIcons from '@iconify/json/json/your-icon-library.json'
+addCollection(YourIcons)
+```
+
+### 3. 在 icon-selector.vue 中添加
+
+```typescript
+const iconifyPrefixs = ['ant-design', 'carbon', 'ic', 'lucide', 'ep', 'ri', 'your-icon-library']
+```
+
+## 配置说明
+
+### 离线模式
+
+在 `.env` 文件中配置：
+
+```env
+VITE_APP_ICON_OFFLINE=true
+VITE_APP_ICONIFY_PREFIX=ant-design,carbon,ic,lucide,ep,ri
+```
+
+### 图标选择器配置
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| modelValue | string | '' | v-model 绑定的图标值 |
+| text | string | '图标选择器' | 显示文本 |
+| width | string | '200px' | 组件宽度 |
+| size | string | 'default' | 组件大小：large/default/small |
+| disabled | boolean | false | 是否禁用 |
+
+## 注意事项
+
+1. 图标名称格式：`图标库名称:图标名称`
+2. 离线模式下需要预先加载所有图标数据
+3. 图标选择器支持搜索功能
+4. 图标选择器支持分页显示
+
+## 示例代码
+
+完整示例请参考项目中的使用场景。