klasifikasi_kredit/resources/views/admin/dashboard.blade.php

72 lines
2.4 KiB
PHP

@extends('layouts.admin')
@section('content')
<div class="content-wrapper pb-0 min-vh-100">
<div class="page-header flex-wrap">
<h3 class="mb-0">Hi, welcome back!</h3>
</div>
<!-- Statistik Nasabah -->
<div class="row">
<div class="col-md-4">
<div class="card bg-primary text-white">
<div class="card-body">
<h4 class="card-title">Total Nasabah</h4>
<h2>{{ $total_nasabah }}</h2>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card bg-success text-white">
<div class="card-body">
<h4 class="card-title">Nasabah Layak</h4>
<h2>{{ $layak }}</h2>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card bg-danger text-white">
<div class="card-body">
<h4 class="card-title">Nasabah Tidak Layak</h4>
<h2>{{ $tidak_layak }}</h2>
</div>
</div>
</div>
</div>
<!-- Grafik Total Uang Peminjaman -->
<div class="card mt-4">
<div class="card-body">
<h4 class="card-title">Grafik Total Uang Peminjaman Berdasarkan Jangka Waktu</h4>
<canvas id="peminjamanChart"></canvas>
</div>
</div>
</div>
<!-- Chart.js -->
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script>
var ctx = document.getElementById('peminjamanChart').getContext('2d');
var peminjamanChart = new Chart(ctx, {
type: 'bar',
data: {
labels: @json($jangka_waktu),
datasets: [{
label: 'Total Peminjaman (Rp)',
data: @json($total_pinjaman),
backgroundColor: 'rgba(54, 162, 235, 0.6)',
borderColor: 'rgba(54, 162, 235, 1)',
borderWidth: 1
}]
},
options: {
responsive: true,
scales: {
y: {
beginAtZero: true
}
}
}
});
</script>
@endsection