@extends('theme::layout')

@section('title', __('Créer un compte'))
@section('description', __('Créer un compte'))

@section('content')
    <div class="container pb-5 pt-5">
        <div class="row justify-content-center">
            <div class="col-md-8">
                <h1 class="fw-bold text-tertiary text-uppercase text-center">
                    {{ __('S\'inscrire au club :company', ['company' => $settingsGlobal->company]) }}</h1>

                <form class="container-fluid" method="POST" action="{{ route('fo.register') }}">
                    @csrf

                    <div class="row justify-content-center mb-3">
                        <div class="col-md-8">
                            <span class="h2 d-block text-center">{{ __("Merci de renseigner les champs ci-dessous\u{00A0}:") }}</span>
                        </div>
                    </div>

                    <fieldset class="mb-3">
                        <legend class="text-center">{{ __('Votre profil') }}</legend>

                        <div class="container-fluid">
                            <div class="row justify-content-center">
                                <div class="col col-md-10 col-lg-8 py-2">
                                    <div class="form-floating">
                                        <input class="form-control @if ($errors->has('lastname')) is-invalid @endif mx-auto"
                                            id="register-lastname" name="lastname" type="text"
                                            value="{{ old('lastname', $crmCustomer->lastname ?? null) }}" placeholder="{{ __('Nom') }}*"
                                            autocomplete="given-name" required />
                                        <label for="register-lastname">{{ __('Nom') }}*</label>
                                        @foreach ($errors->get('lastname') as $message)
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @endforeach
                                    </div>
                                </div>
                            </div>

                            <div class="row justify-content-center">
                                <div class="col col-md-10 col-lg-8 py-2">
                                    <div class="form-floating">
                                        <input class="form-control @if ($errors->has('firstname')) is-invalid @endif mx-auto"
                                            id="register-firstname" name="firstname" type="text"
                                            value="{{ old('firstname', $crmCustomer->firstname ?? null) }}" placeholder="{{ __('Prénom') }}*"
                                            autocomplete="family-name" required />
                                        <label for="register-firstname">{{ __('Prénom') }}*</label>
                                        @foreach ($errors->get('firstname') as $message)
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @endforeach
                                    </div>
                                </div>
                            </div>

                            <div class="row justify-content-center">
                                <div class="col col-md-10 col-lg-8 py-2">
                                    <div class="form-floating">
                                        @php
                                            $dataBirthDate = [
                                                'id' => 'register-birth_date',
                                                'class' => 'form-control mx-auto ' . ($errors->has('birth_date') ? 'is-invalid' : ''),
                                                'name' => 'birth_date',
                                                'placeholder' => __('Date de naissance'),
                                                'autocomplete' => 'bday',
                                                'required' => true,
                                                'value' => old('birth_date', $crmCustomer->birth_date ?? null),
                                            ];
                                        @endphp
                                        <div class="input-birth-date form-floating" data-json='@json($dataBirthDate)'></div>
                                        @foreach ($errors->get('birth_date') as $message)
                                            <div class="invalid-feedback d-block">{{ $message }}</div>
                                        @endforeach
                                    </div>
                                </div>
                            </div>
                        </div>
                    </fieldset>

                    <fieldset class="mb-3">
                        <legend class="text-center">{{ __('Vos coordonnées') }}</legend>

                        <div class="row justify-content-center">
                            <div class="col col-md-10 col-lg-8 py-2">
                                <div class="form-floating">
                                    <input class="form-control @if ($errors->has('address')) is-invalid @endif mx-auto"
                                        id="register-address" name="address" type="text"
                                        value="{{ old('address', $crmCustomer->address ?? null) }}" placeholder="{{ __('Adresse') }}*"
                                        autocomplete="street-address" required />
                                    <label for="register-address">{{ __('Adresse') }}*</label>
                                    @foreach ($errors->get('address') as $message)
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @endforeach
                                </div>
                            </div>
                        </div>

                        <div class="row justify-content-center">
                            <div class="col col-md-10 col-lg-8 py-2">
                                <div class="form-floating">
                                    <input class="form-control @if ($errors->has('address2')) is-invalid @endif mx-auto"
                                        id="register-address2" name="address2" type="text"
                                        value="{{ old('address2', $crmCustomer->address2 ?? null) }}"
                                        placeholder="{{ __('Adresse complément') }}" />
                                    <label for="register-address2">{{ __('Adresse complément') }}</label>
                                    @foreach ($errors->get('address2') as $message)
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @endforeach
                                </div>
                            </div>
                        </div>

                        <div class="row justify-content-center">
                            <div class="col col-md-10 col-lg-8 py-2">
                                <div class="form-floating">
                                    <input class="form-control @if ($errors->has('city')) is-invalid @endif mx-auto" id="register-city"
                                        name="city" type="text" value="{{ old('city', $crmCustomer->city ?? null) }}"
                                        placeholder="{{ __('Ville') }}*" autocomplete="address-level2" required />
                                    <label for="register-city">{{ __('Ville') }}*</label>
                                    @foreach ($errors->get('city') as $message)
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @endforeach
                                </div>
                            </div>
                        </div>

                        <div class="row justify-content-center">
                            <div class="col col-md-10 col-lg-8 py-2">
                                <div class="form-floating">
                                    <input class="form-control @if ($errors->has('postcode')) is-invalid @endif mx-auto"
                                        id="register-postcode" name="postcode" type="text"
                                        value="{{ old('postcode', $crmCustomer->postcode ?? null) }}" placeholder="{{ __('Code postal') }}*"
                                        autocomplete="postal-code" required />
                                    <label for="register-postcode">{{ __('Code postal') }}*</label>
                                    @foreach ($errors->get('postcode') as $message)
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @endforeach
                                </div>
                            </div>
                        </div>
                    </fieldset>

                    <fieldset class="mb-3">
                        <legend class="text-center">{{ __('Vos identifiants') }}</legend>

                        <div class="container-fluid">
                            <div class="row justify-content-center">
                                <div class="col col-md-10 col-lg-8 py-2">
                                    <div class="form-floating">
                                        <input class="form-control @if ($errors->has('email')) is-invalid @endif mx-auto"
                                            id="register-email" name="email" type="email"
                                            value="{{ old('email', $crmCustomer->email ?? null) }}"
                                            placeholder="{{ __('Votre adresse email') }}*" autocomplete="email"
                                            @if (!empty($displayEdit)) disabled @else required @endif />
                                        <label for="register-email">{{ __('Votre adresse email') }}*</label>
                                        @foreach ($errors->get('email') as $message)
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @endforeach
                                    </div>
                                </div>
                            </div>

                            @if (empty($displayEdit))
                                <div class="row justify-content-center">
                                    <div class="col col-md-10 col-lg-8 input-group d-flex justify-content-center py-2">
                                        <div class="input-group has-validation">
                                            <div class="form-floating @if ($errors->has('password')) is-invalid @endif">
                                                <input
                                                    class="form-control rounded-0 rounded-start @if ($errors->has('password')) is-invalid @endif"
                                                    id="register-password" name="password" type="password"
                                                    placeholder="{{ __('Mot de passe') }}*" autocomplete="new-password" required />
                                                <label for="register-password">{{ __('Mot de passe') }}*</label>
                                            </div>
                                            @php $dataPassword = ['inputId' => 'register-password']; @endphp
                                            <span class="password-visibility p-0" data-json='@json($dataPassword)'></span>
                                            @foreach ($errors->get('password') as $message)
                                                <div class="invalid-feedback">{{ $message }}</div>
                                            @endforeach
                                        </div>
                                    </div>
                                </div>

                                <div class="row justify-content-center">
                                    <div class="col col-md-10 col-lg-8 input-group d-flex justify-content-center py-2">
                                        <div class="input-group has-validation">
                                            <div class="form-floating @if ($errors->has('password_confirmation')) is-invalid @endif">
                                                <input
                                                    class="form-control rounded-0 rounded-start @if ($errors->has('password_confirmation')) is-invalid @endif"
                                                    id="register-password-confirmation" name="password_confirmation" type="password"
                                                    placeholder="{{ __('Confirmer votre mot de passe') }}*" autocomplete="new-password"
                                                    required />
                                                <label for="register-password-confirmation">{{ __('Confirmer votre mot de passe') }}*</label>
                                            </div>
                                            @php $dataConfirmPassword = ['inputId' => 'register-password-confirmation']; @endphp
                                            <span class="password-visibility p-0" data-json='@json($dataConfirmPassword)'></span>
                                            @foreach ($errors->get('password_confirmation') as $message)
                                                <div class="invalid-feedback">{{ $message }}</div>
                                            @endforeach
                                        </div>
                                    </div>
                                </div>

                                @include('theme::auth.password-min-strength')
                            @endif
                        </div>
                    </fieldset>

                    <div class="row justify-content-center">
                        <div class="col col-md-8 px-0 py-2">
                            <div class="form-check text-start">
                                <input class="form-check-input @if ($errors->has('opt_in')) is-invalid @endif me-1" id="register-optin"
                                    name="opt_in" type="checkbox">
                                <label class="form-check-label fw-bold w-fit" for="register-optin" role="button">
                                    {{ __('Je souhaite m\'inscrire à la newsletter') }} {{ $settingsGlobal->company }}
                                </label>
                            </div>
                            @foreach ($errors->get('opt_in') as $message)
                                <div class="invalid-feedback d-block">{{ $message }}</div>
                            @endforeach
                        </div>
                    </div>

                    <div class="row justify-content-center mb-5">
                        <div class="col col-md-8 px-0 py-2">
                            <div class="form-check">
                                <input class="form-check-input @if ($errors->has('ok_cgv')) is-invalid @endif me-1"
                                    id="register-ok-cgv" name="ok_cgv" type="checkbox" required />
                                <label class="form-check-label fw-bold w-fit" for="register-ok-cgv" role="button">
                                    {!! clean(
                                        __('J\'ai lu et accepte le :a règlement du jeu :enda', [
                                            'a' => '<a href="' . route('fo.reglement') . '" target="_blank">',
                                            'enda' => '</a>',
                                        ]),
                                    ) !!}
                                </label>
                            </div>
                            @foreach ($errors->get('ok_cgv') as $message)
                                <div class="invalid-feedback d-block">{{ $message }}</div>
                            @endforeach
                        </div>
                    </div>

                    <div class="row mb-2">
                        <div class="col-md-6 offset-md-4">
                            <button class="btn btn-lg btn-tertiary" type="submit">
                                {{ __('Register') }}
                            </button>
                        </div>
                    </div>

                    <div class="row mb-0">
                        <div class="col-md-6 offset-md-4">
                            <span class="fw-bold">{{ __('* champs obligatoires') }}</span>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection