@extends('layouts.main')

@section('titulopagina', 'Atendimento')



@section('content')
<script>
@if(Session::has('msg'))
toastr.options = {
    "closeButton": false,
    "progressBar": true
}
toastr.success("{{ session('msg') }}");
@endif
</script>
@foreach ($cliente as $client)
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header bg-info">
                    <h3 class="card-title"> <i class="fa-solid fa-user-large"></i> Dados do Cliente - {{$client->id}}
                    </h3>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-4">
                            <table class="table table-bordered">


                                <tr>
                                    <td class="col-md-3 bg-default"><span class="font-weight-bold"><i
                                                class="fa-solid fa-user"></i> Cliente: </span>
                                    </td>
                                    <td class="col-md-9" colspan="2">{{$client->cliente_nome}}</td>

                                </tr>
                                <tr>
                                    <td class="col-md-3 bg-default"><span class="font-weight-bold"> <i
                                                class="fa-solid fa-address-card"></i> CPF: </span>
                                    </td>
                                    <td class="col-md-9" colspan=" 2">{{$client->cliente_cpf}}</td>

                                </tr>
                                <tr>
                                    <td class="col-md-3 bg-default"><span class="font-weight-bold"><i
                                                class="fa-solid fa-address-card"></i> RG: </span>
                                    </td>
                                    <td class="col-md-9" colspan=" 2">{{$client->cliente_rg}}</td>

                                </tr>
                                <tr>
                                    <td class="col-md-4 bg-default"><span class="font-weight-bold"><i
                                                class="fa-solid fa-cake-candles"></i> Data de
                                            Nascimento: </span> </td>
                                    <td class="col-md-3 dtnasc" id="datanascimento">
                                        {{date('d/m/Y', strtotime($client->cliente_datanasc))}}</td>
                                    <td class="col-md-5" id="idade">
                                        55 anos
                                    </td>

                                </tr>


                            </table>
                        </div>
                        <div class="col-4">
                            <table class="table table-bordered">
                                <tr>
                                    <td class="col-md-4 bg-default"><span class="font-weight-bold"><i
                                                class="fa-solid fa-thumbtack"></i> Endereço: </span>
                                    </td>
                                    <td class="col-md-9">{{$client->cliente_tipoendereco}}
                                        {{$client->cliente_endereco}}, {{$client->cliente_numeroendereco}} -
                                        {{$client->cliente_bairro}}</td>

                                </tr>
                                <tr>
                                    <td class="col-md-4 bg-default"><span class="font-weight-bold"><i
                                                class="fa-solid fa-map-pin"></i> Complemento: </span>
                                    </td>
                                    <td class="col-md-9">{{$client->cliente_complemento}}</td>

                                </tr>
                                <tr>
                                    <td class="col-md-4 bg-default"><span class="font-weight-bold"><i
                                                class="fa-solid fa-location-dot"></i> Cidade: </span>
                                    </td>
                                    <td class="col-md-9">{{$client->cliente_cidade}} - {{$client->cliente_uf}}</td>

                                </tr>

                            </table>
                        </div>
                        <div class="col-4">
                            <table class="table table-bordered">
                                <tr>
                                    <td class="col-md-4 bg-default"><span class="font-weight-bold"><i
                                                class="fa-solid fa-phone"></i> Telefones: </span>
                                    </td>
                                    <td class="col-md-9">{{$client->cliente_tel1}}, {{$client->cliente_tel2}}</td>

                                </tr>
                                <tr>
                                    <td class="col-md-4 bg-default"><span class="font-weight-bold"><i
                                                class="fa-solid fa-mobile-screen"></i> Celular: </span>
                                    </td>
                                    <td class="col-md-9">{{$client->cliente_celular}}</td>

                                </tr>
                                <tr>
                                    <td class="col-md-4 bg-default"><span class="font-weight-bold"><i
                                                class="fa-solid fa-envelope"></i> E-mail: </span>
                                    </td>
                                    <td class="col-md-9">{{$client->cliente_email}}</td>

                                </tr>

                            </table>
                        </div>


                    </div>

                </div>
                <div class="card-footer">
                    <button class="btn btn-info btn-sm rounded-0" type="button" data-bs-toggle="modal"
                        data-bs-target="#editCliente" data-bs-whatever="{{$client->id}}">Atualizar
                        Dados</button>
                    <button class="btn btn-info btn-sm rounded-0" type="button" data-bs-toggle="modal"
                        data-bs-target="#ordemservicos" data-bs-whatever="{{$client->id}}">Nova Ordem de
                        Serviço</button>
                    <button class="btn btn-info btn-sm rounded-0" type="button" data-bs-toggle="modal"
                        data-bs-target="#consulta" data-bs-whatever="{{$client->id}}">Nova Consulta</button>

                </div>
            </div>

        </div>

        <div class="col-12">

            <div class="row">
                <!-- Ordem de Serviços -->
                <div class="col-6">

                    <div class="card card-primary">


                        <div class="card-body">
                            <div class="row">

                                <div class="col-12">
                                    <table class="table table-hover">
                                        <thead>
                                            <tr>
                                                <th scope="col">Número da Ordem</th>
                                                <th scope="col">Data da Entrada</th>
                                                <th scope="col">Requisitante</th>
                                                <th scope="col">Convênio</th>

                                            </tr>
                                        </thead>
                                        <tbody>

                                            @foreach ($ordem as $os)
                                            <tr>
                                                <th scope="row"><a href="/ordem/{{$os->idOS}}" </a> {{$os->idOS}}</th>
                                                <td>{{date('d/m/Y', strtotime($os->dataEntrada))}}</td>
                                                <td>{{$os->requisitante}}</td>
                                                <td>{{$os->idConvenio}}</td>



                                            </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>

                                <div class="col-12">




                                </div>
                            </div>



                        </div>


                    </div>
                </div>

                <!-- Atendimentos Consultas -->

                <div class="col-6">

                    <div class="card card-primary">


                        <div class="card-body">
                            <div class="row">

                                <div class="col-12">
                                    <table class="table table-hover">
                                        <thead>
                                            <tr>
                                                <th scope="col">Número do Atendimento</th>
                                                <th scope="col">Especialista</th>
                                                <th scope="col">Data da Consulta</th>


                                            </tr>
                                        </thead>
                                        <tbody>

                                            @foreach ($consulta as $cons)
                                            <tr>
                                                <th scope="row"><a
                                                        href="/consulta/{{$client->id}}/{{$cons->idAtendimento}}" </a>
                                                        {{$cons->idAtendimento}}</th>
                                                <td>{{$cons->nome_especialidade}}</td>
                                                <td>{{date('d/m/Y', strtotime($cons->dataAtendimento))}}</td>




                                            </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>

                                <div class="col-12">




                                </div>
                            </div>



                        </div>


                    </div>
                </div>


            </div>

        </div>
    </div>
    <!-- Modal -->
    <div class="modal fade" id="editCliente" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-xl">
            <form action="/cliente/update/{{$client->id}}" method="POST">
                @csrf
                @method('PUT')
                <div class="modal-content">
                    <div class="modal-header bg-info">
                        <h5 class="modal-title" id="exampleModalLabel">Atualizar Cliente - {{$client->id}}</h5>
                        <input type="hidden" name="id" value="{{$client->id}}">
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">

                        <div class="row">
                            <div class="col-12">
                                <div class="row gx-3">
                                    <!-- Dados Pessoais -->
                                    <div class="col-12">
                                        <div class="row gx-2">
                                            <div class="col-12">
                                                <div class="row gx-2">
                                                    <div class="col-5">
                                                        <div class="mb-1">
                                                            <label class="form-label">Nome do Cliente</label>
                                                            <input type="text" class="form-control form-control-sm"
                                                                name="cliente_nome" value="{{$client->cliente_nome}}">
                                                        </div>
                                                    </div>
                                                    <div class="col-2">
                                                        <div class="mb-1">
                                                            <label class="form-label">CPF</label>
                                                            <input type="text" class="form-control form-control-sm"
                                                                id="cpf" name="cliente_cpf"
                                                                value="{{$client->cliente_cpf}}" type="text"
                                                                onkeyup="cpfCheck(this)" maxlength="18"
                                                                onkeydown="javascript: fMasc( this, mCPF );">
                                                            <span id="cpfResponse"></span>
                                                        </div>
                                                    </div>
                                                    <div class="col-2">
                                                        <div class="mb-1">
                                                            <label class="form-label">RG</label>
                                                            <input type="text" class="form-control form-control-sm"
                                                                id="rg" name="cliente_rg"
                                                                value="{{$client->cliente_rg}}">
                                                        </div>
                                                    </div>
                                                    <div class="col-1">
                                                        <div class="mb-1">
                                                            <label class="form-label">Genero</label>
                                                            <select class="form-select form-select-sm" id="genero"
                                                                name="cliente_sexo">

                                                                <option value="M" @if ($client->cliente_sexo=='M')
                                                                    {{ 'selected' }} @endif>Masculino</option>
                                                                <option value="F" @if ($client->cliente_sexo=='F')
                                                                    {{ 'selected' }} @endif>Feminino</option>




                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="col-2">
                                                        <div class="mb-3">
                                                            <label class="form-label">Dt Nascimento</label>
                                                            <input type="date" class="form-control form-control-sm"
                                                                name="cliente_datanasc"
                                                                value="{{date('Y-m-d', strtotime($client->cliente_datanasc))}}">

                                                        </div>
                                                    </div>

                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                    <!-- End Dados Pessoais -->

                                </div>
                                <!-- Start Tabs Opcionais -->
                                <ul class="nav nav-tabs" id="myTab" role="tablist">

                                    <!-- Seleção de Abas -->
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link active" id="endereco-tab" data-bs-toggle="tab"
                                            data-bs-target="#endereco" type="button" role="tab" aria-controls="endereco"
                                            aria-selected="false">Endereço</button>
                                    </li>
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link" id="parentesco-tab" data-bs-toggle="tab"
                                            data-bs-target="#parentesco" type="button" role="tab"
                                            aria-controls="parentesco" aria-selected="false">Parentesco</button>
                                    </li>
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link" id="contato-tab" data-bs-toggle="tab"
                                            data-bs-target="#contato" type="button" role="tab" aria-controls="contato"
                                            aria-selected="false">Contatos</button>
                                    </li>
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link" id="observacao-tab" data-bs-toggle="tab"
                                            data-bs-target="#observacao" type="button" role="tab"
                                            aria-controls="observacao" aria-selected="false">Observação</button>
                                    </li>

                                </ul>
                                <div class="tab-content" id="myTabContent">
                                    <div class="tab-pane fade show active" id="endereco" role="tabpanel"
                                        aria-labelledby="endereco-tab">
                                        <div class="row gx-2 mt-2">
                                            <div class="col-2">
                                                <div class="mb-1">
                                                    <label class="form-label">Tipo</label>
                                                    <select class="form-select form-select-sm" id="tipo"
                                                        name="cliente_tipoendereco">

                                                        <option value="Rua" @if ($client->
                                                            cliente_cliente_tipoendereco=='Rua') {{ 'selected' }}
                                                            @endif>Rua
                                                        </option>
                                                        <option value="Avenida" @if ($client->
                                                            cliente_cliente_tipoendereco=='Avenida') {{ 'selected' }}
                                                            @endif>Avenida</option>
                                                        <option value="Travessa" @if ($client->
                                                            cliente_cliente_tipoendereco=='Travessa') {{ 'selected' }}
                                                            @endif>Travessa</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-8">
                                                <div class="mb-1">
                                                    <label class="form-label">Endereço</label>
                                                    <input type="text" class="form-control form-control-sm"
                                                        id="endereco" name="cliente_endereco"
                                                        value="{{$client->cliente_endereco}}">
                                                </div>
                                            </div>
                                            <div class="col-2">
                                                <div class="mb-1">
                                                    <label class="form-label">Número</label>
                                                    <input type="number" class="form-control form-control-sm"
                                                        name="cliente_numeroendereco"
                                                        value="{{$client->cliente_numeroendereco}}">
                                                </div>
                                            </div>
                                            <div class="col-4">
                                                <div class="mb-1">
                                                    <label class="form-label">Complemento</label>
                                                    <input type="text" name="cliente_complemento"
                                                        class="form-control form-control-sm"
                                                        value="{{$client->cliente_complemento}}">
                                                </div>
                                            </div>
                                            <div class="col-3">
                                                <div class="mb-1">
                                                    <label class="form-label">Bairro</label>
                                                    <input type="text" class="form-control form-control-sm"
                                                        name="cliente_bairro" value="{{$client->cliente_bairro}}">
                                                </div>

                                            </div>
                                            <div class="col-3">
                                                <div class="mb-1">
                                                    <label class="form-label">Cidade</label>
                                                    <input type="text" class="form-control form-control-sm"
                                                        name="cliente_cidade" value="{{$client->cliente_cidade}}">
                                                </div>
                                            </div>
                                            <div class="col-2">
                                                <div class="mb-1">
                                                    <label class="form-label">UF</label>
                                                    <select class="form-select form-select-sm" name="cliente_uf"
                                                        aria-label=".form-select-sm example">
                                                        <option value="AL" @if ($client->cliente_uf=='AL')
                                                            {{ 'selected' }}
                                                            @endif>AL</option>
                                                        <option value="PE" @if ($client->cliente_uf=='PE')
                                                            {{ 'selected' }}
                                                            @endif>PE</option>
                                                        <option value="PB" @if ($client->cliente_uf=='PB')
                                                            {{ 'selected' }}
                                                            @endif>PB</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="tab-pane fade" id="parentesco" role="tabpanel"
                                        aria-labelledby="parentesco-tab">
                                        <div class="row gx-2 mt-2">
                                            <div class="col-6">
                                                <div class="mb-1">
                                                    <label class="form-label">Nome do Pai</label>
                                                    <input type="tel" class="form-control form-control-sm"
                                                        name="cliente_nomepai" value="{{$client->cliente_nomepai}}">
                                                </div>
                                            </div>
                                            <div class="col-6">
                                                <div class="mb-1">
                                                    <label class="form-label">Nome da Mãe</label>
                                                    <input type="tel" class="form-control form-control-sm"
                                                        name="cliente_nomemae" value="{{$client->cliente_nomemae}}">
                                                </div>
                                            </div>
                                            <div class="col-6">
                                                <div class="mb-1">
                                                    <label class="form-label">Responsável</label>
                                                    <input type="tel" class="form-control form-control-sm"
                                                        name="cliente_responsavel"
                                                        value="{{$client->cliente_responsavel}}">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="tab-pane fade" id="contato" role="tabpanel"
                                        aria-labelledby="contato-tab">
                                        <div class="row gx-2 mt-2">
                                            <div class="col-6">
                                                <div class="mb-1">
                                                    <label class="form-label">Telefone 1</label>
                                                    <input type="tel" class="form-control form-control-sm"
                                                        name="cliente_tel1" id="telefone1"
                                                        value="{{$client->cliente_tel1}}">
                                                </div>
                                            </div>
                                            <div class="col-6">
                                                <div class="mb-1">
                                                    <label class="form-label">Telefone 2</label>
                                                    <input type="tel" class="form-control form-control-sm"
                                                        name="cliente_tel2" id="telefone2"
                                                        value="{{$client->cliente_tel2}}">
                                                </div>
                                            </div>
                                            <div class="col-6">
                                                <div class="mb-1">
                                                    <label class="form-label">Celular</label>
                                                    <input type="tel" class="form-control form-control-sm"
                                                        name="cliente_celular" id="celular"
                                                        value="{{$client->cliente_celular}}">
                                                </div>
                                            </div>
                                            <div class="col-6">
                                                <div class="mb-4">
                                                    <label class="form-label">E-mail</label>
                                                    <input type="tel" class="form-control form-control-sm"
                                                        name="cliente_email" value="{{$client->cliente_email}}">
                                                </div>

                                            </div>
                                        </div>
                                    </div>
                                    <div class="tab-pane fade" id="observacao" role="tabpanel"
                                        aria-labelledby="observacao-tab">
                                        <div class="col-12">
                                            <div class="mb-4">

                                                <div class="input-group">

                                                    <textarea style="padding: 5px;" name="cliente_comentario"
                                                        id="observecao" cols="100"
                                                        rows="5">{{$client->cliente_comentario}}</textarea>

                                                </div>

                                            </div>
                                        </div>

                                    </div>

                                </div>




                            </div>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-info btn-lg">Atualizar</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <!-- Modal -->
    <div class="modal fade" id="ordemservicos" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <form action="/ordem" method="POST">
                @csrf
                <div class="modal-content">
                    <div class="modal-header bg-info">
                        <h5 class="modal-title" id="exampleModalLabel">Ordem de Serviço</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">


                        <div class="mb-0">
                            <input type="hidden" class="form-control form-control-sm" id="idcliente" name="idcliente">
                        </div>
                        <div class="mb-3">
                            <label for="message-text" class="col-form-label">Data de Entrega:</label>
                            <input type="date" class="form-control form-control-sm" name="datadaEntrada"
                                id="dataentrada" disable>
                        </div>
                        <div class="mb-3">
                            <label for="message-text" class="col-form-label">Requisitante:</label>
                            <input type="text" aria-label="First name" class="form-control form-control-sm"
                                name="requisitante">
                        </div>
                        <div class="mb-3">
                            <label for="message-text" class="col-form-label">Convênio:</label>
                            <select class="form-select form-select-sm" name="idconvenio"
                                aria-label="Default select example">
                                <option selected></option>
                                <option value="0">Particular</option>
                                <option value="1">Outros</option>

                            </select>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-info btn-lg">Criar</button>
                    </div>
                </div>
            </form>
        </div>
    </div>


    @endforeach


    @endsection
    @section('js')
    <script>
    var ModalOrdemServico = document.getElementById('ordemservicos')
    ModalOrdemServico.addEventListener('show.bs.modal', function(event) {
        var button = event.relatedTarget
        var idCliente = button.getAttribute('data-bs-whatever')
        var data = new Date().toISOString().split('T')[0];

        var cliente = ModalOrdemServico.querySelector('#idcliente')
        cliente.setAttribute('value', idCliente)
        var dataentrada = ModalOrdemServico.querySelector('#dataentrada')
        dataentrada.setAttribute('value', data)

    })
    </script>

    <script>
    var ModalExame = document.getElementById('editCliente')
    ModalExame.addEventListener('show.bs.modal', function(event) {
        var button = event.relatedTarget
        var idOS = button.getAttribute('data-bs-whatever')


        var cliente = ModalExame.querySelector('#idcliente')
        cliente.setAttribute('value', idOS)




    })
    </script>

    <script>
    function idade(dateString) {
        const today = new Date();
        const dtNasc = new Date(dateString);

        let idade = today.getFullYear() - dtNasc.getFullYear();
        const mes = today.getMonth() - dtNasc.getMonth();



        if (mes < 0 && (mes === 0 && today.getDate() < dtNasc.getDate())) {
            idade--;
        };
        return idade;
        document.getElementById("idade").innerText = idade;


    }
    </script>




    @endsection