kolat, dan anggota

This commit is contained in:
SitiAfiah 2026-04-10 21:49:19 +07:00
parent 75cfd09205
commit a53eefa96e
20 changed files with 1895 additions and 40 deletions

View File

@ -0,0 +1,92 @@
<?php
namespace App\Http\Controllers;
use App\Models\Anggota;
use App\Models\Kolat; // Import model Kolat
use App\Models\Role;
use Illuminate\Http\Request;
class AnggotaController extends Controller
{
// 1. Menampilkan Daftar Anggota
public function anggota()
{
// Menggunakan with('kolat') agar data relasi langsung terbawa (Eager Loading)
$data_anggota = Anggota::with(['kolat', 'role'])->get();
return view('anggota.anggota', compact('data_anggota'));
}
// 2. Menampilkan Form Tambah
public function create()
{
// Ambil semua daftar kolat untuk ditampilkan di dropdown form
$data_kolat = Kolat::all();
return view('anggota.anggotacreate', compact('data_kolat'));
}
// 3. Menyimpan Anggota Baru
public function store(Request $request)
{
// Validasi data
$request->validate([
'nama_lengkap' => 'required',
'jabatan' => 'required|in:pengurus,pelatih,anggota',
'no_hp' => 'required',
'role_id' => 'required',
'kolat_id' => 'required|exists:kolat,id', // Validasi ID kolat harus ada di tabel kolat
]);
// Logika Membuat No Induk Otomatis (JB-001)
$terakhir = Anggota::orderBy('id', 'desc')->first();
if (!$terakhir) {
$nomor_urut = "001";
} else {
// Ambil angka setelah "JB-" (JB-001 -> 001)
$nomor_terakhir = substr($terakhir->no_induk, 3);
$nomor_urut = sprintf("%03d", intval($nomor_terakhir) + 1);
}
$no_induk_baru = "JB-" . $nomor_urut;
// Gabungkan data input dengan No Induk otomatis
$data = $request->all();
$data['no_induk'] = $no_induk_baru;
// Simpan ke database
Anggota::create($data);
return redirect()->route('anggota.anggota')
->with('success', 'Anggota ' . $request->nama_lengkap . ' berhasil terdaftar dengan ID: ' . $no_induk_baru);
}
// 4. Menampilkan Form Edit
public function edit($id)
{
$anggota = Anggota::findOrFail($id);
$data_kolat = Kolat::all(); // Ambil daftar kolat lagi untuk pilihan saat edit
return view('anggota.editanggota', compact('anggota', 'data_kolat'));
}
// 5. Update Data Anggota
public function update(Request $request, $id)
{
$anggota = Anggota::findOrFail($id);
$request->validate([
'no_induk' => 'required|unique:anggotas,no_induk,' . $id,
'nama_lengkap' => 'required',
'no_hp' => 'required',
'jabatan' => 'required|in:pengurus,pelatih,anggota',
'kolat_id' => 'required|exists:kolat,id',
]);
// Update data menggunakan data yang sudah divalidasi
$anggota->update($request->all());
return redirect()->route('anggota.anggota')
->with('success', 'Data ' . $anggota->nama_lengkap . ' Berhasil Diperbarui!');
}
}

View File

@ -0,0 +1,64 @@
<?php
namespace App\Http\Controllers;
use App\Models\Kolat;
use Illuminate\Http\Request;
class KolatController extends Controller
{
// 1. Tampilkan Halaman Utama Kolat
public function kolat()
{
$data_kolat = Kolat::all();
return view('kolat.kolat', compact('data_kolat'));
}
// membuat data dan Simpan Data Kolat Baru
public function create()
{
return view('kolat.kolatcreate');
}
public function store(Request $request)
{
$request->validate([
'nama_kolat' => 'required|unique:kolat,nama_kolat',
'alamat_kolat' => 'nullable'
]);
Kolat::create($request->all());
return redirect()->route('kolat.index')->with('success', 'Kolat baru berhasil ditambahkan!');
}
public function edit($id)
{
$kolat = Kolat::findOrFail($id);
return view('kolat.editkolat', compact('kolat'));
}
public function update(Request $request, $id)
{
$request->validate([
'nama_kolat' => 'required|unique:kolat,nama_kolat,'.$id,
'alamat_kolat' => 'nullable'
]);
$kolat = Kolat::findOrFail($id);
$kolat->update($request->all());
return redirect()->route('kolat.index')->with('success', 'Data Kolat berhasil diperbarui!');
}
// 4. Hapus Data Kolat
public function destroy($id)
{
$kolat = Kolat::findOrFail($id);
$kolat->delete();
return redirect()->back()->with('success', 'Kolat telah dihapus!');
}
}

View File

@ -0,0 +1,12 @@
<?php
namespace App\Http\Controllers;
//use Illuminate\Http\Request;
class PelatihController extends Controller
{
public function pelatih()
{
return view('pelatih.pelatih');
}
}

View File

@ -0,0 +1,41 @@
<?php
namespace App\Models;
use App\Models\Role;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Anggota extends Model
{
use HasFactory;
protected $table = 'anggotas';
protected $fillable = [
'no_induk',
'nama_lengkap',
'role_id',
'jenis_kelamin',
'tempat_lahir',
'tgl_lahir',
'no_hp',
'kolat_id',
'tingkatan',
'tgl_gabung',
'status',
'alamat',
'catatan_medis'
];
public function kolat()
{
// Pastikan file Kolat.php juga ada di folder Models
return $this->belongsTo(Kolat::class, 'kolat_id');
}
public function role()
{
return $this->belongsTo(Role::class, 'role_id');
}
}

View File

@ -0,0 +1,26 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Kolat extends Model
{
use HasFactory;
// Tentukan nama tabel jika tidak otomatis jamak
protected $table = 'kolat';
// Daftarkan kolom yang boleh diisi (Mass Assignment)
protected $fillable = [
'nama_kolat',
'alamat_kolat',
];
// Relasi: Satu Kolat memiliki banyak Anggota
public function anggota()
{
return $this->hasMany(Anggota::class, 'kolat_id');
}
}

View File

@ -0,0 +1,26 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\Relations\BelongsTo;
class Pelatih extends Model
{
// Kolom yang boleh diisi massal
protected $fillable = [
'anggota_id',
'no_sk',
'tgl_sk',
'masa_berlaku',
'foto_sk',
'status_pelatih',
'catatan'
];
public function anggota(): BelongsTo
{
return $this->belongsTo(Anggota::class, 'anggota_id');
}
}

View File

@ -0,0 +1,14 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Role extends Model
{
use HasFactory;
protected $table = 'role'; // Pastikan nama tabelnya 'roles' di database
protected $fillable = ['nama_role']; // Sesuaikan kolom di tabel roles kamu
}

View File

@ -0,0 +1,29 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('role', function (Blueprint $table) {
$table->id();
$table->string('nama_role');
$table->string('slug')->unique();
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('role');
}
};

View File

@ -0,0 +1,29 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('kolat', function (Blueprint $table) {
$table->id();
$table->string('nama_kolat');
$table->text('alamat_kolat')->nullable();
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('kolat');
}
};

View File

