@props(['user' => null, 'userTypes'])

@php
    $isEdit = !is_null($user);

    $userStatuses = [
        ['value' => '1', 'label' => 'Ativo'],
        ['value' => '0', 'label' => 'Inativo'],
    ];
@endphp

<div class="card py-4 px-4">

    <div class="row mb-3">
        <div class="col-6">
            <div class="form-group">
                <label for="user_type_id">Tipo de Utilizador<span class="handle-error">*</span></label>
                <select name="user_type_id" id="user_type_id" class="form-select">
                    <option value="">Selecionar</option>
                    @foreach ($userTypes as $type)
                        <option value="{{ $type['id'] }}" 
                            {{ old('user_type_id', $user->user_type_id ?? '') == $type['id'] ? 'selected' : '' }}>
                            {{ $type['name'] }}
                        </option>
                    @endforeach
                </select>
                @error('user_type_id')
                    <div class="error handle-error">{{ $message }}</div>
                @enderror
            </div>
        </div>

        <div class="col-6">
            <div class="form-group">
                <label for="name">Nome<span class="handle-error">*</span></label>
                <input type="text" name="name" id="name" class="form-control"
                    value="{{ old('name', $user->name ?? '') }}">
                @error('name')
                    <div class="error handle-error">{{ $message }}</div>
                @enderror
            </div>
        </div>
    </div>

    <div class="row mb-3">

        <div class="col-6">
            <div class="form-group">
                <label for="email">Email<span class="handle-error">*</span></label>
                <input type="email" name="email" id="email" class="form-control"
                    value="{{ old('email', $user->email ?? '') }}">
                @error('email')
                    <div class="error handle-error">{{ $message }}</div>
                @enderror
            </div>
        </div>

        <div class="col-6">
            <div class="form-group">
                <label for="photo_img">Foto de Perfil</label>

                <div class="d-flex align-items-center gap-0">
                    @if (!empty($user?->photo_img))
                        <x-image-preview :url="$user->photo_img" height="40" width="40" folder="profile_photos"
                            alt="Foto de Perfil" />
                    @endif

                    <input type="file" name="photo_img" id="photo_img"
                        class="form-control custom-file">

                </div>

                @error('photo_img')
                    <div class="error handle-error">{{ $message }}</div>
                @enderror
            </div>
        </div>
    </div>

    <div class="row mb-3">
        <div class="col-6">
            <div class="form-group">
                <label for="password">Password @if (!isset($user))
                        <span class="handle-error">*</span>
                    @endif
                </label>
                <input type="password" name="password" id="password" class="form-control"
                    {{ isset($user) ? '' : '' }}>
                @error('password')
                    <div class="error handle-error">{{ $message }}</div>
                @enderror
            </div>
        </div>

        <div class="col-6">
            <div class="form-group">
                <label for="password_confirmation">Confirmar Password @if (!isset($user))
                        <span class="handle-error">*</span>
                    @endif
                </label>
                <input type="password" name="password_confirmation" id="password_confirmation" class="form-control"
                    {{ isset($user) ? '' : '' }}>
                @error('password_confirmation')
                    <div class="error handle-error">{{ $message }}</div>
                @enderror
            </div>
        </div>
    </div>

    <div class="row mb-3">
        <div class="col-6">
            <div class="form-group">
                <label for="phone">Telefone</label>
                <input type="text" name="phone" id="phone" class="form-control"
                    value="{{ old('phone', $user->phone ?? '') }}">

                @error('phone')
                    <div class="error handle-error">{{ $message }}</div>
                @enderror    
            </div>
        </div>

        <div class="col-6">
            <div class="form-group">
                <label for="is_active">Estado<span class="handle-error">*</span></label>
                <select name="is_active" id="is_active" class="form-select">
                    <option value="">Selecionar</option>
                    <option value="1" {{ old('is_active', $user->is_active ?? '') == '1' ? 'selected' : '' }}>Ativo</option>
                    <option value="0" {{ old('is_active', $user->is_active ?? '') == '0' ? 'selected' : '' }}>Inativo</option>
                </select>

                @error('is_active')
                    <div class="error handle-error">{{ $message }}</div>
                @enderror
            </div>
        </div>
    </div>

    <div class="text-end my-4">
        <button type="submit" class="btn btn-sm btn-primary">
            {{ $isEdit ? 'Guardar' : 'Criar'}} <i class="fa-light fa-floppy-disk"></i>
        </button>
    </div>

</div>