Setelah halaman transaksi dan customer sudah kita buat, sekarang kita akan membuat halaman laporan penjualan. Kita cukup membuat 1 buah controller dan 2 buah file views.
# Buat Laporan Controller
Buka terminal dan jalankan perintah
php artisan make:controller LaporanController
tekan enter dan tunggu sampai file LaporanController.php selesai dibuat. Selanjutnya buka file LaporanController.php dan isi dengan kode berikut.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class LaporanController extends Controller
{
public function index() {
$data = array('title' => 'Form Laporan Penjualan');
return view('laporan.index', $data);
}
public function proses() {
$data = array('title' => 'Laporan Penjualan');
return view('laporan.proses', $data);
}
}
# Tambahkan route laporan
Buka file routes/web.php dan tambahkan route ke form laporan dan proses laporan.
<?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('/', '[email protected]');
Route::get('/about', '[email protected]');
Route::get('/kontak', '[email protected]');
Route::get('/kategori', '[email protected]');
Route::get('/kategori/{slug}', '[email protected]');
Route::get('/produk', '[email protected]');
Route::get('/produk/{slug}', '[email protected]');
Route::group(['prefix' => 'admin'], function() {
Route::get('/', '[email protected]');
// route kategori
Route::resource('kategori', 'KategoriController');
// route produk
Route::resource('produk', 'ProdukController');
// route customer
Route::resource('customer', 'CustomerController');
// route transaksi
Route::resource('transaksi', 'TransaksiController');
// profil
Route::get('profil', '[email protected]');
// setting profil
Route::get('setting', '[email protected]');
// form laporan
Route::get('laporan', '[email protected]');
// proses laporan
Route::get('proseslaporan', '[email protected]');
});
Selanjutnya buat 2 buah file views.
# Buat file form laporan
Buat 1 buah folder baru di folder views dengan nama laporan. Pada folder laporan buat 1 buah file dengan nama index.blade.php dan isi dengan kode berikut.
@extends('layouts.dashboard')
@section('content')
<div class="container-fluid">
<div class="row">
<div class="col col-lg-4 col-md-4">
<div class="card card-primary card-outline">
<div class="card-header">
<h3 class="card-title">Form Laporan</h3>
</div>
<div class="card-body">
<form action="#">
<div class="form-group">
<label for="bulan">Bulan</label>
<select name="bulan" id="bulan" class="form-control">
<option value="1">Januari</option>
<option value="2">Februari</option>
<option value="3">Maret</option>
<option value="4">April</option>
<option value="5">Mei</option>
<option value="6">Juni</option>
<option value="7">Juli</option>
<option value="8">Agustus</option>
<option value="9">September</option>
<option value="10">Oktober</option>
<option value="11">Nopember</option>
<option value="12">Desember</option>
</select>
</div>
<div class="form-group">
<label for="tahun">Tahun</label>
<select name="tahun" id="tahun" class="form-control">
@for($a = 2019; $a <= 2050; $a++)
<option value="{{$a}}">{{$a}}</option>
@endfor
</select>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">Buka Laporan</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
Kembali ke terminal lagi dan jalankan aplikasi dengan mengetik perintah berikut.
php artisan serve
Tekan enter kemudian akses pada halaman http://localhost:8000/admin/laporan
Tampilannya akan menjadi seperti gambar di bawah ini.
# Buat file proses laporan
Setelah form laporan kita buat, selanjutnya buat 1 buah file untuk menampilkan hasil laporan. Masih di folder laporan, buat 1 buah file lagi dengan nama proses.blade.php dan isi dengan kode berikut.
@extends('layouts.dashboard')
@section('content')
<div class="container-fluid">
<div class="row">
<div class="col">
<div class="card card-primary card-outline">
<div class="card-header">
<h3 class="card-title">Laporan Penjualan</h3>
</div>
<div class="card-body">
<h3 class="text-center">Periode Bulan Januari 2021</h3>
<div class="row">
<div class="col col-lg-4 col-md-4">
<h4 class="text-center">Ringkasan Transaksi</h4>
<table class="table table-bordered">
<tbody>
<tr>
<td>Total Penjualan</td>
<td>Rp. 15.000.000</td>
</tr>
<tr>
<td>Total Transaksi</td>
<td>200 Transaksi</td>
</tr>
</tbody>
</table>
</div>
<div class="col col-lg-8 col-md-8">
<h4 class="text-center">Rincian Transaksi</h4>
<div class="table-responsive">
<table class="table table-stripped">
<thead>
<tr>
<th>No</th>
<th>Invoice</th>
<th>Subtotal</th>
<th>Ongkir</th>
<th>Diskon</th>
<th>Total</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Inv-01</td>
<td>100.000</td>
<td>27.000</td>
<td>0</td>
<td>127.000</td>
</tr>
<tr>
<td>2</td>
<td>Inv-02</td>
<td>100.000</td>
<td>27.000</td>
<td>0</td>
<td>127.000</td>
</tr>
<tr>
<td>3</td>
<td>Inv-03</td>
<td>100.000</td>
<td>27.000</td>
<td>0</td>
<td>127.000</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
Selanjutnya akses di halaman http://localhost:8000/admin/proseslaporan dan akan tampil seperti gambar
# Edit menu dashboard
Controller dan view telah kita buat, selanjutnya edit file menu dashboard agar bisa mengarah ke halaman form laporan. Buka file menudashboard.blade.php dan ubah pada bagian menu laporan -> penjualan menjadi seperti berikut.
<nav class="mt-2">
<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
<!-- Add icons to the links using the .nav-icon class
with font-awesome or any other icon font library -->
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon fas fa-th"></i>
<p>
Dashboard
</p>
</a>
</li>
<li class="nav-item has-treeview">
<a href="#" class="nav-link">
<i class="nav-icon fas fa-folder-open"></i>
<p>
Produk
<i class="right fas fa-angle-left"></i>
</p>
</a>
<ul class="nav nav-treeview">
<li class="nav-item">
<a href="{{ route('produk.index') }}" class="nav-link">
<i class="far fa-circle nav-icon"></i>
<p>Produk</p>
</a>
</li>
<li class="nav-item">
<a href="{{ route('kategori.index') }}" class="nav-link">
<i class="far fa-circle nav-icon"></i>
<p>Kategori</p>
</a>
</li>
</ul>
</li>
<li class="nav-item has-treeview">
<a href="#" class="nav-link">
<i class="nav-icon fas fa-shopping-cart"></i>
<p>
Transaksi
<i class="right fas fa-angle-left"></i>
</p>
</a>
<ul class="nav nav-treeview">
<li class="nav-item">
<a href="{{ route('transaksi.index') }}" class="nav-link">
<i class="far fa-circle nav-icon"></i>
<p>Data Transaksi</p>
</a>
</li>
</ul>
</li>
<li class="nav-item has-treeview">
<a href="#" class="nav-link">
<i class="nav-icon fas fa-folder"></i>
<p>
Data
<i class="right fas fa-angle-left"></i>
</p>
</a>
<ul class="nav nav-treeview">
<li class="nav-item">
<a href="{{ route('customer.index') }}" class="nav-link">
<i class="far fa-circle nav-icon"></i>
<p>Customer</p>
</a>
</li>
</ul>
</li>
<li class="nav-item has-treeview">
<a href="#" class="nav-link">
<i class="nav-icon fas fa-list"></i>
<p>
Laporan
<i class="right fas fa-angle-left"></i>
</p>
</a>
<ul class="nav nav-treeview">
<li class="nav-item">
<a href="{{ URL::to('admin/laporan') }}" class="nav-link">
<i class="far fa-circle nav-icon"></i>
<p>Penjualan</p>
</a>
</li>
</ul>
</li>
<li class="nav-item">
<a href="{{ URL::to('admin/profil') }}" class="nav-link">
<i class="nav-icon fas fa-users"></i>
<p>
Profil
</p>
</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">
<i class="nav-icon fas fa-sign-out-alt"></i>
<p>
Sign Out
</p>
</a>
</li>
</ul>
</nav>
Proses desain tampilan toko kita hampir selesai, masih ada 3 bagian lagi yaitu desain login, register dan reset password.