@php
    // dd ($user->role()->first()->permissions()->get())

@endphp

@extends('dashboard.dashboard')
@section('title','Seja Bem Vindo')
@section('main')
    <div class="panel-header">
        {{--        <div class="panel-header bg-primary-gradient">--}}
        <div class="page-inner py-5">
            <div class="d-flex align-items-left align-items-md-center flex-column flex-md-row">
                <div>
                    {{-- <h2 class="text-white pb-2 fw-bold">aaaaaaaaaaaaaa</h2>
                    <h5 class="text-white op-7 mb-2"> aaaaaaaaaaaaa lucas</h5> --}}
                </div>
                <div class="ml-md-auto py-2 py-md-0">
                    {{-- <a href="#" class="btn btn-white btn-border btn-round mr-2">Manage</a>
                    <a href="#" class="btn btn-secondary btn-round">Add Customer</a> --}}
                </div>
            </div>
        </div>
    </div>
    <div class="page-inner mt--5">
        <div class="row mt--2">
            {{-- <div class="col-md-6">
                <div class="card full-height">
                    <div class="card-body">
                        <div class="card-title">Overall statistics</div>
                        <div class="card-category">Daily information about statistics in system</div>
                        <div class="d-flex flex-wrap justify-content-around pb-2 pt-4">
                            <div class="px-2 pb-2 pb-md-0 text-center">
                                <div id="circles-1"></div>
                                <h6 class="fw-bold mt-3 mb-0">New Users</h6>
                            </div>
                            <div class="px-2 pb-2 pb-md-0 text-center">
                                <div id="circles-2"></div>
                                <h6 class="fw-bold mt-3 mb-0">Sales</h6>
                            </div>
                            <div class="px-2 pb-2 pb-md-0 text-center">
                                <div id="circles-3"></div>
                                <h6 class="fw-bold mt-3 mb-0">Subscribers</h6>
                            </div>
                        </div>
                    </div>
                </div>
            </div> --}}
            <div class="col-md-6">
                <div class="card full-height">
                    <div class="card-body">
                        <div class="card-title">Acessos ao site</div>
                        <div class="row py-3">
                            <div class="col-md-4 d-flex flex-column justify-content-around">
                                <div>
                                    <h6 class="fw-bold text-uppercase text-success op-8">Total do Mês</h6>
                                    <h3 class="fw-bold">{{ @$total_month['total']}}</h3>
                                </div>
                                <div>
                                    <h6 class="fw-bold text-uppercase text-warning op-8">Total da Semana</h6>
                                    <h3 class="fw-bold">{{array_sum(explode(',',$chart_accesses['values']))}}</h3>
                                </div>
                            </div>
                            <div class="col-md-8">
                                <div id="chart-container">
                                    <canvas id="chart-accesses"></canvas>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">

        </div>
    </div>
@endsection
@php
        @endphp

@push('scripts')
    <script src="{{asset('admin/js/plugin/chart.js/chart.min.js')}}"></script>
    <script>
        var chartAccesses = document.getElementById('chart-accesses').getContext('2d');

        var mytotalIncomeChart = new Chart(chartAccesses, {
            type: 'bar',
            data: {
                labels: [{!! $chart_accesses['label'] !!}],
                datasets: [{
                    label: "Total de Visitas",
                    backgroundColor: '#ff9e27',
                    borderColor: 'rgb(23, 125, 255)',
                    data: [{{$chart_accesses['values']}}],
                }],
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                legend: {
                    display: false,
                },
                scales: {
                    yAxes: [{
                        ticks: {
                            display: true
                        },
                        gridLines: {
                            drawBorder: false,
                            display: false
                        }
                    }],
                    xAxes: [{
                        gridLines: {
                            drawBorder: false,
                            display: false
                        }
                    }]
                },
            }
        });

    </script>
@endpush