@extends('layouts.admin.theme')

@section('title', env('APP_NAME') . ' :: Castração Animal - Novo Tutor')

@section('content')

    <div class="container mt-5">
        <div class="row">
            <div class="col-12">
                <div class="card shadow">

                    <form action="{{ route('admin.meioAmbiente.castracaoAnimal.tutores.store') }}" method="post" enctype="multipart/form-data">

                        @php $headLine = "<i class='fa-solid fa-paw'></i> Castração Animal - Novo Tutor"; @endphp

                        @include('components.buttons._headLineButtonsBackAdd', [
                            'headLine' => __($headLine),
                            'routeBack' => 'admin.meioAmbiente.castracaoAnimal.verify',
                            'routeBackParams' => [], 
                            'nameBack' => __("Voltar"),
                        ])

                        <div class="card-body">
                            @csrf
                            @method('POST')
                            @include("errors.messageFlash")

                            <div class="row">
                                <div class="col-sm-12 col-md-6 d-flex align-content-center justify-content-center">
                                    <div style="width: 150px">
                                        @php $index = 1; @endphp
                                        @include('components.tables._openPhoto',[
                                            'asset' => "pmar/assets/img/icons/usuario.png",
                                            'alt' => "Novo Tutor",
                                            'title' => "Novo Tutor",
                                            'text' => 'Visualizar foto',
                                        ])
                                    </div>
                                </div>
                                <div class="col-sm-12 col-md-6 d-flex align-items-center">
                                <!-- Campo Foto -->
                                    <div class="w-100">
                                        @include('components.inputs._inputType',[
                                            "for" => null,
                                            "label" => "Foto",
                                            "name" => "photo",
                                            "id" => null,
                                            "required" => false,
                                            "type" => 'file',
                                            "old" => null,
                                            "oninput" => null,
                                            "readonly" => true,
                                            "small" => null,
                                            "accept" => 'image/jpeg,image/jpg,image/png,image/gif',
                                        ])
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-sm-12 col-md-6">
                                <!-- Campo Nome completo -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "Nome completo",
                                        "name" => "fullName",
                                        "id" => null,
                                        "required" => true,
                                        "type" => null,
                                        "old" => old('fullName'),
                                        "oninput" => "javascript:this.value = this.value.toUpperCase()",
                                        "readonly" => false,
                                        "small" => null,
                                    ])
                                </div>
                                <div class="col-sm-12 col-md-6">
                                <!-- Campo CPF -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "CPF",
                                        "name" => "cpf",
                                        "id" => null,
                                        "required" => true,
                                        "type" => null,
                                        "old" => old('cpf', session("cpfTmp")),
                                        "oninput" => "javascript:aplicarMascaraCPF(this)",
                                        "readonly" => true,
                                        "small" => null,
                                    ])
                                </div>
                            </div>


                            <div class="row">
                                <div class="col-sm-12 col-md-6">
                                <!-- Campo Telefone -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "Telefone",
                                        "name" => "phoneNumber",
                                        "id" => null,
                                        "required" => true,
                                        "type" => null,
                                        "old" => old('phoneNumber'),
                                        "oninput" => "javascript:aplicarMascaraTelefone(this)",
                                        "readonly" => false,
                                        "small" => null,
                                    ])
                                </div>
                                <div class="col-sm-12 col-md-6">
                                <!-- Campo Email -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "Email",
                                        "name" => "email",
                                        "id" => null,
                                        "required" => false,
                                        "type" => 'email',
                                        "old" => old('email'),
                                        "oninput" => "javascript:this.value = this.value.toLowerCase()",
                                        "readonly" => false,
                                        "small" => null,
                                        "placeholder" => "nome@email.com",
                                    ])
                                </div>
                            </div>

                            <div class="mb-3" id="resetPasswordCheckbox">
                            <!-- Campo Senha -->
                                @include('components.inputs._inputType',[
                                    "for" => null,
                                    "label" => "Senha",
                                    "name" => "password",
                                    "id" => null,
                                    "required" => true,
                                    "type" => 'password',
                                    "old" => old('password', 'mudar123'),
                                    "oninput" => null,
                                    "readonly" => true,
                                    "small" => '* A senha padrão é: <strong>mudar123</strong><br>',
                                ])

                            </div>

                            <hr/>

                            <div class="row">
                                <div class="col-12">
                                <!-- Tipo de tutor -->
                                    @include('components.inputs._selectType', [
                                        "for" => "tipo_tutor",
                                        "label" => "Categoria",
                                        "name" => "tipo_tutor",
                                        "id" => "tipo_tutor",
                                        "required" => true,
                                        "readonly" => false,
                                        "placeholder" => "Selecione um tipo...",
                                        "options" => collect(App\Enums\TutorEnum::cases())
                                            ->mapWithKeys(fn($status) => [$status->name => $status->label()])
                                            ->toArray(),
                                        "selected" => old('tipo_tutor'),
                                        "small" => "Selecione o tipo de tutor.",
                                    ])
                                </div>
                            </div>

                            <hr/>

                            <div class="row">
                                <div class="col-sm-12 col-md-6">
                                <!-- Campo Tipo de domicilio -->
                                    @include('components.inputs._selectType', [
                                        "for" => "domicilio",
                                        "label" => "Tipo de domicilio",
                                        "name" => "domicilio",
                                        "required" => true,
                                        "readonly" => false,
                                        "options" => collect(App\Enums\StatusDomicilio::cases())
                                            ->mapWithKeys(fn($status) => [$status->name => $status->value])
                                            ->toArray(),
                                        "selected" => old('domicilio'),
                                        "placeholder" => "Selecione o status...",
                                        "small" => "Informe o tipo de dominílio.",
                                        "onchange" => null
                                    ])
                                </div>
                                <div class="col-sm-12 col-md-6">
                                <!-- Campo CEP -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "CEP",
                                        "name" => "cep",
                                        "id" => "zipCode",
                                        "required" => true,
                                        "type" => null,
                                        "old" => old('cep'),
                                        "oninput" => "javascript:aplicarMascaraCEP(this)",
                                        "readonly" => false,
                                        "small" => null,
                                    ])
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-sm-12 col-md-8">
                                <!-- Campo Logradouro -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "Logradouro",
                                        "name" => "logradouro",
                                        "id" => "street",
                                        "required" => true,
                                        "type" => null,
                                        "old" => old('logradouro'),
                                        "oninput" => "javascript:this.value = this.value.toUpperCase()",
                                        "readonly" => false,
                                        "small" => null,
                                    ])
                                </div>
                                <div class="col-sm-12 col-md-4">
                                <!-- Campo Número -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "Número",
                                        "name" => "numero",
                                        "id" => "numero",
                                        "required" => false,
                                        "type" => null,
                                        "old" => old('numero'),
                                        "oninput" => "javascript:this.value = this.value.toUpperCase()",
                                        "readonly" => false,
                                        "small" => null,
                                    ])
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-12">
                                <!-- Campo Complemento -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "Complemento",
                                        "name" => "complemento",
                                        "id" => "complemento",
                                        "required" => false,
                                        "type" => null,
                                        "old" => old('complemento'),
                                        "oninput" => "javascript:this.value = this.value.toUpperCase()",
                                        "readonly" => false,
                                        "small" => null,
                                    ])
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-sm-12 col-md-4">
                                <!-- Campo Cidade -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "Cidade",
                                        "name" => "cidade",
                                        "id" => "city",
                                        "required" => true,
                                        "type" => null,
                                        "old" => old('cidade'),
                                        "oninput" => "javascript:this.value = this.value.toUpperCase()",
                                        "readonly" => false,
                                        "small" => null,
                                    ])
                                </div>

                                <div class="col-sm-12 col-md-4">
                                <!-- Campo Bairro -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "Bairro",
                                        "name" => "bairro",
                                        "id" => "neighborhood",
                                        "required" => true,
                                        "type" => null,
                                        "old" => old('bairro'),
                                        "oninput" => "javascript:this.value = this.value.toUpperCase()",
                                        "readonly" => false,
                                        "small" => null,
                                    ])
                                </div>

                                <div class="col-sm-12 col-md-4">
                                <!-- Campo UF -->
                                    @include('components.inputs._inputType',[
                                        "for" => null,
                                        "label" => "UF",
                                        "name" => "uf",
                                        "id" => "state",
                                        "required" => true,
                                        "type" => null,
                                        "old" => old('uf'),
                                        "oninput" => "javascript:this.value = this.value.toUpperCase()",
                                        "readonly" => false,
                                        "small" => null,
                                        "listName" => "estadosBrasileiros",
                                        "arrayList" => [
                                            'AC', 'AL', 'AM', 'AP', 'BA', 'CE', 'DF', 'ES', 'GO',
                                            'MA', 'MG', 'MS', 'MT', 'PA', 'PB', 'PE', 'PI', 'PR',
                                            'RJ', 'RN', 'RO', 'RR', 'RS', 'SC', 'SE', 'SP', 'TO'
                                        ],
                                    ])
                                </div>
                            </div>

                            <div class="mb-3">

                            <!-- Campo Comprovante -->
                                @include('components.inputs._inputType',[
                                    "for" => null,
                                    "label" => "Comprovante",
                                    "name" => "comprovante",
                                    "id" => null,
                                    "required" => false,
                                    "type" => 'file',
                                    "old" => null,
                                    "oninput" => null,
                                    "readonly" => true,
                                    "small" => null,
                                    "accept" => 'image/jpeg,image/jpg,image/png,image/gif,.pdf',
                                ])

                            </div>

                            <div class="mb-3">
                            <!-- Map Modal -->
                                @include('components.modal._mapModal',[
                                    "label" => "Clique no mapa para escolher um ponto no mapa",
                                ])
                            </div>

                            <div class="my-3">

                            <!-- Campo Latitude -->
                                @include('components.inputs._inputType',[
                                    "for" => null,
                                    "label" => "Latitude",
                                    "name" => "latitude",
                                    "id" => null,
                                    "required" => true,
                                    "type" => null,
                                    "old" => old('latitude'),
                                    "oninput" => "javascript:this.value = this.value.toUpperCase()",
                                    "readonly" => false,
                                    "small" => null,
                                ])

                            </div>
                            <div class="mb-3">

                            <!-- Campo Longitude -->
                                @include('components.inputs._inputType',[
                                    "for" => null,
                                    "label" => "Longitude",
                                    "name" => "longitude",
                                    "id" => null,
                                    "required" => true,
                                    "type" => null,
                                    "old" => old('longitude'),
                                    "oninput" => "javascript:this.value = this.value.toUpperCase()",
                                    "readonly" => false,
                                    "small" => null,
                                ])

                            </div>

                            <div class="mb-3">

                            <!-- Campo Status -->
                                @include('components.inputs._selectType', [
                                    "for" => "status",
                                    "label" => "Status",
                                    "name" => "status",
                                    "required" => true,
                                    "readonly" => false,
                                    "options" => collect(App\Enums\StatusEnum::cases())
                                        ->mapWithKeys(fn($status) => [$status->name => $status->value])
                                        ->toArray(),
                                    "selected" => old('status'),
                                    "placeholder" => "Selecione o status...",
                                    "small" => "Informe o status atual do usuário.",
                                    "onchange" => null
                                ])

                            </div>

                            @include('components.buttons._backAndSend', [
                                    'textBack' => 'Voltar', 
                                    'textSend' => 'Atualizar', 
                                    'routeBack' => 'admin.meioAmbiente.castracaoAnimal.tutores.index'
                                ]
                            )
                        </div>

                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection