kategori.blade.php

@extends('layouts.main')

@section('title', 'Kategori')

@section('container')
    <div class="app-content content">
        <div class="content-overlay"></div>
        <div class="content-wrapper">
            <div class="content-header row">
            </div>
            <div class="content-body">
                <!-- users list start -->
                <section class="users-list-wrapper">
                    <div class="pb-3">
                        <button type="button" class="btn btn-success" data-toggle="modal" data-target="#tambahkategori">+ Tambah Data</button>
                    </div>
                    <div class="users-list-table">
                        <div class="card">
                            <div class="card-content">
                                <div class="card-body">
                                    <!-- datatable start -->
                                    <div class="table-responsive">
                                        <table id="users-list-datatable" class="table">
                                            <thead>
                                                <tr>
                                                    <th>No</th>
                                                    <th>Nama</th>
                                                    <th>Aksi</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <?php $no = 1; ?>
                                                @foreach ($data as $item)
                                                    @php
                                                        $token=Str::random(10);
                                                    @endphp
                                                <tr>
                                                    <td>{!! $no++ !!}</td>
                                                    <td>{{ $item->nama }}</td>
                                                    <td>
                                                        <button type="button" class="btn btn-warning btn-sm" data-toggle="modal" data-target="#modal{{$token}}">Edit</button>
                                                        <a class="btn btn-danger btn-sm" id="btn_delete" href="{{ route('kategori.delete', ['id' => $item->id ]) }}" onclick="return confirm('Anda yakin untuk menghapus data ini?');" data-file="{{$item->id}}">Hapus</a>
                                                        {{-- modal edit --}}
                                                        <div class="modal fade" id="modal{{$token}}">
                                                            <div class="modal-dialog">
                                                                <div class="modal-content">
                                                                    <div class="modal-header">
                                                                        <h4 class="modal-title bold">Ubah Kategori</h4>
                                                                    </div>
                                                                    <form method="POST"  action="{{ route('kategori.update', ['id' => $item->id ]) }}" enctype="multipart/form-data">
                                                                        @csrf
                                                                        @method('put')
                                                                        <div class="modal-body">
                                                                            <div class="form-group">
                                                                                <label for="">Nama Kategori</label>
                                                                                <input type="form" class="form-control" id="nama" name="nama" value="{{$item->nama}}">
                                                                            </div>
                                                                        </div>
                                                                        <div class="modal-footer">
                                                                            <button type="submit" class="btn btn-primary ml-1">Ubah</button>
                                                                            <button type="button" class="btn btn-light-secondary" data-dismiss="modal">Batal</button>
                                                                        </div>
                                                                    </form>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                                @endforeach
                                            </tbody>  
                                        </table>
                                    </div>
                                    <!-- datatable ends -->
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
                <!-- users list ends -->
            </div>
        </div>
    </div>
@endsection

{{-- modal create --}}
<div class="modal fade" id="tambahkategori">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title bold">Tambah Kategori</h4>
            </div>
            <form method="POST"  action="{{ route('kategori.create') }}" enctype="multipart/form-data">
                @csrf
                @method('post')
                <div class="modal-body">
                    <div class="form-group">
                        <label for="">Nama Kategori</label>
                        <input type="form" class="form-control" id="nama" name="nama">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary ml-1">Simpan</button>
                    <button type="button" class="btn btn-light-secondary" data-dismiss="modal">Batal</button>
                </div>
            </form>
        </div>
    </div>
</div>