@extends('layout.backend')
@section('title', 'Visitas')

@section('styles')
@parent
<link href="/css/chart.css" rel="stylesheet">
@endsection

@section('scripts')
@parent
<script type="text/javascript" src="/js/visits.js"></script>
<script type="text/javascript" src="/js/chart.js/dist/chart.umd.min.js"></script>
<script type="text/javascript" src="/js/graph-chart.js"></script>
@endsection

@section('content')

{{-- ALERTAS --}}
@include('components.widget.alerts')

<x-filter.area label="Visitas" class="bg-info" route="{{ route('visits.digest') }}" filter-code="visitsdigest">
    <x-filter.select class="col-12 col-sm-4 col-md-4 col-lg-3 "
            name='type' :items="$types" :value="$data['type']">
        Tipo
    </x-filter.select>
    <x-filter.select class="col-12 col-sm-4 col-md-4 col-lg-3 "
            name='year' :items="$years" :value="$data['year']">
        Ano
    </x-filter.select>
    <x-filter.select class="col-12 col-sm-4 col-md-4 col-lg-3 "
            name='region' :items="$arrRegions" :value="$data['region']">
        Região
    </x-filter.select>
</x-filter.area>

<div class="card shadow mb-4">
    <div class="card-header py-3">
        <h6 class="m-0 font-weight-bold text-primary">
            Acompanhamento das visitas aos médicos
            <span class="iconchart" 
                data-name="Percentual de membros que fizeram<br/>visitas na COLIH {{ config('app.name') }}"
                data-chartdata={{ $perChart }}>
                <i class="fa fas fa-chart-pie"></i>
            </span>
        </h6>
    </div>
    <div class="card-body">
        @foreach($regions as $region)
        <div class="table-responsive">
            <table class="table table-sm table-striped table-bordered" id="dataTable" width="100%" cellspacing="0">
                <thead>
                    <tr>
                        <th class='h4 text-center' colspan="25">
                            Região {{$region->name}}
                        </th>
                    </tr>
                    <tr>
                        <th rowspan="2" class='h4 text-center'>Membros</th>
                        @for($m=1; $m<=$mesend; $m++)
                            <th colspan="2" class="h4 text-center p-0">
                                {{ $months[$m] }}
                            </th>
                        @endfor
                    </tr>
                    <tr>
                        @for($m=1; $m<=$mesend; $m++)
                            <th class="text-center h6 text-danger p-0" data-bs-toggle="tooltip" data-bs-placement="top" title="Aberto (não finalizada)">Ab</th>
                            <th class="text-center h6 text-success p-0" data-bs-toggle="tooltip" data-bs-placement="top" title="Finalizada">Fn</th>
                        @endfor
                    </tr>
                </thead>
                <tbody>
                    @foreach($users[$region->id] as $user)
                    <tr>
                        <td class='p-0 text-right'>
                            {{$user->shortname}}
                            <span class="iconchart" 
                                    data-percent="false"
                                    data-name="Quantidade de visitas por mês<br/> do membro {{$user->shortname}}"
                                    data-chartdata={{$chartUser[$user->id]}}>
                                <i class="fa fas fa-chart-pie"></i>
                            </span>
                        </td>
                        @for($m=1; $m<=$mesend; $m++)
                            <td class="text-center h4 p-0" data-bs-toggle="tooltip" data-bs-placement="top" title="Aberto (não finalizada)">
                                <a href="{!! route('visits.index', ['members' => $user->id, 'satus'=>'1']) !!}" target="_blank">
                                    <span class="text-danger">
                                        {{ $visitDigest[$region->id][$user->id][$m]['opened'] }}
                                    </span>
                                </a>
                            </td>
                            <td class="text-center h4 p-0" data-bs-toggle="tooltip" data-bs-placement="top" title="Finalizada">
                                <a href="{!! route('visits.index', ['members' => $user->id, 'satus'=>'2']) !!}" target="_blank">
                                    <span class="text-success">
                                        {{ $visitDigest[$region->id][$user->id][$m]['ended'] }}
                                    </span>
                                </a>
                            </td>
                        @endfor
                    </tr>
                    @endforeach
                    <tr>
                        <td class='p-0 text-right'>
                            Total
                            <span class="iconchart" 
                                  data-name="Percentual de membros que fizeram<br/>visitas na região {{$region->name}}"
                                  data-chartdata={{$chartRegion[$region->id]}}>
                                <i class="fa fas fa-chart-pie"></i>
                            </span>
                        </td>
                        @for($m=1; $m<=$mesend; $m++)
                            <td colspan="2" class="text-center h4 p-0" > {{ $totalRegionMes[$region->id][$m]['nv'] }}
                            </td>
                        @endfor
                    </tr>
                </tbody>
            </table>
        </div>
        @endforeach
    </div>
</div>
@endsection