145 lines
4.9 KiB
Vue
145 lines
4.9 KiB
Vue
<script setup lang="ts">
|
|
import { Link, useForm } from "@inertiajs/vue3";
|
|
import Button from "@/components/ui/Button.vue";
|
|
import Checkbox from "@/components/ui/Checkbox.vue";
|
|
import Input from "@/components/ui/Input.vue";
|
|
import Message from "@/components/ui/Message.vue";
|
|
import PasswordInput from "@/components/ui/PasswordInput.vue";
|
|
import SocialButtons from "@/components/SocialButtons.vue";
|
|
import { useSettings, useTranslations } from "@/composables/useVanguard";
|
|
import AuthLayout from "@/layouts/AuthLayout.vue";
|
|
|
|
const props = defineProps<{
|
|
socialProviders: string[] | null;
|
|
to?: string | null;
|
|
}>();
|
|
|
|
const { __ } = useTranslations();
|
|
const { setting } = useSettings();
|
|
|
|
const form = useForm({
|
|
username: "",
|
|
password: "",
|
|
remember: false,
|
|
to: props.to ?? null,
|
|
});
|
|
|
|
function submit() {
|
|
form.post("/login", {
|
|
onFinish: () => form.reset("password"),
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<AuthLayout :title="__('Login')">
|
|
<!-- Logo + Titolo principale (stile vecchia Blade) -->
|
|
<div class="text-center mb-6">
|
|
<img
|
|
src="/assets/img/cimac-logo.png"
|
|
:alt="setting('app_name')"
|
|
class="mx-auto h-12"
|
|
/>
|
|
<h3 class="mt-4 text-xl font-semibold tracking-wide text-slate-800">
|
|
CIMAC APPLICATION FORM
|
|
</h3>
|
|
</div>
|
|
|
|
<div class="rounded-lg border border-slate-200 bg-white shadow-sm">
|
|
<div class="p-10">
|
|
<h5
|
|
class="mt-2 mb-4 text-center text-sm font-semibold tracking-wider text-slate-600 uppercase"
|
|
>
|
|
{{ __("Login") }}
|
|
</h5>
|
|
|
|
<Message
|
|
v-if="form.errors.username"
|
|
severity="error"
|
|
class="mb-4"
|
|
>
|
|
{{ form.errors.username }}
|
|
</Message>
|
|
|
|
<form
|
|
class="space-y-4"
|
|
autocomplete="off"
|
|
@submit.prevent="submit"
|
|
>
|
|
<div>
|
|
<label for="username" class="sr-only">{{
|
|
__("Email or Username")
|
|
}}</label>
|
|
<Input
|
|
id="username"
|
|
v-model="form.username"
|
|
class="w-full"
|
|
:placeholder="__('Email or Username')"
|
|
:invalid="Boolean(form.errors.username)"
|
|
autocomplete="username"
|
|
/>
|
|
</div>
|
|
|
|
<div>
|
|
<label for="password" class="sr-only">{{
|
|
__("Password")
|
|
}}</label>
|
|
<PasswordInput
|
|
id="password"
|
|
v-model="form.password"
|
|
class="w-full"
|
|
:placeholder="__('Password')"
|
|
:invalid="Boolean(form.errors.password)"
|
|
autocomplete="current-password"
|
|
/>
|
|
<small v-if="form.errors.password" class="text-red-600">
|
|
{{ form.errors.password }}
|
|
</small>
|
|
</div>
|
|
|
|
<div
|
|
v-if="setting('remember_me')"
|
|
class="flex items-center gap-2"
|
|
>
|
|
<Checkbox v-model="form.remember" id="remember" />
|
|
<label for="remember" class="text-slate-600">
|
|
{{ __("Remember me?") }} Ricordami
|
|
</label>
|
|
</div>
|
|
|
|
<Button
|
|
type="submit"
|
|
:label="__('Log In')"
|
|
class="w-full"
|
|
size="large"
|
|
:loading="form.processing"
|
|
/>
|
|
</form>
|
|
|
|
<Link
|
|
v-if="setting('forgot_password')"
|
|
:href="route('password.request')"
|
|
class="text-primary-600 hover:text-primary-700 mt-4 inline-block text-sm"
|
|
>
|
|
{{ __("I forgot my password") }} - Ho Dimenticato la
|
|
password
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Registrazione personalizzata (stile vecchia Blade) -->
|
|
<p
|
|
v-if="setting('reg_enabled')"
|
|
class="mt-6 text-center text-slate-500"
|
|
>
|
|
Non hai un account / Don't have an account?
|
|
<a
|
|
href="auth-creation.php"
|
|
class="text-primary-600 font-bold hover:text-primary-700"
|
|
>
|
|
Registrati / Sign Up
|
|
</a>
|
|
</p>
|
|
</AuthLayout>
|
|
</template>
|