Inventaris Lab Laravel 12 : Bagian #09 - MEMBUAT HALAMAN TRANSAKSI PEMINJAMAN (LOAN) — Minarsih TECH Install Web App

Inventaris Lab Laravel 12 : Bagian #09 - MEMBUAT HALAMAN TRANSAKSI PEMINJAMAN (LOAN)

profil-penulis

Belajar Bareng Minarsih - Edisi Ngoding

10 Oktober 2025

Tujuan: Di bagian ini, kita akan membuat fitur untuk mencatat dan mengelola data transaksi peminjaman barang. Kita akan belajar lebih dalam tentang cara menampilkan data dari beberapa tabel yang saling berhubungan (relationships) dalam satu tampilan. Di akhir, kita akan menambahkan fitur khusus untuk proses pengembalian barang.

 

Langkah 1: Menyiapkan Route & Controller

Seperti biasa, kita siapkan "jalan" (Route) dan "otak" (Controller) terlebih dahulu.

  1. Memastikan Controller Sudah Ada:
    • File LoanController.php sudah dibuatkan untuk kita oleh perintah php artisan make:model Loan -msr pada bagian KONFIGURASI DATABASE & FONDASI PROYEK.


       
  2. Mendaftarkan Resource Route:
    • Buka file routes/web.php.


       
    • Impor LoanController di bagian atas file:
       
      use App\Http\Controllers\LoanController;

       
    • Di dalam grup Route::middleware('auth')->group(...), tambahkan satu baris route resource untuk loan.
       
      Route::middleware('auth')->group(function () {
          // ... route dashboard, users, category, item
      
          Route::resource('loan', LoanController::class);
      
      });

  1. Melihat Daftar Route:
    • Untuk memastikan rute-rute CRUD Peminjaman sudah terbuat, jalankan perintah ini di terminal:
       
      php artisan route:list --name=loan

 

Langkah 2: Mengisi Logika LoanController (Bagian Index)

