144 lines
5.4 KiB
PHP
144 lines
5.4 KiB
PHP
@extends('layouts.admin')
|
|
|
|
@section('content')
|
|
<style>
|
|
.card {
|
|
border-radius: 15px;
|
|
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
|
}
|
|
|
|
.card:hover {
|
|
transform: scale(1.05);
|
|
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
|
|
}
|
|
|
|
.card-body {
|
|
padding-top: 3rem;
|
|
padding-bottom: 3rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.count-number {
|
|
font-weight: 700;
|
|
font-family: 'Poppins', sans-serif;
|
|
color: #ffffff !important;
|
|
text-shadow:
|
|
0 0 5px rgba(255, 255, 255, 0.8),
|
|
0 0 10px rgba(255, 255, 255, 0.6),
|
|
0 0 15px rgba(0, 0, 0, 0.7);
|
|
}
|
|
|
|
.count-produk {
|
|
font-size: 3.2rem;
|
|
}
|
|
|
|
.count-uang {
|
|
font-size: 3rem;
|
|
}
|
|
|
|
.btn-light {
|
|
border-radius: 50px;
|
|
font-weight: 600;
|
|
}
|
|
</style>
|
|
|
|
<div class="main-panel">
|
|
<div class="content-wrapper">
|
|
<div class="row">
|
|
|
|
<div class="col-md-4 grid-margin stretch-card">
|
|
<div class="card" style="background-color: #6B4F4F;">
|
|
<div class="card-body">
|
|
<h5 class="count-number count-produk" data-target="{{ $jumlahbarangshowroom }}">0</h5>
|
|
<p class="text-white mb-0" style="font-size: 16px;">Barang Showroom</p>
|
|
<a href="{{ url('admin/showroomdaftar') }}" class="btn btn-light btn-sm mt-3">Baca Selengkapnya</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-4 grid-margin stretch-card">
|
|
<div class="card" style="background-color: #A7727D;">
|
|
<div class="card-body">
|
|
<h5 class="count-number count-produk" data-target="{{ $jumlahproduk }}">0</h5>
|
|
<p class="text-white mb-0" style="font-size: 16px;">Data Barang Produksi</p>
|
|
<a href="{{ url('admin/produksidaftar') }}" class="btn btn-light btn-sm mt-3">Baca Selengkapnya</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="col-md-4 grid-margin stretch-card">
|
|
<div class="card" style="background-color: #3E3232;">
|
|
<div class="card-body">
|
|
<h5 class="count-number count-uang" data-target="{{ $totalpenjualan }}">0</h5>
|
|
<p class="text-white mb-0" style="font-size: 16px;">Pemasukan Bulan Ini</p>
|
|
<a href="{{ url('admin/penjualandaftar') }}" class="btn btn-light btn-sm mt-3">Baca Selengkapnya</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{{-- Pengeluaran Hari Ini
|
|
<div class="col-md-6 grid-margin stretch-card">
|
|
<div class="card" style="background-color: #C49292;">
|
|
<div class="card-body">
|
|
<h5 class="count-number count-uang" data-target="{{ $totalpembelianhariini }}">0</h5>
|
|
<p class="text-white mb-0" style="font-size: 16px;">Pengeluaran Hari Ini</p>
|
|
<a href="{{ url('admin/barangmasukdaftar') }}" class="btn btn-light btn-sm mt-3">Baca Selengkapnya</a>
|
|
</div>
|
|
</div>
|
|
</div> --}}
|
|
|
|
{{-- Pemasukan Hari Ini
|
|
<div class="col-md-6 grid-margin stretch-card">
|
|
<div class="card" style="background-color: #614040;">
|
|
<div class="card-body">
|
|
<h5 class="count-number count-uang" data-target="{{ $totalpenjualanhariini }}">0</h5>
|
|
<p class="text-white mb-0" style="font-size: 16px;">Pemasukan Hari Ini</p>
|
|
<a href="{{ url('admin/barangkeluardaftar') }}" class="btn btn-light btn-sm mt-3">Baca Selengkapnya</a>
|
|
</div>
|
|
</div>
|
|
</div> --}}
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const counters = document.querySelectorAll('.count-number');
|
|
counters.forEach(counter => {
|
|
const updateCount = () => {
|
|
const target = +counter.getAttribute('data-target');
|
|
let count = +counter.innerText.replace(/[^0-9]/g, '');
|
|
|
|
const increment = target / 200;
|
|
|
|
if (count < target) {
|
|
count = Math.ceil(count + increment);
|
|
if (counter.classList.contains('count-uang')) {
|
|
counter.innerText = new Intl.NumberFormat('id-ID', {
|
|
style: 'currency',
|
|
currency: 'IDR',
|
|
minimumFractionDigits: 0,
|
|
}).format(count);
|
|
} else {
|
|
counter.innerText = count;
|
|
}
|
|
setTimeout(updateCount, 10);
|
|
} else {
|
|
if (counter.classList.contains('count-uang')) {
|
|
counter.innerText = new Intl.NumberFormat('id-ID', {
|
|
style: 'currency',
|
|
currency: 'IDR',
|
|
minimumFractionDigits: 0,
|
|
}).format(target);
|
|
} else {
|
|
counter.innerText = target;
|
|
}
|
|
}
|
|
};
|
|
updateCount();
|
|
});
|
|
});
|
|
</script>
|
|
@endsection |