<?php
session_start();
include "classes/db.class.php";
include "classes/fc.class.php";
include "config.php";


if (!isset($_SESSION['uid'])) {
    header("Location: login.php");
    exit;
}

if (isset($_SESSION['tabela'])) {
    unset($_SESSION['tabela']);
}
if (isset($_SESSION['coluna'])) {
    unset($_SESSION['coluna']);
}
if (isset($_SESSION['primaria'])) {
    unset($_SESSION['primaria']);
}

$uid = $_SESSION['uid'];
$nome = $_SESSION['un'];
$email = $_SESSION['ue'];
$idsql = $_SESSION['uids'];

$pag = $_SERVER['REQUEST_URI'];
$pag = explode("/", $pag);
$page = $pag[2];





?>
<!DOCTYPE html>

<html lang="pt-br">

<head>

    <?php include "includes/header.php"; ?>

</head>

<body>
    <script type='text/javascript'>
        
        if ('serviceWorker' in navigator)
        {
        navigator.serviceWorker.register('sw.js');
        }
    
    </script>
    <!-- navbar -->
    <?php include "includes/navbar.php"; ?>

    <!-- cards -->
    <div id="corpo" class="container my-1 py-1">

        <div class="row align-items-center">

            <div class="col-6 col-md-6  col-lg-4  col-sm-6">
                <div class="card-box bg-blue">
                    <div class="inner">
                        <h3 style="color: #ffffff;"><strong><?php echo FC::cards('clientes'); ?></strong></h3>
                        <p>CLIENTES</p>
                    </div>
                    <div class="icon"><i class="fas fa-users"></i></div>
                </div>
            </div>
            <div class="col-6 col-md-6  col-lg-4 col-sm-6">
                <div class="card-box bg-orange">
                    <div class="inner">
                        <h3 style="color: #ffffff;"><strong><?php echo FC::cards('produtos'); ?></strong></h3>
                        <p>PRODUTOS</p>
                    </div>
                    <div class="icon"><i class="fas fa-dolly"></i></div>
                </div>
            </div>
            <div class="col-6 col-md-6 col-lg-4  col-sm-6">
                <div class="card-box bg-lime">
                    <div class="inner">
                        <h3 style="color: #ffffff;"><strong><?php echo FC::cards('servicos'); ?></strong></h3>
                        <p>SERVIÇOS</p>
                    </div>
                    <div class="icon"><i class="fas fa-wrench"></i></div>
                </div>
            </div>
            <div class="col-6 col-md-6 col-lg-4  col-sm-6">
                <div class="card-box bg-purple">
                    <div class="inner">
                        <h3 style="color: #ffffff;"><strong><?php echo FC::vendasdia($idsql); ?></strong></h3>
                        <p>VENDAS/DIA</p>
                    </div>
                    <div class="icon"><i class='fas fa-dollar-sign'></i></div>
                </div>
            </div>
        </div>

    </div>

    <div class="container mb-3 py-2">


        <canvas id="myChart" class="w-100 text-center justify-content-center"></canvas>



    </div>




    <!-- footer -->
    <?php include "includes/footer.php"; ?>

    <?php include "includes/libs.php"; ?>

    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/numeral.js/2.0.6/numeral.min.js"></script>


    <script>
        $(function() {
            // Initialize tooltips
            pulse('Carregando...');

        });
        $(document).ready(function() {

            var page = '<?php echo $page; ?>';
            if (page == 'clientes.php') {
                $('#btnradio2').prop('checked', true);
                $('#btnradio3').prop('checked', false);
                $('#btnradio4').prop('checked', false);
                $('#btnradio1').prop('checked', false);
            } else if (page == 'servicos.php') {
                $('#btnradio3').prop('checked', true);
                $('#btnradio2').prop('checked', false);
                $('#btnradio4').prop('checked', false);
                $('#btnradio1').prop('checked', false);
            } else if (page == 'ajuda.php') {
                $('#btnradio4').prop('checked', true);
                $('#btnradio2').prop('checked', false);
                $('#btnradio3').prop('checked', false);
                $('#btnradio1').prop('checked', false);
            } else if (page == 'index.php') {
                $('#btnradio1').prop('checked', true);
                $('#btnradio2').prop('checked', false);
                $('#btnradio3').prop('checked', false);
                $('#btnradio4').prop('checked', false);
            }
            removeloader();
            grafico1();


        });

        function removeloader() {



            Notiflix.Loading.remove(1923);

            mensagem('Bem-vindo(a) <?php echo $nome; ?>', 'sucesso');
            //abas('home');
        }
        var chart;

        function grafico1() {

            var json_url = "./grafico.json";

            const ctx = document.getElementById('myChart');
            const data = {
                labels: [],
                datasets: [{
                    label: 'Vendas/Mês',
                    data: [],
                    backgroundColor: [
                        'rgba(251, 80, 117, 1)',
                        'rgba(54, 162, 235, 1)',
                        'rgba(199, 255, 79, 1)',
                        'rgba(16, 244, 244, 1)',
                        'rgba(153, 102, 255, 1)',
                        'rgba(227, 157, 6,1)',
                        'rgba(158, 12, 237, 1)',
                        'rgba(57, 102, 247,1)',
                        'rgba(65, 184, 46,1)',
                        'rgba(220, 32, 11,1)',
                        'rgba(81, 11, 220,1)',
                        'rgba(254, 144, 9,1)'
                    ],
                    borderColor: [
                        'rgba(251, 80, 117, 1)',
                        'rgba(54, 162, 235, 1)',
                        'rgba(199, 255, 79, 1)',
                        'rgba(16, 244, 244, 1)',
                        'rgba(153, 102, 255, 1)',
                        'rgba(227, 157, 6,1)',
                        'rgba(158, 12, 237, 1)',
                        'rgba(57, 102, 247,1)',
                        'rgba(65, 184, 46,1)',
                        'rgba(220, 32, 11,1)',
                        'rgba(81, 11, 220,1)',
                        'rgba(254, 144, 9,1)'
                    ],
                    borderWidth: 1
                }]
            };


            chart = new Chart(ctx, {
                type: 'bar',
                data: data,
                options: {
                    scales: {
                        y: {
                            beginAtZero: true,
                            ticks: {
                                callback: function(value) {
                                    return parseFloat(value).toLocaleString();
                                }
                            }
                        }
                    },
                    plugins: {
                        tooltip: {
                            callbacks: {
                                label: function(tooltipItem) {
                                    return 'R$ ' + parseFloat(tooltipItem.parsed.y).toFixed(2);

                                }
                            }
                        }
                    }
                }
            });

            ajax_chart(chart, json_url);

        }

        function ajax_chart(chart, url, data) {
            var data = data || {};

            $.getJSON(url, data).done(function(response) {
                //console.log(response.labels);
                //console.log(response.data);
                chart.data.labels = response.labels;
                chart.data.datasets[0].data = response.data; // or you can iterate for multiple datasets
                chart.update(); // finally update our chart
            }).fail(function(jqxhr, textStatus, error) {
                var err = textStatus + ", " + error;
                console.error("Request Failed: " + err);
            });
        }
    </script>


</body>

</html>