162 lines
6.6 KiB
PHP
162 lines
6.6 KiB
PHP
@extends('layouts.master')
|
|
|
|
@section('css')
|
|
<style>
|
|
.avatar-sm {
|
|
width: 36px;
|
|
height: 36px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.card {
|
|
transition: transform .2s;
|
|
}
|
|
|
|
.card:hover {
|
|
transform: translateY(-5px);
|
|
}
|
|
|
|
.text-white-50 {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
.announcement-item:last-child {
|
|
border-bottom: none !important;
|
|
margin-bottom: 0 !important;
|
|
padding-bottom: 0 !important;
|
|
}
|
|
</style>
|
|
@endsection
|
|
|
|
@section('breadcrumb')
|
|
<div class="col-sm-6">
|
|
<h4 class="page-title text-primary font-weight-bold">Dashboard</h4>
|
|
<ol class="breadcrumb bg-transparent p-0">
|
|
<li class="breadcrumb-item"><a href="#" class="text-primary">Home</a></li>
|
|
<li class="breadcrumb-item active text-muted">Dashboard</li>
|
|
</ol>
|
|
</div>
|
|
@endsection
|
|
|
|
@section('content')
|
|
<div class="row">
|
|
<!-- Statistik Cards -->
|
|
<div class="col-xl-4 col-md-6 mb-4">
|
|
<div class="card bg-primary text-white shadow h-100 py-2">
|
|
<div class="card-body">
|
|
<div class="row no-gutters align-items-center">
|
|
<div class="col mr-2">
|
|
<div class="text-xs font-weight-bold text-uppercase mb-1">
|
|
Total Karyawan</div>
|
|
<div class="h3 mb-0 font-weight-bold">{{ number_format($attendanceStats['total_karyawan']) }}</div>
|
|
</div>
|
|
<div class="col-auto">
|
|
<i class="fas fa-users fa-2x text-white-50"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xl-4 col-md-6 mb-4">
|
|
<div class="card bg-success text-white shadow h-100 py-2">
|
|
<div class="card-body">
|
|
<div class="row no-gutters align-items-center">
|
|
<div class="col mr-2">
|
|
<div class="text-xs font-weight-bold text-uppercase mb-1">
|
|
Hadir Bulan Ini</div>
|
|
<div class="h3 mb-0 font-weight-bold">{{ number_format($attendanceStats['hadir']) }}</div>
|
|
</div>
|
|
<div class="col-auto">
|
|
<i class="fas fa-check-circle fa-2x text-white-50"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xl-4 col-md-6 mb-4">
|
|
<div class="card bg-info text-white shadow h-100 py-2">
|
|
<div class="card-body">
|
|
<div class="row no-gutters align-items-center">
|
|
<div class="col mr-2">
|
|
<div class="text-xs font-weight-bold text-uppercase mb-1">
|
|
Total Cuti</div>
|
|
<div class="h3 mb-0 font-weight-bold">{{ number_format($totalCuti) }}</div>
|
|
</div>
|
|
<div class="col-auto">
|
|
<i class="fas fa-calendar-alt fa-2x text-white-50"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Content Row -->
|
|
<div class="row">
|
|
<!-- Pengumuman -->
|
|
<div class="col-xl-8 col-lg-7">
|
|
<div class="card shadow mb-4">
|
|
<div class="card-header py-3">
|
|
<h6 class="m-0 font-weight-bold text-primary">Pengumuman Terbaru</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
@forelse($announcements as $announcement)
|
|
<div class="announcement-item mb-3 pb-3 border-bottom">
|
|
<h5 class="font-weight-bold">{{ $announcement->title }}</h5>
|
|
<p class="text-muted mb-2">{{ Str::limit($announcement->content, 150) }}</p>
|
|
<small class="text-muted">
|
|
<i class="fas fa-clock mr-1"></i>
|
|
{{ $announcement->created_at->diffForHumans() }}
|
|
</small>
|
|
</div>
|
|
@empty
|
|
<div class="text-center py-4">
|
|
<i class="fas fa-bullhorn fa-3x text-gray-300 mb-3"></i>
|
|
<p class="text-muted">Tidak ada pengumuman terbaru</p>
|
|
</div>
|
|
@endforelse
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Aktivitas Presensi -->
|
|
<div class="col-xl-4 col-lg-5">
|
|
<div class="card shadow mb-4">
|
|
<div class="card-header py-3">
|
|
<h6 class="m-0 font-weight-bold text-primary">Aktivitas Presensi Terbaru</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
@forelse($recentAttendance as $attendance)
|
|
<div class="d-flex align-items-center mb-3">
|
|
<div class="flex-shrink-0">
|
|
<div class="avatar-sm bg-light rounded-circle">
|
|
<i class="fas {{ $attendance->clock_type == 'in' ? 'fa-sign-in-alt' : 'fa-sign-out-alt' }}
|
|
text-{{ $attendance->status == 'Hadir' ? 'success' : 'warning' }}"></i>
|
|
</div>
|
|
</div>
|
|
<div class="flex-grow-1 ms-3 ml-3">
|
|
<h6 class="mb-1">{{ $attendance->name }}</h6>
|
|
<p class="text-muted mb-0">
|
|
{{ $attendance->clock_type == 'in' ? 'Masuk' : 'Keluar' }} -
|
|
{{ Carbon\Carbon::parse($attendance->created_at)->format('H:i') }}
|
|
<span class="badge badge-{{ $attendance->status == 'Hadir' ? 'success' : 'warning' }} ml-2">
|
|
{{ $attendance->status }}
|
|
</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
@empty
|
|
<div class="text-center py-4">
|
|
<i class="fas fa-clock fa-3x text-gray-300 mb-3"></i>
|
|
<p class="text-muted">Belum ada aktivitas presensi</p>
|
|
</div>
|
|
@endforelse
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|