

<?php $__env->startSection('breadcrumb'); ?>
	<li class="breadcrumb-item"><a href="javascript:void(0);">Inicio</a></li>
    <!--<li class="breadcrumb-item active" aria-current="page"><span>Nombre Hotel</span></li>-->
<?php $__env->stopSection(); ?>

<?php $__env->startSection('css'); ?>
<link rel="stylesheet" type="text/css" href="<?php echo e(asset('css/widgets/modules-widgets.css')); ?>">    
<?php $__env->stopSection(); ?>

<?php $__env->startSection('content'); ?>
    <?php if(Auth::user()->rol_id == 1): ?>

             <br><br>
                <div class="row analytics">
                    <div class="col">
                        <div class="row widget-statistic">
                            <div class="col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
                                <div class="widget widget-one_hybrid widget-followers">
                                    <div class="widget-heading">
                                        <div class="w-icon">
                                            <svg aria-hidden="true" focusable="false" data-prefix="far" data-icon="building" class="svg-inline--fa fa-building fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M128 148v-40c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12zm140 12h40c6.6 0 12-5.4 12-12v-40c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12zm-128 96h40c6.6 0 12-5.4 12-12v-40c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12zm128 0h40c6.6 0 12-5.4 12-12v-40c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12zm-76 84v-40c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12zm76 12h40c6.6 0 12-5.4 12-12v-40c0-6.6-5.4-12-12-12h-40c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12zm180 124v36H0v-36c0-6.6 5.4-12 12-12h19.5V24c0-13.3 10.7-24 24-24h337c13.3 0 24 10.7 24 24v440H436c6.6 0 12 5.4 12 12zM79.5 463H192v-67c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v67h112.5V49L80 48l-.5 415z"></path></svg>
                                        </div>
                                        <p class="w-value"><?php echo e($hoteles); ?></p>
                                        <h5 class="">Hoteles Publicados</h5>
                                    </div>
                                    <div class="widget-content">    
                                        <div class="w-chart">
                                            <div id="hybrid_followers"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>  

                            <div class="col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
                                <div class="widget widget-one_hybrid widget-referral">
                                    <div class="widget-heading">
                                        <div class="w-icon">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-users"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg>
                                        </div>
                                        <p class="w-value"><?php echo e($user); ?></p>
                                        <h5 class="">Usuarios Registrados</h5>
                                    </div>
                                    <div class="widget-content">    
                                        <div class="w-chart">
                                            <div id="hybrid_followers1"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
                                <div class="widget widget-one_hybrid widget-engagement">
                                    <div class="widget-heading">
                                        <div class="w-icon">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-message-circle"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"></path></svg>
                                        </div>
                                        <p class="w-value"><?php echo e($habitaciones); ?></p>
                                        <h5 class="">Habitaciones Publicadas</h5>
                                    </div>
                                    <div class="widget-content">    
                                        <div class="w-chart">
                                            <div id="hybrid_followers3"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>  

                <div class="row sales layout-top-spacing">
                    <div class="col-md-3">
                        <div class="widget widget-chart-two">
                            <div class="widget-heading">
                                <h5 class="">Hoteles</h5>
                            </div>
                            <div class="widget-content">
                                <div id="chart-hoteles" class=""></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="widget widget-chart-two">
                            <div class="widget-heading">
                                <h5 class="">Hoteles por estrellas </h5>
                            </div>
                            <div class="widget-content">
                                <div id="chart-estrellas" class=""></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="widget-three">
                            <div class="widget-heading">
                                <h5 class="">Usuarios por roles</h5>
                            </div>
                            <div class="widget-content">

                                <div class="order-summary">

                                    <div class="summary-list">
                                        <div class="w-icon">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-users"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg>
                                        </div>
                                        <div class="w-summary-details">
                                            
                                            <div class="w-summary-info">
                                                <h6>Hotel</h6>
                                                <p class="summary-count"><?php echo e($roles[0]); ?></p>
                                            </div>

                                            <div class="w-summary-stats">
                                                <div class="progress">
                                                    <div class="progress-bar bg-gradient-secondary" role="progressbar" style="width: <?php echo e($porcentaje[0]); ?>%" aria-valuenow="0" aria-valuemin="<?php echo e($porcentaje[0]); ?>" aria-valuemax="100"></div>
                                                </div>
                                            </div>

                                        </div>

                                    </div>

                                    <!--
                                    <div class="summary-list">
                                        <div class="w-icon">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-users"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg>
                                        </div>
                                        <div class="w-summary-details">
                                            
                                            <div class="w-summary-info">
                                                <h6>Agencias de viajes</h6>
                                                <p class="summary-count"><?php echo e($roles[2]); ?></p>
                                            </div>

                                            <div class="w-summary-stats">
                                                <div class="progress">
                                                    <div class="progress-bar bg-gradient-success" role="progressbar" style="width: <?php echo e($porcentaje[2]); ?>%" aria-valuenow="0" aria-valuemin="<?php echo e($porcentaje[2]); ?>" aria-valuemax="100"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="summary-list">
                                        <div class="w-icon">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-users"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg>
                                        </div>
                                        <div class="w-summary-details">
                                            
                                            <div class="w-summary-info">
                                                <h6>Guía de viajes</h6>
                                                <p class="summary-count"><?php echo e($roles[3]); ?></p>
                                            </div>

                                            <div class="w-summary-stats">
                                                <div class="progress">
                                                    <div class="progress-bar bg-gradient-primary" role="progressbar" style="width: <?php echo e($porcentaje[3]); ?>%" aria-valuenow="<?php echo e($porcentaje[3]); ?>" aria-valuemin="<?php echo e($porcentaje[3]); ?>" aria-valuemax="100"></div>
                                                </div>
                                            </div>

                                        </div>

                                    </div>
                                    -->
                                    
                                    <div class="summary-list">
                                        <div class="w-icon">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-users"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg>
                                        </div>
                                        <div class="w-summary-details">
                                            
                                            <div class="w-summary-info">
                                                <h6>Clientes</h6>
                                                <p class="summary-count"><?php echo e($roles[1]); ?></p>
                                            </div>

                                            <div class="w-summary-stats">
                                                <div class="progress">
                                                    <div class="progress-bar bg-gradient-warning" role="progressbar" style="width: <?php echo e($porcentaje[1]); ?>%" aria-valuenow="0" aria-valuemin="<?php echo e($porcentaje[1]); ?>" aria-valuemax="100"></div>
                                                </div>
                                            </div>

                                        </div>

                                    </div>
                                    
                                </div>

                            </div>
                        </div>
                    </div>  
                </div>    
    <?php else: ?>
        <center>
            <br>
            <img src="<?php echo e(asset('img/guatehoteles.png')); ?>" style="height: 340px;">    
            <h1>Bienvenido a GuateHoteles</h1>        
        </center>
    <?php endif; ?>
