Commit cfd003e1 authored by Syaifur Rohman's avatar Syaifur Rohman

add table and chart absensi

parent a57f7baa
<?php
namespace App\Http\Controllers\Api;
use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
use App\Models\Akademik\AbsensiModel;
class ChartDashboardController extends Controller
{
public function __construct()
{
$this->mAkAbsensi = new AbsensiModel();
}
public function getStatistikAbsensi()
{
// Fetch all attendance records for the current school and active period
$absensi = $this->mAkAbsensi
->where('idPSekolah', session()->get('idPSekolah'))
->where('idPPeriode', session()->get('idPPeriode'))
->get();
// Initialize a status count array with descriptive keys
$statusCount = [
'belum_ada_absensi' => 0,
'hadir' => 0,
'tidak_hadir' => 0,
'terlambat' => 0,
'ijin' => 0,
'sakit' => 0,
];
// Count each status across all students
foreach ($absensi as $record) {
switch ($record->idStatus) {
case 0:
$statusCount['belum_ada_absensi']++;
break;
case 1:
$statusCount['hadir']++;
break;
case 2:
$statusCount['tidak_hadir']++;
break;
case 3:
$statusCount['terlambat']++;
break;
case 4:
$statusCount['ijin']++;
break;
case 5:
$statusCount['sakit']++;
break;
}
}
// Return the status count as JSON
return response()->json($statusCount);
}
}
\ No newline at end of file
......@@ -28,89 +28,120 @@
{{ session('gagal') }}
</div>
@endif
<div class="card">
<div class="card-header pb-0">
<h1 class="text-center mb-5">Petunjuk Penggunaan</h1>
<h3>Petunjuk Struktur Kelas</h3>
<p>Untuk menyesuaikan Kurikulum 2013 dan Merdeka, Aplikasi yang kami membuat menyesuaikan dengan cara yang Bapak/Ibu bisa ikuti menyesuaikan dengan yang berlaku di sekolah: </p>
<div class="mb-5">
<h5 class="text-center">Contoh Struktur Kelas Kurikulum 2013</h5>
<table class="table text-center" border="1">
<thead>
<tr>
<td>No.</td>
<td>Jurusan</td>
<td>Tingkat</td>
<td>Indeks Kelas</td>
<td><b>Dikenal Sebagai</b></td>
</tr>
</thead>
<tbody>
<tr>
<td>1. </td>
<td>IPA</td>
<td>10</td>
<td>1, 2, 3, 4</td>
<td>10 IPA 1 <br> 10 IPA 2 <br> 10 IPA 3 <br> 10 IPA 4</td>
</tr>
<tr>
<td>2. </td>
<td>Bahasa</td>
<td>11</td>
<td>1, 2</td>
<td>11 Bahasa 1 <br> 11 Bahasa 2</td>
</tr>
</tbody>
</table>
</div>
<div class="mb-5">
<h5 class="text-center">Contoh Struktur Kelas Kurikulum Merdeka</h5>
<table class="table text-center" border="1">
<thead>
<tr>
<td>No.</td>
<td>Jurusan</td>
<td>Tingkat</td>
<td>Indeks Kelas</td>
<td><b>Dikenal Sebagai</b></td>
</tr>
</thead>
<tbody>
<tr>
<td>1. </td>
<td>Paket 1</td>
<td>10</td>
<td>1, 2, 3, 4</td>
<td>10 Paket 1 1 <br> 10 Paket 1 2 <br> 10 Paket 1 3 <br> 10 Paket 1 4</td>
</tr>
<tr>
<td>2. </td>
<td>Paket</td>
<td>11</td>
<td>1, 2</td>
<td>11 Paket 1 <br> 11 Paket 2</td>
</tr>
<tr>
<td>3. </td>
<td>Paket Kimia</td>
<td>11</td>
<td>1, 2</td>
<td>11 Paket Kimia 1 <br> 11 Paket Kimia 2</td>
</tr>
</tbody>
</table>
</div>
<h1 class="text-center mb-5">Statistik Absensi Siswa</h1>
</div>
<div class="card-body">
@if (session()->get('role') == 1)
<div class="row">
<div class="col-6" id="chartJmlSekolahJenisSekolah" style="height: 500px;"></div>
<div class="col-6" id="chartJmlSiswaJenisSekolah" style="height: 500px;"></div>
<div class="row">
<div class="col-md-6">
<h3>Kehadiran Siswa</h3>
<table class="table text-center" border="1">
<thead>
<tr>
<td>Siswa</td>
<td>Jumlah</td>
<td>Prosentase</td>
</tr>
</thead>
<tbody id="attendance-stats">
<!-- Data will be populated here -->
</tbody>
</table>
</div>
@endif
<div class="col-md-6">
<div id="chartKehadiranSiswa" style="height: 500px;"></div>
</div>
</div>
</div>
</div>
@if (session()->get('role') == 2)
<div class="card">
<div class="card-header pb-0">
<h1 class="text-center mb-5">Petunjuk Penggunaan</h1>
<h3>Petunjuk Struktur Kelas</h3>
<p>Untuk menyesuaikan Kurikulum 2013 dan Merdeka, Aplikasi yang kami membuat menyesuaikan dengan cara yang Bapak/Ibu bisa ikuti menyesuaikan dengan yang berlaku di sekolah: </p>
<div class="mb-5">
<h5 class="text-center">Contoh Struktur Kelas Kurikulum 2013</h5>
<table class="table text-center" border="1">
<thead>
<tr>
<td>No.</td>
<td>Jurusan</td>
<td>Tingkat</td>
<td>Indeks Kelas</td>
<td><b>Dikenal Sebagai</b></td>
</tr>
</thead>
<tbody>
<tr>
<td>1. </td>
<td>IPA</td>
<td>10</td>
<td>1, 2, 3, 4</td>
<td>10 IPA 1 <br> 10 IPA 2 <br> 10 IPA 3 <br> 10 IPA 4</td>
</tr>
<tr>
<td>2. </td>
<td>Bahasa</td>
<td>11</td>
<td>1, 2</td>
<td>11 Bahasa 1 <br> 11 Bahasa 2</td>
</tr>
</tbody>
</table>
</div>
<div class="mb-5">
<h5 class="text-center">Contoh Struktur Kelas Kurikulum Merdeka</h5>
<table class="table text-center" border="1">
<thead>
<tr>
<td>No.</td>
<td>Jurusan</td>
<td>Tingkat</td>
<td>Indeks Kelas</td>
<td><b>Dikenal Sebagai</b></td>
</tr>
</thead>
<tbody>
<tr>
<td>1. </td>
<td>Paket 1</td>
<td>10</td>
<td>1, 2, 3, 4</td>
<td>10 Paket 1 1 <br> 10 Paket 1 2 <br> 10 Paket 1 3 <br> 10 Paket 1 4</td>
</tr>
<tr>
<td>2. </td>
<td>Paket</td>
<td>11</td>
<td>1, 2</td>
<td>11 Paket 1 <br> 11 Paket 2</td>
</tr>
<tr>
<td>3. </td>
<td>Paket Kimia</td>
<td>11</td>
<td>1, 2</td>
<td>11 Paket Kimia 1 <br> 11 Paket Kimia 2</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="card-body">
@if (session()->get('role') == 1)
<div class="row">
<div class="col-6" id="chartJmlSekolahJenisSekolah" style="height: 500px;"></div>
<div class="col-6" id="chartJmlSiswaJenisSekolah" style="height: 500px;"></div>
</div>
@endif
</div>
</div>
@endif
</div>
</div>
</div>
......@@ -123,6 +154,84 @@
</script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// Fetch attendance statistics
$.ajax({
url: baseUrl + '/chart/dashboard/get-statistik-absensi',
method: 'GET',
success: function(response) {
let total = response.hadir + response.tidak_hadir + response.terlambat + response.ijin + response.sakit;
let rows = `
<tr>
<td>Belum Ada Absensi</td>
<td>${response.belum_ada_absensi}</td>
<td>${((response.belum_ada_absensi / total) * 100).toFixed(2)}%</td>
</tr>
<tr>
<td>Hadir</td>
<td>${response.hadir}</td>
<td>${((response.hadir / total) * 100).toFixed(2)}%</td>
</tr>
<tr>
<td>Tidak Hadir</td>
<td>${response.tidak_hadir}</td>
<td>${((response.tidak_hadir / total) * 100).toFixed(2)}%</td>
</tr>
<tr>
<td>Terlambat</td>
<td>${response.terlambat}</td>
<td>${((response.terlambat / total) * 100).toFixed(2)}%</td>
</tr>
<tr>
<td>Ijin</td>
<td>${response.ijin}</td>
<td>${((response.ijin / total) * 100).toFixed(2)}%</td>
</tr>
<tr>
<td>Sakit</td>
<td>${response.sakit}</td>
<td>${((response.sakit / total) * 100).toFixed(2)}%</td>
</tr>
`;
$('#attendance-stats').html(rows);
// Draw the pie chart for attendance
drawChartKehadiranSiswa(response);
},
error: function(err) {
console.log("Error:", err);
}
});
});
// Load Google Charts
google.charts.load('current', {'packages':['corechart']});
function drawChartKehadiranSiswa(data) {
// Create the data table
var dataTable = new google.visualization.DataTable();
dataTable.addColumn('string', 'Status');
dataTable.addColumn('number', 'Jumlah');
dataTable.addRows([
['Belum Ada Absensi', data.belum_ada_absensi],
['Hadir', data.hadir],
['Tidak Hadir', data.tidak_hadir],
['Terlambat', data.terlambat],
['Ijin', data.ijin],
['Sakit', data.sakit]
]);
// Set chart options
var options = {
title: 'Kehadiran Siswa',
pieHole: 0.4,
};
// Instantiate and draw the chart
var chart = new google.visualization.PieChart(document.getElementById('chartKehadiranSiswa'));
chart.draw(dataTable, options);
}
@if (session()->get('role') == 1)
// Memuat Google Charts
google.charts.load('current', {'packages':['corechart']});
......
......@@ -120,6 +120,8 @@ Route::middleware(['login:1'])->group(function () {
Route::middleware(['login:2'])->group(function () {
@include_once('web_sekolah.php');
// Chart Dashboard
Route::get('chart/dashboard/get-statistik-absensi', 'Api\ChartDashboardController@getStatistikAbsensi');
});
Route::middleware(['login:3'])->group(function () {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment