@extends('layouts.app')

@section('title', 'Página Inicial')

@section('content')

@section('page-function', 'Página Inicial')

<!-- Content (Page) -->
<section class="content">
    <div class="container-fluid">
        @include('template.alert')
        <div class="row">
            <div class="col-sm-12">
                <div class="row">
                    <div class="col-md-4 col-sm-6 col-12">
                        <div class="info-box">
                            <span class="info-box-icon bg-info"><i class="fas fa-paw"></i></span>
                            <div class="info-box-content" style="word-wrap: none;">
                                <span class="info-box-text">Animais Cadastrados</span>
                                <span class="info-box-number">{{$totalAnimais}}</span>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6 col-12">
                        <div class="info-box">
                            <span class="info-box-icon bg-success"><i class="fas fa-cat"></i></span>
                            <div class="info-box-content">
                                <span class="info-box-text">Animais na fila de espera</span>
                                <span class="info-box-number">{{$totalEspera}}</span>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6 col-12">
                        <div class="info-box">
                            <span class="info-box-icon bg-warning"><i class="fas fa-dog"></i></span>
                            <div class="info-box-content">
                                <span class="info-box-text">Animais castrados (Processo finalizado)</span>
                                <span class="info-box-number">{{$totalCastrados}}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div><!-- /.row -->
        <div class="row">
            <div class="col-sm-12">
                <div class="col-sm-12 col-md-12">
                    <div class="card">
                        <div class="card-header">
                            <h4>Cotas disponíveis {{($cotaAtiva != null) ? '- Em uso: '. $cotaAtiva->nome : ''}}
                            </h4>
                        </div>
                        <div class="card-body">
                            <div id='table' style="width: 100%; overflow: scroll;">
                                <table class="table table-bordered">
                                    <thead>
                                        <tr>
                                            <th>Clínica</th>
                                            <th>Caninos fêmeas</th>
                                            <th>Caninos machos</th>
                                            <th>Felinos fêmeas</th>
                                            <th>Felinos machos</th>
                                        </tr>
                                    </thead>
                                    @foreach($cotasClinicas as $clinica=>$cotas)
                                    <tbody>
                                        <tr>
                                            <th>{{$clinica}}</th>

                                            <td>
                                                <table>
                                                    <thead>
                                                        <tr>
                                                            <th>Cota Recebida</th>
                                                            <th>Cota Utilizada</th>
                                                            <th>Faltantes</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td>{{$cotas['cf']['recebida']}}</td>
                                                            <td>{{$cotas['cf']['utilizada']}}</td>
                                                            <td>{{$cotas['cf']['ausencias']}}</td>
                                                        </tr>
                                                    </tbody>

                                                    <tfoot>
                                                        <th>Total disponível</th>
                                                        <td colspan="2"> {{$cotas['cf']['recebida'] -
                                                            $cotas['cf']['utilizada']}}</td>
                                                    </tfoot>
                                                </table>
                                            </td>
                                            <td>
                                                <table>
                                                    <thead>
                                                        <tr>
                                                            <th>Cota Recebida</th>
                                                            <th>Cota Utilizada</th>
                                                            <th>Faltantes</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td>{{$cotas['cm']['recebida']}}</td>
                                                            <td>{{$cotas['cm']['utilizada']}}</td>
                                                            <td>{{$cotas['cm']['ausencias']}}</td>
                                                        </tr>
                                                    </tbody>

                                                    <tfoot>
                                                        <th>Total disponível</th>
                                                        <td colspan="2"> {{$cotas['cm']['recebida'] -
                                                            $cotas['cm']['utilizada']}}</td>
                                                    </tfoot>
                                                </table>
                                            </td>
                                            <td>
                                                <table>
                                                    <thead>
                                                        <tr>
                                                            <th>Cota Recebida</th>
                                                            <th>Cota Utilizada</th>
                                                            <th>Faltantes</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td>{{$cotas['ff']['recebida']}}</td>
                                                            <td>{{$cotas['ff']['utilizada']}}</td>
                                                            <td>{{$cotas['ff']['ausencias']}}</td>
                                                        </tr>
                                                    </tbody>

                                                    <tfoot>
                                                        <th>Total disponível</th>
                                                        <td colspan="2"> {{$cotas['ff']['recebida'] -
                                                            $cotas['ff']['utilizada']}}</td>
                                                    </tfoot>
                                                </table>
                                            </td>
                                            <td>
                                                <table>
                                                    <thead>
                                                        <tr>
                                                            <th>Cota Recebida</th>
                                                            <th>Cota Utilizada</th>
                                                            <th>Faltantes</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td>{{$cotas['fm']['recebida']}}</td>
                                                            <td>{{$cotas['fm']['utilizada']}}</td>
                                                            <td>{{$cotas['fm']['ausencias']}}</td>
                                                        </tr>
                                                    </tbody>

                                                    <tfoot>
                                                        <th>Total disponível</th>
                                                        <td colspan="2"> {{$cotas['fm']['recebida'] -
                                                            $cotas['fm']['utilizada']}}</td>
                                                    </tfoot>
                                                </table>
                                            </td>

                                        </tr>

                                    </tbody>
                                    @endforeach
                                </table>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12 col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h4>Calendário</h4>
                    </div>
                    <div class="card-body">
                        <div id='calendar'></div>
                    </div>
                </div>
            </div>
        </div>
    </div><!-- /.container-fluid -->
</section>
<!-- /.content -->

@include('triagem.widgets.modal.calendar_modal')

@push('scripts')
<script>
    document.addEventListener('DOMContentLoaded', function () {
        const calendarEl = document.getElementById("calendar");

        let calendar = new Calendar(calendarEl, {
            locale: 'pt-BR',
            plugins: [dayGridPlugin, timeGridPlugin, listPlugin],
            initialView: 'dayGridMonth',
            displayEventTime: true,
            selectable: true,
            businessHours: true,
            dayMaxEvents: true,
            selectable: true,
            navLinks: true,
            buttonText: {
                today: 'Hoje',
                month: 'Mês',
                week: 'Semana',
                day: 'Dia',
                year: 'Ano',
            },
            headerToolbar: {
                left: 'prev,next today',
                center: 'title',
                right: 'dayGridMonth'
            },

            //Chamar modal
            eventClick: function (info) {
                document.getElementById("animal_nome").value = info.event.extendedProps.animal_nome;
                document.getElementById("titular").value = info.event.extendedProps.tutor_nome;
                document.getElementById("data_agendamento").value = moment(info.event.start).format('DD/MM/YYYY HH:mm');
                document.getElementById("ver").href = info.event.extendedProps.ver;
                $('#calendar_modal').modal('show');
            },

            // INÍCIO BUSCAR EVENTOS PARA EXIBIR NO CALENDÁRIO
            eventSources: [
                {
                    url: "{{route('triagem.get_calendario_datas')}}",
                    method: 'GET',
                    color: 'yellow',
                    textColor: 'black',
                    failure: function () {
                        //alert('Nenhum evento encontrado');
                    },
                },
            ],

            // FIM BUSCAR EVENTOS PARA EXIBIR NO CALENDÁRIO
        });
        calendar.render();
    });
</script>
@endpush
@endsection