<?php $__env->stopSection(); ?>

<?php $__env->startSection('script'); ?>
	<script src="<?php echo e(asset('js/widgets/modules-widgets.js')); ?>"></script>

    <script type="text/javascript">
        var options = {
                chart: {
                    type: 'donut',
                    width: 380
                },
                colors: ['#fdb716', '#28b6e9'],
                dataLabels: {
                  enabled: false
                },
                legend: {
                    position: 'bottom',
                    horizontalAlign: 'center',
                    fontSize: '14px',
                    markers: {
                      width: 10,
                      height: 10,
                    },
                    itemMargin: {
                      horizontal: 0,
                      vertical: 8
                    }
                },
                plotOptions: {
                  pie: {
                    donut: {
                      size: '65%',
                      background: 'transparent',
                      labels: {
                        show: true,
                        name: {
                          show: true,
                          fontSize: '29px',
                          fontFamily: 'Nunito, sans-serif',
                          color: undefined,
                          offsetY: -10
                        },
                        value: {
                          show: true,
                          fontSize: '26px',
                          fontFamily: 'Nunito, sans-serif',
                          color: '20',
                          offsetY: 16,
                          formatter: function (val) {
                            return val
                          }
                        },
                        total: {
                          show: true,
                          showAlways: true,
                          label: 'Total',
                          color: '#888ea8',
                          formatter: function (w) {
                            return w.globals.seriesTotals.reduce( function(a, b) {
                              return a + b
                            }, 0)
                          }
                        }
                      }
                    }
                  }
                },
                stroke: {
                  show: true,
                  width: 25,
                },
                series: [<?php echo $HNR.','.$HR; ?>],
                labels: ['Hoteles sin reclamar', 'Hoteles reclamados'],
                responsive: [{
                    breakpoint: 1599,
                    options: {
                        chart: {
                            width: '350px',
                            height: '400px'
                        },
                        legend: {
                            position: 'bottom'
                        }
                    },

                    breakpoint: 1439,
                    options: {
                        chart: {
                            width: '250px',
                            height: '390px'
                        },
                        legend: {
                            position: 'bottom'
                        },
                        plotOptions: {
                          pie: {
                            donut: {
                              size: '65%',
                            }
                          }
                        }
                    },
                }]
        }

        var chart = new ApexCharts(
            document.querySelector("#chart-hoteles"),
            options
        );

        chart.render();


        var options1 = {
                chart: {
                    type: 'donut',
                    width: 380
                },
                colors: ['#20ad75','#2a61e5','#ed737a','#fdb716', '#f8733c','#b224ef'],
                dataLabels: {
                  enabled: false
                },
                legend: {
                    position: 'bottom',
                    horizontalAlign: 'center',
                    fontSize: '14px',
                    markers: {
                      width: 10,
                      height: 10,
                    },
                    itemMargin: {
                      horizontal: 0,
                      vertical: 8
                    }
                },
                plotOptions: {
                  pie: {
                    donut: {
                      size: '80%',
                      background: 'transparent',
                      labels: {
                        show: true,
                        name: {
                          show: true,
                          fontSize: '29px',
                          fontFamily: 'Nunito, sans-serif',
                          color: undefined,
                          offsetY: -10
                        },
                        value: {
                          show: true,
                          fontSize: '26px',
                          fontFamily: 'Nunito, sans-serif',
                          color: '20',
                          offsetY: 16,
                          formatter: function (val) {
                            return val
                          }
                        },
                        total: {
                          show: true,
                          showAlways: true,
                          label: 'Total',
                          color: '#888ea8',
                          formatter: function (w) {
                            return w.globals.seriesTotals.reduce( function(a, b) {
                              return a + b
                            }, 0)
                          }
                        }
                      }
                    }
                  }
                },
                stroke: {
                  show: true,
                  width: 25,
                },
                series: [<?php echo $h0.','.$h1.','.$h2.','.$h3.','.$h4.','.$h5; ?>],
                labels: ['0 estrellas', '1 estrella','2 estrellas','3 estrellas','4 estrellas','5 estrellas'],
                responsive: [{
                    breakpoint: 1599,
                    options: {
                        chart: {
                            width: '350px',
                            height: '400px'
                        },
                        legend: {
                            position: 'bottom'
                        }
                    },

                    breakpoint: 1439,
                    options: {
                        chart: {
                            width: '250px',
                            height: '390px'
                        },
                        legend: {
                            position: 'bottom'
                        },
                        plotOptions: {
                          pie: {
                            donut: {
                              size: '60%',
                            }
                          }
                        }
                    },
                }]
        }

        var chart = new ApexCharts(
            document.querySelector("#chart-estrellas"),
            options1
        );

        chart.render();

    </script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('admin.layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH C:\xampp\htdocs\guatehoteles\resources\views/admin/index.blade.php ENDPATH**/ ?>