refactor(api): 重构 HTTP模块并优化错误处理
- 将 http.ts 重命名为 http.js - 添加全局错误处理逻辑 - 更新 API 调用和错误处理方式 - 优化登录页面的验证码发送逻辑 - 调整消息组件的显示位置
This commit is contained in:
parent
0107ff6217
commit
4ab0a5ca81
@ -1,4 +1,4 @@
|
||||
import { getHttp } from '@/api/http.ts'
|
||||
import { getHttp } from '~/api/http.js'
|
||||
|
||||
export async function senCode(data) {
|
||||
const http = getHttp()
|
||||
|
@ -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 httpStatusErrorHandler: HttpStatusErrorHandler
|
||||
|
||||
let http: $Fetch
|
||||
let http
|
||||
|
||||
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
|
||||
}
|
||||
|
@ -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>
|
||||
|
@ -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
|
||||
vanSwipeRef.value?.swipeTo(pane.value)
|
||||
showKeyboard.value=true
|
||||
})
|
||||
loadingRef.value.loading1=false
|
||||
if (res.status===0){
|
||||
|
||||
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>
|
||||
|
Loading…
Reference in New Issue
Block a user