Pendahuluan
Setelah sekian lama jeda karena tidak dapat kesempatan untuk menulis, sehingga ada beberapa part konsep dari artikel ini yang hilang begitu saja. Maka pada kesempatan ini saya mencoba merangkai kembali dan mencoba untuk menyelesaikan artikel berseri ini guna menemani teman-teman untuk belajar membuat sebuah aplikasi dengan framework Laravel from scratch.
Dilihat dari artikel sebelumnya yang membahas tentang Membuat Aplikasi Invoice Laravel 5.7: Create Invoice, maka saya berkesimpulan bahwa artikel ini terputus pada bagian membuat invoice saja tanpa kita tahu dimana harus melihat invoice yang telah dibuat sebelumnya. So, pada seri kali ini kita akan menampilkan list dari invoice yang telah dibuat beserta halaman untuk melihat invoice tersebut.
Akan tetapi, ada komentar dari teman-teman pembaca yang bertanya, "fungsi auth apa? kok saya bisa akses halaman apapun tanpa login?" Maka artikel ini saya rangkaikan dengan authentication.
Baca Juga: Membuat Aplikasi Invoice Laravel 5.7 #4: Create Invoice
Manajemen Invoice
Untuk menampilkan list invoice agar dapat dengan mudah dilihat dan dikelola oleh user, maka caranya pun tidak jauh berbeda dari manajemen customer ataupun product. So, buka file InvoiceController.php kemudian tambahkan method berikut:
public function index()
{
$invoice = Invoice::with(['customer', 'detail'])->orderBy('created_at', 'DESC')->paginate(10);
return view('invoice.index', compact('invoice'));
}
Penjelasan: Fungsi with() untuk me-load table yang berelasi dimana customer dan detail adalah nama method yang telah didefinisikan pada model Invoice.php sebelumnya, dan fungsi ini sering disebut dengan eager loading.
Kemudian buat file index.blade.php didalam folder resources/views/invoice, kemudian tambahkan potongan code berikut:
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-header">
<div class="row">
<div class="col-md-6">
<h3 class="card-title">Manajemen Invoice</h3>
</div>
</div>
</div>
<div class="card-body">
@if (session('success'))
<div class="alert alert-success">
{!! session('success') !!}
</div>
@endif
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>Invoice ID</th>
<th>Nama Lengkap</th>
<th>No Telp</th>
<th>Total Item</th>
<th>Subtotal</th>
<th>Pajak</th>
<th>Total</th>
<th>Aksi</th>
</tr>
</thead>
<tbody>
@forelse ($invoice as $row)
<tr>
<td><strong>#{{ $row->id }}</strong></td>
<td>{{ $row->customer->name }}</td>
<td>{{ $row->customer->phone }}</td>
<td><span class="badge badge-success">{{ $row->detail->count() }} Item</span></td>
<td>Rp {{ number_format($row->total) }}</td>
<td>Rp {{ number_format($row->tax) }}</td>
<td>Rp {{ number_format($row->total_price) }}</td>
<td>
<form action="{{ route('invoice.destroy', $row->id) }}" method="POST">
@csrf
<input type="hidden" name="_method" value="DELETE">
<a href="{{ route('invoice.edit', $row->id) }}" class="btn btn-warning btn-sm">Edit</a>
<button class="btn btn-danger btn-sm">Delete</button>
</form>
</td>
</tr>
@empty
<tr>
<td colspan="8" class="text-center">Tidak ada data</td>
</tr>
@endforelse
</tbody>
</table>
<div class="float-right">
{{ $invoice->links() }}
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
Agar dapat digunakan, definisikan route-nya terlebih dahulu dengan menambahkan code berikut pada routes/web.php:
//[.. CODE SEBELUM ..]
Route::group(['prefix' => 'invoice'], function() {
//[.. CODE SEBELUM ..]
Route::get('/', 'InvoiceController@index')->name('invoice.index');
});
Jangan lupa tambahkan code berikut agar dapat ditampilkan pada menu navigasi, buka file resources/views/layouts/app.blade.php:
<!-- [.. CODE SEBELUMNYA ..] -->
<li class="nav-item">
<a href="{{ route('invoice.create') }}" class="nav-link">Buat Invoice</a>
</li>
<!-- TAMBAHKAN CODE INI -->
<li class="nav-item">
<a href="{{ route('invoice.index') }}" class="nav-link">List Invoice</a>
</li>
<!-- TAMBAHKAN CODE INI -->
<li class="nav-item">
<a href="{{ url('/customer') }}" class="nav-link">Manajemen Pelanggan</a>
</li>
<!-- [.. CODE SETELAHNYA ..] -->
Karena route invoice.destroy sudah digunakan, maka kita buat terlebih dahulu agar tidak terjadi error saat page di-load karena route name tidak terdefinisikan. Buka kembali file InvoiceController.php kemudian tambahkan code berikut:
public function destroy($id)
{
$invoice = Invoice::find($id);
$invoice->delete();
return redirect()->back()->with(['success' => 'Data telah dihapus']);
}
Kemudian buka file routes/web.php dan tambahkan code berikut:
//[.. CODE SEBELUM ..]
Route::group(['prefix' => 'invoice'], function() {
//[.. CODE SEBELUM ..]
Route::delete('/{id}/delete', 'InvoiceController@destroy')->name('invoice.destroy');
});
Baca Juga: Membuat Aplikasi Invoice Laravel 5.7 #3: Manajemen Customer
Protect with Authentication
Secara otomatis Laravel telah menyediakan fitur authentication sesuai standar yang telah ditetapkan oleh Laravel dengan menggunakan command: php artisan make:auth. Command ini telah kita jalankan pada part sebelumnya akan tetapi saya lupa tepatnya berada pada part berapa. So, tugas kita sekarang hanya membuat fungsi untuk mem-protect page sehingga hanya bisa diakses oleh user yang telah login.
Buka file routes/web.php kemudian masukkan semua code dari route yang ingin dilindungi dengan proses otentikasi terlebih dahulu kedalam route berikut:
Route::group(['middleware' => 'auth'], function() {
//[.. MASUKKAN CODE-NYA DISINI ..]
});
Sehingga hasil akhirnya akan tampak seperti berikut:
<?php
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', function () {
return view('welcome');
});
Auth::routes();
Route::get('/home', 'HomeController@index')->name('home');
//NEW CODE
Route::group(['middleware' => 'auth'], function() {
Route::group(['prefix' => 'product'], function() {
Route::get('/', 'ProductController@index');
Route::get('/new', 'ProductController@create');
Route::post('/', 'ProductController@save');
Route::get('/{id}', 'ProductController@edit');
Route::put('/{id}', 'ProductController@update');
Route::delete('/{id}', 'ProductController@destroy');
});
Route::group(['prefix' => 'customer'], function() {
Route::get('/', 'CustomerController@index');
Route::get('/new', 'CustomerController@create');
Route::post('/', 'CustomerController@save');
Route::get('/{id}', 'CustomerController@edit');
Route::put('/{id}', 'CustomerController@update');
Route::delete('/{id}', 'CustomerController@destroy');
});
Route::group(['prefix' => 'invoice'], function() {
Route::get('/', 'InvoiceController@index')->name('invoice.index');
Route::get('/new', 'InvoiceController@create')->name('invoice.create');
Route::post('/', 'InvoiceController@save')->name('invoice.store');
Route::get('/{id}', 'InvoiceController@edit')->name('invoice.edit');
Route::put('/{id}', 'InvoiceController@update')->name('invoice.update');
Route::delete('/{id}', 'InvoiceController@deleteProduct')->name('invoice.delete_product');
Route::delete('/{id}/delete', 'InvoiceController@destroy')->name('invoice.destroy');
});
});
Karena kita belum membuat fitur manajemen user, maka untuk sementara user yang akan digunakan untuk login kita buat terlebih dahulu menggunakan seeder. Untuk membuat seeds, jalankan command berikut:
php artisan make:seeder UsersTableSeeder
Kemudian buka file database/seeds/UsersTableSeeder.php, dan tambahkan code berikut:
<?php
use Illuminate\Database\Seeder;
use App\User;
class UsersTableSeeder extends Seeder
{
/**
* Run the database seeds.
*
* @return void
*/
public function run()
{
User::create([
'name' => 'anugrah sandi',
'email' => '[email protected]',
'password' => bcrypt('secret')
]);
}
}
Terakhir, jalankan command berikut untuk mengesekusi seeds diatas:
php artisan db:seed --class=UsersTableSeeder
Kesimpulan
Sepanjang artikel ini kita telah mengulas kembali bagaimana melakukan query kedatabase menggunakan Eloquent serta penggunaan eager loading. Kita juga telah belajar bagaimana menggunakan middleware, dalam hal ini adalah middleware bawaan Laravel yakni: auth. Juga kita telah belajar bagaimana membuat seeds untuk membuat dummy data.
Untuk melihat dokumentasi dari artikel ini kamu dapat dapat mengunjungi Github.
Comments