kolat, dan anggota
This commit is contained in:
parent
75cfd09205
commit
a53eefa96e
|
|
@ -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!');
|
||||
}
|
||||
}
|
||||
|
|
@ -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!');
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<?php
|
||||
|
||||
namespace App\Http\Controllers;
|
||||
//use Illuminate\Http\Request;
|
||||
|
||||
class PelatihController extends Controller
|
||||
{
|
||||
public function pelatih()
|
||||
{
|
||||
return view('pelatih.pelatih');
|
||||
}
|
||||
}
|
||||
|
|
@ -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');
|
||||
}
|
||||
}
|
||||
|
|
@ -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');
|
||||
}
|
||||
}
|
||||
|
|
@ -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');
|
||||
}
|
||||
}
|
||||
|
|
@ -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
|
||||
}
|
||||
|
|
@ -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');
|
||||
}
|
||||
};
|
||||
|
|
@ -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');
|
||||
}
|
||||
};
|
||||
|
|
@ -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');
|
||||
}
|
||||
};
|
||||
|
|
@ -1,49 +1,339 @@
|
|||
@extends('layout.app')
|
||||
|
||||
@section('content')
|
||||
<div class="page-header">
|
||||
<ol class="breadcrumb">
|
||||
<li class="breadcrumb-item">Home</li>
|
||||
<li class="breadcrumb-item active">Data Kriteria</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="container-fluid py-4">
|
||||
<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 Anggota</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<h3 class="fw-bold text-dark">Manajemen Keanggotaan TapakMP</h3>
|
||||
</div>
|
||||
|
||||
<div class="row gutters">
|
||||
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="card border-0 shadow-sm" style="border-radius: 20px;">
|
||||
<div class="card-body p-4">
|
||||
|
||||
<div class="mb-3 d-flex justify-content-between align-items-center">
|
||||
<h5 class="mb-0">Data Kriteria</h5>
|
||||
<a href="#" class="btn btn-success">
|
||||
<i class="icon-plus"></i> Tambah Data
|
||||
</a>
|
||||
<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 Anggota PPS Merpati Putih</h5>
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover align-middle main-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th width="60">No</th>
|
||||
<th>Identitas Anggota</th>
|
||||
<th>JK</th>
|
||||
<th>Tingkatan & Kolat</th>
|
||||
<th>Jabatan</th>
|
||||
<th>Status</th>
|
||||
<th>Aksi</th>
|
||||
</tr>
|
||||
</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>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead class="thead-light">
|
||||
<tr>
|
||||
<th width="50">No</th>
|
||||
<th width="100">No Induk</th>
|
||||
<th>Nama lengkap</th>
|
||||
<th>Tempat & Tanggal Lahir</th>
|
||||
<th>Jenis Kelamin</th>
|
||||
<th>Alamat</th>
|
||||
<th>Asal Kolat</th>
|
||||
<th>Tingkatan</th>
|
||||
<th>Tanggal Gabung</th>
|
||||
<th>Status Anggota</th>
|
||||
|
||||
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</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
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -36,6 +36,9 @@
|
|||
* Author: BootstrapMade.com
|
||||
* License: https://bootstrapmade.com/license/
|
||||
======================================================== -->
|
||||
|
||||
{{-- tambahan untuk pop up hapus --}}
|
||||
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
@ -71,6 +74,31 @@
|
|||
<!-- Template Main JS File -->
|
||||
<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>
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -1,7 +1,11 @@
|
|||
<?php
|
||||
|
||||
use App\Http\Controllers\AnggotaController;
|
||||
use App\Http\Controllers\KolatController;
|
||||
use App\Http\Controllers\PelatihController;
|
||||
use Illuminate\Support\Facades\Route;
|
||||
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Web Routes
|
||||
|
|
@ -28,3 +32,22 @@
|
|||
Route::get('/anggota', function () {
|
||||
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');
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue