227 lines
10 KiB
PHP
227 lines
10 KiB
PHP
@extends('layouts.anggota')
|
|
|
|
@section('content')
|
|
<style>
|
|
|
|
|
|
.card.shadow-lg {
|
|
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
|
}
|
|
|
|
.card.shadow-lg:hover {
|
|
transform: translateY(-5px);
|
|
box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
|
|
}
|
|
|
|
.btn-sm,
|
|
.btn-lg {
|
|
transition: all 0.2s ease-in-out;
|
|
}
|
|
|
|
.btn-primary:hover,
|
|
.btn-info:hover {
|
|
transform: translateY(-1px);
|
|
box-shadow: 0 4px 10px rgba(0, 123, 255, 0.4);
|
|
}
|
|
|
|
.header-section {
|
|
border-left: 5px solid #4c51bf;
|
|
padding-left: 1rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
|
|
.header-section .breadcrumb {
|
|
margin-bottom: 0.5rem !important;
|
|
}
|
|
|
|
.animated-card {
|
|
animation: slideInDown 0.6s ease-out;
|
|
animation-fill-mode: both;
|
|
}
|
|
|
|
.staggered-item {
|
|
opacity: 0;
|
|
animation: fadeIn 0.4s ease-out;
|
|
animation-fill-mode: forwards;
|
|
}
|
|
|
|
.staggered-item.delay-1 {
|
|
animation-delay: 0.6s;
|
|
}
|
|
|
|
.staggered-item.delay-2 {
|
|
animation-delay: 0.8s;
|
|
}
|
|
|
|
.staggered-item.delay-3 {
|
|
animation-delay: 1.0s;
|
|
}
|
|
|
|
#anggotaTable tbody tr:hover {
|
|
background-color: #f0f8ff;
|
|
transition: background-color 0.3s ease;
|
|
}
|
|
|
|
@keyframes slideInDown {
|
|
from {
|
|
transform: translateY(-50px);
|
|
opacity: 0;
|
|
}
|
|
|
|
to {
|
|
transform: translateY(0);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeIn {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<div class="container-fluid py-4">
|
|
|
|
<div class="header-section">
|
|
<nav aria-label="breadcrumb">
|
|
<ol class="breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5">
|
|
<li class="breadcrumb-item text-sm">
|
|
</li>
|
|
<li class="breadcrumb-item text-sm text-dark active" aria-current="page">Anggota</li>
|
|
</ol>
|
|
</nav>
|
|
<h3 class="font-weight-bolder mb-0 text-primary">Daftar Anggota</h3>
|
|
</div>
|
|
|
|
<div class="card shadow-lg border-0 mb-4 animated-card" style="border-radius: 1rem;">
|
|
<div class="card-header pb-0 d-flex justify-content-between align-items-center bg-white staggered-item delay-1"
|
|
style="border-top-left-radius: 1rem; border-top-right-radius: 1rem;">
|
|
<h5 class="font-weight-bolder text-primary mb-0">
|
|
<i class="fas fa-users me-2"></i>Anggota Terdaftar
|
|
</h5>
|
|
</div>
|
|
|
|
<div class="card-body p-4">
|
|
|
|
<div class="mb-4 staggered-item delay-2">
|
|
<form action="{{ route('admin.anggota.index') }}" method="GET"
|
|
class="d-flex gap-2 flex-wrap align-items-center">
|
|
<input type="text" name="search" class="form-control form-control-sm"
|
|
placeholder="Cari nama atau email..." value="{{ request('search') }}">
|
|
|
|
<select name="status" class="form-select form-select-sm" style="width:auto;">
|
|
<option value="">Semua Status</option>
|
|
<option value="menunggu" {{ request('status') == 'menunggu' ? 'selected' : '' }}>Menunggu</option>
|
|
<option value="disetujui" {{ request('status') == 'disetujui' ? 'selected' : '' }}>Disetujui
|
|
</option>
|
|
<option value="ditolak" {{ request('status') == 'ditolak' ? 'selected' : '' }}>Ditolak</option>
|
|
</select>
|
|
|
|
<button class="btn btn-outline-primary btn-sm" type="submit">
|
|
<i class="fas fa-search"></i> Cari
|
|
</button>
|
|
@if(request('search') || request('status'))
|
|
<a href="{{ route('admin.anggota.index') }}" class="btn btn-outline-secondary btn-sm">
|
|
<i class="fas fa-times"></i> Reset
|
|
</a>
|
|
@endif
|
|
</form>
|
|
</div>
|
|
|
|
<div class="table-responsive staggered-item delay-3">
|
|
<table id="anggotaTable" class="table table-striped align-items-center mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
|
|
No</th>
|
|
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">Nama
|
|
</th>
|
|
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">Email
|
|
</th>
|
|
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">No.
|
|
Telepon</th>
|
|
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">Alamat
|
|
</th>
|
|
<th
|
|
class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2 text-center">
|
|
Status</th>
|
|
<th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
|
|
Aksi</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@forelse($members as $member)
|
|
<tr>
|
|
<td class="align-middle text-center text-sm">{{ $loop->iteration }}</td>
|
|
<td class="align-middle text-sm">{{ $member->nama }}</td>
|
|
<td class="align-middle text-sm">{{ $member->email }}</td>
|
|
<td class="align-middle text-sm">{{ $member->no_hp ?? '-' }}</td>
|
|
<td class="align-middle text-sm">{{ $member->alamat }}</td>
|
|
|
|
<td class="align-middle text-center">
|
|
@if($member->status == 'menunggu')
|
|
<span class="badge bg-warning text-dark">Menunggu</span>
|
|
@elseif($member->status == 'disetujui')
|
|
<span class="badge bg-success">Disetujui</span>
|
|
@else
|
|
<span class="badge bg-danger">Ditolak</span>
|
|
@endif
|
|
</td>
|
|
|
|
<td class="align-middle text-center">
|
|
<div class="d-flex justify-content-center gap-2 flex-wrap">
|
|
@if($member->status === 'menunggu')
|
|
<form action="{{ route('admin.anggota.approve', $member->id) }}" method="POST"
|
|
class="d-inline">
|
|
@csrf
|
|
<button type="submit" class="btn btn-success btn-sm"
|
|
onclick="return confirm('Setujui anggota ini?')">
|
|
<i class="fas fa-check"></i> Setujui
|
|
</button>
|
|
</form>
|
|
<form action="{{ route('admin.anggota.reject', $member->id) }}" method="POST"
|
|
class="d-inline">
|
|
@csrf
|
|
<button type="submit" class="btn btn-danger btn-sm"
|
|
onclick="return confirm('Tolak anggota ini?')">
|
|
<i class="fas fa-times"></i> Tolak
|
|
</button>
|
|
</form>
|
|
@endif
|
|
|
|
<a href="{{ route('admin.anggota.edit', $member->id) }}"
|
|
class="btn btn-primary btn-sm">
|
|
<i class="fas fa-edit"></i> Edit
|
|
</a>
|
|
<a href="{{ route('admin.anggota.cetak', $member->id) }}" target="_blank"
|
|
class="btn btn-info btn-sm">
|
|
<i class="fas fa-id-card"></i> Cetak
|
|
</a>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
@empty
|
|
<tr>
|
|
<td colspan="7" class="text-center text-muted py-4">
|
|
<i class="fas fa-inbox fa-2x mb-2 d-block"></i>
|
|
Tidak ada data anggota ditemukan.
|
|
</td>
|
|
</tr>
|
|
@endforelse
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-center mt-4">
|
|
{{ $members->links('pagination::bootstrap-4') }}
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection |