@extends('admin.auth')
@section('content')
<div class="d-flex flex-center flex-column align-items-stretch h-lg-100 w-md-400px">
    <div class="d-flex flex-center flex-column flex-column-fluid pb-15 pb-lg-20">
        @if(isset($_GET['resetStatus']) && $_GET['resetStatus'])
            <div class="alert alert-success d-flex align-items-center p-5 mb-10">
                <i class="ki-duotone ki-shield-tick fs-2hx text-success me-4">
                    <span class="path1"></span>
                    <span class="path2"></span>
                </i>
                <div class="d-flex flex-column">
                    <span class="fw-semibold">Se le ha enviado un email de solicitud de cambio de contraseña.</span>
                </div>
            </div>
        @endif

        @include('admin._includes.flash')

        {!! Form::open(['method' => 'post', 'class' => 'form w-100', 'id' => 'kt_form', 'novalidate' => 'novalidate']) !!}
        <div class="text-center mb-11"><h1 class="text-dark fw-bolder mb-3">Inicia sesión</h1></div>
                <div class="fv-row form-floating mb-8">
                    {!! Form::email('email', null, ['class' => 'form-control bg-transparent', 'autocomplete' => 'off', 'placeholder' => 'name@example.com']) !!}
                    <label for="email">Correo eléctronico</label>
                </div>
                <div class="fv-row form-floating mb-8">
                    {!! Form::password('password', ['class' => 'form-control bg-transparent', 'autocomplete' => 'off', 'placeholder' => 'Contraseña']) !!}
                    <label for="password">Contraseña</label>
                </div>
                <div class="d-flex flex-stack flex-wrap gap-3 fs-base fw-semibold mb-8">
                    <div class="mb-3">
                        <label class="form-check form-check-inline">
                            {!! Form::checkbox('rememberme', 1, null, ['class' => 'form-check-input']) !!}
                            <span class="form-check-label fw-semibold text-gray-700 fs-6 ms-1">Recordarme</span>
                        </label>
                    </div>
                    <a href="{{route('password.request')}}" class="link-primary">¿Olvidaste tu contraseña?</a>
                </div>
                <div class="d-grid mb-10">
                    <button type="submit" id="kt_submit" class="btn btn-primary">Continuar</button>
                </div>
            {!! Form::close() !!}
        </div>
    </div>
@endsection
@push('scripts')
    <script>

        let validator
        const form = document.querySelector('#kt_form');
        const submitButton = document.querySelector('#kt_submit');

        KTUtil.onDOMContentLoaded(function() {

            validator = FormValidation.formValidation(form, {
				fields: {
					'email': { validators: { notEmpty: { message: 'Ingresá tu correo' }}},
                    'password': { validators: { notEmpty: { message: 'Ingresá tu contraseña' }}}
				},
				plugins: {
					trigger: new FormValidation.plugins.Trigger(),
                    submitButton: new FormValidation.plugins.SubmitButton(),
					bootstrap: new FormValidation.plugins.Bootstrap5({
                        rowSelector: '.fv-row',
                        eleInvalidClass: 'is-invalid border-danger',
                        eleValidClass: '',
                    })
				}
			});

            submitButton.addEventListener('click', function (e) {
                e.preventDefault();
                submitButton.disabled = true;
                validator.validate().then(function (status) {
                    submitButton.disabled = false;
                    if (status == 'Valid') {
                        form.submit();
                    }
                });
            });
        });
    </script>
@endpush