diff --git a/app/Models/Sale.php b/app/Models/Sale.php
index 6c47f59..b707b70 100644
--- a/app/Models/Sale.php
+++ b/app/Models/Sale.php
@@ -8,6 +8,7 @@ class Sale extends Model
         'code',
         'date',
         'customer_id',
+        'total'
     ];
 
     public function customer()
diff --git a/database/migrations/2023_05_03_164004_create_sales_table.php b/database/migrations/2023_05_03_164004_create_sales_table.php
index 51a5bab..c5abc99 100644
--- a/database/migrations/2023_05_03_164004_create_sales_table.php
+++ b/database/migrations/2023_05_03_164004_create_sales_table.php
@@ -16,6 +16,7 @@ return new class extends Migration
             $table->string('code');
             $table->timestamp('date')->nullable();
             $table->uuid('customer_id')->nullable();
+            $table->decimal('total', 14, 2)->default(0);
             $table->timestamps();
             $table->softDeletes();
             $table->uuid('created_by')->nullable();
diff --git a/database/seeders/DummySeeder.php b/database/seeders/DummySeeder.php
index 36b5322..d99e823 100644
--- a/database/seeders/DummySeeder.php
+++ b/database/seeders/DummySeeder.php
@@ -21,7 +21,13 @@ class DummySeeder extends Seeder
             $category = Category::create(['name' => $cat]);
         }
 
