@extends('adminlte::page')

@section('title_prefix', __('Dashboard'))

@section('content_header')
<h1 class="m-0 text-dark">Recebíveis</h1>
@stop

@section('content')
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                @include('cliente.recebiveis.tabs')
                <button onclick="window.print()" class="btn btn-sm float-right btn-dark" title="Imprimir"><i class="fas fa-print"></i></button>
                <a href="{{ route('cliente.recebiveis.grafico', array_merge(['excel' => 1], request()->all())) }}" target="_blank">
                    <button class="btn btn-sm btn-dark float-right mr-1" title="Exportar para Excel"><i class="fas fa-file-excel"></i>
                </button></a>
            </div>
            <div class="card-body row justify-content-center">

                <div class="col-md-6">
                    <table class="table table-sm">
                        <tr class="bg-gradient-secondary">
                            <th>
                                <a style="color: white;" class="{{ request()->ordem == 'nome' ? 'text-success' : '' }}" href="{{ route(Route::currentRouteName(), array_merge(request()->all(), ['ordem' => 'nome', 'desc' => request()->ordem == 'nome' && !request()->desc])) }}">Convênio
                                    {!! request()->ordem == 'nome' ? (!request()->desc ? '&darr;' : '&uarr;') : '' !!}
                                </a>
                            </th>
                            <th style="text-align: right">
                                <a style="color: white;" class="{{ request()->ordem == 'valor' ? 'text-success' : '' }}" href="{{ route(Route::currentRouteName(), array_merge(request()->all(), ['ordem' => 'valor', 'desc' => request()->ordem == 'valor' && !request()->desc])) }}">Total (R$)
                                        {!! request()->ordem == 'valor' ? (!request()->desc ? '&darr;' : '&uarr;') : '' !!}
                                </a>
                            </th>
                            <th style="text-align: right">
                                <a style="color: white;" class="{{ request()->ordem == 'participacao' ? 'text-success' : '' }}" href="{{ route(Route::currentRouteName(), array_merge(request()->all(), ['ordem' => 'participacao', 'desc' => request()->ordem == 'participacao' && !request()->desc])) }}">%
                                        {!! request()->ordem == 'participacao' ? (!request()->desc ? '&darr;' : '&uarr;') : '' !!}
                                </a>
                            </th>
                        </tr>
                        @foreach($dados as $dado)
                        <tr>
                            <td>{{ $dado['nome'] }}</td>
                            <td style="text-align: right">{{ number_format($dado['valor'], 2, ',', '.') }}</td>
                            <td style="text-align: right">{{ number_format($dado['participacao'], 2, ',', '.') }}%</td>
                        </tr>
                        @endforeach
                        <tr class="bg-gradient-secondary text-bold">
                            <td>Total geral</td>
                            <td style="text-align: right">{{ number_format($total, 2, ',', '.') }}</td>
                            <td style="text-align: right">100%</td>
                        </tr>
                    </table>
                </div>
                <div class="col-md-6 d-flex">
                    <div id="chart_div" class="h-100 w-100"></div>
                </div>
            </div>
        </div>
    </div>
</div>
@stop


@push('js')
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script>
    google.charts.load('current', {
        'packages': ['corechart']
    });
    google.charts.setOnLoadCallback(drawChart);

    function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Convênio');
        data.addColumn('number', 'Valor');
        data.addRows([
            @foreach($dados as $dado)[
                '{{ $dado['nome'] }}', {{ $dado['valor'] }}],
            @endforeach
        ]);

        var options = {
            title: 'Recebíveis',
            is3D: true,
            colors: {!! json_encode($chart_colors) !!}
        };
        var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
        chart.draw(data, options);
    }

    $(window).resize(function() {
        drawChart();
    });
</script>
@endpush