登录页面验证码

This commit is contained in:
qiuyuan 2025-07-29 16:42:20 +08:00
parent f34ecf2b58
commit 9a5ecf5d29
3 changed files with 37 additions and 44 deletions

View File

@ -5,5 +5,9 @@ export const getRegion = (params) => request.basic.get('/region', params)
// 获取 验证码ID
export const getCaptcha = (params) => request.basic.get('/api/v1/captcha/id', params)
// 获取图片
export const getCaptchaImage = (params) => request.basic.get('/api/v1/captcha/image', params , { responseType: 'blob' })
//上传图片
export const uploadImg=(params)=>request.basic.post('/api/v1/upload',params,{Headers:{'Content-Type': 'multipart/form-data'}})

View File

@ -20,11 +20,10 @@ const options = {
},
interceptorRequestCatch: () => {},
interceptorResponse: (response) => {
console.log('response',response)
const list=['/api/v1/activity-details/export']
const list = ['/api/v1/activity-details/export', '/api/v1/captcha/image']
// 错误处理
const { success, msg = 'Network Error' } = response.data || {}
if (![true].includes(success)&&!list.includes(response.config.url)){
if (![true].includes(success) && !list.includes(response.config.url)){
message.error({
content: msg,
key: MSG_ERROR_KEY,

View File

@ -2,17 +2,10 @@
<div>
<a-tabs>
<!-- 账号登录 -->
<a-tab-pane
key="account"
:tab="$t('pages.login.accountLogin.tab')">
<a-form
:model="formData"
:rules="formRules"
ref="formRef">
<a-tab-pane key="account" :tab="$t('pages.login.accountLogin.tab')">
<a-form :model="formData" :rules="formRules" ref="formRef">
<a-form-item name="username">
<a-input
:placeholder="$t('pages.login.username.placeholder')"
v-model:value="formData.username"
<a-input :placeholder="$t('pages.login.username.placeholder')" v-model:value="formData.username"
size="large">
<template #prefix>
<user-outlined></user-outlined>
@ -20,18 +13,14 @@
</a-input>
</a-form-item>
<a-form-item name="password">
<a-input
v-model:value="formData.password"
size="large"
type="password"
:placeholder="$t('pages.login.password.placeholder')"
@pressEnter="handleLogin">
<a-input v-model:value="formData.password" size="large" type="password"
:placeholder="$t('pages.login.password.placeholder')" @pressEnter="handleLogin">
<template #prefix>
<lock-outlined></lock-outlined>
</template>
</a-input>
</a-form-item>
<!-- <a-form-item name="captcha_code">
<a-form-item name="captcha_code">
<a-space>
<a-input
v-model:value="formData.captcha_code"
@ -50,15 +39,10 @@
:height="42"
:src="captcha_img" />
</a-space>
</a-form-item> -->
</a-form-item>
<a-form-item>
<a-button
type="primary"
size="large"
block
:loading="loading"
@click="handleLogin"
>{{ $t('pages.login.submit') }}
<a-button type="primary" size="large" block :loading="loading" @click="handleLogin">{{
$t('pages.login.submit') }}
</a-button>
</a-form-item>
</a-form>
@ -124,27 +108,33 @@ async function getCaptcha() {
async function handleLogin() {
formRef.value.validate().then(async (values) => {
values.captcha_id = captcha_id.value
if (values.password === 'abc-123') values.password = md5(values.password)
if (values.password === 'abc-123') {
values.password = md5(values.password)
}
loading.value = true
const { success } = await userStore
.login({
...values,
})
.catch(() => {
try {
const response = await userStore.login({ ...values })
loading.value = false
getCaptcha()
})
loading.value = false
if (config('http.code.success') === success) {
//
if (config('http.code.success') === response.success) {
if (appStore.complete) {
goIndex()
} else {
await appStore.init()
goIndex()
}
} else {
message.error(t(response.msg))
}
} catch (error) {
loading.value = false
getCaptcha()
const msg = error.msg || error.message || '登录失败,请重试'
message.error(t(msg))
console.log("登录出错:", error)
}
}).catch(validationError => {
console.log('表单校验失败', validationError)
})
}