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

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

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

app/layouts/components/dark-switch.vue

@@ -2,20 +2,22 @@
     <div class="theme-toggle-content" @click="toggleDark">
         <div class="switch">
             <div class="switch-action">
-                <Icon name="local-dark" color="#ffffff" size="13px" class="switch-icon dark-icon" />
-                <Icon name="local-light" color="#303133" size="13px" class="switch-icon light-icon" />
+                <Icon icon="ant-design:moon-outlined" color="#ffffff" size="13px" class="switch-icon dark-icon" />
+                <Icon icon="ant-design:sun-outlined" color="#303133" size="13px" class="switch-icon light-icon" />
             </div>
         </div>
     </div>
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
-const color = useColorMode()
+import { ref, computed } from 'vue'
+import { Icon } from '~/components/icon'
+import { getDark, setDark } from '~/utils/dark'
 
+const isDark = computed(() => getDark())
 
 function toggleDark() {
-  color.preference = color.value === 'dark' ? 'light' : 'dark'
+  setDark(!isDark.value)
 }
 
 </script>