144 lines
6.0 KiB
PHP
144 lines
6.0 KiB
PHP
@extends('base.layout')
|
|
@section('content')
|
|
<style>
|
|
table {
|
|
margin-bottom: 30px;
|
|
}
|
|
</style>
|
|
<div class="wrapper">
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-sm-6">
|
|
<div class="card-box ribbon-box">
|
|
<div class="ribbon ribbon-primary">Rekapitulasi Data Ziehl Laki-Laki Bulan {{$bulan}} Tahun {{$tahun}}</div>
|
|
<p></p>
|
|
<div class="table-responsive">
|
|
<button type="button" class="btn btn-primary" id="btnexport"><i class="fa fa-print"></i> Export</button>
|
|
<table cellpadding="0" cellspacing="0" id="znreporttable" class="table table-striped table-bordered">
|
|
<thead>
|
|
<tr>
|
|
<th>Nilai</th>
|
|
@foreach($kdSpesimenList as $sp)
|
|
<th>{{ $sp }}</th>
|
|
@endforeach
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@foreach($nilaiList as $nilai)
|
|
<tr>
|
|
<td>{{ $nilai }}</td>
|
|
@foreach($kdSpesimenList as $sp)
|
|
<td>{{ $rekapLaki[$nilai][$sp] }}</td>
|
|
@endforeach
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="card-footer">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-6">
|
|
<div class="card-box ribbon-box">
|
|
<div class="ribbon ribbon-danger">Rekapitulasi Data Ziehl Perempuan Bulan {{$bulan}} Tahun {{$tahun}}</div>
|
|
<p></p>
|
|
<div class="table-responsive">
|
|
<button type="button" class="btn btn-primary" id="btnexportperempuan"><i class="fa fa-print"></i> Export</button>
|
|
<table cellpadding="0" cellspacing="0" id="znreporttableperempuan" class="table table-striped table-bordered">
|
|
<thead>
|
|
<tr>
|
|
<th>Nilai</th>
|
|
@foreach($kdSpesimenList as $sp)
|
|
<th>{{ $sp }}</th>
|
|
@endforeach
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@foreach($nilaiList as $nilai)
|
|
<tr>
|
|
<td>{{ $nilai }}</td>
|
|
@foreach($kdSpesimenList as $sp)
|
|
<td>{{ $rekapPerempuan[$nilai][$sp] }}</td>
|
|
@endforeach
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="card-footer">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-12">
|
|
<div class="card-box ribbon-box">
|
|
<div class="ribbon ribbon-danger">Diagram Batang Bulan {{$bulan}} Tahun {{$tahun}}</div>
|
|
<p></p>
|
|
<div class="card-body">
|
|
<canvas id="chartZiehl" height="100"></canvas>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<input type="hidden" name="_token" id="token" value="{{ csrf_token() }}">
|
|
@endsection
|
|
@push('script')
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.17.0/xlsx.full.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
|
|
<script type="text/javascript">
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
document.getElementById('btnexport').addEventListener('click', function() {
|
|
var table = document.getElementById('znreporttable');
|
|
if (table) {
|
|
var wb = XLSX.utils.table_to_book(table, { sheet: "Report" });
|
|
XLSX.writeFile(wb, "ziehlnielsenlakilaki_{{$bulan}}_Tahun{{$tahun}}.xlsx");
|
|
} else {
|
|
console.error('Tabel dengan ID "znreporttable" tidak ditemukan.');
|
|
}
|
|
});
|
|
document.getElementById('btnexportperempuan').addEventListener('click', function() {
|
|
var table = document.getElementById('znreporttableperempuan');
|
|
if (table) {
|
|
var wb = XLSX.utils.table_to_book(table, { sheet: "Report" });
|
|
XLSX.writeFile(wb, "ziehlnielsenperempuan_{{$bulan}}_Tahun{{$tahun}}.xlsx");
|
|
} else {
|
|
console.error('Tabel dengan ID "znreporttableperempuan" tidak ditemukan.');
|
|
}
|
|
});
|
|
});
|
|
var ctx = document.getElementById('chartZiehl').getContext('2d');
|
|
var chart = new Chart(ctx, {
|
|
type: 'bar',
|
|
data: {
|
|
labels: @json($nilaiList),
|
|
datasets: [
|
|
{
|
|
label: 'Laki-Laki',
|
|
data: @json($chartL),
|
|
backgroundColor: 'rgba(54, 162, 235, 0.7)'
|
|
},
|
|
{
|
|
label: 'Perempuan',
|
|
data: @json($chartP),
|
|
backgroundColor: 'rgba(255, 99, 132, 0.7)'
|
|
}
|
|
]
|
|
},
|
|
options: {
|
|
responsive: true,
|
|
scales: {
|
|
y: {
|
|
beginAtZero: true,
|
|
title: {
|
|
display: true,
|
|
text: 'Jumlah Pasien'
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
@endpush |