62 lines
1.5 KiB
TypeScript
62 lines
1.5 KiB
TypeScript
import { useStore } from 'vuex';
|
|
import * as z from 'zod';
|
|
import { useField, useForm } from 'vee-validate';
|
|
import { toTypedSchema } from '@vee-validate/zod';
|
|
import { computed, watch } from 'vue';
|
|
import router, { PAGE } from '../router';
|
|
|
|
const useLoginForm = () => {
|
|
const store = useStore();
|
|
const schema = z.object({
|
|
email: z
|
|
.string()
|
|
.trim()
|
|
.min(1, 'Обязательное поле')
|
|
.email('Невалидный email')
|
|
.default(''),
|
|
password: z
|
|
.string()
|
|
.trim()
|
|
.min(1, 'Обязательное поле')
|
|
.min(6, 'Должно содержать больше 6 символов')
|
|
.default('')
|
|
})
|
|
|
|
const {handleSubmit, isSubmitting, submitCount} = useForm({
|
|
validationSchema: toTypedSchema(schema)
|
|
});
|
|
|
|
const onSubmit = handleSubmit(async (values) => {
|
|
await store.dispatch('auth/login', values);
|
|
await router.push({name: PAGE.HOME});
|
|
})
|
|
|
|
const {value: email, errorMessage: eError, handleBlur: eBlur} = useField('email');
|
|
const {value: password, errorMessage: pError, handleBlur: pBlur} = useField('password');
|
|
|
|
const isTooManyAttempts = computed(() => submitCount.value > 2);
|
|
const disabled = computed(() => isSubmitting.value || isTooManyAttempts.value)
|
|
|
|
watch(isTooManyAttempts, (value) => {
|
|
if (value) {
|
|
setTimeout(() => {
|
|
submitCount.value = 0;
|
|
}, 2000)
|
|
}
|
|
})
|
|
|
|
return {
|
|
email,
|
|
eError,
|
|
eBlur,
|
|
password,
|
|
pError,
|
|
pBlur,
|
|
disabled,
|
|
onSubmit,
|
|
isTooManyAttempts,
|
|
}
|
|
};
|
|
|
|
export default useLoginForm;
|