@ -0,0 +1,59 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('anggotas', function (Blueprint $table) {
$table->id();
// --- RELASI (Penghubung ke Dropdown) ---
$table->foreignId('role_id')->constrained('role')->onDelete('cascade');
$table->foreignId('kolat_id')->constrained('kolat')->onDelete('cascade');
// --- DATA IDENTITAS ---
$table->string('no_induk')->unique();
$table->string('nama_lengkap');
$table->enum('jenis_kelamin', ['L', 'P']);
$table->string('tempat_lahir');
$table->date('tgl_lahir');
// --- DATA KONTAK & ALAMAT ---
$table->string('no_hp', 15)->nullable();
$table->text('alamat');
// --- DATA ORGANISASI ---
$table->string('tingkatan'); // Dasar I, Balik II, dll
$table->date('tgl_gabung');
$table->date('tgl_keluar')->nullable(); // Diisi jika sudah tidak aktif
$table->enum('status', ['Aktif', 'Non-Aktif', 'Alumni'])->default('Aktif');
$table->string('jabatan')->default('Anggota'); // Jabatan struktural di kolat/cabang
// --- DATA KHUSUS KEPELATIHAN (Nullable) ---
// Kolom ini hanya diisi jika role_id merujuk ke 'Pelatih'
$table->string('no_sk')->nullable();
$table->date('tgl_sk')->nullable();
$table->date('masa_berlaku')->nullable();
$table->string('foto_sk')->nullable();
// --- LAINNYA ---
$table->text('catatan_medis')->nullable();
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('anggota');
}
};

View File

