first commit
This commit is contained in:
80
resources/js/pages/auth/Login.vue
Normal file
80
resources/js/pages/auth/Login.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<script setup lang="ts">
|
||||
import { Head, useForm } from '@inertiajs/vue3';
|
||||
import { NButton, NCard, NCheckbox, NForm, NFormItem, NInput } from 'naive-ui';
|
||||
import { TbLock, TbMail } from 'vue-icons-plus/tb';
|
||||
import AuthLayout from '../../layouts/AuthLayout.vue';
|
||||
|
||||
const form = useForm({
|
||||
email: '',
|
||||
password: '',
|
||||
remember: false,
|
||||
});
|
||||
|
||||
const submit = (): void => {
|
||||
form.post('/login', {
|
||||
onFinish: () => form.reset('password'),
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Head title="Вход" />
|
||||
|
||||
<AuthLayout
|
||||
title="Вход в систему"
|
||||
subtitle="Защищённый сервис обработки персональных данных"
|
||||
>
|
||||
<NCard>
|
||||
<NForm @submit.prevent="submit">
|
||||
<NFormItem
|
||||
label="Email"
|
||||
:feedback="form.errors.email"
|
||||
:validation-status="form.errors.email ? 'error' : undefined"
|
||||
>
|
||||
<NInput
|
||||
v-model:value="form.email"
|
||||
type="text"
|
||||
placeholder="user@example.ru"
|
||||
autocomplete="username"
|
||||
:input-props="{ inputmode: 'email' }"
|
||||
>
|
||||
<template #prefix><TbMail /></template>
|
||||
</NInput>
|
||||
</NFormItem>
|
||||
|
||||
<NFormItem
|
||||
label="Пароль"
|
||||
:feedback="form.errors.password"
|
||||
:validation-status="
|
||||
form.errors.password ? 'error' : undefined
|
||||
"
|
||||
>
|
||||
<NInput
|
||||
v-model:value="form.password"
|
||||
type="password"
|
||||
show-password-on="click"
|
||||
placeholder="••••••••••••"
|
||||
autocomplete="current-password"
|
||||
>
|
||||
<template #prefix><TbLock /></template>
|
||||
</NInput>
|
||||
</NFormItem>
|
||||
|
||||
<div class="mb-4">
|
||||
<NCheckbox v-model:checked="form.remember">
|
||||
Запомнить меня
|
||||
</NCheckbox>
|
||||
</div>
|
||||
|
||||
<NButton
|
||||
type="primary"
|
||||
block
|
||||
attr-type="submit"
|
||||
:loading="form.processing"
|
||||
>
|
||||
Войти
|
||||
</NButton>
|
||||
</NForm>
|
||||
</NCard>
|
||||
</AuthLayout>
|
||||
</template>
|
||||
75
resources/js/pages/auth/PasswordExpired.vue
Normal file
75
resources/js/pages/auth/PasswordExpired.vue
Normal file
@@ -0,0 +1,75 @@
|
||||
<script setup lang="ts">
|
||||
import { Head, useForm } from '@inertiajs/vue3';
|
||||
import { NButton, NCard, NForm, NFormItem, NInput } from 'naive-ui';
|
||||
import AuthLayout from '../../layouts/AuthLayout.vue';
|
||||
|
||||
const form = useForm({
|
||||
current_password: '',
|
||||
password: '',
|
||||
password_confirmation: '',
|
||||
});
|
||||
|
||||
const submit = (): void =>
|
||||
form.put('/password', { onFinish: () => form.reset() });
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Head title="Смена пароля" />
|
||||
|
||||
<AuthLayout
|
||||
title="Требуется смена пароля"
|
||||
subtitle="Срок действия пароля истёк. Задайте новый (не менее 12 символов)"
|
||||
>
|
||||
<NCard>
|
||||
<NForm @submit.prevent="submit">
|
||||
<NFormItem
|
||||
label="Текущий пароль"
|
||||
:feedback="form.errors.current_password"
|
||||
:validation-status="
|
||||
form.errors.current_password ? 'error' : undefined
|
||||
"
|
||||
>
|
||||
<NInput
|
||||
v-model:value="form.current_password"
|
||||
type="password"
|
||||
show-password-on="click"
|
||||
autocomplete="current-password"
|
||||
/>
|
||||
</NFormItem>
|
||||
|
||||
<NFormItem
|
||||
label="Новый пароль"
|
||||
:feedback="form.errors.password"
|
||||
:validation-status="
|
||||
form.errors.password ? 'error' : undefined
|
||||
"
|
||||
>
|
||||
<NInput
|
||||
v-model:value="form.password"
|
||||
type="password"
|
||||
show-password-on="click"
|
||||
autocomplete="new-password"
|
||||
/>
|
||||
</NFormItem>
|
||||
|
||||
<NFormItem label="Повтор нового пароля">
|
||||
<NInput
|
||||
v-model:value="form.password_confirmation"
|
||||
type="password"
|
||||
show-password-on="click"
|
||||
autocomplete="new-password"
|
||||
/>
|
||||
</NFormItem>
|
||||
|
||||
<NButton
|
||||
type="primary"
|
||||
block
|
||||
attr-type="submit"
|
||||
:loading="form.processing"
|
||||
>
|
||||
Сохранить
|
||||
</NButton>
|
||||
</NForm>
|
||||
</NCard>
|
||||
</AuthLayout>
|
||||
</template>
|
||||
46
resources/js/pages/auth/TwoFactorChallenge.vue
Normal file
46
resources/js/pages/auth/TwoFactorChallenge.vue
Normal file
@@ -0,0 +1,46 @@
|
||||
<script setup lang="ts">
|
||||
import { Head, useForm } from '@inertiajs/vue3';
|
||||
import { NButton, NCard, NForm, NFormItem, NInput } from 'naive-ui';
|
||||
import AuthLayout from '../../layouts/AuthLayout.vue';
|
||||
|
||||
const form = useForm({ code: '' });
|
||||
const submit = (): void => form.post('/mfa/verify');
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Head title="Подтверждение входа" />
|
||||
|
||||
<AuthLayout
|
||||
title="Подтверждение входа"
|
||||
subtitle="Код из приложения-аутентификатора или резервный код"
|
||||
>
|
||||
<NCard>
|
||||
<NForm @submit.prevent="submit">
|
||||
<NFormItem
|
||||
label="Код"
|
||||
:feedback="form.errors.code"
|
||||
:validation-status="form.errors.code ? 'error' : undefined"
|
||||
>
|
||||
<NInput
|
||||
v-model:value="form.code"
|
||||
placeholder="123456"
|
||||
autofocus
|
||||
:input-props="{
|
||||
inputmode: 'numeric',
|
||||
autocomplete: 'one-time-code',
|
||||
}"
|
||||
/>
|
||||
</NFormItem>
|
||||
|
||||
<NButton
|
||||
type="primary"
|
||||
block
|
||||
attr-type="submit"
|
||||
:loading="form.processing"
|
||||
>
|
||||
Подтвердить
|
||||
</NButton>
|
||||
</NForm>
|
||||
</NCard>
|
||||
</AuthLayout>
|
||||
</template>
|
||||
64
resources/js/pages/auth/TwoFactorSetup.vue
Normal file
64
resources/js/pages/auth/TwoFactorSetup.vue
Normal file
@@ -0,0 +1,64 @@
|
||||
<script setup lang="ts">
|
||||
import { Head, useForm } from '@inertiajs/vue3';
|
||||
import {
|
||||
NButton,
|
||||
NCard,
|
||||
NForm,
|
||||
NFormItem,
|
||||
NInput,
|
||||
NQrCode,
|
||||
NText,
|
||||
} from 'naive-ui';
|
||||
import AuthLayout from '../../layouts/AuthLayout.vue';
|
||||
|
||||
defineProps<{ secret: string; qr: string }>();
|
||||
|
||||
const form = useForm({ code: '' });
|
||||
const submit = (): void => form.post('/mfa/enable');
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Head title="Настройка двухфакторной аутентификации" />
|
||||
|
||||
<AuthLayout
|
||||
title="Двухфакторная аутентификация"
|
||||
subtitle="Отсканируйте QR-код в приложении-аутентификаторе"
|
||||
>
|
||||
<NCard>
|
||||
<div class="mb-4 flex flex-col items-center gap-3">
|
||||
<NQrCode :value="qr" :size="180" />
|
||||
<NText depth="3" class="text-center text-xs">
|
||||
Или введите ключ вручную:
|
||||
<br />
|
||||
<code>{{ secret }}</code>
|
||||
</NText>
|
||||
</div>
|
||||
|
||||
<NForm @submit.prevent="submit">
|
||||
<NFormItem
|
||||
label="Код подтверждения"
|
||||
:feedback="form.errors.code"
|
||||
:validation-status="form.errors.code ? 'error' : undefined"
|
||||
>
|
||||
<NInput
|
||||
v-model:value="form.code"
|
||||
placeholder="123456"
|
||||
:input-props="{
|
||||
inputmode: 'numeric',
|
||||
autocomplete: 'one-time-code',
|
||||
}"
|
||||
/>
|
||||
</NFormItem>
|
||||
|
||||
<NButton
|
||||
type="primary"
|
||||
block
|
||||
attr-type="submit"
|
||||
:loading="form.processing"
|
||||
>
|
||||
Включить
|
||||
</NButton>
|
||||
</NForm>
|
||||
</NCard>
|
||||
</AuthLayout>
|
||||
</template>
|
||||
Reference in New Issue
Block a user