70 lines
2.9 KiB
PHP
70 lines
2.9 KiB
PHP
<div class="flex flex-col gap-4">
|
|
<div class="grid grid-cols-1 gap-4 md:grid-cols-3">
|
|
<div
|
|
class="relative aspect-video overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-700 p-6">
|
|
<h2 class="text-lg font-semibold">Total Pasien</h2>
|
|
<p class="mt-4 text-2xl font-bold">{{ $totalPatients }}</p>
|
|
</div>
|
|
|
|
<div
|
|
class="relative aspect-video overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-700 p-6">
|
|
<h2 class="text-lg font-semibold">Total Dokter</h2>
|
|
<p class="mt-4 text-2xl font-bold">{{ $totalDoctors }}</p>
|
|
</div>
|
|
|
|
<div
|
|
class="relative aspect-video overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-700 p-6">
|
|
<h2 class="text-lg font-semibold">Pendaftaran Hari Ini</h2>
|
|
<p class="mt-4 text-2xl font-bold">{{ $todayRegistrations }}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div
|
|
class="relative h-full flex-1 overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-700 p-6">
|
|
<h2 class="text-lg font-semibold">Pendapatan Hari Ini</h2>
|
|
<p class="mt-4 text-4xl font-bold text-green-500">Rp {{ number_format($todayIncome, 0, ',', '.') }}</p>
|
|
</div>
|
|
|
|
<div class="relative h-96 flex-1 overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-700 p-6">
|
|
<h2 class="text-lg font-semibold">Grafik Pendapatan 7 Hari Terakhir</h2>
|
|
<canvas id="incomeChart" class="mt-4"></canvas>
|
|
|
|
<div class="mt-4 text-sm">
|
|
@if ($incomeChangePercentage !== null)
|
|
<span>Trend: <b>{{ $incomeTrendStatus }}</b> sebesar
|
|
{{ number_format($incomeChangePercentage, 2) }}%</span>
|
|
@else
|
|
<span>Trend: <b>{{ $incomeTrendStatus }}</b></span>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const ctx = document.getElementById('incomeChart').getContext('2d');
|
|
const chart = new Chart(ctx, {
|
|
type: 'line',
|
|
data: {
|
|
labels: {!! json_encode($weeklyIncome->pluck('date')) !!},
|
|
datasets: [{
|
|
label: 'Pendapatan',
|
|
data: {!! json_encode($weeklyIncome->pluck('income')) !!},
|
|
borderColor: 'rgb(75, 192, 192)',
|
|
backgroundColor: 'rgba(75, 192, 192, 0.2)',
|
|
fill: true,
|
|
tension: 0.4,
|
|
}]
|
|
},
|
|
options: {
|
|
responsive: true,
|
|
scales: {
|
|
y: {
|
|
beginAtZero: true
|
|
}
|
|
}
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
</div>
|