refactor(api): 重构 HTTP模块并优化错误处理

- 将 http.ts 重命名为 http.js
- 添加全局错误处理逻辑
- 更新 API 调用和错误处理方式
- 优化登录页面的验证码发送逻辑
- 调整消息组件的显示位置

app/api/auth/index.js

@@ -1,4 +1,4 @@
-import { getHttp } from '@/api/http.ts'
+import { getHttp } from '~/api/http.js'
 
 export async function senCode(data) {
     const http = getHttp()

app/api/http.js

@@ -1,19 +1,17 @@
-import type { $Fetch } from 'ofetch'
 
 import { useRuntimeConfig } from '#app'
 import { ofetch } from 'ofetch'
+import {message} from '@/components/x-message/useMessage.js'
+let httpStatusErrorHandler
 
-type HttpStatusErrorHandler = (message: string, statusCode: number) => void
+let http
-let httpStatusErrorHandler: HttpStatusErrorHandler
-
-let http: $Fetch
 
 export function setupHttp() {
   if (http)
     return http
 
   const config = useRuntimeConfig()
-  const baseURL = config.public.NUXT_PUBLIC_API_BASE as string
+  const baseURL = config.public.NUXT_PUBLIC_API_BASE
 
   http = ofetch.create({
     baseURL,
@@ -26,7 +24,13 @@ export function setupHttp() {
         ...(token && { Authorization: token }),
       }
     },
+    async onResponse({ response }) {
+     if (response._data.status===1){
+       message.warning(response._data.msg)
+     }
+    },
     async onResponseError({ response }) {
+      console.log('error错误')
       const { message } = response._data
       if (Array.isArray(message)) {
         message.forEach((item) => {
@@ -43,7 +47,7 @@ export function setupHttp() {
   })
 }
 
-export function injectHttpStatusErrorHandler(handler: HttpStatusErrorHandler) {
+export function injectHttpStatusErrorHandler(handler) {
   httpStatusErrorHandler = handler
 }
 

app/components/x-message/index.vue

@@ -28,7 +28,7 @@ defineExpose({ showMessage })
       v-if="visible" 
       :text="messageText" 
       :type="messageType" 
-      class="fixed top-20px left-1/2 -translate-x-1/2 z-9999"
+      class="fixed top-50px left-1/2 -translate-x-1/2 z-9999"
     />
   </transition>
 </template>

app/pages/login/index.vue

@@ -11,10 +11,14 @@ definePageMeta({
   title: '登录',
   i18n: 'login.title',
 })
+const loadingRef=ref({
+  loading1:false
+})
+const isExist=ref(false)//帐号是否存在  true存在
+const isReal=ref(false) //isReal 是否实名过
 function goToPage() {
   router.push('/countryRegion');
 }
-
 const phoneNum = ref('')
 const code = ref('')
 const pane = ref(0)
@@ -63,13 +67,19 @@ watch(locale, () => {
 })
 const vanSwipeRef=ref(null)
 const getCode =async () => {
-/* const res=await senCode({
+  loadingRef.value.loading1=true
+ const res=await senCode({
    telNum:phoneNum.value,
    zone:selectedZone.value
- })*/
+ })
-  pane.value = 1
+  loadingRef.value.loading1=false
-  vanSwipeRef.value?.swipeTo(pane.value)
+  if (res.status===0){
-  showKeyboard.value=true
+
+    pane.value = 1
+    vanSwipeRef.value?.swipeTo(pane.value)
+    showKeyboard.value=true
+  }
+
 }
 const goBack = () => {
   code.value = ''
@@ -88,7 +98,7 @@ const goLogin = () => {
     </div>
     <van-swipe ref="vanSwipeRef" :show-indicators="false" :touchable="false" :lazy-render="true" :loop="false">
       <van-swipe-item >
-        <div v-if="pane===0">
+        <div v-show="pane===0">
           <div class="">
             <div class="w-full flex justify-between" @click="goToPage">
               <div class="text-[16px] text-[#000]">
@@ -108,7 +118,7 @@ const goLogin = () => {
             <div />
           </div>
           <div class="mt-[55px]">
-            <van-button v-if="phoneNum" type="primary" block style="height: 48px" @click="getCode">{{ $t('login.getCode')
+            <van-button :loading="loadingRef.loading1" v-if="phoneNum" :loading-text="$t('login.getCode')" type="primary" block style="height: 48px" @click="getCode">{{ $t('login.getCode')
               }}</van-button>
             <van-button v-else type="primary" color="#D3D3D3" block style="height: 48px">{{ $t('login.getCode')
               }}</van-button>
@@ -116,13 +126,12 @@ const goLogin = () => {
         </div>
       </van-swipe-item>
       <van-swipe-item>
-        <div v-if="pane===1">
+        <div v-show="pane===1">
           <div class="flex mb-[16px]">
             <div class="text-[16px] text-[#BDBDBD] mr-[10px]">{{ $t('login.hasSendTo') }}</div>
             <div class="text-[16px] text-[#000]">+{{ selectedZone }} {{ phoneNum }}</div>
           </div>
           <van-password-input :value="code" :gutter="10" :mask="false" focused @focus="showKeyboard = true" />
-
           <div class="text-#2B53AC text-14px">
             {{ $t('login.reSend') }}
           </div>