@ -1,49 +1,339 @@
@extends('layout.app') @extends('layout.app')
@section('content') @section('content')
<div class="page-header"> <div class="container-fluid py-4">
<ol class="breadcrumb"> <div class="page-header mb-4 text-start">
<li class="breadcrumb-item">Home</li> <nav aria-label="breadcrumb">
<li class="breadcrumb-item active">Data Kriteria</li> <ol class="breadcrumb bg-transparent p-0 mb-2">
<li class="breadcrumb-item"><a href="#" class="text-muted text-decoration-none small">Home</a></li>
<li class="breadcrumb-item active text-primary fw-bold small" aria-current="page">Data Anggota</li>
</ol> </ol>
</div> </nav>
<h3 class="fw-bold text-dark">Manajemen Keanggotaan TapakMP</h3>
</div>
<div class="row gutters"> <div class="row">
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12"> <div class="col-12">
<div class="card"> <div class="card border-0 shadow-sm" style="border-radius: 20px;">
<div class="card-body"> <div class="card-body p-4">
<div class="mb-3 d-flex justify-content-between align-items-center"> <div class="d-flex justify-content-between align-items-center mb-4">
<h5 class="mb-0">Data Kriteria</h5> <div class="text-start">
<a href="#" class="btn btn-success"> <h5 class="card-title mb-0 fw-bold text-dark">Daftar Anggota PPS Merpati Putih</h5>
<i class="icon-plus"></i> Tambah Data <p class="text-muted small mb-0">Cabang Jember - Kelola informasi induk anggota.</p>
</div>
<a href="{{ route('anggota.create') }}" class="btn btn-primary px-4 py-2 shadow-sm"
style="border-radius: 12px;">
<i class="icon-plus me-1"></i> Tambah Anggota
</a> </a>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-bordered table-hover"> <table class="table table-hover align-middle main-table">
<thead class="thead-light"> <thead>
<tr> <tr>
<th width="50">No</th> <th width="60">No</th>
<th width="100">No Induk</th> <th>Identitas Anggota</th>
<th>Nama lengkap</th> <th>JK</th>
<th>Tempat & Tanggal Lahir</th> <th>Tingkatan & Kolat</th>
<th>Jenis Kelamin</th> <th>Jabatan</th>
<th>Alamat</th> <th>Status</th>
<th>Asal Kolat</th> <th>Aksi</th>
<th>Tingkatan</th>
<th>Tanggal Gabung</th>
<th>Status Anggota</th>
</tr> </tr>
</thead> </thead>
<tbody>
@foreach ($data_anggota as $no => $item)
<tr>
<td class="text-muted small text-center">{{ $no + 1 }}</td>
<td>
<div class="fw-bold text-dark text-center">{{ $item->nama_lengkap }}</div>
<small class="text-muted text-center d-block">ID:
{{ $item->no_induk }}</small>
</td>
<td class="text-center">
<span
class="badge-jk {{ $item->jenis_kelamin == 'P' ? 'bg-danger' : 'bg-primary' }} shadow-xs">
{{ $item->jenis_kelamin }}
</span>
</td>
<td class="text-center">
<span
class="badge bg-info-soft text-info px-3">{{ $item->tingkatan }}</span>
<div class="small text-muted mt-1" style="font-size: 10px;">Kolat
{{ $item->asal_kolat }}</div>
</td>
<td class="text-center">
@if ($item->jabatan == 'pelatih')
<span class="badge bg-primary text-white px-3"
style="border-radius: 8px;">Pelatih</span>
@elseif($item->jabatan == 'pengurus')
<span class="badge bg-warning text-dark px-3"
style="border-radius: 8px;">Pengurus</span>
@else
<span class="badge bg-light text-dark border px-3"
style="border-radius: 8px;">Anggota</span>
@endif
</td>
<td class="text-center">
<span
class="badge rounded-pill {{ $item->status == 'Aktif' ? 'bg-success-soft text-success border-success' : 'bg-secondary-soft text-secondary border-secondary' }} px-3 border">
{{ $item->status }}
</span>
</td>
<td class="text-center">
<div class="d-flex justify-content-center gap-2">
<button class="btn btn-sm btn-action-detail fw-bold px-3 shadow-xs"
data-bs-toggle="modal"
data-bs-target="#modalDetail{{ $item->id }}">
<i class="icon-eye"></i> Detail
</button>
<a href="{{ route('anggota.edit', $item->id) }}"
class="btn btn-sm btn-action-edit fw-bold px-3 shadow-xs">
<i class="icon-pencil"></i> Edit
</a>
</div>
</td>
</tr>
<div class="modal fade" id="modalDetail{{ $item->id }}" tabindex="-1"
aria-labelledby="modalDetailLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content"
style="border-radius: 20px; border: none; overflow: hidden;">
<div class="modal-header bg-primary text-white border-0 py-3 px-4">
<h5 class="modal-title fw-bold" id="modalDetailLabel">
<i class="icon-user-check me-2"></i>Profil Lengkap Anggota
</h5>
<button type="button" class="btn-close btn-close-white"
data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body p-4">
<div class="row">
<div class="col-md-4 text-center border-end">
<div class="mb-3">
<div class="bg-light rounded-circle d-inline-flex align-items-center justify-content-center shadow-sm"
style="width: 120px; height: 120px; border: 4px solid #f8f9fa;">
<i class="icon-user text-primary"
style="font-size: 60px;"></i>
</div>
</div>
<h5 class="fw-bold mb-1">{{ $item->nama_lengkap }}</h5>
<p class="text-muted small mb-3">ID: {{ $item->no_induk }}
</p>
<span
class="badge rounded-pill {{ $item->status == 'Aktif' ? 'bg-success' : 'bg-secondary' }} px-4 py-2">
{{ $item->status }}
</span>
<hr class="d-md-none">
</div>
<div class="col-md-8 ps-md-4">
<div class="row g-3">
<div class="col-12">
<h6
class="fw-bold text-primary mb-3 border-bottom pb-2">
Informasi Organisasi</h6>
</div>
<div class="col-6">
<small class="text-muted d-block">Asal Kolat</small>
<span
class="fw-bold text-dark">{{ $item->asal_kolat }}</span>
</div>
<div class="col-6">
<small class="text-muted d-block">Jabatan
Organisasi</small>
<span
class="fw-bold text-primary text-uppercase">{{ $item->jabatan ?? 'Anggota' }}</span>
</div>
<div class="col-6">
<small class="text-muted d-block">Tingkatan</small>
<span
class="fw-bold text-dark">{{ $item->tingkatan }}</span>
</div>
<div class="col-6">
<small class="text-muted d-block">Tanggal
Gabung</small>
<span
class="fw-bold text-dark">{{ \Carbon\Carbon::parse($item->tgl_gabung)->format('d M Y') }}</span>
</div>
<div class="col-6">
<small class="text-muted d-block">Jenis
Kelamin</small>
<span
class="fw-bold text-dark">{{ $item->jenis_kelamin == 'L' ? 'Laki-laki' : 'Perempuan' }}</span>
</div>
<div class="col-12 mt-4">
<h6
class="fw-bold text-primary mb-3 border-bottom pb-2">
Kontak & Pribadi</h6>
</div>
<div class="col-6">
<small class="text-muted d-block">Tempat, Tgl
Lahir</small>
<span
class="fw-bold text-dark">{{ $item->tempat_lahir }},
{{ \Carbon\Carbon::parse($item->tgl_lahir)->format('d M Y') }}</span>
</div>
<div class="col-6">
<small class="text-muted d-block">No.
WhatsApp</small>
<a href="https://wa.me/{{ $item->no_hp }}"
target="_blank"
class="text-decoration-none fw-bold text-success">
<i
class="icon-phone me-1"></i>{{ $item->no_hp }}
</a>
</div>
<div class="col-12">
<small class="text-muted d-block">Alamat
Lengkap</small>
<span
class="fw-bold text-dark">{{ $item->alamat }}</span>
</div>
<div class="col-12 mt-4">
<div class="p-3 bg-danger-soft border border-danger rounded-3"
style="background-color: #fff5f5;">
<h6 class="fw-bold text-danger mb-2"><i
class="icon-heart me-2"></i>Catatan
Medis</h6>
<p class="mb-0 text-dark small"
style="line-height: 1.6;">
{{ $item->catatan_medis ?? 'Anggota tidak memiliki riwayat medis khusus.' }}
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer border-0 px-4 pb-4">
<button type="button" class="btn btn-light px-4"
data-bs-dismiss="modal"
style="border-radius: 10px;">Tutup</button>
</div>
</div>
</div>
</div>
@endforeach
</tbody>
</table> </table>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
<style>
/* Global Centering */
.main-table {
text-align: center;
vertical-align: middle;
}
/* Header Styling */
.main-table thead th {
background-color: #f8faff;
padding: 18px 10px;
font-size: 0.75rem;
color: #8c98a5;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 2px solid #edf2f9;
}
/* Body Cell Styling */
.main-table tbody td {
padding: 20px 10px;
border-bottom: 1px solid #f1f4f8;
color: #495057;
font-size: 0.9rem;
}
/* Soft UI Badges */
.bg-success-soft {
background-color: #e6fffa;
color: #38b2ac;
}
.bg-info-soft {
background-color: #e0f2fe;
color: #0ea5e9;
}
.bg-secondary-soft {
background-color: #f3f4f6;
color: #6b7280;
}
/* Badge JK Circle */
.badge-jk {
width: 32px;
height: 32px;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 11px;
font-weight: bold;
color: white;
border-radius: 50% !important;
}
/* Action Button */
.btn-action-detail {
background-color: #f0f7ff;
color: #0d6efd;
border: 1px solid #d0e4ff;
border-radius: 10px;
transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
/* Tombol Edit */
.btn-action-edit {
background-color: #fff8e6;
color: #f59e0b;
border: 1px solid #ffecb3;
border-radius: 10px;
transition: 0.3s;
}
.btn-action-edit:hover {
background-color: #f59e0b !important;
color: white !important;
transform: translateY(-2px);
}
.btn-action-detail:hover {
background-color: #0d6efd !important;
color: white !important;
transform: translateY(-2px);
}
/* Modal Profile Styling */
.profile-circle {
width: 85px;
height: 85px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 36px;
font-weight: bold;
}
/* Table Hover Effect */
.table-hover tbody tr:hover {
background-color: #f8faff;
transition: 0.2s;
}
.shadow-xs {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
</style>
@endsection @endsection

View File

@ -0,0 +1,217 @@
@extends('layout.app')
@section('content')
<div class="container-fluid py-4">
<!-- Header & Breadcrumb -->
<div class="page-header mb-4 text-start">
<nav aria-label="breadcrumb">
<ol class="breadcrumb bg-transparent p-0 mb-2">
<li class="breadcrumb-item"><a href="{{ route('anggota.anggota') }}" class="text-muted text-decoration-none small">Daftar Anggota</a></li>
<li class="breadcrumb-item active text-primary fw-bold small" aria-current="page">
{{ isset($anggota) ? 'Edit Anggota' : 'Tambah Anggota' }}
</li>
</ol>
</nav>
<h3 class="fw-bold text-dark">{{ isset($anggota) ? 'Update Data Anggota' : 'Pendaftaran Anggota Baru' }}</h3>
<p class="text-muted small">Lengkapi data identitas dan legalitas SK untuk Pelatih atau Pengurus.</p>
</div>
<div class="row">
<div class="col-md-12">
<form action="{{ isset($anggota) ? route('anggota.update', $anggota->id) : route('anggota.store') }}"
method="POST"
enctype="multipart/form-data">
@csrf
@if(isset($anggota)) @method('PUT') @endif
<!-- CARD 1: INFORMASI PRIBADI -->
<div class="card border-0 shadow-sm mb-4" style="border-radius: 20px;">
<div class="card-header bg-white border-0 pt-4 px-4">
<h5 class="fw-bold text-primary mb-0"><i class="icon-user me-2"></i>Informasi Pribadi</h5>
</div>
<div class="card-body p-4">
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-bold">Nama Lengkap</label>
<input type="text" name="nama_lengkap" class="form-control {{ isset($anggota) ? 'bg-light' : '' }}"
value="{{ $anggota->nama_lengkap ?? '' }}"
{{ isset($anggota) ? 'readonly' : '' }} required placeholder="Nama lengkap sesuai identitas">
</div>
<div class="col-md-6">
<label class="form-label fw-bold">No. WhatsApp</label>
<div class="input-group">
<span class="input-group-text bg-light border-end-0">+62</span>
<input type="number" name="no_hp" class="form-control" value="{{ $anggota->no_hp ?? '' }}" placeholder="81234567xxx" required>
</div>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Tempat & Tanggal Lahir</label>
<div class="row g-2">
<div class="col-7">
<input type="text" name="tempat_lahir" class="form-control" value="{{ $anggota->tempat_lahir ?? '' }}" placeholder="Kota" required>
</div>
<div class="col-5">
<input type="date" name="tgl_lahir" class="form-control" value="{{ $anggota->tgl_lahir ?? '' }}" required>
</div>
</div>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Jenis Kelamin</label>
<select name="jenis_kelamin" class="form-select" required>
<option value="" disabled selected>-- Pilih --</option>
<option value="L" {{ (isset($anggota) && $anggota->jenis_kelamin == 'L') ? 'selected' : '' }}>Laki-laki</option>
<option value="P" {{ (isset($anggota) && $anggota->jenis_kelamin == 'P') ? 'selected' : '' }}>Perempuan</option>
</select>
</div>
<div class="col-12">
<label class="form-label fw-bold">Alamat Lengkap</label>
<textarea name="alamat" class="form-control" rows="2" placeholder="Alamat lengkap domisili..." required>{{ $anggota->alamat ?? '' }}</textarea>
</div>
</div>
</div>
</div>
<!-- CARD 2: INFORMASI ORGANISASI -->
<div class="card border-0 shadow-sm mb-4" style="border-radius: 20px;">
<div class="card-header bg-white border-0 pt-4 px-4">
<h5 class="fw-bold text-success mb-0"><i class="icon-badge me-2"></i>Informasi Organisasi</h5>
</div>
<div class="card-body p-4">
<div class="row g-3">
<div class="col-md-4">
<label class="form-label fw-bold text-muted small">No Induk</label>
<input type="text" class="form-control bg-light fw-bold text-primary" value="{{ $anggota->no_induk ?? 'JB-XXX (Otomatis)' }}" readonly>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Jabatan</label>
<select name="role_id" id="roleSelect" class="form-select border-primary" onchange="toggleSKFields()" required>
<option value="" disabled selected>-- Pilih Jabatan --</option>
@foreach($data_role as $role)
<option value="{{ $role->id }}"
{{ (isset($anggota) && $anggota->role_id == $role->id) ? 'selected' : '' }}>
{{ $role->nama_role }}
</option>
@endforeach
</select>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Status</label>
<select name="status" class="form-select" required>
<option value="Aktif" {{ (isset($anggota) && $anggota->status == 'Aktif') ? 'selected' : '' }}>Aktif</option>
<option value="Non-Aktif" {{ (isset($anggota) && $anggota->status == 'Non-Aktif') ? 'selected' : '' }}>Non-Aktif</option>
</select>
</div>
<!-- BOX SK (Legalitas) -->
<div id="boxSK" class="col-12 mt-3 p-4 bg-light rounded-4 border border-dashed border-danger" style="display: none;">
<h6 class="text-danger fw-bold mb-3"><i class="bi bi-file-earmark-check me-2"></i>Data Legalitas (SK/Lisensi)</h6>
<div class="row g-3">
<div class="col-md-4">
<label class="form-label small fw-bold">Nomor SK</label>
<input type="text" name="no_sk" class="form-control" value="{{ $anggota->no_sk ?? '' }}">
</div>
<div class="col-md-4">
<label class="form-label small fw-bold">Masa Berlaku</label>
<input type="date" name="masa_berlaku" class="form-control" value="{{ $anggota->masa_berlaku ?? '' }}">
</div>
<div class="col-md-4">
<label class="form-label small fw-bold">Upload SK (Gambar)</label>
<input type="file" name="foto_sk" class="form-control">
</div>
</div>
</div>
<div class="col-md-6 mt-4">
<label class="form-label fw-bold">Asal Kolat</label>
<select name="kolat_id" class="form-select" required>
<option value="" disabled selected>-- Pilih Kolat --</option>
@foreach($data_kolat as $k)
<option value="{{ $k->id }}" {{ (isset($anggota) && $anggota->kolat_id == $k->id) ? 'selected' : '' }}>
Kolat {{ $k->nama_kolat }}
</option>
@endforeach
</select>
</div>
<div class="col-md-3 mt-4">
<label class="form-label fw-bold">Tingkatan</label>
<input type="text" name="tingkatan" class="form-control" value="{{ $anggota->tingkatan ?? '' }}" placeholder="Contoh: Balik I" required>
</div>
<div class="col-md-3 mt-4">
<label class="form-label fw-bold">Tanggal Gabung</label>
<input type="date" name="tgl_gabung" class="form-control" value="{{ $anggota->tgl_gabung ?? '' }}" required>
</div>
<div class="col-12 mt-4">
<label class="form-label fw-bold text-danger"><i class="icon-heart me-2"></i>Catatan Medis</label>
<textarea name="catatan_medis" class="form-control" rows="3" placeholder="Contoh: Riwayat asma atau cedera fisik.">{{ $anggota->catatan_medis ?? '' }}</textarea>
</div>
</div>
</div>
<!-- FOOTER CARD UNTUK BUTTON -->
<div class="card-footer bg-light border-0 p-4" style="border-radius: 0 0 20px 20px;">
<div class="d-flex justify-content-end align-items-center gap-3">
<a href="{{ route('anggota.anggota') }}" class="btn btn-outline-secondary px-4 fw-bold btn-cancel">
<i class="icon-x me-1"></i> Batal
</a>
<button type="submit" class="btn btn-primary px-5 fw-bold btn-save shadow">
<i class="icon-check me-1"></i> {{ isset($anggota) ? 'Update Data' : 'Simpan Data' }}
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<script>
function toggleSKFields() {
const jabatan = document.getElementById('jabatanSelect').value;
const boxSK = document.getElementById('boxSK');
if (jabatan === 'pelatih' || jabatan === 'pengurus') {
boxSK.style.display = 'block';
} else {
boxSK.style.display = 'none';
}
}
document.addEventListener("DOMContentLoaded", function() {
toggleSKFields();
});
</script>
<style>
.form-control, .form-select {
border-radius: 10px;
padding: 10px 15px;
}
.form-control:focus, .form-select:focus {
border-color: #0d6efd;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.1);
}
/* Perbaikan Button Styling */
.btn-cancel {
border-radius: 12px;
transition: all 0.3s ease;
border: 2px solid #6c757d;
}
.btn-cancel:hover {
background-color: #6c757d;
color: white;
transform: translateY(-2px);
}
.btn-save {
border-radius: 12px;
background: (45deg, #0d6efd, #004dc0);
border: none;
transition: all 0.3s ease;
}
.btn-save:hover {
transform: translateY(-2px);
/* box-shadow: 0 5px 15px rgba(13, 110, 253, 0.4) !important; */
background:(45deg, #004dc0, #0d6efd);
}
</style>
@endsection

View File

@ -0,0 +1,181 @@
@extends('layout.app')
@section('content')
<div class="container-fluid py-4">
<!-- Header & Breadcrumb -->
<div class="page-header mb-4 text-start">
<nav aria-label="breadcrumb">
<ol class="breadcrumb bg-transparent p-0 mb-2">
<li class="breadcrumb-item"><a href="{{ route('anggota.anggota') }}" class="text-muted text-decoration-none small">Daftar Anggota</a></li>
<li class="breadcrumb-item active text-primary fw-bold small" aria-current="page">Edit Anggota</li>
</ol>
</nav>
<h3 class="fw-bold text-dark">Form Edit Anggota Merpati Putih</h3>
<p class="text-muted small">Perbarui informasi identitas atau legalitas SK anggota di bawah ini.</p>
</div>
<div class="row">
<div class="col-md-12">
<!-- Form Start - Pastikan enctype ada untuk upload foto SK -->
<form action="{{ route('anggota.update', $anggota->id) }}" method="POST" enctype="multipart/form-data">
@csrf
@method('PUT')
<!-- CARD 1: INFORMASI PRIBADI -->
<div class="card border-0 shadow-sm mb-4" style="border-radius: 20px;">
<div class="card-header bg-white border-0 pt-4 px-4">
<h5 class="fw-bold text-primary mb-0"><i class="icon-user me-2"></i>Informasi Pribadi</h5>
</div>
<div class="card-body p-4">
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-bold">No Induk</label>
<input type="text" name="no_induk" class="form-control bg-light fw-bold text-primary" value="{{ $anggota->no_induk }}" readonly>
<small class="text-muted" style="font-size: 11px;">* No. induk permanen dan tidak dapat diubah</small>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Nama Lengkap</label>
<input type="text" name="nama_lengkap" class="form-control bg-light" value="{{ $anggota->nama_lengkap }}" required>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">No. WhatsApp (HP)</label>
<div class="input-group">
<span class="input-group-text bg-light border-end-0">+62</span>
<input type="number" name="no_hp" class="form-control" value="{{ $anggota->no_hp }}" placeholder="81234567xxx" required>
</div>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Alamat Lengkap</label>
<input type="text" name="alamat" class="form-control" value="{{ $anggota->alamat }}" required>
</div>
</div>
</div>
</div>
<!-- CARD 2: INFORMASI ORGANISASI -->
<div class="card border-0 shadow-sm mb-4" style="border-radius: 20px;">
<div class="card-header bg-white border-0 pt-4 px-4">
<h5 class="fw-bold text-success mb-0"><i class="icon-badge me-2"></i>Informasi Organisasi</h5>
</div>
<div class="card-body p-4">
<div class="row g-3">
<div class="col-md-4">
<label class="form-label fw-bold">Jabatan Organisasi</label>
<select name="jabatan" id="jabatanSelect" class="form-select border-primary" onchange="toggleSKFields()" required>
<option value="anggota" {{ $anggota->jabatan == 'anggota' ? 'selected' : '' }}>Anggota</option>
<option value="pelatih" {{ $anggota->jabatan == 'pelatih' ? 'selected' : '' }}>Pelatih</option>
<option value="pengurus" {{ $anggota->jabatan == 'pengurus' ? 'selected' : '' }}>Pengurus</option>
</select>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Tingkatan</label>
<input type="text" name="tingkatan" class="form-control" value="{{ $anggota->tingkatan }}" required>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Status Anggota</label>
<select name="status" class="form-select" required>
<option value="Aktif" {{ $anggota->status == 'Aktif' ? 'selected' : '' }}>Aktif</option>
<option value="Non-Aktif" {{ $anggota->status == 'Non-Aktif' ? 'selected' : '' }}>Non-Aktif</option>
</select>
</div>
<!-- BOX DATA SK (Otomatis muncul jika pilih Pelatih/Pengurus) -->
<div id="boxSK" class="col-12 mt-3 p-4 bg-light rounded-4 border border-dashed border-danger" style="display: none;">
<h6 class="text-danger fw-bold mb-3"><i class="icon-certificate me-2"></i>Data Legalitas SK (Wajib diisi untuk Pelatih/Pengurus)</h6>
<div class="row g-3">
<div class="col-md-3">
<label class="form-label small fw-bold">Nomor SK</label>
<input type="text" name="no_sk" class="form-control" value="{{ $anggota->no_sk ?? '' }}" placeholder="Contoh: SK/001/2026">
</div>
<div class="col-md-3">
<label class="form-label small fw-bold">Tanggal SK</label>
<input type="date" name="tgl_sk" class="form-control" value="{{ $anggota->tgl_sk ?? '' }}">
</div>
<div class="col-md-3">
<label class="form-label small fw-bold">Masa Berlaku</label>
<input type="date" name="masa_berlaku" class="form-control" value="{{ $anggota->masa_berlaku ?? '' }}">
</div>
<div class="col-md-3">
<label class="form-label small fw-bold">Upload Scan SK</label>
<input type="file" name="foto_sk" class="form-control">
@if($anggota->foto_sk)
<small class="text-muted mt-1 d-block">File: {{ $anggota->foto_sk }}</small>
@endif
</div>
</div>
</div>
<div class="col-md-12 mt-3">
<label class="form-label fw-bold">Asal Kolat</label>
<input type="text" name="asal_kolat" class="form-control" value="{{ $anggota->asal_kolat }}" required>
</div>
</div>
</div>
<!-- FOOTER CARD UNTUK BUTTON -->
<div class="card-footer bg-light border-0 p-4" style="border-radius: 0 0 20px 20px;">
<div class="d-flex justify-content-end align-items-center gap-3">
<a href="{{ route('anggota.anggota') }}" class="btn btn-outline-secondary px-4 fw-bold btn-cancel">
<i class="icon-x me-1"></i> Batal
</a>
<button type="submit" class="btn btn-primary px-5 fw-bold btn-save shadow">
<i class="icon-check me-1"></i> Simpan Perubahan
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- JAVASCRIPT TOGGLE -->
<script>
function toggleSKFields() {
const jabatan = document.getElementById('jabatanSelect').value;
const boxSK = document.getElementById('boxSK');
if (jabatan === 'pelatih' || jabatan === 'pengurus') {
boxSK.style.display = 'block';
} else {
boxSK.style.display = 'none';
}
}
// Jalankan saat pertama kali halaman dimuat
document.addEventListener("DOMContentLoaded", function() {
toggleSKFields();
});
</script>
<style>
.form-control, .form-select {
border-radius: 10px;
padding: 10px 15px;
}
.form-control:focus, .form-select:focus {
border-color: #0d6efd;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.1);
}
.btn-cancel {
border-radius: 12px;
transition: all 0.3s ease;
border: 2px solid #6c757d;
}
.btn-cancel:hover {
background-color: #6c757d;
color: white;
transform: translateY(-2px);
}
.btn-save {
border-radius: 12px;
background: (45deg, #0d6efd);
border: none;
transition: all 0.3s ease;
}
.btn-save:hover {
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(13, 110, 253, 0.4) !important;
}
</style>
@endsection

View File

@ -0,0 +1,118 @@
@extends('layout.app')
@section('content')
<div class="container-fluid py-4">
<!-- Header & Breadcrumb -->
<div class="page-header mb-4 text-start">
<nav aria-label="breadcrumb">
<ol class="breadcrumb bg-transparent p-0 mb-2">
<li class="breadcrumb-item"><a href="{{ route('kolat.index') }}" class="text-muted text-decoration-none small">Daftar Kolat</a></li>
<li class="breadcrumb-item active text-primary fw-bold small" aria-current="page">Edit Kolat</li>
</ol>
</nav>
<h3 class="fw-bold text-dark">Update Data Kolat</h3>
<p class="text-muted small">Perbarui informasi nama atau lokasi Kelompok Latihan (Kolat).</p>
</div>
<div class="row">
<div class="col-md-12">
<!-- Action mengarah ke fungsi Update dengan membawa ID -->
<form action="{{ route('kolat.update', $kolat->id) }}" method="POST">
@csrf
@method('PUT') {{-- PENTING: Untuk proses update di Laravel --}}
<div class="card border-0 shadow-sm mb-4" style="border-radius: 20px;">
<div class="card-header bg-white border-0 pt-4 px-4">
<h5 class="fw-bold text-primary mb-0"><i class="icon-pencil me-2"></i>Edit Detail Kolat</h5>
</div>
<div class="card-body p-4">
<div class="row g-4">
<!-- ID Kolat (Readonly) -->
<div class="col-md-4">
<label class="form-label fw-bold text-muted small">ID Kolat</label>
<input type="text" class="form-control bg-light fw-bold text-primary"
value="{{ $kolat->id }}" readonly>
<small class="text-muted" style="font-size: 11px;">ID tidak dapat diubah (Permanen).</small>
</div>
<!-- Nama Kolat -->
<div class="col-md-8">
<label class="form-label fw-bold text-dark">Nama Kelompok Latihan (Kolat)</label>
<input type="text" name="nama_kolat"
class="form-control @error('nama_kolat') is-invalid @enderror"
value="{{ old('nama_kolat', $kolat->nama_kolat) }}"
required placeholder="Masukkan nama kolat baru">
@error('nama_kolat')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
<!-- Alamat Kolat -->
<div class="col-12">
<label class="form-label fw-bold text-dark">Alamat Lengkap Lokasi Latihan</label>
<textarea name="alamat_kolat" class="form-control @error('alamat_kolat') is-invalid @enderror"
rows="4" required
placeholder="Masukkan alamat lengkap lokasi...">{{ old('alamat_kolat', $kolat->alamat_kolat) }}</textarea>
@error('alamat_kolat')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
</div>
</div>
<!-- Footer dengan tombol Aksi -->
<div class="card-footer bg-light border-0 p-4" style="border-radius: 0 0 20px 20px;">
<div class="d-flex justify-content-end align-items-center gap-3">
<a href="{{ route('kolat.index') }}" class="btn btn-outline-secondary px-4 fw-bold btn-cancel">
<i class="icon-x me-1"></i> Batal
</a>
<button type="submit" class="btn btn-primary px-5 fw-bold btn-save shadow">
<i class="icon-save me-1"></i> Simpan Perubahan
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<style>
/* Styling agar seragam dengan form lainnya */
.form-control {
border-radius: 10px;
padding: 12px 15px;
border: 1px solid #dce1e7;
}
.form-control:focus {
border-color: #0d6efd;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.1);
}
.btn-cancel {
border-radius: 12px;
transition: all 0.3s ease;
border: 2px solid #6c757d;
}
.btn-cancel:hover {
background-color: #6c757d;
color: white;
transform: translateY(-2px);
}
.btn-save {
border-radius: 12px;
background: linear-gradient(45deg, #0d6efd, #004dc0);
border: none;
color: white;
transition: all 0.3s ease;
}
.btn-save:hover {
transform: translateY(-2px);
background: linear-gradient(45deg, #004dc0, #0d6efd);
color: white;
}
.shadow {
box-shadow: 0 5px 15px rgba(13, 110, 253, 0.3) !important;
}
</style>
@endsection

View File

@ -0,0 +1,178 @@
@extends('layout.app')
@section('content')
<div class="container-fluid py-4">
<!-- Header & Breadcrumb -->
<div class="page-header mb-4 text-start">
<nav aria-label="breadcrumb">
<ol class="breadcrumb bg-transparent p-0 mb-2">
<li class="breadcrumb-item"><a href="#" class="text-muted text-decoration-none small">Home</a></li>
<li class="breadcrumb-item active text-primary fw-bold small" aria-current="page">Data Kolat</li>
</ol>
</nav>
<h3 class="fw-bold text-dark">Manajemen Kelompok Latihan</h3>
</div>
<div class="row">
<div class="col-12">
<div class="card border-0 shadow-sm" style="border-radius: 20px;">
<div class="card-body p-4">
<!-- Title & Action Button -->
<div class="d-flex justify-content-between align-items-center mb-4">
<div class="text-start">
<h5 class="card-title mb-0 fw-bold text-dark">Daftar Kolat Pada PPS Betako Merpati Putih</h5>
<p class="text-muted small mb-0">Cabang Jember - Kelola lokasi dan unit latihan.</p>
</div>
<a href="{{ route('kolat.create') }}" class="btn btn-primary px-4 py-2 shadow-sm"
style="border-radius: 12px;">
<i class="bi bi-plus-lg me-1"></i> Tambah Kolat
</a>
</div>
<!-- Notifikasi Alert (Opsional jika ingin pakai SweetAlert saja, ini bisa dihapus) -->
@if(session('success'))
<div class="alert alert-success border-0 shadow-sm mb-4" style="border-radius: 12px;">
<i class="bi bi-check-circle me-2"></i> {{ session('success') }}
</div>
@endif
<div class="table-responsive">
<table class="table table-hover align-middle main-table">
<thead>
<tr>
<th width="80">ID</th>
<th>Nama Kelompok Latihan</th>
<th>Alamat Lokasi</th>
<th width="200">Aksi</th>
</tr>
</thead>
<tbody>
@forelse ($data_kolat as $item)
<tr>
<td class="text-muted small text-center fw-bold">{{ $item->id }}</td>
<td>
<div class="fw-bold text-dark">Kolat {{ $item->nama_kolat }}</div>
<small class="text-muted d-block">Pusat Latihan Unit</small>
</td>
<td class="text-start">
<span class="text-muted small">
<i class="bi bi-geo-alt me-1"></i> {{ $item->alamat_kolat ?? 'Alamat belum diatur' }}
</span>
</td>
<td class="text-center">
<div class="d-flex justify-content-center gap-2">
<!-- Edit Button -->
<a href="{{ route('kolat.edit', $item->id) }}"
class="btn btn-sm btn-action-edit fw-bold px-3 shadow-xs">
<i class="bi bi-pencil-square"></i> Edit
</a>
<!-- Delete Button dengan SweetAlert -->
<form action="{{ route('kolat.destroy', $item->id) }}" method="POST" id="delete-form-{{ $item->id }}">
@csrf
@method('DELETE')
<button type="button" onclick="confirmDelete({{ $item->id }})" class="btn btn-sm btn-action-delete fw-bold px-3 shadow-xs">
<i class="bi bi-trash"></i> Hapus
</button>
</form>
</div>
</td>
</tr>
@empty
<tr>
<td colspan="4" class="text-center py-5">
<p class="text-muted">Belum ada data kolat yang tersedia.</p>
</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<style>
.main-table { text-align: center; vertical-align: middle; }
.main-table thead th {
background-color: #f8faff;
padding: 18px 10px;
font-size: 0.75rem;
color: #8c98a5;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 2px solid #edf2f9;
}
.main-table tbody td {
padding: 20px 10px;
border-bottom: 1px solid #f1f4f8;
color: #495057;
font-size: 0.9rem;
}
.btn-action-edit {
background-color: #fff8e6;
color: #f59e0b;
border: 1px solid #ffecb3;
border-radius: 10px;
transition: 0.3s;
}
.btn-action-edit:hover {
background-color: #f59e0b !important;
color: white !important;
transform: translateY(-2px);
}
.btn-action-delete {
background-color: #fff5f5;
color: #dc3545;
border: 1px solid #ffe5e5;
border-radius: 10px;
transition: 0.3s;
}
.btn-action-delete:hover {
background-color: #dc3545 !important;
color: white !important;
transform: translateY(-2px);
}
.shadow-xs { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); }
</style>
@push('scripts')
<script>
// Notifikasi Sukses Otomatis
@if(session('success'))
Swal.fire({
icon: 'success',
title: 'Berhasil!',
text: "{{ session('success') }}",
showConfirmButton: false,
timer: 2000,
borderRadius: '20px'
});
@endif
// Fungsi Konfirmasi Hapus
function confirmDelete(id) {
Swal.fire({
title: 'Apakah Anda yakin?',
text: "Data yang dihapus tidak bisa dikembalikan!",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#0d6efd',
cancelButtonColor: '#6c757d',
confirmButtonText: 'Ya, Hapus!',
cancelButtonText: 'Batal',
reverseButtons: true,
borderRadius: '20px'
}).then((result) => {
if (result.isConfirmed) {
document.getElementById('delete-form-' + id).submit();
}
})
}
</script>
@endpush
@endsection

View File

@ -0,0 +1,119 @@
@extends('layout.app')
@section('content')
<div class="container-fluid py-4">
<!-- Header & Breadcrumb -->
<div class="page-header mb-4 text-start">
<nav aria-label="breadcrumb">
<ol class="breadcrumb bg-transparent p-0 mb-2">
<li class="breadcrumb-item"><a href="{{ route('kolat.index') }}" class="text-muted text-decoration-none small">Daftar Kolat</a></li>
<li class="breadcrumb-item active text-primary fw-bold small" aria-current="page">
{{ isset($kolat) ? 'Edit Kolat' : 'Tambah Kolat' }}
</li>
</ol>
</nav>
<h3 class="fw-bold text-dark">{{ isset($kolat) ? 'Update Data Kolat' : 'Registrasi Kolat Baru' }}</h3>
<p class="text-muted small">Kelola informasi unit latihan atau Kelompok Latihan (Kolat) PPS Merpati Putih.</p>
</div>
<div class="row">
<div class="col-md-12">
<form action="{{ isset($kolat) ? route('kolat.update', $kolat->id) : route('kolat.store') }}"
method="POST">
@csrf
@if(isset($kolat)) @method('PUT') @endif
<!-- CARD UTAMA: INFORMASI KOLAT -->
<div class="card border-0 shadow-sm mb-4" style="border-radius: 20px;">
<div class="card-header bg-white border-0 pt-4 px-4">
<h5 class="fw-bold text-primary mb-0"><i class="icon-map-pin me-2"></i>Detail Kelompok Latihan</h5>
</div>
<div class="card-body p-4">
<div class="row g-4">
<!-- Kolom ID (Hanya tampil/readonly saat Edit atau sebagai placeholder saat Create) -->
<div class="col-md-4">
<label class="form-label fw-bold text-muted small">ID Kolat</label>
<input type="text" class="form-control bg-light fw-bold text-primary"
value="{{ $kolat->id ?? 'AUTO (Sistem)' }}" readonly>
<small class="text-muted" style="font-size: 11px;">Identitas unik kolat di dalam sistem.</small>
</div>
<!-- Nama Kolat -->
<div class="col-md-8">
<label class="form-label fw-bold">Nama Kelompok Latihan (Kolat)</label>
<input type="text" name="nama_kolat" class="form-control"
value="{{ $kolat->nama_kolat ?? old('nama_kolat') }}"
required placeholder="Contoh: UNMUH Jember, POLIJE, dsb.">
@error('nama_kolat')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
<!-- Alamat Kolat -->
<div class="col-12">
<label class="form-label fw-bold">Alamat Lengkap Lokasi Latihan</label>
<textarea name="alamat_kolat" class="form-control" rows="4"
placeholder="Masukkan alamat lengkap lokasi latihan"
required>{{ $kolat->alamat_kolat ?? old('alamat_kolat') }}</textarea>
@error('alamat_kolat')
<small class="text-danger">{{ $message }}</small>
@enderror
</div>
</div>
</div>
<!-- FOOTER CARD UNTUK BUTTON -->
<div class="card-footer bg-light border-0 p-4" style="border-radius: 0 0 20px 20px;">
<div class="d-flex justify-content-end align-items-center gap-3">
<a href="{{ route('kolat.index') }}" class="btn btn-outline-secondary px-4 fw-bold btn-cancel">
<i class="icon-x me-1"></i> Batal
</a>
<button type="submit" class="btn btn-primary px-5 fw-bold btn-save shadow">
<i class="icon-check me-1"></i> {{ isset($kolat) ? 'Update Kolat' : 'Simpan Kolat' }}
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<style>
/* Mengikuti Style yang Anda berikan */
.form-control {
border-radius: 10px;
padding: 12px 15px;
border: 1px solid #dce1e7;
}
.form-control:focus {
border-color: #0d6efd;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.1);
}
.btn-cancel {
border-radius: 12px;
transition: all 0.3s ease;
border: 2px solid #6c757d;
}
.btn-cancel:hover {
background-color: #6c757d;
color: white;
transform: translateY(-2px);
}
.btn-save {
border-radius: 12px;
background: linear-gradient(45deg, #0d6efd, #004dc0);
border: none;
color: white;
transition: all 0.3s ease;
}
.btn-save:hover {
transform: translateY(-2px);
background: linear-gradient(45deg, #004dc0, #0d6efd);
color: white;
}
.shadow {
box-shadow: 0 5px 15px rgba(13, 110, 253, 0.3) !important;
}
</style>
@endsection

View File

@ -36,6 +36,9 @@
* Author: BootstrapMade.com * Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/ * License: https://bootstrapmade.com/license/
======================================================== --> ======================================================== -->
{{-- tambahan untuk pop up hapus --}}
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
</head> </head>
<body> <body>
@ -71,6 +74,31 @@
<!-- Template Main JS File --> <!-- Template Main JS File -->
<script src="{{ asset('asset/js/main.js') }}"></script> <script src="{{ asset('asset/js/main.js') }}"></script>
</body> {{-- untuk menampilkan detail --}}
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
@stack('scripts')
{{-- ini tambahan untuk pop up hapus --}}
...
<script src="{{ asset('asset/js/main.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
@stack('scripts')
@if(session('success'))
<script>
Swal.fire({
icon: 'success',
title: 'Berhasil!',
text: "{{ session('success') }}",
showConfirmButton: false,
timer: 2000,
borderRadius: '20px'
});
</script>
@endif
</body>
</html> </html>

View File

@ -0,0 +1,165 @@
@extends('layout.app')
@section('content')
<div class="container-fluid py-4">
<!-- Header & Breadcrumb -->
<div class="page-header mb-4 text-start">
<nav aria-label="breadcrumb">
<ol class="breadcrumb bg-transparent p-0 mb-2">
<li class="breadcrumb-item"><a href="#" class="text-muted text-decoration-none small">Home</a></li>
<li class="breadcrumb-item active text-danger fw-bold small" aria-current="page">Data Pelatih</li>
</ol>
</nav>
<h3 class="fw-bold text-dark">Manajemen Pelatih TapakMP</h3>
</div>
<div class="row">
<div class="col-12">
<div class="card border-0 shadow-sm" style="border-radius: 20px;">
<div class="card-body p-4">
<!-- Header Tabel -->
<div class="d-flex justify-content-between align-items-center mb-4">
<div class="text-start">
<h5 class="card-title mb-0 fw-bold text-dark">Daftar Pelatih PPS Merpati Putih</h5>
<p class="text-muted small mb-0">Cabang Jember - Kelola informasi lisensi dan tingkatan pelatih.</p>
</div>
<a href="#" class="btn btn-danger px-4 py-2 shadow-sm"
style="border-radius: 12px; background-color: #b91c1c; border: none; font-size: 14px;">
<i class="icon-plus me-1"></i> Tambah Pelatih
</a>
</div>
<!-- Area Tabel -->
<div class="table-responsive">
<table class="table table-hover align-middle main-table">
<thead>
<tr>
<th width="60">No</th>
<th>Profil Pelatih</th>
<th class="text-center">Tingkatan</th>
<th class="text-center">Nomor SK / Lisensi</th>
<th class="text-center">Status</th>
<th class="text-center">Aksi</th>
</tr>
</thead>
<tbody>
<!-- Contoh Baris 1 -->
<tr>
<td class="text-muted small text-center">1</td>
<td>
<div class="d-flex align-items-center">
<div class="text-start">
<div class="fw-bold text-dark">Agus Setiawan</div>
<small class="text-muted">ID: MP-00192</small>
</div>
</div>
</td>
<td class="text-center">
<span class="badge bg-info-soft text-info px-3">Mandiri</span>
</td>
<td class="text-center">
<span class="text-primary fw-bold small bg-light px-2 py-1 rounded border">SK-JBR-001/2026</span>
</td>
<td class="text-center">
<span class="badge rounded-pill bg-success-soft text-success border border-success px-3">Aktif</span>
</td>
<td class="text-center">
<div class="d-flex justify-content-center gap-2">
<button class="btn btn-sm btn-action-detail fw-bold px-3 shadow-xs">Detail</button>
<button class="btn btn-sm btn-action-edit fw-bold px-3 shadow-xs">Edit</button>
</div>
</td>
</tr>
<!-- Contoh Baris 2 -->
<tr>
<td class="text-muted small text-center">2</td>
<td>
<div class="d-flex align-items-center">
<div class="fw-bold text-dark">Siti Aminah</div>
<small class="text-muted">ID: MP-00205</small>
</div>
</div>
</td>
<td class="text-center">
<span class="badge bg-info-soft text-info px-3">Balik II</span>
</td>
<td class="text-center">
<span class="text-primary fw-bold small bg-light px-2 py-1 rounded border">SK-JBR-002/2026</span>
</td>
<td class="text-center">
<span class="badge rounded-pill bg-success-soft text-success border border-success px-3">Aktif</span>
</td>
<td class="text-center">
<div class="d-flex justify-content-center gap-2">
<button class="btn btn-sm btn-action-detail fw-bold px-3 shadow-xs">Detail</button>
<button class="btn btn-sm btn-action-edit fw-bold px-3 shadow-xs">Edit</button>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Style CSS Khusus Tampilan -->
<style>
.main-table thead th {
background-color: #f8faff;
padding: 18px 10px;
font-size: 11px;
color: #8c98a5;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 2px solid #edf2f9;
}
.main-table tbody td {
padding: 16px 10px;
border-bottom: 1px solid #f1f4f8;
color: #495057;
font-size: 14px;
}
/* Avatar Bulat */
.badge-avatar {
width: 38px;
height: 38px;
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: bold;
color: white;
border-radius: 10px; /* Modern Soft Square */
font-size: 12px;
}
/* Warna Soft UI */
.bg-success-soft { background-color: #e6fffa; color: #38b2ac; }
.bg-info-soft { background-color: #e0f2fe; color: #0ea5e9; }
.bg-danger-soft { background-color: #fff5f5; color: #e53e3e; }
/* Button Styling */
.btn-action-detail {
background-color: #f0f7ff; color: #0d6efd; border: 1px solid #d0e4ff;
border-radius: 8px; transition: 0.2s;
}
.btn-action-edit {
background-color: #fff8e6; color: #f59e0b; border: 1px solid #ffecb3;
border-radius: 8px; transition: 0.2s;
}
.btn-action-detail:hover { background-color: #0d6efd !important; color: white !important; }
.btn-action-edit:hover { background-color: #f59e0b !important; color: white !important; }
.shadow-xs { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); }
.table-hover tbody tr:hover { background-color: #fcfcfc; }
</style>
@endsection

View File

@ -0,0 +1,144 @@
@extends('layout.app')
@section('content')
<div class="container-fluid py-4">
<!-- Header & Breadcrumb -->
<div class="page-header mb-4 text-start">
<nav aria-label="breadcrumb">
<ol class="breadcrumb bg-transparent p-0 mb-2">
<li class="breadcrumb-item"><a href="#" class="text-muted text-decoration-none small">Home</a></li>
<li class="breadcrumb-item active text-primary fw-bold small" aria-current="page">Data Kolat</li>
</ol>
</nav>
<h3 class="fw-bold text-dark">Manajemen Kelompok Latihan</h3>
</div>
<div class="row">
<div class="col-12">
<div class="card border-0 shadow-sm" style="border-radius: 20px;">
<div class="card-body p-4">
<!-- Title & Action Button -->
<div class="d-flex justify-content-between align-items-center mb-4">
<div class="text-start">
hide<h5 class="card-title mb-0 fw-bold text-dark">Daftar Kolat PPS Merpati Putih</h5>
<p class="text-muted small mb-0">Cabang Jember - Kelola lokasi dan unit latihan.</p>
</div>
<a href="{{ route('kolat.create') }}" class="btn btn-primary px-4 py-2 shadow-sm"
style="border-radius: 12px;">
<i class="icon-plus me-1"></i> Tambah Kolat
</a>
</div>
<!-- Alert Success -->
@if(session('success'))
<div class="alert alert-success border-0 shadow-sm mb-4" style="border-radius: 12px;">
<i class="icon-check-circle me-2"></i> {{ session('success') }}
</div>
@endif
<div class="table-responsive">
<table class="table table-hover align-middle main-table">
<thead>
<tr>
<th width="80">ID</th>
<th>Nama Kelompok Latihan</th>
<th>Alamat Lokasi</th>
<th width="200">Aksi</th>
</tr>
</thead>
<tbody>
@forelse ($data_kolat as $item)
<tr>
<td class="text-muted small text-center fw-bold">#{{ $item->id }}</td>
<td>
<div class="fw-bold text-dark">Kolat {{ $item->nama_kolat }}</div>
<small class="text-muted d-block">Pusat Latihan Unit</small>
</td>
<td class="text-start">
<span class="text-muted small">
<i class="icon-map-pin me-1"></i> {{ $item->alamat_kolat ?? 'Alamat belum diatur' }}
</span>
</td>
<td class="text-center">
<div class="d-flex justify-content-center gap-2">
<!-- Edit Button -->
<a href="{{ route('kolat.edit', $item->id) }}"
class="btn btn-sm btn-action-edit fw-bold px-3 shadow-xs">
<i class="icon-pencil"></i> Edit
</a>
<!-- Delete Button -->
<form action="{{ route('kolat.destroy', $item->id) }}" method="POST"
onsubmit="return confirm('Hapus Kolat ini? Anggota di dalamnya mungkin akan terdampak.')">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-sm btn-action-delete fw-bold px-3 shadow-xs">
<i class="icon-trash"></i> Hapus
</button>
</form>
</div>
</td>
</tr>
@empty
<tr>
<td colspan="4" class="text-center py-5">
<p class="text-muted">Belum ada data kolat yang tersedia.</p>
</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<style>
/* Samakan dengan Style Blade Anggota Anda */
.main-table { text-align: center; vertical-align: middle; }
.main-table thead th {
background-color: #f8faff;
padding: 18px 10px;
font-size: 0.75rem;
color: #8c98a5;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 2px solid #edf2f9;
}
.main-table tbody td {
padding: 20px 10px;
border-bottom: 1px solid #f1f4f8;
color: #495057;
font-size: 0.9rem;
}
.btn-action-edit {
background-color: #fff8e6;
color: #f59e0b;
border: 1px solid #ffecb3;
border-radius: 10px;
transition: 0.3s;
}
.btn-action-edit:hover {
background-color: #f59e0b !important;
color: white !important;
transform: translateY(-2px);
}
.btn-action-delete {
background-color: #fff5f5;
color: #dc3545;
border: 1px solid #ffe5e5;
border-radius: 10px;
transition: 0.3s;
}
.btn-action-delete:hover {
background-color: #dc3545 !important;
color: white !important;
transform: translateY(-2px);
}
.shadow-xs { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); }
</style>
@endsection

View File

@ -1,7 +1,11 @@
<?php <?php
use App\Http\Controllers\AnggotaController;
use App\Http\Controllers\KolatController;
use App\Http\Controllers\PelatihController;
use Illuminate\Support\Facades\Route; use Illuminate\Support\Facades\Route;
/* /*
|-------------------------------------------------------------------------- |--------------------------------------------------------------------------
| Web Routes | Web Routes
@ -28,3 +32,22 @@
Route::get('/anggota', function () { Route::get('/anggota', function () {
return view('anggota.anggota'); return view('anggota.anggota');
}); });
//anggota
Route::get('/anggota', [AnggotaController::class, 'anggota'])->name('anggota.anggota');
Route::get('/anggota/tambah', [AnggotaController::class, 'create'])->name('anggota.create');
Route::post('/anggota/simpan', [AnggotaController::class, 'store'])->name('anggota.store');
Route::get('/anggota/{id}/edit', [AnggotaController::class, 'edit'])->name('anggota.edit');
Route::put('/anggota/{id}', [AnggotaController::class, 'update'])->name('anggota.update');
//pelatih
Route::get('/pelatih', [PelatihController::class, 'pelatih'])->name('pelatih.pelatih');
//kolat
Route::get('/kolat', [KolatController::class, 'kolat'])->name('kolat.index');
Route::get('/kolat/tambah', [KolatController::class, 'create'])->name('kolat.create');
Route::post('/kolat/simpan', [KolatController::class, 'store'])->name('kolat.store');
Route::get('/kolat/{id}/edit', [KolatController::class, 'edit'])->name('kolat.edit');
Route::put('/kolat/{id}', [KolatController::class, 'update'])->name('kolat.update');
Route::delete('/kolat/{id}', [KolatController::class, 'destroy'])->name('kolat.destroy');