Compare commits
No commits in common. "575fcae049a2fb399cfd66b4f494f91d12986880" and "8207170a0115fcb172c262a27cb5f8f6c659ea8a" have entirely different histories.
575fcae049
...
8207170a01
@ -9,7 +9,7 @@ let http
|
|||||||
// HTTP 状态码映射 - 使用i18n国际化
|
// HTTP 状态码映射 - 使用i18n国际化
|
||||||
export function setupHttp() {
|
export function setupHttp() {
|
||||||
if (http) return http
|
if (http) return http
|
||||||
const {codeToken}= codeAuthStore()
|
const {token}= codeAuthStore()
|
||||||
const config = useRuntimeConfig()
|
const config = useRuntimeConfig()
|
||||||
const baseURL = config.public.NUXT_PUBLIC_API_COLLECT_CODE
|
const baseURL = config.public.NUXT_PUBLIC_API_COLLECT_CODE
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
@ -43,7 +43,7 @@ export function setupHttp() {
|
|||||||
// 添加 token
|
// 添加 token
|
||||||
options.headers = {
|
options.headers = {
|
||||||
...options.headers,
|
...options.headers,
|
||||||
Authorization: codeToken.value,
|
Authorization: token.value,
|
||||||
'accept-language': i18n.locale.value
|
'accept-language': i18n.locale.value
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -8,7 +8,7 @@ import {message} from '@/components/x-message/useMessage.js'
|
|||||||
import FingerprintJS from '@fingerprintjs/fingerprintjs'
|
import FingerprintJS from '@fingerprintjs/fingerprintjs'
|
||||||
import {checkPhone, mobileLogin, userSend} from "@/api-collect-code/auth/index.js";
|
import {checkPhone, mobileLogin, userSend} from "@/api-collect-code/auth/index.js";
|
||||||
|
|
||||||
const {userInfo, codeToken, fingerprint} = codeAuthStore()
|
const {userInfo, token, fingerprint} = codeAuthStore()
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const {locale} = useI18n()
|
const {locale} = useI18n()
|
||||||
@ -49,31 +49,27 @@ const checkFingerprint = async () => {
|
|||||||
await router.push('/collectCode/mine')
|
await router.push('/collectCode/mine')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const codeInput = ref(null)
|
|
||||||
const isFocused = ref(false)
|
const isFocused = ref(false)
|
||||||
checkFingerprint()
|
checkFingerprint()
|
||||||
const vanSwipeRef = ref(null)
|
const vanSwipeRef = ref(null)
|
||||||
const getCode = async () => {
|
const getCode = async () => {
|
||||||
loadingRef.value.loading1 = true
|
loadingRef.value.loading1 = true
|
||||||
try {
|
const res = await checkPhone({
|
||||||
const res = await checkPhone({
|
tel: phoneNum.value,
|
||||||
tel: phoneNum.value,
|
})
|
||||||
})
|
loadingRef.value.loading1 = false
|
||||||
|
if (res.status === 0) {
|
||||||
|
const res = await userSend({telNum: phoneNum.value, zone: '+86'})
|
||||||
if (res.status === 0) {
|
if (res.status === 0) {
|
||||||
const sendRes = await userSend({telNum: phoneNum.value, zone: '+86'})
|
pane.value = 1
|
||||||
startCountdown()
|
vanSwipeRef.value?.swipeTo(pane.value)
|
||||||
pane.value = 1
|
nextTick(()=>{
|
||||||
await nextTick()
|
codeInput.value.focus()
|
||||||
vanSwipeRef.value?.swipeTo(pane.value)
|
})
|
||||||
nextTick(() => {
|
|
||||||
codeInput.value?.focus()
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
} catch (error) {
|
|
||||||
console.error('获取验证码失败:', error)
|
|
||||||
} finally {
|
|
||||||
loadingRef.value.loading1 = false
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
const changeToPwd = async () => {
|
const changeToPwd = async () => {
|
||||||
loginType.value = loginType.value === 0 ? 1 : 0
|
loginType.value = loginType.value === 0 ? 1 : 0
|
||||||
@ -92,7 +88,7 @@ const goLogin = async () => {
|
|||||||
})
|
})
|
||||||
if (res.status === 0) {
|
if (res.status === 0) {
|
||||||
userInfo.value = res.data.accountInfo
|
userInfo.value = res.data.accountInfo
|
||||||
codeToken.value = res.data.token
|
token.value = res.data.token
|
||||||
fingerprint.value = await getFingerprint()
|
fingerprint.value = await getFingerprint()
|
||||||
|
|
||||||
await router.push('/collectCode/mine');
|
await router.push('/collectCode/mine');
|
||||||
@ -108,121 +104,111 @@ const togglePasswordVisibility = () => {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="grow-1 w-[100vw] bg-[url('@/static/images/asdfsdd.png')] bg-bottom bg-cover px-[31px] pt-[86px]">
|
<div class="h-[100vh] w-[100vw] bg-[url('@/static/images/asdfsdd.png')] bg-cover px-[31px] pt-[86px]">
|
||||||
<div class="w-full flex justify-center mb-[100px] flex-col items-center">
|
<div class="w-full flex justify-center mb-[100px] flex-col items-center">
|
||||||
<img class="h-[105px] w-[189px]" src="@/static/images/ghfggff.png" alt="">
|
<img class="h-[105px] w-[189px]" src="@/static/images/ghfggff.png" alt="">
|
||||||
<img class="h-[29px] w-[108px]" src="@/static/images/qrcodetext.png" alt="">
|
<img class="h-[29px] w-[108px]" src="@/static/images/qrcodetext.png" alt="">
|
||||||
</div>
|
</div>
|
||||||
<van-swipe ref="vanSwipeRef" :show-indicators="false" :touchable="false" :lazy-render="true" :loop="false">
|
<van-swipe ref="vanSwipeRef" :show-indicators="false" :touchable="false" :lazy-render="true" :loop="false">
|
||||||
<van-swipe-item>
|
<van-swipe-item>
|
||||||
<div v-if="pane === 0">
|
<div v-show="pane === 0">
|
||||||
<div>
|
<div class="">
|
||||||
<div class="">
|
<div class="border-b-[1.7px] mt-[8px]">
|
||||||
<div class="border-b-[1.7px] mt-[8px]">
|
<van-field v-model="phoneNum" clearable :placeholder="$t('collectCode.login.phoneNumberPlaceholder')">
|
||||||
<van-field v-model="phoneNum" clearable :placeholder="$t('collectCode.login.phoneNumberPlaceholder')">
|
<template #label>
|
||||||
<template #label>
|
<div class="text-[16px] text-[#1A1A1A] flex align-center justify-start">
|
||||||
<div class="text-[16px] text-[#1A1A1A] flex align-center justify-start">
|
{{ $t('collectCode.login.phoneNumber') }}
|
||||||
{{ $t('collectCode.login.phoneNumber') }}
|
</div>
|
||||||
</div>
|
</template>
|
||||||
</template>
|
</van-field>
|
||||||
</van-field>
|
</div>
|
||||||
</div>
|
<div class="border-b-[1.7px] mt-[8px]" v-show="loginType === 1">
|
||||||
<div class="border-b-[1.7px] mt-[8px]" v-if="loginType === 1">
|
<van-field
|
||||||
<van-field
|
v-model="password"
|
||||||
v-model="password"
|
:type="showPassword ? 'text' : 'password'"
|
||||||
:type="showPassword ? 'text' : 'password'"
|
clearable
|
||||||
clearable
|
:placeholder="$t('collectCode.login.passwordPlaceholder')"
|
||||||
:placeholder="$t('collectCode.login.passwordPlaceholder')"
|
>
|
||||||
>
|
<template #label>
|
||||||
<template #label>
|
<div class="text-[16px] text-[#1A1A1A] flex align-center justify-start">
|
||||||
<div class="text-[16px] text-[#1A1A1A] flex align-center justify-start">
|
{{ $t('collectCode.login.password') }}
|
||||||
{{ $t('collectCode.login.password') }}
|
</div>
|
||||||
</div>
|
</template>
|
||||||
</template>
|
<template #button>
|
||||||
<template #button>
|
<div class="flex justify-center items-center">
|
||||||
<div class="flex justify-center items-center">
|
<van-icon
|
||||||
<van-icon
|
size="20"
|
||||||
size="20"
|
:name="showPassword ? 'eye-o' : 'closed-eye'"
|
||||||
:name="showPassword ? 'eye-o' : 'closed-eye'"
|
@click="togglePasswordVisibility"
|
||||||
@click="togglePasswordVisibility"
|
/>
|
||||||
/>
|
</div>
|
||||||
</div>
|
</template>
|
||||||
</template>
|
</van-field>
|
||||||
</van-field>
|
</div>
|
||||||
</div>
|
<div class="flex justify-end mt-[10px]">
|
||||||
<div class="flex justify-end mt-[10px]">
|
<div class="text-[14px] text-[#2B53AC]" @click="changeToPwd">
|
||||||
<div class="text-[14px] text-[#2B53AC]" @click="changeToPwd">
|
{{ loginType === 0 ? $t('collectCode.login.passwordLogin') : $t('collectCode.login.codeLogin') }}
|
||||||
{{ loginType === 0 ? $t('collectCode.login.passwordLogin') : $t('collectCode.login.codeLogin') }}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-[55px]">
|
<div/>
|
||||||
<div v-if="loginType === 0">
|
</div>
|
||||||
<van-button :loading="loadingRef.loading1" v-if="phoneNum" :loading-text="$t('collectCode.login.getCode')"
|
<div class="mt-[55px]">
|
||||||
type="primary" block style="height: 48px" @click="getCode">{{
|
<div v-if="loginType === 0">
|
||||||
$t('collectCode.login.getCode')
|
<van-button :loading="loadingRef.loading1" v-if="phoneNum" :loading-text="$t('collectCode.login.getCode')"
|
||||||
}}
|
type="primary" block style="height: 48px" @click="getCode">{{ $t('collectCode.login.getCode') }}
|
||||||
</van-button>
|
</van-button>
|
||||||
<van-button v-else type="primary" color="#D3D3D3" block style="height: 48px">
|
<van-button v-else type="primary" color="#D3D3D3" block style="height: 48px">{{ $t('collectCode.login.getCode') }}</van-button>
|
||||||
{{ $t('collectCode.login.getCode') }}
|
</div>
|
||||||
</van-button>
|
<div v-else>
|
||||||
</div>
|
<van-button type="primary" v-if="password" block :loading="loadingRef.loading2" :loading-text="$t('collectCode.login.login')"
|
||||||
<div v-else>
|
style="height: 48px;margin-top:10px" @click="goLogin">{{ $t('collectCode.login.login') }}
|
||||||
<van-button type="primary" v-if="password" block :loading="loadingRef.loading2"
|
</van-button>
|
||||||
:loading-text="$t('collectCode.login.login')"
|
<van-button v-else type="primary" color="#D3D3D3" block style="height: 48px">{{ $t('collectCode.login.login') }}</van-button>
|
||||||
style="height: 48px;margin-top:10px" @click="goLogin">{{ $t('collectCode.login.login') }}
|
|
||||||
</van-button>
|
|
||||||
<van-button v-else type="primary" color="#D3D3D3" block style="height: 48px">
|
|
||||||
{{ $t('collectCode.login.login') }}
|
|
||||||
</van-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</van-swipe-item>
|
</van-swipe-item>
|
||||||
<van-swipe-item>
|
<van-swipe-item>
|
||||||
<div v-if="pane == 1">
|
<div v-show="pane === 1">
|
||||||
<div>
|
<div class="flex mb-[16px]">
|
||||||
<div class="flex mb-[16px]">
|
<div class="text-[16px] text-[#BDBDBD] mr-[10px]">{{ $t('collectCode.login.hasSendTo') }}</div>
|
||||||
<div class="text-[16px] text-[#BDBDBD] mr-[10px]">{{ $t('collectCode.login.hasSendTo') }}</div>
|
<div class="text-[16px] text-[#000]">+86 {{ phoneNum }}</div>
|
||||||
<div class="text-[16px] text-[#000]">+86 {{ phoneNum }}</div>
|
</div>
|
||||||
|
<div class="relative">
|
||||||
|
<van-password-input
|
||||||
|
:value="code"
|
||||||
|
:gutter="10"
|
||||||
|
:mask="false"
|
||||||
|
:focused="isFocused"
|
||||||
|
/>
|
||||||
|
<input
|
||||||
|
v-model="code"
|
||||||
|
type="tel"
|
||||||
|
maxlength="6"
|
||||||
|
ref="codeInput"
|
||||||
|
class="opacity-0 absolute top-0 left-0 h-full w-full"
|
||||||
|
@input="code = $event.target.value.replace(/\D/g, '').slice(0, 6)"
|
||||||
|
@focus="isFocused = true"
|
||||||
|
@blur="isFocused = false"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<div :class="`${countdown>0?'text-#BDBDBD':'text-#2B53AC'} text-14px`">
|
||||||
|
{{ $t('collectCode.login.reSend') }}<span v-if="countdown>0">({{ countdown }})</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="relative">
|
<div @click="goBack" class="text-#2B53AC text-14px">
|
||||||
<van-password-input
|
{{ $t('collectCode.login.back') }}
|
||||||
:value="code"
|
|
||||||
:gutter="10"
|
|
||||||
:mask="false"
|
|
||||||
:focused="isFocused"
|
|
||||||
/>
|
|
||||||
<input
|
|
||||||
v-model="code"
|
|
||||||
type="tel"
|
|
||||||
maxlength="6"
|
|
||||||
ref="codeInput"
|
|
||||||
class="opacity-0 absolute top-0 left-0 h-full w-full"
|
|
||||||
@input="code = $event.target.value.replace(/\D/g, '').slice(0, 6)"
|
|
||||||
@focus="isFocused = true"
|
|
||||||
@blur="isFocused = false"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex justify-between">
|
|
||||||
<div :class="`${countdown>0?'text-#BDBDBD':'text-#2B53AC'} text-14px`">
|
|
||||||
{{ $t('collectCode.login.reSend') }}<span v-if="countdown>0">({{ countdown }})</span>
|
|
||||||
</div>
|
|
||||||
<div @click="goBack" class="text-#2B53AC text-14px">
|
|
||||||
{{ $t('collectCode.login.back') }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="mt-[17px]">
|
|
||||||
<van-button v-if="code.length === 6" type="primary" block :loading="loadingRef.loading2"
|
|
||||||
:loading-text="$t('collectCode.login.login')" style="height: 48px" @click="goLogin">
|
|
||||||
{{ $t('collectCode.login.login') }}
|
|
||||||
</van-button>
|
|
||||||
<van-button v-else type="primary" color="#D3D3D3" block style="height: 48px">
|
|
||||||
{{ $t('collectCode.login.login') }}
|
|
||||||
</van-button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="mt-[17px]">
|
||||||
|
<van-button v-if="code.length === 6" type="primary" block :loading="loadingRef.loading2"
|
||||||
|
:loading-text="$t('collectCode.login.login')" style="height: 48px" @click="goLogin">
|
||||||
|
{{ $t('collectCode.login.login') }}
|
||||||
|
</van-button>
|
||||||
|
<van-button v-else type="primary" color="#D3D3D3" block style="height: 48px">
|
||||||
|
{{ $t('collectCode.login.login') }}
|
||||||
|
</van-button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</van-swipe-item>
|
</van-swipe-item>
|
||||||
</van-swipe>
|
</van-swipe>
|
||||||
|
|||||||
@ -1,7 +1,5 @@
|
|||||||
import VConsole from 'vconsole'
|
import VConsole from 'vconsole'
|
||||||
|
|
||||||
export default defineNuxtPlugin(() => {
|
export default defineNuxtPlugin(() => {
|
||||||
if (process.env.NODE_ENV !== 'production') {
|
const vConsole = new VConsole()
|
||||||
const vConsole = new VConsole()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
@ -1,6 +1,6 @@
|
|||||||
import { createGlobalState,useLocalStorage } from '@vueuse/core'
|
import { createGlobalState,useLocalStorage } from '@vueuse/core'
|
||||||
export const codeAuthStore = createGlobalState(() => {
|
export const codeAuthStore = createGlobalState(() => {
|
||||||
const codeToken=useLocalStorage('codeToken','')
|
const token=useLocalStorage('token','')
|
||||||
const RefreshToken=useLocalStorage('RefreshToken','')
|
const RefreshToken=useLocalStorage('RefreshToken','')
|
||||||
const userInfo=useLocalStorage('userInfo',{})
|
const userInfo=useLocalStorage('userInfo',{})
|
||||||
const fingerprint=useLocalStorage('fingerprint','')
|
const fingerprint=useLocalStorage('fingerprint','')
|
||||||
@ -41,7 +41,7 @@ export const codeAuthStore = createGlobalState(() => {
|
|||||||
formData,
|
formData,
|
||||||
userInfo,
|
userInfo,
|
||||||
RefreshToken,
|
RefreshToken,
|
||||||
codeToken,
|
token,
|
||||||
fingerprint
|
fingerprint
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
Loading…
Reference in New Issue
Block a user