@extends("layouts.auth_layout")

@section("title", "ForUZONE")

@section("content")
<div class="block-auth-form">
    <a href="{{route('index')}}">
        <img draggable="false" class="image-logo image-auth" src="../images/ForUZON.png" alt="">
    </a>
    <h1 class="h1-login">Registro</h1>
    <form action="{{route('users.store')}}" method="POST" enctype="multipart/form-data">
        @csrf
        @if($errors->any())
        @foreach ($errors->all() as $error)
        <h3 class="error">{{ $error }}</h3>
        @endforeach
        @endif
        <div class="block-flex-form">
            <div class="block-form">
                <label class="lab-form" for="name">{{ __('Nome*') }}</label>
                <br>
                <input class="inp-form" type="text" name="name" value="{{ old('name') }}" required>
            </div>
            <div class="block-form">
                <label class="lab-form" for="username">{{ __('Nome de utilizador*') }}</label>
                <br>
                <input class="inp-form" type="text" name="username" value="{{ old('username') }}" required>
            </div>
        </div>
        <div class="block-flex-form">
            <div class="block-form">
                <label class="lab-form" for="email">{{ __('Email*') }}</label>
                <br>
                <input class="inp-form" type="email" name="email" value="{{ old('email') }}" pattern="[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}" required autofocus>
            </div>
            <div class="block-form">
                <label class="lab-form" for="password">{{ __('Palavra-Passe*') }}</label>
                <br>
                <input class="inp-form" type="password" name="password" autocomplete="current-password" required>
            </div>
        </div>

        <div class="block-flex-form">
            <div class="block-form">
                <label class="lab-form" for="birth">{{ __('Data de nascimento*') }}</label>
                <br>
                <input class="inp-form inp-birth" type="date" name="birth" value="{{ old('birth') }}" required>
            </div>
            <div class="block-form">
                <label class="lab-form" for="description">{{ __('Descrição do perfil') }}</label>
                <br>
                <textarea class="inp-form description" name="description" value="{{ old('description') }}"></textarea>
            </div>
        </div>

        <div class="block-flex-form">
            <div class="block-form">
                <label class="lab-form" for="inp-phone-change">{{__("Número de telemóvel")}}</label> 
                <br>
                <select class="phone-code phone-code-regis" name="phone_code" required></select><input class="inp-form inp-phone-regis" name="phone_number" type="tel" value="{{ old('phone_number') }}" pattern="\d{7,15}" required>
            </div>
            <div class="block-form block-country">{{--Coutry--}}
                <label class="lab-form" for="country">{{ __('País') }}</label>
                <br>
                <select name="country" class="country">
                    {{--Aqui ficam os países da API de países--}}
                </select>
            </div>
        </div>

        <div class="block-flex-form">
            <div class="block-form">
                <div class="form-file-profile-pic visible" enctype="multipart/form-data">
                    <label class="lab-form" for="image">{{ __('Imagem de perfil*') }}</label>
                    <br>
                    <div class="block-file-profile-pic">
                        <input class="inp-form input-file-profile-pic" type="file" name="image" value="{{ old('image') }}" accept=".jpg, .jpeg, .png" required>
                        <div class="publish-viewing-profile-pic">
                            <img class="image-thumb" src="{{asset("images/thumbAdd.png")}}" alt="Botão de adicionar imagem de perfil">
                            <span class="file-error"></span>
                        </div>
                    </div>
                </div>
                <div class="block-file-upload">{{_("Carregando...")}}</div>
                <label class="lab-form" for="image"></label>
                <br>
            </div>
            <div class="block-form">
                <div class="form-file-banner visible" action="" enctype="multipart/form-data">
                    <label class="lab-form" for="banner_image">{{ __('Imagem de banner') }}</label>
                    <br>
                    <div class="block-file-banner">
                        <input class="inp-form input-file-banner" type="file" name="banner_image" value="{{ old('banner_image') }}" accept=".jpg, .jpeg, .png">
                        <div class="publish-viewing-banner">
                            <img class="image-thumb" src="{{asset("images/thumbAdd.png")}}" alt="Botão de adicionar banner">
                            <span class="file-error"></span>
                        </div>
                    </div>
                </div>
                <div class="block-file-upload">{{_("Carregando...")}}</div>
            </div>
        </div>

        <div class="block-submit">
            <button type="submit" class="btn btn-big btn-large btn-submit">
                {{ __('Registre') }}
            </button>
            <div class="block-submit-links">
                <a class="link-nondeco password-recover" href="{{ route('login') }}">{{ __('Já tem uma conta?') }}</a>
            </div>
        </div>
    </form>
</div>
@endsection