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/sms-code/index.vue

@@ -63,18 +63,20 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive, computed } from 'vue'
+import { ref, reactive, computed, watch } from 'vue'
 import { sendSmsVerificationCode } from '@/api/system'
 import type { FormInstance } from 'element-plus'
 
 interface SmsCodeProps {
-    mobile: string
+    mobile?: string
+    email?: string
     type: string
     modelValue: string
 }
 
 interface CaptchaFormData {
-    mobile: string
+    mobile?: string
+    email?: string
     captcha_code: string
     captcha_key: string
     type: string
@@ -93,12 +95,21 @@ let countdownTimer: number | undefined = undefined
 
 // 验证码相关
 const captchaForm = reactive<CaptchaFormData>({
-    mobile: '',
+    mobile: props.mobile || '',
+    email: props.email || '',
     captcha_code: '',
     captcha_key: '',
     type: props.type
 })
 
+// 监听 props 变化，更新 captchaForm
+watch(() => props.mobile, (newVal) => {
+    captchaForm.mobile = newVal || ''
+})
+watch(() => props.email, (newVal) => {
+    captchaForm.email = newVal || ''
+})
+
 const captchaImage = ref('')
 const captchaFormRef = ref<FormInstance>()
 
@@ -126,14 +137,15 @@ buttonText.value = t('get_sms_code')
 
 // 发送短信验证码
 const sendSmsCode = async () => {
-    captchaForm.mobile = props.mobile
-    
+    captchaForm.mobile = props.mobile || ''
+    captchaForm.email = props.email || ''
+
     if (!canSendCode.value) return
 
     try {
         isLoading.value = true
         const response = await sendSmsVerificationCode(captchaForm) as any
-        
+
         if (response?.code !== -1) {
             smsValue.value = response.data.key
             startCountdown()