Sekarang, kita isi logika pada controller untuk mengambil data peminjaman dari database.

  1. Buka file app/Http/Controllers/LoanController.php.


     
  2. Pastikan import model Loan sudah ada di LoanController. Biasanya baris ini akan otomatis dibuat karena model Loan sebelumnya dibuat dengan perintah-msr
     
    use App\Models\Loan;

     
  3. Tambahkan variabel protected dengan menyalinnya dari ItemController dan menyesuaikan isinya:
     
    class LoanController extends Controller
    {
    
        // Variabel untuk data umum
    
        protected $title = 'Peminjaman';
    
        protected $menu = 'loan';
    
        protected $directory = 'admin.loan'; // Diubah ke folder view loan

  4. Isi fungsi index() untuk mengambil data dan mengirimkannya ke view:
     
    public function index()
    {
    
        // Menyiapkan array untuk dikirim ke view
    
        $data['title'] = $this->title;
    
        $data['menu'] = $this->menu;
    
    
    
        // Mengambil data dari database
    
        $data['loans'] = Loan::with(['user', 'item'])->latest()->get();
    
    
    
        // Me-return view beserta data
    
        return view($this->directory . '.index', $data);
    
    }


Penjelasan Kode: Perintah .with(['user', 'item']) adalah Eager Loading untuk banyak relasi sekaligus. Ini berarti: "Ambil semua data peminjaman, dan untuk setiap peminjaman, sertakan juga data user (peminjam) dan data item (barang yang dipinjam)".

 

Langkah 3: Menyiapkan File-File View (Cara Cepat)

Kita akan kembali menggunakan metode duplikasi.

  1. Di panel file VS Code, buka direktori resources/views/admin/.
  2. Klik kanan pada folder item, lalu pilih Copy.


     
  3. Klik kanan lagi pada folder admin, lalu pilih Paste.


     
  4. Rename folder item copy menjadi loan.


     
  5. Sekarang kita memiliki folder loan yang berisi file index, create, dan edit yang siap untuk kita modifikasi.

 

Langkah 4: Menyesuaikan Halaman Index Loan

Kita akan mengubah file index.blade.php untuk menampilkan ringkasan data peminjaman.

  1. Buka file resources/views/admin/loan/index.blade.php.


     
  2. Lakukan Penyesuaian dengan Teliti:
    • Rute & Looping: Ubah semua rute dari item.* ke loan.* dan ubah perulangan menjadi @foreach ($loans as $loan).




       
    • Header Tabel: Sesuaikan <thead> dengan kolom yang lebih sederhana: No, Nama Peminjam, Nama Barang, Tanggal Pinjam, Status, dan Aksi.


       
    • Isi Tabel: Sesuaikan <tbody> untuk menampilkan data dari $loan dan relasinya.


       
  3. KODE SETELAH PENYESUAIAN (Kode Final untuk loan/index.blade.php): Ganti seluruh isi file dengan kode yang sudah disesuaikan ini:
     
    @extends('admin.layouts.app')
    @section('css')
    
        {{-- CSS Tambahan --}}
    
    @endsection
    
    
    @section('content')
    
        <div class="card">
    
            <div class="card-body">
    
                <h5 class="card-title fw-semibold mb-4">Data {{ $title }}</h5>
    
                <a href="{{ route('loan.create') }}" class="btn btn-primary mb-4">Tambah Data {{ $title }}</a>
    
    
    
                <div class="table-responsive">
    
                    <table id="datatable" class="table table-striped">
    
                        <thead>
    
                            <tr>
    
                                <th>No</th>
    
                                <th>Nama Peminjam</th>
    
                                <th>Nama Barang</th>
    
                                <th>Tanggal Pinjam</th>
    
                                <th>Status</th>
    
                                <th>Aksi</th>
    
                            </tr>
    
                        </thead>
    
                        <tbody>
    
                            @foreach ($loans as $loan)
    
                                <tr>
    
                                    <td>{{ $loop->iteration }}</td>
    
                                    <td>{{ $loan->user->name }}</td>
            <td>
    
       <small>{{ $loan->item->unique_code }}</small><br>
    
       <span class="fw-bold">{{ $loan->item->name }}</span>
    
            </td>
    
                                    <td>{{ \Carbon\Carbon::parse($loan->loan_date)->format('d-m-Y') }}</td>
    
                                    <td>
    
                                        @if ($loan->status == 'Dipinjam')
    
                                            <span class="badge bg-warning">{{ $loan->status }}</span>
    
                                        @else
    
                                            <span class="badge bg-success">{{ $loan->status }}</span>
    
                                        @endif
    
                                    </td>
    
                                    <td>
    
                                        <a href="{{ route('loan.edit', $loan->id) }}" class="btn btn-warning btn-sm">Ubah</a>
    
                                        <form id="deleteForm{{ $loan->id }}"
    
                                            action="{{ route('loan.destroy', $loan->id) }}" method="POST" class="d-inline">
    
                                            @csrf
    
                                            @method('DELETE')
    
                                            <button type="button" class="btn btn-danger btn-sm"
    
                                                onclick="confirmDelete({{ $loan->id }})">Hapus</button>
    
                                        </form>
    
                                    </td>
    
                                </tr>
    
                            @endforeach
    
                        </tbody>
    
                    </table>
    
                </div>
    
            </div>
    
        </div>
    
    @endsection
    
    
    
    @section('js')
    
        <script>
    
            $(document).ready(function() {
    
                $('#datatable').DataTable();
    
            });
    
    
    
            // Script untuk SweetAlert
    
            function confirmDelete(id) {
    
                swal({
    
                        title: "Apakah anda yakin?",
    
                        text: "Data yang dihapus tidak dapat dikembalikan!",
    
                        icon: "warning",
    
                        buttons: true,
    
                        dangerMode: true,
    
                    })
    
                    .then((willDelete) => {
    
                        if (willDelete) {
    
                            // Jika pengguna menekan "OK", submit form
    
                            $('#deleteForm' + id).submit();
    
                        } else {
    
                            // Jika pengguna menekan "Cancel"
    
                            swal("Data tidak jadi dihapus!", {
    
                                icon: "error",
    
                            });
    
                        }
    
                    });
    
            }
    
        </script>
    
    @endsection





 

Langkah 5: Menambahkan Menu Peminjaman di Sidebar

Agar halaman daftar peminjaman bisa diakses, kita perlu menambahkan link menunya. Sesuai rencana, kita akan membuat grup menu baru bernama "Transaksi" agar navigasi aplikasi kita lebih terstruktur.

  1. Buka file resources/views/admin/layouts/sidebar.blade.php.


     
  2. Scroll ke bawah setelah grup menu "Datamaster".
  3. Tambahkan blok kode baru untuk grup "Transaksi" dan menu "Peminjaman". Anda bisa menyalin dari blok "Datamaster" dan menyesuaikannya.


  4. KODE SETELAH PENAMBAHAN (Kode Final Sidebar): Struktur <ul id="sidebarnav"> Anda sekarang akan terlihat lengkap seperti ini:
     
    <ul id="sidebarnav">
        {{-- MENU HOME --}}
    
        <li class="nav-small-cap">
    
            <i class="ti ti-dots nav-small-cap-icon fs-4"></i>
    
            <span class="hide-menu">Home</span>
    
        </li>
    
        <li class="sidebar-item {{ Request::is('dashboard') ? 'selected' : '' }}">
    
            <a class="sidebar-link {{ Request::is('dashboard') ? 'active' : '' }}"
    
                href="{{ route('dashboard') }}" aria-expanded="false">
    
                <span><i class="ti ti-layout-dashboard"></i></span>
    
                <span class="hide-menu">Dashboard</span>
    
            </a>
    
        </li>
    
    
    
        {{-- MENU DATAMASTER --}}
    
        <li class="nav-small-cap">
    
            <i class="ti ti-dots nav-small-cap-icon fs-4"></i>
    
            <span class="hide-menu">Datamaster</span>
    
        </li>
    
        {{-- Menu Users, Category, Item --}}
    
        <li class="sidebar-item {{ Request::is('users*') ? 'selected' : '' }}">
    
            <a class="sidebar-link {{ Request::is('users*') ? 'active' : '' }}"
    
                href="{{ route('users.index') }}" aria-expanded="false">
    
                <span><i class="ti ti-users"></i></span>
    
                <span class="hide-menu">Data Users</span>
    
            </a>
    
        </li>
    
        <li class="sidebar-item {{ Request::is('category*') ? 'selected' : '' }}">
    
            <a class="sidebar-link {{ Request::is('category*') ? 'active' : '' }}"
    
                href="{{ route('category.index') }}" aria-expanded="false">
    
                <span><i class="ti ti-category"></i></span>
    
                <span class="hide-menu">Data Category</span>
    
            </a>
    
        </li>
    
        <li class="sidebar-item {{ Request::is('item*') ? 'selected' : '' }}">
    
            <a class="sidebar-link {{ Request::is('item*') ? 'active' : '' }}"
    
                href="{{ route('item.index') }}" aria-expanded="false">
    
                <span><i class="ti ti-box"></i></span>
    
                <span class="hide-menu">Data Item</span>
    
            </a>
    
        </li>
    
    
    
        {{-- (BARU) MENU TRANSAKSI --}}
    
        <li class="nav-small-cap">
    
            <i class="ti ti-dots nav-small-cap-icon fs-4"></i>
    
            <span class="hide-menu">Transaksi</span>
    
        </li>
    
        <li class="sidebar-item {{ Request::is('loan*') ? 'selected' : '' }}">
    
            <a class="sidebar-link {{ Request::is('loan*') ? 'active' : '' }}"
    
                href="{{ route('loan.index') }}" aria-expanded="false">
    
                <span><i class="ti ti-clipboard-text"></i></span>
    
                <span class="hide-menu">Peminjaman</span>
    
            </a>
    
        </li>
    
    </ul>
    



  5. Uji Coba Halaman Index Loan:
    • Simpan file sidebar.blade.php.
    • Refresh browser Anda.
    • Hasil: Anda akan melihat grup menu baru "Transaksi" dengan menu "Peminjaman" di dalamnya. Klik menu tersebut, dan halaman daftar peminjaman akan tampil dengan benar.

 

Langkah 6: Membuat Form Tambah Peminjaman

Form ini akan menjadi yang paling interaktif karena akan mengambil data dari tabel users dan items untuk ditampilkan sebagai pilihan dropdown.

  1. Siapkan Logika di Controller (Fungsi create):
    • Buka app/Http/Controllers/LoanController.php.


       
    • Kita perlu mengambil data semua siswa dan semua item yang tersedia. Impor Model User dan Item di bagian atas:
       
      use App\Models\User;
      use App\Models\Item;

       
    • Isi fungsi create() dengan kode berikut:
       
      public function create()
      {
      
          $data['title'] = $this->title;
      
          $data['menu'] = $this->menu;
      
          // Ambil data user yang rolenya siswa
      
          $data['users'] = User::where('role', 'Siswa')->get();
      
          // Ambil semua data item
      
          $data['items'] = Item::all();
      
      
      
          return view($this->directory . '.create', $data);
      
      }

       
  2. Sesuaikan Tampilan Form (create.blade.php):
    • Buka file resources/views/admin/loan/create.blade.php. Saat ini isinya masih berupa salinan dari form item.


       
    • Kita akan melakukan modifikasi besar. Ubah form agar memiliki input dropdown untuk Nama Peminjam dan Nama Barang, serta input tanggal untuk Tanggal Pinjam dan Tanggal Pengembalian.












       
  3. KODE SETELAH PENYESUAIAN (Kode Final create.blade.php): Ganti seluruh isi file dengan kode di bawah ini.
     
    @extends('admin.layouts.app')
    
    @section('css')
        {{-- CSS Tambahan --}}
    
    @endsection
    
    @section('content')
    
        <div class="card">
    
            <div class="card-body">
    
                <h5 class="card-title fw-semibold mb-4">Tambah Data {{ $title }}</h5>
    
                <div class="card">
    
                    <div class="card-body">
    
                        <form action="{{ route('loan.store') }}" method="POST">
    
                            @csrf
    
                            {{-- Nama Peminjam --}}
    
                            <div class="mb-3">
    
                                <label for="user_id" class="form-label">Nama Peminjam</label>
    
                                <select class="form-select @error('user_id') is-invalid @enderror" name="user_id" id="user_id">
    
                                    <option value="" disabled selected>Pilih Peminjam</option>
    
                                    @foreach ($users as $user)
    
                                        <option value="{{ $user->id }}" {{ old('user_id') == $user->id ? 'selected' : '' }}>{{ $user->name }}</option>
    
                                    @endforeach
    
                                </select>
    
                                @error('user_id')
    
                                    <small class="text-danger">{{ $message }}</small>
    
                                @enderror
    
                            </div>
    
    
    
                            {{-- Nama Barang --}}
    
                            <div class="mb-3">
    
                                <label for="item_id" class="form-label">Nama Barang</label>
    
                                <select class="form-select @error('item_id') is-invalid @enderror" name="item_id" id="item_id">
    
                                    <option value="" disabled selected>Pilih Barang</option>
    
                                    @foreach ($items as $item)
    
                                        <option value="{{ $item->id }}" {{ old('item_id') == $item->id ? 'selected' : '' }}>{{ $item->name }} - ({{$item->unique_code}})</option>
    
                                    @endforeach
    
                                </select>
    
                                @error('item_id')
    
                                    <small class="text-danger">{{ $message }}</small>
    
                                @enderror
    
                            </div>
    
    
    
                            {{-- Tanggal Pinjam --}}
    
                            <div class="mb-3">
    
                                <label for="loan_date" class="form-label">Tanggal Pinjam</label>
    
                                <input type="date" class="form-control @error('loan_date') is-invalid @enderror" name="loan_date"
    
                                    id="loan_date" value="{{ old('loan_date') }}">
    
                                @error('loan_date')
    
                                    <small class="text-danger">{{ $message }}</small>
    
                                @enderror
    
                            </div>
    
    
    
                            {{-- Tanggal Pengembalian --}}
    
                            <div class="mb-3">
    
                                <label for="return_date" class="form-label">Tanggal Pengembalian</label>
    
                                <input type="date" class="form-control @error('return_date') is-invalid @enderror" name="return_date"
    
                                    id="return_date" value="{{ old('return_date') }}">
    
                                @error('return_date')
    
                                    <small class="text-danger">{{ $message }}</small>
    
                                @enderror
    
                            </div>
    
    
    
                            {{-- Tombol --}}
    
                            <button type="submit" class="btn btn-primary">Simpan</button>
    
                            <a href="{{ route('loan.index') }}" class="btn btn-warning">Kembali</a>
    
                        </form>
    
                    </div>
    
                </div>
    
            </div>
    
        </div>
    
    @endsection
    
    @section('js')
    
        {{-- JS Tambahan --}}
    
    @endsection





 

Langkah 7: Menyiapkan Logika Penyimpanan Data Peminjaman

Logika ini akan sedikit lebih kompleks, karena kita harus memeriksa ketersediaan barang sebelum menyimpannya.

  1. Siapkan Model Loan.php:
    • Buka file app/Models/Loan.php.


       
    • Tambahkan properti $fillable dan definisikan relasi ke Model User dan Item.


       
  2. Isi Logika store() di Controller:
    • Buka LoanController.php.


       
    • Isi fungsi store() dengan logika validasi, pengecekan ketersediaan barang, dan penyimpanan data.
       
      public function store(Request $request)
      
      {
      
          // 1. Validasi data
      
          $validatedData = $request->validate([
      
              'user_id' => 'required',
      
              'item_id' => 'required',
      
              'loan_date' => 'required|date',
      
              'return_date' => 'required|date|after_or_equal:loan_date',
      
          ]);
      
      
      
          // 2. Cek apakah barang sedang dipinjam atau rusak
      
          $item = Item::findOrFail($validatedData['item_id']);
      
          if ($item->condition === 'Rusak') {
      
              return redirect()->route('loan.create')->withInput()->with([
      
                  'status' => 'danger', 'title' => 'Gagal', 'message' => 'Barang dalam kondisi rusak dan tidak bisa dipinjam.'
      
              ]);
      
          }
      
          $isBorrowed = Loan::where('item_id', $validatedData['item_id'])->where('status', 'Dipinjam')->exists();
      
          if ($isBorrowed) {
      
              return redirect()->route('loan.create')->withInput()->with([
      
                  'status' => 'danger', 'title' => 'Gagal', 'message' => 'Barang ini sedang dipinjam oleh orang lain.'
      
              ]);
      
          }
      
      
      
          // 3. Simpan data ke database
      
          $loan = Loan::create($validatedData);
      
      
      
          // 4. Redirect dengan pesan sukses
      
          if ($loan) {
      
              return redirect()->route('loan.index')->with([
      
                  'status' => 'success',
      
                  'title' => 'Berhasil',
      
                  'message' => 'Data Peminjaman Berhasil Ditambahkan!'
      
              ]);
      
          } else {
      
              return redirect()->route('loan.index')->with([
      
                  'status' => 'danger',
      
                  'title' => 'Gagal',
      
                  'message' => 'Data Peminjaman Gagal Ditambahkan!'
      
              ]);
      
          }
      
      }
      




       

Penjelasan Baru:

  • $isBorrowed = Loan::...->exists(): Kode ini memeriksa ke tabel loans apakah ada data peminjaman untuk barang yang sama dengan status 'Dipinjam'. Jika ada, hasilnya true.
  • return redirect()->...->withInput(): Jika barang tidak tersedia, kita kembalikan pengguna ke form tambah (loan.create) dengan pesan error. .withInput() memastikan data yang sudah diketik pengguna tidak hilang.

 

Langkah 8: Uji Coba Form Tambah Data Peminjaman

  1. Buka browser, pergi ke halaman "Peminjaman", lalu klik tombol "Tambah Data Peminjaman".


     
  2. Isi formnya: pilih peminjam, barang, dan tanggal. Klik Simpan.


     
  3. Hasil: Anda akan diarahkan kembali ke halaman daftar peminjaman, notifikasi sukses akan muncul, dan data peminjaman baru akan tampil di tabel.


 

Langkah 9: Membuat Form Ubah Peminjaman

Prosesnya akan sangat mirip dengan membuat form tambah, kita akan mengadaptasi kode yang sudah ada untuk mempercepat pekerjaan.

  1. Siapkan Logika di Controller (Fungsi edit):
    • Buka app/Http/Controllers/LoanController.php.


       
    • Cari fungsi edit(Loan $loan) yang masih kosong. Kita perlu mengambil data peminjaman yang akan diubah, sekaligus semua data user dan item untuk pilihan dropdown.


       
    • Isi fungsi edit() dengan kode berikut:
       
      public function edit(Loan $loan)
      {
      
          $data['title'] = $this->title;
      
          $data['menu'] = $this->menu;
      
          // Cari data peminjaman berdasarkan ID menggunakan Model Binding
      
          $data['loan'] = $loan;
      
          // Ambil data user yang rolenya siswa
      
          $data['users'] = User::where('role', 'Siswa')->get();
      
          // Ambil semua data item
      
          $data['items'] = Item::all();
      
      
      
          return view($this->directory . '.edit', $data);
      
      }

       
  2. Menyiapkan Tampilan Form (edit.blade.php):
    • Buka file resources/views/admin/loan/edit.blade.php yang saat ini isinya adalah salinan dari form ubah item.


       
    • Hapus semua isinya, lalu salin semua kode dari create.blade.php (dari folder loan) dan tempel ke edit.blade.php ini.




       
    • Sekarang, kita akan sesuaikan file tersebut agar menampilkan data yang ada.
  3. Kode Lengkap edit.blade.php (Setelah Penyesuaian): Ganti seluruh isi file edit.blade.php dengan kode yang sudah disesuaikan ini. Perhatikan perubahan pada action form, penambahan @method('PUT'), dan penyesuaian pada value serta selected di setiap input.
     
    @extends('admin.layouts.app')
    
    @section('css')
        {{-- CSS Tambahan --}}
    
    @endsection
    
    
    @section('content')
    
        <div class="card">
    
            <div class="card-body">
    
                <h5 class="card-title fw-semibold mb-4">Ubah Data {{ $title }}</h5>
    
                <div class="card">
    
                    <div class="card-body">
    
                        <form action="{{ route('loan.update', $loan->id) }}" method="POST">
    
                            @csrf
    
                            @method('PUT')
    
                            {{-- Nama Peminjam --}}
    
                            <div class="mb-3">
    
                                <label for="user_id" class="form-label">Nama Peminjam</label>
    
                                <select class="form-select @error('user_id') is-invalid @enderror" name="user_id" id="user_id">
    
                                    <option value="" disabled>Pilih Peminjam</option>
    
                                    @foreach ($users as $user)
    
                                        <option value="{{ $user->id }}" {{ old('user_id', $loan->user_id) == $user->id ? 'selected' : '' }}>{{ $user->name }}</option>
    
                                    @endforeach
    
                                </select>
    
                                @error('user_id')
    
                                    <small class="text-danger">{{ $message }}</small>
    
                                @enderror
    
                            </div>
    
    
    
                            {{-- Nama Barang --}}
    
                            <div class="mb-3">
    
                                <label for="item_id" class="form-label">Nama Barang</label>
    
                                <select class="form-select @error('item_id') is-invalid @enderror" name="item_id" id="item_id">
    
                                    <option value="" disabled>Pilih Barang</option>
    
                                    @foreach ($items as $item)
    
                                        <option value="{{ $item->id }}" {{ old('item_id', $loan->item_id) == $item->id ? 'selected' : '' }}>{{ $item->name }} - ({{$item->unique_code}})</option>
    
                                    @endforeach
    
                                </select>
    
                                @error('item_id')
    
                                    <small class="text-danger">{{ $message }}</small>
    
                                @enderror
    
                            </div>
    
    
    
                            {{-- Tanggal Pinjam --}}
    
                            <div class="mb-3">
    
                                <label for="loan_date" class="form-label">Tanggal Pinjam</label>
    
                                <input type="date" class="form-control @error('loan_date') is-invalid @enderror" name="loan_date"
    
                                    id="loan_date" value="{{ old('loan_date', \Carbon\Carbon::parse($loan->loan_date)->format('Y-m-d')) }}">
    
                                @error('loan_date')
    
                                    <small class="text-danger">{{ $message }}</small>
    
                                @enderror
    
                            </div>
    
    
    
                            {{-- Tanggal Pengembalian --}}
    
                            <div class="mb-3">
    
                                <label for="return_date" class="form-label">Tanggal Pengembalian</label>
    
                                <input type="date" class="form-control @error('return_date') is-invalid @enderror" name="return_date"
    
                                    id="return_date" value="{{ old('return_date', \Carbon\Carbon::parse($loan->return_date)->format('Y-m-d')) }}">
    
                                @error('return_date')
    
                                    <small class="text-danger">{{ $message }}</small>
    
                                @enderror
    
                            </div>
    
    
    
                            {{-- Tombol --}}
    
                            <button type="submit" class="btn btn-primary">Simpan</button>
    
                            <a href="{{ route('loan.index') }}" class="btn btn-warning">Kembali</a>
    
                        </form>
    
                    </div>
    
                </div>
    
            </div>
    
        </div>
    
    @endsection
    
    @section('js')
    
        {{-- JS Tambahan --}}
    
    @endsection



 

Langkah 10: Menyiapkan Logika Update Data Peminjaman

Sekarang kita tulis logika di controller untuk memvalidasi dan memperbarui data di database, termasuk pengecekan jika admin mengganti barang.

  1. Buka LoanController.php.


     
  2. Isi fungsi update() dengan logika validasi, pengecekan ketersediaan barang (jika diubah), dan pembaruan data.
     
    public function update(Request $request, Loan $loan)
    {
    
        // 1. Gunakan Route Model Binding, variabel $loan sudah siap pakai.
    
        $validatedData = $request->validate([
    
            'user_id' => 'required',
    
            'item_id' => 'required',
    
            'loan_date' => 'required|date',
    
            'return_date' => 'required|date|after_or_equal:loan_date',
    
        ]);
    
    
    
        // 2. Jalankan pengecekan ketersediaan HANYA JIKA item pinjaman diubah.
    
        if ($loan->item_id != $validatedData['item_id']) {
    
            $newItem = Item::findOrFail($validatedData['item_id']);
    
            
    
            // Cek jika item baru dalam kondisi rusak.
    
            if ($newItem->condition === 'Rusak') {
    
                return redirect()->back()->withInput()->with([
    
                    'status' => 'danger', 'title' => 'Gagal', 'message' => 'Barang baru yang dipilih dalam kondisi rusak.'
    
                ]);
    
            }
    
            
    
            // Cek jika item baru sedang dipinjam oleh orang lain.
    
            $isBorrowed = Loan::where('item_id', $validatedData['item_id'])->where('status', 'Dipinjam')->exists();
    
            if ($isBorrowed) {
    
                return redirect()->back()->withInput()->with([
    
                    'status' => 'danger', 'title' => 'Gagal', 'message' => 'Barang baru yang dipilih sedang dipinjam.'
    
                ]);
    
            }
    
        }
    
    
    
        // 3. Update data peminjaman di database.
    
        $updateProcess = $loan->update($validatedData);
    
    
    
        // 4. Redirect dengan pesan status berdasarkan hasil update.
    
        if ($updateProcess) {
    
            return redirect()->route('loan.index')->with([
    
                'status' => 'success',
    
                'title' => 'Berhasil',
    
                'message' => 'Data Peminjaman Berhasil Diubah!'
    
            ]);
    
        } else {
    
            return redirect()->route('loan.index')->with([
    
                'status' => 'danger',
    
                'title' => 'Gagal',
    
                'message' => 'Data Peminjaman Gagal Diubah!'
    
            ]);
    
        }
    
    }
    




     

Penjelasan Perubahan:

Kita menambahkan blok if ($loan->item_id != $validatedData['item_id']). Kode di dalam blok ini hanya akan berjalan jika admin memilih barang yang berbeda dari yang tercatat sebelumnya, untuk memastikan barang baru tersebut memang tersedia.

 

Langkah 11: Uji Coba Form Ubah Data Peminjaman

  1. Buka browser Anda, pergi ke halaman "Peminjaman", lalu klik tombol "Ubah" pada salah satu data.


     
  2. Anda akan diarahkan ke form ubah, dan semua data peminjaman lama akan otomatis terisi.


     
  3. Coba ubah tanggal pengembaliannya, lalu klik "Simpan".


     
  4. Hasil: Anda akan kembali ke halaman daftar peminjaman, notifikasi sukses akan muncul, dan data di tabel akan diperbarui sesuai perubahan Anda.



 

Langkah 12: Membuat Fitur Hapus Peminjaman

Ini adalah langkah terakhir untuk melengkapi CRUD Peminjaman. Kita hanya perlu mengisi logika di controller, karena route dan tombol di tampilan sudah kita siapkan.

  1. Siapkan Logika destroy() di Controller:
    • Buka app/Http/Controllers/LoanController.php.


       
    • Cari fungsi destroy(Loan $loan) yang masih kosong, lalu isi dengan kode berikut yang bisa kita adaptasi dari controller sebelumnya.
       
      public function destroy(Loan $loan)
      
      {
      
          // 1. Gunakan Route Model Binding, variabel $loan sudah siap pakai untuk hapus data peminjaman.
      
          $deleteProcess = $loan->delete();
      
      
      
          // 2. Redirect dengan pesan status berdasarkan hasil proses hapus.
      
          if ($deleteProcess) {
      
              return redirect()->route('loan.index')->with([
      
                  'status' => 'success',
      
                  'title' => 'Berhasil',
      
                  'message' => 'Data Peminjaman Berhasil Dihapus!'
      
              ]);
      
          } else {
      
              return redirect()->route('loan.index')->with([
      
                  'status' => 'danger',
      
                  'title' => 'Gagal',
      
                  'message' => 'Data Peminjaman Gagal Dihapus!'
      
              ]);
      
          }
      
      }




       

Penjelasan Kode: Logikanya sangat sederhana. Fungsi ini mencari data peminjaman berdasarkan ID, menghapusnya dari database menggunakan metode $loan->delete(), lalu mengembalikan pengguna ke halaman daftar peminjaman dengan notifikasi yang sesuai.

 

Langkah 13: Uji Coba Terakhir Fitur Hapus

Saatnya memastikan semua bagian (Tombol -> SweetAlert -> Controller -> Hapus Data -> Redirect) bekerja dengan sempurna.

  1. Buka browser Anda dan pergi ke halaman "Peminjaman".


     
  2. Pilih salah satu data peminjaman yang ingin Anda hapus, lalu klik tombol "Hapus" berwarna merah.
  3. Sebuah dialog konfirmasi dari SweetAlert akan muncul. Klik tombol "OK".


     
  4. Hasil: Anda akan tetap berada di halaman daftar peminjaman, notifikasi SweetAlert "Berhasil Dihapus!" akan muncul, dan baris data yang Anda hapus tadi akan hilang dari tabel.



     

 

Langkah 14: Menyiapkan Route & Controller (Fungsi show)

Route Resource yang kita buat sebelumnya sudah menyediakan "pintu" untuk halaman detail, yaitu loan.show yang mengarah ke fungsi show() di controller. Mari kita isi fungsinya.

  1. Buka app/Http/Controllers/LoanController.php.


     
  2. Cari fungsi show(Loan $loan) yang masih kosong, lalu isi dengan kode berikut:
     
    public function show(Loan $loan)
    {
    
       // 1. Gunakan Route Model Binding, variabel $loan sudah siap pakai.
    
        //    Tidak perlu lagi mencari manual dengan findOrFail().
    
    
    
        // 2. Siapkan data umum.
    
        $data['title'] = $this->title;
    
        $data['menu'] = $this->menu;
    
    
    
        // 3. Muat relasi (eager load) ke dalam model $loan yang sudah ada.
    
        $loan->load(['user', 'item.category']);
    
        $data['loan'] = $loan;
    
    
    
        // 4. Kirim semua data ke view.
    
        return view($this->directory . '.show', $data);
    
    }



Penjelasan Kode: Perhatikan .with(['user', 'item.category']). Ini adalah nested eager loading. Artinya: "Ambil data peminjaman, sertakan data user-nya, dan sertakan juga data item-nya, lalu untuk item tersebut, sertakan juga data category-nya".

 

Langkah 15: Membuat Halaman Tampilan Detail (show.blade.php)

Sekarang kita akan membuat halaman baru untuk menampilkan detail peminjaman dan barang.

  1. Di dalam folder resources/views/admin/loan/, buat file baru bernama show.blade.php.


     
  2. Isi file show.blade.php dengan kode di bawah ini. Kode ini akan membuat tata letak dua kolom seperti yang kita rencanakan.
     
    @extends('admin.layouts.app')
    @section('css')
    
        {{-- CSS Tambahan --}}
    
    @endsection
    
    
    
    @section('content')
    
        <div class="row">
    
            {{-- KOLOM KIRI: DETAIL PEMINJAMAN --}}
    
            <div class="col-md-6">
    
                <div class="card">
    
                    <div class="card-body">
    
                        <h5 class="card-title fw-semibold mb-4">Detail Peminjaman</h5>
    
                        <table class="table table-striped table-bordered-0">
    
                            <tbody>
    
                                <tr>
    
                                    <th>Nama Peminjam</th>
    
                                    <td>{{ $loan->user->name }}</td>
    
                                </tr>
    
                                <tr>
    
                                    <th>Tanggal Pinjam</th>
    
                                    <td>{{ \Carbon\Carbon::parse($loan->loan_date)->format('d F Y') }}</td>
    
                                </tr>
    
                                <tr>
    
                                    <th>Tgl Wajib Kembali</th>
    
                                    <td>{{ \Carbon\Carbon::parse($loan->return_date)->format('d F Y') }}</td>
    
                                </tr>
    
                                <tr>
    
                                    <th>Tanggal Aktual Kembali</th>
    
                                    <td>
    
                                        @if ($loan->actual_return_date)
    
                                            {{ \Carbon\Carbon::parse($loan->actual_return_date)->format('d F Y') }}
    
                                        @else
    
                                            -
    
                                        @endif
    
                                    </td>
    
                                </tr>
    
                                <tr>
    
                                    <th>Status</th>
    
                                    <td>
    
                                        @if ($loan->status == 'Dipinjam')
    
                                            <span class="badge bg-warning">{{ $loan->status }}</span>
    
                                        @else
    
                                            <span class="badge bg-success">{{ $loan->status }}</span>
    
                                        @endif
    
                                    </td>
    
                                </tr>
    
                            </tbody>
    
                        </table>
    
                    </div>
    
                </div>
    
            </div>
    
    
    
            {{-- KOLOM KANAN: DETAIL BARANG --}}
    
            <div class="col-md-6">
    
                <div class="card">
    
                    <div class="card-body">
    
                        <h5 class="card-title fw-semibold mb-4">Detail Barang</h5>
    
                        @if ($loan->item->photo)
    
                            <div class="mb-3 text-center">
    
                                <img src="{{ asset('photos/' . $loan->item->photo) }}" alt="Foto Barang" class="img-fluid rounded" style="max-height: 200px;">
    
                            </div>
    
                        @endif
    
                        <table class="table table-striped table-bordered-0">
    
                            <tbody>
    
                                <tr>
    
                                    <th>Nama Barang</th>
    
                                    <td>{{ $loan->item->name }}</td>
    
                                </tr>
    
                                <tr>
    
                                    <th>Kategori</th>
    
                                    <td>{{ $loan->item->category->name }}</td>
    
                                </tr>
    
                                <tr>
    
                                    <th>Kode Unik</th>
    
                                    <td>{{ $loan->item->unique_code }}</td>
    
                                </tr>
    
                                <tr>
    
                                    <th>Kondisi</th>
    
                                    <td>{{ $loan->item->condition }}</td>
    
                                </tr>
    
                            </tbody>
    
                        </table>
    
                    </div>
    
                </div>
    
            </div>
    
        </div>
    
    
    
        {{-- TOMBOL AKSI --}}
    
        <div class="card">
    
            <div class="card-body">
    
                <div class="mt-3 d-flex justify-content-between">
    
                    <a href="{{ route('loan.index') }}" class="btn btn-warning">Kembali</a>
    
            
    
                    {{-- Tombol ini hanya muncul jika status masih 'Dipinjam' --}}
    
                    @if ($loan->status == 'Dipinjam')
    
                        <form action="#" method="POST">
    
                            @csrf
    
                            <button type="submit" class="btn btn-success">Kembalikan Barang</button>
    
                        </form>
    
                    @endif
    
                </div>
    
            </div>
    
        </div>
    
    @endsection
    
    
    
    @section('js')
    
        {{-- JS Tambahan --}}
    
    @endsection







 

Langkah 16: Menambahkan Tombol Aksi 'Detail' di Halaman Index

Agar bisa masuk ke halaman detail, kita akan menambahkan tombol "Detail" di halaman daftar peminjaman, di samping tombol "Ubah" dan "Hapus".

  1. Buka file resources/views/admin/loan/index.blade.php.


     
  2. Cari <td> yang berisi tombol-tombol aksi di dalam perulangan @foreach.


     
  3. Tambahkan tombol "Detail" di depan tombol "Ubah".

     
  • SEBELUM:
    
    <td>
        <a href="{{ route('loan.edit', $loan->id) }}" class="btn btn-warning btn-sm">Ubah</a>
    
        <form ... > ... </form>
    
    </td>

     

  • SESUDAH:
     
    <td>
        <a href="{{ route('loan.show', $loan->id) }}" class="btn btn-info btn-sm">Detail</a>
    
        <a href="{{ route('loan.edit', $loan->id) }}" class="btn btn-warning btn-sm">Ubah</a>
    
        <form id="deleteForm{{ $loan->id }}"
    
            action="{{ route('loan.destroy', $loan->id) }}" method="POST" class="d-inline">
    
            @csrf
    
            @method('DELETE')
    
            <button type="button" class="btn btn-danger btn-sm"
    
                onclick="confirmDelete({{ $loan->id }})">Hapus</button>
    
        </form>
    
    </td>

 

Langkah 17: Membuat Logika Pengembalian Barang

Sekarang kita akan membuat tombol "Kembalikan Barang" di halaman detail berfungsi. Ini memerlukan route khusus dan method baru di controller.

  1. Membuat Rute Khusus:
    • Buka file routes/web.php.


       
    • Di bawah Route::resource('loan', ...) di dalam grup middleware, tambahkan satu rute baru untuk aksi pengembalian.
      Route::middleware('auth')->group(function () {
          // ...
      
          Route::resource('loan', LoanController::class);
      
          Route::put('loan/{loan}/return', [LoanController::class, 'returnItem'])->name('loan.return');
      
      });
      

 

  1. Menulis Logika di Controller:
    • Buka app/Http/Controllers/LoanController.php.


       
    • Tambahkan method baru bernama returnItem di dalam kelasnya.
       
      public function returnItem(Loan $loan)
      {
      
          // 1. Gunakan Route Model Binding, variabel $loan sudah siap pakai.
      //    Tidak perlu lagi mencari manual dengan findOrFail().
      
          // 2. Cek apakah barang sudah pernah dikembalikan.
      
          if ($loan->status == 'Dikembalikan') {
      
              return redirect()->route('loan.index')->with([
      
                  'status' => 'info',
      
                  'title' => 'Informasi',
      
                  'message' => 'Barang ini sudah dikembalikan sebelumnya.'
      
              ]);
      
          }
      
      
      
          // 3. Update status peminjaman dan tanggal pengembalian aktual.
      
          $loan->status = 'Dikembalikan';
      
          $loan->actual_return_date = now();
      
          $updateProcess = $loan->save();
      
      
      
          // 4. Redirect dengan pesan status berdasarkan hasil proses simpan.
      
          if ($updateProcess) {
      
              return redirect()->route('loan.index')->with([
      
                  'status' => 'success',
      
                  'title' => 'Berhasil',
      
                  'message' => 'Barang telah berhasil dikembalikan!'
      
              ]);
      
          } else {
      
              return redirect()->route('loan.index')->with([
      
                  'status' => 'danger',
      
                  'title' => 'Gagal',
      
                  'message' => 'Proses pengembalian barang gagal.'
      
              ]);
      
          }
      
      }



       
  2. Menghubungkan Tombol ke Rute Baru:
    • Buka kembali file halaman detail di resources/views/admin/loan/show.blade.php.


       
    • Cari <form> untuk tombol "Kembalikan Barang".


       
    • Sesuaikan action-nya dan tambahkan @method('PUT').
      <form action="{{ route('loan.return', $loan->id) }}" method="POST">
          @csrf
      
          @method('PUT')
      
          <button type="submit" class="btn btn-success">Kembalikan Barang</button>
      
      </form>

 

Langkah 18: Uji Coba Fitur Pengembalian

Saatnya menguji keseluruhan alur dari fitur baru kita.

  1. Buka browser Anda dan pergi ke halaman daftar "Peminjaman".


     
  2. Klik tombol "Detail" (berwarna biru) pada salah satu data yang statusnya masih "Dipinjam".
  3. Anda akan masuk ke halaman detail. Perhatikan bahwa tombol "Kembalikan Barang" muncul.




     
  4. Klik tombol "Kembalikan Barang".
  5. Hasil:
    • Anda akan diarahkan kembali ke halaman daftar "Peminjaman".
    • Sebuah notifikasi SweetAlert "Barang telah berhasil dikembalikan!" akan muncul.


       
    • Status peminjaman untuk data tersebut di tabel akan berubah menjadi "Dikembalikan" dengan badge berwarna hijau.


       
    • Jika Anda mengklik "Detail" lagi pada data yang sama, tombol "Kembalikan Barang" sekarang sudah tidak ada.


       

Selamat! Anda telah berhasil membangun fungsionalitas CRUD yang lengkap, ditambah dengan fitur kustom untuk proses bisnis spesifik (pengembalian barang). Ini adalah pencapaian besar dalam bagian MEMBUAT HALAMAN TRANSAKSI PEMINJAMAN (LOAN).

 

Artikel Lainnya Dengan Kategori Terkait :


1. Inventaris Lab Laravel 12 : Bagian #01 - INSTALASI LARAGON, PHP, PHPMYADMIN & LARAVEL

2. Inventaris Lab Laravel 12 : Bagian #02 - KONFIGURASI DATABASE & FONDASI PROYEK

3. Inventaris Lab Laravel 12 : Bagian #03 - MEMBANGUN HALAMAN ADMIN DENGAN BLADE TEMPLATING

4. Inventaris Lab Laravel 12 : Bagian #04 - MEMBUAT HALAMAN DASHBOARD DINAMIS

5. Inventaris Lab Laravel 12 : Bagian #05 - MEMBUAT HALAMAN CRUD USERS

6. Inventaris Lab Laravel 12 : Bagian #06 - MEMBUAT FITUR AUTENTIKASI (LOGIN) & PENYESUAIAN UI

7. Inventaris Lab Laravel 12 : Bagian #07 - MEMBUAT HALAMAN CRUD CATEGORY

8. Inventaris Lab Laravel 12 : Bagian #08 - MEMBUAT HALAMAN CRUD ITEM

9. Inventaris Lab Laravel 12 : Bagian #09 - MEMBUAT HALAMAN TRANSAKSI PEMINJAMAN (LOAN)

10. Inventaris Lab Laravel 12 : Bagian #10 - HAK AKSES (AUTHORIZATION) & HALAMAN SISWA

Masuk Terlebih dahulu untuk berkomentar

Paling baru
Lihat Lainnya