调整登录和注册表单,修改密码可见性逻辑,移除不必要的日志输出
This commit is contained in:
parent
20a3f86416
commit
2432b9a0ce
@ -1,39 +1,8 @@
|
|||||||
<!-- <template>
|
|
||||||
<v-sheet class="mx-auto text-center" min-width="50%">
|
|
||||||
<v-form fast-fail @submit.prevent="submit">
|
|
||||||
<v-container>
|
|
||||||
<v-row>
|
|
||||||
<v-col>
|
|
||||||
<h1 class="text-h2 font-weight-bold">登录</h1>
|
|
||||||
</v-col>
|
|
||||||
</v-row>
|
|
||||||
<v-spacer></v-spacer>
|
|
||||||
<v-row>
|
|
||||||
<v-col>
|
|
||||||
<v-text-field v-model="userId" :rules="userIdRules" label="账号"></v-text-field>
|
|
||||||
</v-col>
|
|
||||||
</v-row>
|
|
||||||
<v-row>
|
|
||||||
<v-col>
|
|
||||||
<v-text-field v-model="password" :rules="passwordRules" :error-messages="passwordValidate"
|
|
||||||
label="密码"></v-text-field>
|
|
||||||
</v-col>
|
|
||||||
</v-row>
|
|
||||||
|
|
||||||
<v-row>
|
|
||||||
<v-col>
|
|
||||||
<v-btn :loading="loading" width="50%" text="注册" type="submit"></v-btn>
|
|
||||||
</v-col>
|
|
||||||
</v-row>
|
|
||||||
</v-container>
|
|
||||||
</v-form>
|
|
||||||
</v-sheet>
|
|
||||||
</template> -->
|
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<v-form fast-fail @submit.prevent="submit">
|
<v-form fast-fail @submit.prevent="submit">
|
||||||
<v-img class="mx-auto my-6" max-width="228"
|
<!-- <v-img class="mx-auto my-6" max-width="228"
|
||||||
src="https://cdn.vuetifyjs.com/docs/images/logos/vuetify-logo-v3-slim-text-light.svg"></v-img>
|
src="https://cdn.vuetifyjs.com/docs/images/logos/vuetify-logo-v3-slim-text-light.svg"></v-img> -->
|
||||||
|
|
||||||
<v-card class="mx-auto pa-12 pb-8" elevation="8" max-width="448" rounded="lg">
|
<v-card class="mx-auto pa-12 pb-8" elevation="8" max-width="448" rounded="lg">
|
||||||
<v-text-field v-model="userId" prepend-inner-icon="mdi-account-circle" :rules="userIdRules"
|
<v-text-field v-model="userId" prepend-inner-icon="mdi-account-circle" :rules="userIdRules"
|
||||||
@ -42,7 +11,7 @@
|
|||||||
<v-divider :thickness="10" class="border-opacity-0"></v-divider>
|
<v-divider :thickness="10" class="border-opacity-0"></v-divider>
|
||||||
|
|
||||||
<v-text-field v-model="password" :rules="passwordRules" :error-messages="passwordValidate" label="密码"
|
<v-text-field v-model="password" :rules="passwordRules" :error-messages="passwordValidate" label="密码"
|
||||||
:append-inner-icon="visible ? 'mdi-eye-off' : 'mdi-eye'" :type="visible ? 'text' : 'password'"
|
:append-inner-icon="visible ? 'mdi-eye' : 'mdi-eye-off'" :type="visible ? 'text' : 'password'"
|
||||||
@click:append-inner="visible = !visible" prepend-inner-icon="mdi-lock-outline"></v-text-field>
|
@click:append-inner="visible = !visible" prepend-inner-icon="mdi-lock-outline"></v-text-field>
|
||||||
|
|
||||||
<v-divider :thickness="10" class="border-opacity-0"></v-divider>
|
<v-divider :thickness="10" class="border-opacity-0"></v-divider>
|
||||||
@ -82,7 +51,7 @@ import axios, { AxiosError } from 'axios';
|
|||||||
import { jwtDecode } from 'jwt-decode';
|
import { jwtDecode } from 'jwt-decode';
|
||||||
import { ref } from 'vue';
|
import { ref } from 'vue';
|
||||||
|
|
||||||
const visible = ref(true);
|
const visible = ref(false);
|
||||||
|
|
||||||
const authStore = useAuthStore();
|
const authStore = useAuthStore();
|
||||||
const storedToken = ref(authStore.token);
|
const storedToken = ref(authStore.token);
|
||||||
@ -116,7 +85,6 @@ const login = async (userId: string, password: string) => {
|
|||||||
formData.append("user_id", userId);
|
formData.append("user_id", userId);
|
||||||
formData.append("password", password);
|
formData.append("password", password);
|
||||||
let res = await axios.post('/api/auth/login', formData);
|
let res = await axios.post('/api/auth/login', formData);
|
||||||
console.log(res.data);
|
|
||||||
return res.data as LoginResponse;
|
return res.data as LoginResponse;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
let ex = e as AxiosError;
|
let ex = e as AxiosError;
|
||||||
@ -128,8 +96,8 @@ const submit = async (event: SubmitEvent) => {
|
|||||||
const results: any = await event;
|
const results: any = await event;
|
||||||
if (results.valid) {
|
if (results.valid) {
|
||||||
loading.value = true
|
loading.value = true
|
||||||
console.log('valid')
|
|
||||||
let res = await login(userId.value, password.value);
|
let res = await login(userId.value, password.value);
|
||||||
|
loading.value = false
|
||||||
if (res?.error) {
|
if (res?.error) {
|
||||||
passwordValidate.value = res.error;
|
passwordValidate.value = res.error;
|
||||||
await dialog('错误', `登录失败:${res.error}`);
|
await dialog('错误', `登录失败:${res.error}`);
|
||||||
@ -137,9 +105,7 @@ const submit = async (event: SubmitEvent) => {
|
|||||||
await dialog('信息', `登录成功,你好 ${(jwtDecode(res.token as string) as any).user_id}。`);
|
await dialog('信息', `登录成功,你好 ${(jwtDecode(res.token as string) as any).user_id}。`);
|
||||||
authStore.setToken(res.token as string);
|
authStore.setToken(res.token as string);
|
||||||
}
|
}
|
||||||
loading.value = false
|
|
||||||
}
|
}
|
||||||
console.log(2);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const userIdRules: any = [(value: string) => {
|
const userIdRules: any = [(value: string) => {
|
||||||
|
@ -1,8 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<v-form fast-fail @submit.prevent="submit">
|
<v-form fast-fail @submit.prevent="submit">
|
||||||
<v-img class="mx-auto my-6" max-width="228"
|
<!-- <v-img class="mx-auto my-6" max-width="228"
|
||||||
src="https://cdn.vuetifyjs.com/docs/images/logos/vuetify-logo-v3-slim-text-light.svg"></v-img>
|
src="https://cdn.vuetifyjs.com/docs/images/logos/vuetify-logo-v3-slim-text-light.svg"></v-img> -->
|
||||||
|
|
||||||
<v-card class="mx-auto pa-12 pb-8" elevation="8" max-width="448" rounded="lg">
|
<v-card class="mx-auto pa-12 pb-8" elevation="8" max-width="448" rounded="lg">
|
||||||
<v-text-field v-model="userId" prepend-inner-icon="mdi-account-circle" :rules="userIdRules"
|
<v-text-field v-model="userId" prepend-inner-icon="mdi-account-circle" :rules="userIdRules"
|
||||||
@ -11,7 +11,7 @@
|
|||||||
<v-divider :thickness="10" class="border-opacity-0"></v-divider>
|
<v-divider :thickness="10" class="border-opacity-0"></v-divider>
|
||||||
|
|
||||||
<v-text-field v-model="password" :rules="passwordRules" label="密码"
|
<v-text-field v-model="password" :rules="passwordRules" label="密码"
|
||||||
:append-inner-icon="visible ? 'mdi-eye-off' : 'mdi-eye'" :type="visible ? 'text' : 'password'"
|
:append-inner-icon="visible ? 'mdi-eye' : 'mdi-eye-off'" :type="visible ? 'text' : 'password'"
|
||||||
@click:append-inner="visible = !visible" prepend-inner-icon="mdi-lock-outline"></v-text-field>
|
@click:append-inner="visible = !visible" prepend-inner-icon="mdi-lock-outline"></v-text-field>
|
||||||
|
|
||||||
<v-divider :thickness="10" class="border-opacity-0"></v-divider>
|
<v-divider :thickness="10" class="border-opacity-0"></v-divider>
|
||||||
@ -49,7 +49,7 @@ import { useAuthStore } from '@/store/auth';
|
|||||||
import axios, { AxiosError } from 'axios';
|
import axios, { AxiosError } from 'axios';
|
||||||
import { inject, ref } from 'vue';
|
import { inject, ref } from 'vue';
|
||||||
|
|
||||||
const visible = ref(true);
|
const visible = ref(false);
|
||||||
const model = defineModel();
|
const model = defineModel();
|
||||||
|
|
||||||
const authStore = useAuthStore();
|
const authStore = useAuthStore();
|
||||||
@ -96,13 +96,13 @@ const submit = async (event: SubmitEvent) => {
|
|||||||
loading.value = true
|
loading.value = true
|
||||||
console.log('valid')
|
console.log('valid')
|
||||||
let res = await register(userId.value, password.value);
|
let res = await register(userId.value, password.value);
|
||||||
|
loading.value = false
|
||||||
if (res?.error) {
|
if (res?.error) {
|
||||||
dialog('错误', `注册失败:${res.error}`);
|
dialog('错误', `注册失败:${res.error}`);
|
||||||
} else {
|
} else {
|
||||||
await dialog('提示', '注册成功,请前往登录。');
|
await dialog('提示', '注册成功,请前往登录。');
|
||||||
model.value = 0;
|
model.value = 0;
|
||||||
}
|
}
|
||||||
loading.value = false
|
|
||||||
}
|
}
|
||||||
console.log(2);
|
console.log(2);
|
||||||
};
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user