Membuat Modal Untuk Tampilan Data Jabatan

projek_pkl/app/Http/Controllers/DashboardController.php

@@ -19,5 +19,11 @@ class DashboardController extends Controller
         return view('dashboard.sections.karyawan', compact('karyawan'));
     }
 
+    public function jabatan()
+    {
+        $jabatans = Jabatan::all(); // atau [] jika tidak ada data
+        return view('dashboard.sections.jabatan', compact('jabatans'));
+    }
+
 }
 

projek_pkl/app/Http/Controllers/JabatanController.php

@@ -0,0 +1,54 @@
+<?php
+
+// app/Http/Controllers/JabatanController.php
+
+namespace App\Http\Controllers;
+
+use App\Models\Jabatan;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Validator;
+
+class JabatanController extends Controller
+{
+    // Menampilkan halaman utama Data Jabatan
+    public function index()
+    {
+        $jabatans = Jabatan::latest()->get();
+        return view('dashboard.sections.jabatan', compact('jabatans'));
+    }
+
+    // Menyimpan data jabatan baru
+    public function store(Request $request)
+    {
+        $validator = Validator::make($request->all(), ['jabatan' => 'required|string|max:255|unique:jabatans']);
+        if ($validator->fails()) {
+            return response()->json(['errors' => $validator->errors()], 422);
+        }
+        $jabatan = Jabatan::create($request->only('jabatan'));
+        return response()->json(['success' => 'Data Jabatan berhasil ditambahkan.', 'data' => $jabatan]);
+    }
+
+    // Mengambil data spesifik untuk form edit
+    public function show(Jabatan $jabatan)
+    {
+        return response()->json($jabatan);
+    }
+
+    // Memperbarui data jabatan
+    public function update(Request $request, Jabatan $jabatan)
+    {
+        $validator = Validator::make($request->all(), ['jabatan' => 'required|string|max:255|unique:jabatans,jabatan,' . $jabatan->id]);
+        if ($validator->fails()) {
+            return response()->json(['errors' => $validator->errors()], 422);
+        }
+        $jabatan->update($request->only('jabatan'));
+        return response()->json(['success' => 'Data Jabatan berhasil diperbarui.', 'data' => $jabatan]);
+    }
+
+    // Menghapus data jabatan
+    public function destroy(Jabatan $jabatan)
+    {
+        $jabatan->delete();
+        return response()->json(['success' => 'Data Jabatan berhasil dihapus.']);
+    }
+}

projek_pkl/resources/views/dashboard/sections/jabatan.blade.php

