<?php 
//=====================================================================================
//INICIO LA SESION---------------------------------------------------------------------
//=====================================================================================
session_start();
//=====================================================================================
//----------------VARIBLES-------------------------------------------------------------
//=====================================================================================
$txt_desc_tramite = $_POST["txt_desc_tramite"];
$txt_inicial_exp = $_POST["txt_inicial_exp"];
$txt_traff_exp = $_POST["txt_traff_exp"];
$txt_terminado_exp = $_POST["txt_terminado_exp"];
$txt_retenido_exp = $_POST["txt_retenido_exp"];
$txt_total_exp = $_POST["txt_total_exp"];
$txt_code_tramite = $_POST["txt_code_tramite"];
$_SESSION["code_tramite"] = $txt_code_tramite;
$html = "";
//=====================================================================================
//----------------ACCIONES-------------------------------------------------------------
//=====================================================================================
//=====================================================================================
$html .= '
<span id="section_stats_exp">
    <div class="container-fluid mt--6">
        <div class="row">
            <div class="col-sm-12 col-md-12 col-lg-7">
                <div class="card bg-teal opacity-8 shadow">
                    <div class="card-body">
                        <div class="chart">
                            <canvas id="chart-tramites" class="chart-canvas"></canvas>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-5">
                <div class="card card-frame opacity-8">
                    <div class="card-body">
                        <ul class="list-group list-group-flush">
                            <li class="checklist-entry list-group-item flex-column align-items-start py-4 px-4">
                                <div class="checklist-item checklist-item-success">
                                    <div class="checklist-info">
                                        <h5 class="checklist-title mb-0 text-teal">Estado Inicial</h5>
                                        <small class="text-teal">Cant. Expedientes : '.$txt_inicial_exp.'</small>
                                    </div>
                                    <div>
                                        <div class="custom-control custom-checkbox custom-checkbox-success">
                                        <button onClick="javascript:consultaExpedientesEstado(1);" class="btn btn-icon btn-outline-success" type="button">
                                            <span class="btn-inner--icon"><i class="fas fa-search"></i></span>
                                        </button>
                                        </div>
                                    </div>
                                </div>  
                            </li>
                            <li class="checklist-entry list-group-item flex-column align-items-start py-4 px-4">
                                <div class="checklist-item checklist-item-success">
                                    <div class="checklist-info">
                                        <h5 class="checklist-title mb-0 text-teal">Estado en Tráfico</h5>
                                        <small class="text-teal">Cant. Expedientes : '.$txt_traff_exp.'</small>
                                    </div>
                                    <div>
                                        <div class="custom-control custom-checkbox custom-checkbox-success">
                                        <button onClick="javascript:consultaExpedientesEstado(2);" class="btn btn-icon btn-outline-success" type="button">
                                            <span class="btn-inner--icon"><i class="fas fa-search"></i></span>
                                        </button>
                                        </div>
                                    </div>
                                </div>  
                            </li>
                            <li class="checklist-entry list-group-item flex-column align-items-start py-4 px-4">
                                <div class="checklist-item checklist-item-success">
                                    <div class="checklist-info">
                                        <h5 class="checklist-title mb-0 text-teal">Estado Terminado</h5>
                                        <small class="text-teal">Cant. Expedientes : '.$txt_terminado_exp.'</small>
                                    </div>
                                    <div>
                                        <div class="custom-control custom-checkbox custom-checkbox-success">
                                        <button onClick="javascript:consultaExpedientesEstado(3);" class="btn btn-icon btn-outline-success" type="button">
                                            <span class="btn-inner--icon"><i class="fas fa-search"></i></span>
                                        </button>
                                        </div>
                                    </div>
                                </div>  
                            </li>
                            <li class="checklist-entry list-group-item flex-column align-items-start py-4 px-4">
                                <div class="checklist-item checklist-item-warning">
                                    <div class="checklist-info">
                                        <h5 class="checklist-title mb-0 text-warning">Estado Retenido</h5>
                                        <small class="text-warning">Cant. Expedientes : '.$txt_retenido_exp.'</small>
                                    </div>
                                    <div>
                                        <div class="custom-control custom-checkbox custom-checkbox-warning">
                                        <button  onClick="javascript:consultaExpedientesEstado(4);"class="btn btn-icon btn-outline-warning" type="button">
                                            <span class="btn-inner--icon"><i class="fas fa-search"></i></span>
                                        </button>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</span>
<span id="section_tabla_exp" style="display:none"></span>
<span id="section_detalle_exp" style="display:none"></span>
<script>
var ctx = document.getElementById("chart-tramites");
var myBarChart = new Chart(ctx, {
    type: "doughnut",
    data: {
        datasets: [{
            data: ['.$txt_inicial_exp.', '.$txt_traff_exp.', '.$txt_terminado_exp.', '.$txt_retenido_exp.'],
            backgroundColor: [
                "rgba(255, 206, 86, 0.6)",
                "rgba(54, 162, 235, 0.6)",
                "rgba(134, 194, 128, 0.6)",
                "rgba(255, 99, 132, 0.6)"
            ],
            borderColor: [
                "rgba(255, 206, 86, 1)",
                "rgba(54, 162, 235, 1)",
                "rgba(134, 194, 128, 1)",
                "rgba(255, 99, 132, 1)"
            ],
            borderWidth: 1
        }],
        labels: [
            "Inicial",
            "En Tráfico",
            "Terminado",
            "Retenido"
        ]
    },
    options: {
        cutoutPercentage : 40,
        legend: {
            display: true,
            position: "bottom",
            labels: {
                fontColor: "rgb(246, 250, 252)"
            }
        },
        title: {
            display: true,
            text: "'.$txt_total_exp.' EXPEDIENTES DE '.$txt_desc_tramite.'",
            fontSize: 20,
            fontColor: "rgb(246, 250, 252)"
        }        
    }
});
</script>
';

$r_code = 400;
$r_msg = "success : request success";
$r_html = $html;
//RESPUESTA============================================================================
$response[] = array ( 
    "code" => $r_code,
    "message" => $r_msg,
    "html" => $r_html
);
header("Content-type: application/json; charset=utf-8");
echo json_encode($response);
//=====================================================================================
//----------------FUNCIONES------------------------------------------------------------
//=====================================================================================

?>