-        foreach(['Roti Tawar', 'Indomie', 'Telur Omega 3'] as $prod) {
+        foreach([
+            'Roti Tawar', 
+            'Indomie', 
+            'Telur Omega 3',
+            'Enervonche',
+            'Teh Olong'
+        ] as $prod) {
             Product::create([
                 'code' => Str::upper(Str::random(6)),
                 'name' => $prod,
diff --git a/resources/js/Components/FormInput.jsx b/resources/js/Components/FormInput.jsx
index 41073e8..5abf753 100644
--- a/resources/js/Components/FormInput.jsx
+++ b/resources/js/Components/FormInput.jsx
@@ -1,7 +1,7 @@
 import React from "react";
 import Input from "./Input";
 
-export default function FormInput({ type, name, onChange, value, label, className, error, autoComplete, autoFocus, placeholder, disabled, readOnly}) {
+export default function FormInput({ type, name, onChange, value, label, className, error, autoComplete, autoFocus, placeholder, disabled, readOnly, min = null }) {
     return (
         <div className={className}>
             <label htmlFor="first_name" className="block mb-2 text-sm font-medium text-gray-900 dark:text-white">{label}</label>
@@ -16,6 +16,7 @@ export default function FormInput({ type, name, onChange, value, label, classNam
                 placeholder={placeholder}
                 disabled={disabled}
                 readOnly={readOnly}
+                min={min}
             />
         </div>
     )
diff --git a/resources/js/Components/FormInputDate.jsx b/resources/js/Components/FormInputDate.jsx
index c7c3be8..ad2c87e 100644
--- a/resources/js/Components/FormInputDate.jsx
+++ b/resources/js/Components/FormInputDate.jsx
@@ -2,7 +2,7 @@ import React from "react";
 import DatePicker from "react-datepicker";
 import { converToDate, dateToString } from "@/utils";
 
-export default function FormInputDate({ selected, onChange, label = '', error }) {
+export default function FormInputDate({ selected, onChange, label = '', error, placeholder = '' }) {
     return (
         <div>
             {label !== '' && (
@@ -19,6 +19,7 @@ export default function FormInputDate({ selected, onChange, label = '', error })
                 previousMonthButtonLabel="<"
                 nextYearButtonLabel=">"
                 previousYearButtonLabel="<"
+                placeholderText={placeholder}
             />
             {error && (
                 <p className="mb-2 text-sm text-red-600 dark:text-red-500">{error}</p>
diff --git a/resources/js/Components/Input.jsx b/resources/js/Components/Input.jsx
index 1e64a6a..481d688 100644
--- a/resources/js/Components/Input.jsx
+++ b/resources/js/Components/Input.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-export default function Input({ type = 'text', name, onChange, value, error = "", autoComplete = false, autoFocus = false, placeholder , className ,disabled, readOnly}) {
+export default function Input({ type = 'text', name, onChange, value, error = "", autoComplete = false, autoFocus = false, placeholder , className ,disabled, readOnly, min }) {
     return (
         <>
             <input 
@@ -14,6 +14,7 @@ export default function Input({ type = 'text', name, onChange, value, error = ""
                 placeholder={placeholder}
                 disabled={disabled}
                 readOnly={readOnly}
+                min={min}
             />
             {error && (
                 <p className="mb-2 text-sm text-red-600 dark:text-red-500">{error}</p>
diff --git a/resources/js/Layouts/Partials/routes.js b/resources/js/Layouts/Partials/routes.js
index 9d25498..8e07633 100644
--- a/resources/js/Layouts/Partials/routes.js
+++ b/resources/js/Layouts/Partials/routes.js
@@ -4,7 +4,7 @@ import {
     HiUsers,
     HiUserGroup,
     HiViewList,
-    HiCurrencyDollar,
+    HiOutlineCash,
 } from "react-icons/hi";
 
 export default [
@@ -19,10 +19,10 @@ export default [
     {
         name: "Transaksi Penjualan",
         show: true,
-        icon: HiCurrencyDollar,
-        route: route("category.index"),
-        active: "category.*",
-        permission: "view-category",
+        icon: HiOutlineCash,
+        route: route("sale.index"),
+        active: "sale.*",
+        permission: "view-sale",
     },
     {
         name: "Kategori",
diff --git a/resources/js/Pages/Customer/SelectionInput.jsx b/resources/js/Pages/Customer/SelectionInput.jsx
index 42b3581..d89089f 100644
--- a/resources/js/Pages/Customer/SelectionInput.jsx
+++ b/resources/js/Pages/Customer/SelectionInput.jsx
@@ -78,7 +78,7 @@ export default function SelectionInput(props) {
 
     const fetch = (q = '') => {
         setLoading(true)
-        axios.get(route('api.office.index', { 'q': q, 'all': all }), {
+        axios.get(route('api.customer.index', { 'q': q, 'all': all }), {
             headers: {
                 'Content-Type': 'application/json',
                 'Authorization': 'Bearer ' + auth.user.jwt_token
diff --git a/routes/api.php b/routes/api.php
index 921a652..ab7f24a 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -1,6 +1,7 @@
 <?php
 
 use App\Http\Controllers\Api\CategoryController;
+use App\Http\Controllers\Api\CustomerController;
 use App\Http\Controllers\Api\RoleController;
 use Illuminate\Http\Request;
 use Illuminate\Support\Facades\Route;
@@ -21,4 +22,5 @@ Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
 });
 
 Route::get('/categories', [CategoryController::class, 'index'])->name('api.category.index');
+Route::get('/customers', [CustomerController::class, 'index'])->name('api.customer.index');
 Route::get('/roles', [RoleController::class, 'index'])->name('api.role.index');
diff --git a/routes/web.php b/routes/web.php
index 878ba0a..58af926 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -7,6 +7,7 @@ use App\Http\Controllers\UserController;
 use App\Http\Controllers\CategoryController;
 use App\Http\Controllers\CustomerController;
 use App\Http\Controllers\ProductController;
+use App\Http\Controllers\SaleController;
 use Illuminate\Support\Facades\Route;
 
 /*
@@ -54,6 +55,13 @@ Route::middleware(['auth'])->group(function () {
     Route::post('/products', [ProductController::class, 'store'])->name('product.store');
     Route::put('/products/{product}', [ProductController::class, 'update'])->name('product.update');
     Route::delete('/products/{product}', [ProductController::class, 'destroy'])->name('product.destroy');
+
+    // Sale
+    Route::get('/sales', [SaleController::class, 'index'])->name('sale.index');
+    Route::get('/sales/create', [SaleController::class, 'create'])->name('sale.create');
+    Route::post('/sales', [SaleController::class, 'store'])->name('sale.store');
+    Route::get('/sales/{sale}', [SaleController::class, 'show'])->name('sale.show');
+    Route::delete('/sales/{sale}', [SaleController::class, 'destroy'])->name('sale.destroy');
 });
 
 Route::middleware('auth')->group(function () {