219 lines
8.8 KiB
PHP
219 lines
8.8 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('title', 'Daftar Pengguna')
|
|
|
|
@push('styles')
|
|
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
|
|
<style>
|
|
:root {
|
|
--primary-color: #4361ee;
|
|
--primary-hover: #3a56d4;
|
|
--danger-color: #f43f5e;
|
|
--success-color: #10b981;
|
|
--warning-color: #f59e0b;
|
|
--info-color: #3b82f6;
|
|
--light-bg: #f8fafc;
|
|
--card-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
|
|
--transition: all 0.2s ease-in-out;
|
|
--border-radius: 12px;
|
|
--danger-hover: #dc2626;
|
|
--text-primary: #1e293b;
|
|
--text-secondary: #64748b;
|
|
--bg-light: #f8fafc;
|
|
--border-color: #e2e8f0;
|
|
}
|
|
|
|
body {
|
|
font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
|
|
line-height: 1.5;
|
|
color: var(--text-primary);
|
|
background-color: #f1f5f9;
|
|
}
|
|
|
|
.table th {
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
font-size: 0.75rem;
|
|
letter-spacing: 0.05em;
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.table > :not(:first-child) {
|
|
border-top: 1px solid var(--border-color);
|
|
}
|
|
|
|
.table > :not(caption) > * > * {
|
|
padding: 1rem 1.25rem;
|
|
}
|
|
|
|
.table-hover > tbody > tr:hover {
|
|
background-color: rgba(15, 23, 42, 0.02);
|
|
}
|
|
|
|
.btn-sm {
|
|
padding: 0.35rem 0.75rem;
|
|
font-size: 0.825rem;
|
|
}
|
|
|
|
.badge {
|
|
font-weight: 600;
|
|
padding: 0.35em 0.65em;
|
|
}
|
|
|
|
.form-control:focus {
|
|
border-color: var(--primary-color);
|
|
box-shadow: 0 0 0 0.25rem rgba(67, 97, 238, 0.15);
|
|
}
|
|
|
|
/* Custom scrollbar */
|
|
::-webkit-scrollbar {
|
|
width: 6px;
|
|
height: 6px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background: #f1f1f1;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background: #cbd5e1;
|
|
border-radius: 10px;
|
|
transition: background 0.3s ease;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #94a3b8;
|
|
}
|
|
</style>
|
|
@endpush
|
|
|
|
@section('content')
|
|
<div class="container py-4">
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h2 class="mb-0" style="font-weight:700; font-size:1.5rem;">Daftar Pengguna</h2>
|
|
<div class="d-flex gap-2 d-none">
|
|
<form method="POST" action="{{ route('admin.users.attendance.enable-all') }}" class="mb-0">
|
|
@csrf
|
|
<button type="submit" class="btn btn-success btn-sm">Aktifkan Semua</button>
|
|
</form>
|
|
<form method="POST" action="{{ route('admin.users.attendance.disable-all') }}" class="mb-0">
|
|
@csrf
|
|
<button type="submit" class="btn btn-danger btn-sm">Nonaktifkan Semua</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card shadow-sm">
|
|
<div class="card-body p-0">
|
|
<div class="table-responsive">
|
|
<table class="table table-hover align-middle mb-0">
|
|
<thead class="bg-light">
|
|
<tr>
|
|
<th class="ps-4">Nama</th>
|
|
<th>Email</th>
|
|
<th>NIK</th>
|
|
<th>Jabatan</th>
|
|
<th>Status</th>
|
|
<th>Hadir</th>
|
|
<th>Tidak Hadir</th>
|
|
<th class="text-end pe-4">Aksi</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@forelse($users as $user)
|
|
@php
|
|
$initials = collect(explode(' ', trim($user->name)))
|
|
->filter()
|
|
->map(fn($part) => mb_substr($part, 0, 1))
|
|
->take(2)
|
|
->implode('');
|
|
$initials = mb_strtoupper($initials ?: 'U');
|
|
|
|
$hadir = $user->attendances()->where('status', 'hadir')->count();
|
|
$tidakHadir = $user->attendances()->where('status', '!=', 'hadir')->count();
|
|
@endphp
|
|
<tr>
|
|
<td>
|
|
<div class="d-flex align-items-center">
|
|
<div class="me-3 d-flex align-items-center justify-content-center rounded-circle" style="width:40px; height:40px; background:linear-gradient(140deg,rgba(99,102,241,0.6),rgba(14,165,233,0.4)); color:white; font-weight:600; font-size:14px;">
|
|
{{ $initials }}
|
|
</div>
|
|
<div>
|
|
<div class="fw-semibold">{{ $user->name }}</div>
|
|
<small class="text-muted">{{ $user->username ?? 'No Username' }}</small>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td>{{ $user->email ?? '-' }}</td>
|
|
<td>{{ $user->nik ?? '-' }}</td>
|
|
<td>
|
|
@if($user->role)
|
|
<span class="badge bg-primary">{{ ucfirst($user->role) }}</span>
|
|
@else
|
|
<span class="text-muted">-</span>
|
|
@endif
|
|
</td>
|
|
<td>
|
|
<form method="POST" action="{{ route('admin.users.attendance-toggle', $user->id) }}" class="d-inline">
|
|
@csrf
|
|
@method('PATCH')
|
|
<input type="hidden" name="attendance_enabled" value="{{ $user->attendance_enabled ? 0 : 1 }}">
|
|
<button type="submit" class="btn btn-sm {{ $user->attendance_enabled ? 'btn-success' : 'btn-danger' }} py-0 px-2">
|
|
{{ $user->attendance_enabled ? 'Aktif' : 'Nonaktif' }}
|
|
</button>
|
|
</form>
|
|
</td>
|
|
<td>
|
|
<span style="background:#22c55e;color:#fff;padding:2px 10px;border-radius:8px;font-weight:600;">{{ $hadir }}</span>
|
|
</td>
|
|
<td>
|
|
<span style="background:#ef4444;color:#fff;padding:2px 10px;border-radius:8px;font-weight:600;">{{ $tidakHadir }}</span>
|
|
</td>
|
|
<td class="text-end pe-4">
|
|
<a href="{{ route('admin.users.show', $user->id) }}" class="btn btn-primary btn-sm" style="margin-right:6px;">Lihat</a>
|
|
<form method="POST" action="{{ route('admin.users.destroy', $user->id) }}" style="display:inline;" onsubmit="return confirm('Yakin ingin menghapus pengguna ini?')">
|
|
@csrf
|
|
@method('DELETE')
|
|
<button type="submit" class="btn btn-danger btn-sm">Hapus</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
@empty
|
|
<tr>
|
|
<td colspan="8" class="text-center py-4">
|
|
<div class="text-muted">Tidak ada data pengguna</div>
|
|
</td>
|
|
</tr>
|
|
@endforelse
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="card-footer bg-white">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div class="text-muted small">
|
|
Menampilkan {{ $users->firstItem() ?? 0 }} - {{ $users->lastItem() ?? 0 }} dari {{ $users->total() }} pengguna
|
|
</div>
|
|
<div>
|
|
{{ $users->withQueryString()->links() }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
|
|
@push('scripts')
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Inisialisasi tooltips
|
|
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
|
|
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
|
|
return new bootstrap.Tooltip(tooltipTriggerEl);
|
|
});
|
|
});
|
|
</script>
|
|
@endpush
|