

<?php $__env->startSection('content'); ?>
<div class="mb-4">
    <h3 class="font-weight-bold">
        Dashboard Sistem Gaji Guru
    </h3>

    <p class="text-muted">
        Ringkasan data guru, absensi dan penggajian.
    </p>
</div>

<div class="row">

    <div class="col-lg-4 col-md-6 mb-3">
        <div class="card border-0 shadow-sm">
            <div class="card-body d-flex justify-content-between align-items-center">
                <div>
                    <small class="text-muted">Total Guru</small>
                    <h2 class="mb-0"><?php echo e($totalGuru); ?></h2>
                </div>
                <div class="bg-primary text-white rounded-circle p-3">
                    <i class="fas fa-user-tie fa-lg"></i>
                </div>
            </div>
        </div>
    </div>

    <div class="col-lg-4 col-md-6 mb-3">
        <div class="card border-0 shadow-sm">
            <div class="card-body d-flex justify-content-between align-items-center">
                <div>
                    <small class="text-muted">Hadir Hari Ini</small>
                    <h2 class="mb-0"><?php echo e($hadirHariIni); ?></h2>
                </div>
                <div class="bg-success text-white rounded-circle p-3">
                    <i class="fas fa-calendar-check fa-lg"></i>
                </div>
            </div>
        </div>
    </div>

    <div class="col-lg-4 col-md-6 mb-3">
        <div class="card border-0 shadow-sm">
            <div class="card-body d-flex justify-content-between align-items-center">
                <div>
                    <small class="text-muted">Total Penggajian</small>
                    <h3 class="mb-0">
                        Rp <?php echo e(number_format($totalGaji,0,',','.')); ?>

                    </h3>
                </div>
                <div class="bg-warning text-white rounded-circle p-3">
                    <i class="fas fa-money-bill-wave fa-lg"></i>
                </div>
            </div>
        </div>
    </div>

</div>

<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

<div class="row mt-4">

    <div class="col-md-6">
        <div class="card shadow-sm">
            <div class="card-header bg-white">
                <strong>Grafik Absensi</strong>
            </div>
            <div class="card-body">
                <div style="height:250px">
                    <canvas id="absensiChart"></canvas>
                </div>
            </div>
        </div>
    </div>

    <div class="col-md-6">
        <div class="card shadow-sm">
            <div class="card-header bg-white">
                <strong>Grafik Penggajian</strong>
            </div>
            <div class="card-body">
                <div style="height:250px">
                    <canvas id="gajiChart"></canvas>
                </div>
            </div>
        </div>
    </div>

</div>

<div class="row mt-4">

    <div class="col-md-3">
        <div class="small-box bg-success">
            <div class="inner">
                <h3><?php echo e($hadir); ?></h3>
                <p>Hadir</p>
            </div>
            <div class="icon">
                <i class="fas fa-check"></i>
            </div>
        </div>
    </div>

    <div class="col-md-3">
        <div class="small-box bg-info">
            <div class="inner">
                <h3><?php echo e($izin); ?></h3>
                <p>Izin</p>
            </div>
            <div class="icon">
                <i class="fas fa-file-alt"></i>
            </div>
        </div>
    </div>

    <div class="col-md-3">
        <div class="small-box bg-warning">
            <div class="inner">
                <h3><?php echo e($sakit); ?></h3>
                <p>Sakit</p>
            </div>
            <div class="icon">
                <i class="fas fa-clinic-medical"></i>
            </div>
        </div>
    </div>

    <div class="col-md-3">
        <div class="small-box bg-danger">
            <div class="inner">
                <h3><?php echo e($alpha); ?></h3>
                <p>Alpha</p>
            </div>
            <div class="icon">
                <i class="fas fa-times"></i>
            </div>
        </div>
    </div>

</div>

<script>

    

const absensiChart = new Chart(
    document.getElementById('absensiChart'),
    {
        type: 'doughnut',
        data: {
            labels: ['Hadir','Izin','Sakit','Alpha'],
            datasets: [{
                data: [
                    <?php echo e($hadir); ?>,
                    <?php echo e($izin); ?>,
                    <?php echo e($sakit); ?>,
                    <?php echo e($alpha); ?>

                ],
                backgroundColor: [
                    '#28a745',
                    '#17a2b8',
                    '#ffc107',
                    '#dc3545'
                ]
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false
}
    }
);

new Chart(
    document.getElementById('gajiChart'),
    {
        type: 'line',
        data: {
            labels: [
                <?php $__currentLoopData = $gajiBulanan; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $g): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    '<?php echo e($g->periode); ?>',
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            ],
            datasets: [{
                label: 'Total Penggajian',
                data: [
                    <?php $__currentLoopData = $gajiBulanan; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $g): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <?php echo e($g->total); ?>,
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                ]
            }]
        },
        options: {
            responsive: true,
            maintainAspectRatio: false
}
    }
);

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