@@ -0,0 +1,270 @@
+@extends('layouts.app')
+
+@section('title', 'Data Jabatan')
+
+<style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+            font-family: 'Poppins', sans-serif;
+        }
+        .container {
+            width: 90%;
+            max-width: 900px;
+            background: #ffffff;
+            padding: 20px;
+            border-radius: 20px;
+            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
+        }
+        h1 {
+            text-align: center;
+            margin-bottom: 20px;
+            color: #2c3e50;
+        }
+        .button {
+            display: inline-block;
+            padding: 14px 15px;
+            margin-top: 10px;
+            color: #ffffff;
+            background: #4e73df;
+            text-decoration: none;
+            border-radius: 50px;
+            font-weight: 600;
+            transition: background 0.3s ease;
+        }
+        .button:hover {
+            background: #ACB6E5;
+        }
+        .alert {
+            padding: 15px;
+            background-color: #d1f2eb;
+            color: #117864;
+            margin-bottom: 20px;
+            border-left: 6px solid #1abc9c;
+            border-radius: 8px;
+        }
+        table {
+            width: 100%;
+            border-collapse: collapse;
+            margin-top: 15px;
+            overflow: hidden;
+            border-radius: 15px;
+        }
+        thead {
+            background-color: #4e73df;
+            color: white;
+            text-align: center;
+        }
+        th, td {
+            padding: 15px;
+            text-align: center;
+            font-size: 15px;
+            border-bottom: 1px solid #e1e1e1;
+        }
+        tbody tr:nth-child(even) {
+            background-color: #f4f9fd;
+        }
+        tbody tr:hover {
+            background-color: #e1e6fc;
+        }
+        p {
+            text-align: center;
+            margin-top: 10px;
+            font-size: 15px;
+            color: #555;
+        }
+
+        .button-opsi {
+            display: inline-block ;
+            padding: 10px 15px;
+            margin-top: 2px;
+            color: #ffffff;
+            background: #4e73df;
+            text-decoration: none;
+            border: none;
+            border-radius: 15px;
+            font-size: 15px;
+            font family: 'Poppins', sans-serif;
+            font-weight: 300;
+            transition: background 0.3s ease;
+            margin-right: 5px;
+            cursor: pointer;
+        }
+        .button-group {
+            display: flex;
+            justify-content: right;
+            margin-top: 20px;
+            padding: 0 20px;
+            font-size: 15px;
+        }
+
+        .btn {
+            padding: 10px 20px;
+            border-radius: 20px;
+            border: none;
+            text-decoration: none;
+            font-size: 15px;
+            color: white;
+            font-weight: bold;
+        }
+
+        .btn-kembali {
+            background-color: #4e73df;
+        }
+
+        .btn-tambah {
+            background-color: #4e73df;
+        }
+    </style>
+
+@section('content')
+<div class="container-fluid">
+    <h1 class="h3 mb-4 text-gray-800">Data Jabatan</h1>
+
+    <div class="card shadow mb-4">
+        <div class="card-header py-3">
+            <button id="btn-tambah-jabatan" class="btn btn-primary">+ Tambah Data Jabatan</button>
+        </div>
+        <div class="card-body">
+            <div class="table-responsive">
+                <table class="table table-bordered" id="jabatan-table">
+                    <thead>
+                        <tr>
+                            <th>No</th>
+                            <th>Nama Jabatan</th>
+                            <th>Aksi</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        @foreach($jabatans as $key => $jabatan)
+                        <tr id="jabatan-{{ $jabatan->id }}">
+                            <td>{{ $key + 1 }}</td>
+                            <td>{{ $jabatan->jabatan }}</td>
+                            <td>
+                                <button class="btn btn-sm btn-info btn-edit" data-id="{{ $jabatan->id }}">Edit</button>
+                                <button class="btn btn-sm btn-danger btn-hapus" data-id="{{ $jabatan->id }}">Hapus</button>
+                            </td>
+                        </tr>
+                        @endforeach
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="modal fade" id="jabatanModal" tabindex="-1" role="dialog" aria-labelledby="jabatanModalLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="jabatanModalLabel">Tambah Jabatan</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <form id="jabatanForm">
+                <div class="modal-body">
+                    @csrf
+                    <input type="hidden" id="jabatan_id">
+                    <div class="form-group">
+                        <label for="jabatan">Nama Jabatan</label>
+                        <input type="text" class="form-control" id="jabatan" name="jabatan" required>
+                        <div class="invalid-feedback"></div>
+                    </div>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Tutup</button>
+                    <button type="submit" class="btn btn-primary" id="btn-simpan">Simpan</button>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+@endsection
+
+@push('scripts')
+<!-- <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> -->
+<!-- <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> -->
+<script>
+$(document).ready(function () {
+    const csrfToken = $('meta[name="csrf-token"]').attr('content');
+
+    // 1. Tampilkan Modal untuk Tambah Data
+    $('#btn-tambah-jabatan').on('click', function() {
+        let id = $(this).data('id');
+        $('#jabatanModal').modal('show');
+        $('#jabatanForm').attr('action', '/dashboard/jabatan');
+        $('#jabatanForm')[0].reset();
+        $('#jabatanModalLabel').text('Tambah Data Jabatan');
+        $('#jabatan_id').val('');
+        $('#nama_jabatan').removeClass('is-invalid');
+    });
+
+    // 2. Tampilkan Modal untuk Edit Data
+    $('#jabatan-table').on('click', '.btn-edit', function() {
+        let id = $(this).data('id');
+        $('#jabatanModal').modal("show")
+        $.get('/dashboard/jabatan/' + id, function(data) {
+            $('#jabatanModalLabel').text('Edit Data Jabatan');
+            $('#jabatan_id').val(data.id);
+            $('#jabatan').val(data.jabatan).removeClass('is-invalid');
+        });
+    });
+
+    // 3. Proses Simpan atau Update Data
+    $('#jabatanForm').on('submit', function(e) {
+        e.preventDefault();
+        let id = $('#jabatan_id').val();
+        let url = id ? '/dashboard/jabatan/' + id : '/dashboard/jabatan';
+        let method = id ? 'PUT' : 'POST';
+
+        $.ajax({
+            url: url,
+            method: method,
+            data: $(this).serialize(),
+            success: function(response) {
+                $('#jabatanModal').modal('hide');
+                Swal.fire('Sukses!', response.success, 'success');
+                setTimeout(() => location.reload(), 1500);
+            },
+            error: function(xhr) {
+                let errors = xhr.responseJSON.errors;
+                if (errors.jabatan) {
+                    $('#jabatan').addClass('is-invalid').next('.invalid-feedback').text(errors.jabatan[0]);
+                }
+            }
+        });
+    });
+
+    // 4. Proses Hapus Data
+    $('body').on('click', '.btn-hapus', function() {
+        let id = $(this).data('id');
+        Swal.fire({
+            title: 'Anda yakin?',
+            text: "Data yang dihapus tidak dapat dikembalikan!",
+            icon: 'warning',
+            showCancelButton: true,
+            confirmButtonColor: '#d33',
+            cancelButtonColor: '#3085d6',
+            confirmButtonText: 'Ya, hapus!',
+            cancelButtonText: 'Batal'
+        }).then((result) => {
+            if (result.isConfirmed) {
+                $.ajax({
+                    url: '/dashboard/jabatan/' + id,
+                    method: 'DELETE',
+                    data: { _token: '{{ csrf_token() }}' },
+                    success: function(response) {
+                        Swal.fire('Terhapus!', response.success, 'success');
+                        $('#jabatan-' + id).remove();
+                         // Opsional: Reload untuk update nomor urut jika perlu
+                        // setTimeout(() => location.reload(), 1500);
+                    }
+                });
+            }
+        });
+    });
+});
+</script>
+@endpush

projek_pkl/resources/views/layouts/app.blade.php

@@ -35,6 +35,10 @@
     <!-- SB Admin 2 JS -->
     <script src="{{ asset('assets/sb-admin2/vendor/jquery/jquery.min.js') }}"></script>
     <script src="{{ asset('assets/sb-admin2/vendor/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
+    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
     <script src="{{ asset('assets/sb-admin2/js/sb-admin-2.min.js') }}"></script>
+
+
+    @stack('scripts')
 </body>
 </html>

projek_pkl/resources/views/layouts/sidebar.blade.php

@@ -22,6 +22,12 @@
         </a>
     </li>
 
+    <li class="nav-item">
+        <a href="{{ route('dashboard.jabatan.index') }}" class="nav-link {{ request()->is('jabatan*') ? 'active' : '' }}">
+            <i class="fas fa-briefcase"></i> <p>Data Jabatan</p>
+        </a>
+    </li>
+
    <li class="nav-item">
         <a href="#" class="nav-link" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
             <i class="fas fa-fw fa-sign-out-alt"></i>

projek_pkl/routes/web.php

@@ -7,6 +7,7 @@ use Illuminate\App\Http\Controllers\SiswaController;
 use App\Http\Controllers\KaryawanController;
 use App\Http\Controllers\LoginController;
 use App\Http\Controllers\AuthController;
+use App\Http\Controllers\JabatanController;
 use App\Http\Controllers\DashboardController;
 
 // KARYAWAN
@@ -41,7 +42,10 @@ Route::post('/logout', [AuthController::class, 'logout'])->name('logout');
 Route::get('/data-karyawan', [KaryawanController::class, 'index'])->name('karyawan.index');
 
 //dashboard
-Route::middleware(['auth'])->prefix('dashboard')->group(function () {
+Route::middleware(['auth'])->prefix('dashboard')->name('dashboard.')->group(function () {
-    Route::get('/', [DashboardController::class, 'index'])->name('dashboard.index');
+    Route::get('/', [DashboardController::class, 'index'])->name('index');
-    Route::get('/karyawan', [DashboardController::class, 'karyawan'])->name('dashboard.karyawan');
+    Route::get('/karyawan', [DashboardController::class, 'karyawan'])->name('karyawan');
-});
+    
+    Route::resource('jabatan', JabatanController::class);
+});
+