diff --git a/app/Http/Controllers/Kasir/Menu.php b/app/Http/Controllers/Kasir/Menu.php
index eb105ab..3ad368b 100644
--- a/app/Http/Controllers/Kasir/Menu.php
+++ b/app/Http/Controllers/Kasir/Menu.php
@@ -3,6 +3,8 @@
 namespace App\Http\Controllers\Kasir;
 
 use App\Http\Controllers\Controller;
+use App\Models\KategoriProduk;
+use App\Models\KelompokKategori;
 use App\Models\Pesanan;
 use App\Models\Produk;
 use Illuminate\Http\Request;
@@ -11,7 +13,15 @@ class Menu extends Controller
 {
     public function index()
     {
-        return view('pages.Menu.index');
+        $kategori_produks = KategoriProduk::get();
+
+        return view('pages.Menu.index', compact('kategori_produks'));
+    }
+
+    public function kelompokKategori($id) {
+        $kelompok_kategoris = KelompokKategori::where('kategori_produk_id', $id)->first();
+        
+        return $kelompok_kategoris;
     }
 
     public function getDataMenu()
@@ -35,4 +45,7 @@ class Menu extends Controller
             ->rawColumns(['nomor', 'kode_produk', 'ubah'])
             ->make(true);
     }
+    public function store() {
+
+    } 
 }
diff --git a/resources/views/layouts/base.blade.php b/resources/views/layouts/base.blade.php
index 3cddfd8..95886fd 100644
--- a/resources/views/layouts/base.blade.php
+++ b/resources/views/layouts/base.blade.php
@@ -18,6 +18,7 @@ scratch. This page gets rid of all links and provides the needed markup only.
     <link rel="stylesheet" href="{{ asset('assets/plugins/fontawesome-free/css/fontawesome.min.css') }}">
     <link rel="stylesheet" href="{{ asset('assets/plugins/fontawesome-free/css/all.min.css') }}">
     <link rel="stylesheet" href="{{ asset('assets/plugins/fontawesome-free/css/solid.min.css') }}">
+    @stack('style2')
     <!-- Theme style -->
     <link rel="stylesheet" href="{{ asset('assets/dist/css/adminlte.min.css') }}">
 
diff --git a/resources/views/pages/History/js.blade.php b/resources/views/pages/History/js.blade.php
index 008230b..d52ad3a 100644
--- a/resources/views/pages/History/js.blade.php
+++ b/resources/views/pages/History/js.blade.php
@@ -133,7 +133,8 @@
     <script>
         function print(id) {
             var url = "{{ route('history.print', '') }}/" + id + '?print=true'
-            window.open(url, '_blank');
+            // window.open(url, '_blank');
+            window.open(url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=900,height=600");
         }
     </script>
     <script>
diff --git a/resources/views/pages/Kasir/js.blade.php b/resources/views/pages/Kasir/js.blade.php
index 9b648a6..2e4860b 100644
--- a/resources/views/pages/Kasir/js.blade.php
+++ b/resources/views/pages/Kasir/js.blade.php
@@ -70,19 +70,22 @@
     <script>
         function printDapurTigaKali(id) {
             var url = "{{ route('transaksi.printDapurTigaKali', '') }}/" + id + '?print=true'
-            window.open(url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");
+            window.open(url, '_blank');
+            // window.open(result.url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=900,height=600");
             location.reload(true);
         }
 
         function printDapurDuaKali(id) {
             var url = "{{ route('transaksi.printDapurDuaKali', '') }}/" + id + '?print=true'
-            window.open(url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");
+            window.open(url, '_blank');
+            // window.open(result.url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=900,height=600");
             location.reload(true);
         }
 
         function printDapurSatuKali(id) {
             var url = "{{ route('transaksi.printDapurSatuKali', '') }}/" + id + '?print=true'
-            window.open(url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");
+            window.open(url, '_blank');
+            // window.open(result.url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=900,height=600");
             location.reload(true);
         }
     </script>
@@ -379,8 +382,7 @@
             var diskonSatuan = table.rows[index].getAttribute('data-diskon-satuan');
             var total = table.rows[index].getAttribute('data-total');
             var harga = table.rows[index].getAttribute('data-harga');
-            var valueKeterangan = table.rows[index].cells[0].getElementsByTagName('input')[0].getAttribute(
-                'data-keterangan');
+            var valueKeterangan = table.rows[index].cells[0].getElementsByTagName('input')[0].getAttribute('data-keterangan');
 
             qty = parseInt(qty) + 1;
             var totalLama = parseInt(total) + parseInt(harga);
@@ -392,15 +394,14 @@
             table.rows[index].setAttribute('data-total', totalLama);
 
             table.rows[index].cells[0].innerHTML = `
-            <td>
-                ${nama_produk}
-                <br>
-                ${(diskonSatuan > 0) ? '<small class="text-primary"><s>Rp. ' + (harga * qty) + '</s></small> | <small class="text-danger">Rp. ' + total + '</small>' : '<small class="text-primary">Rp. ' + totalLama + '</small>'}
-                <div class="input-group input-group-sm mt-1">
-                    <input type="text" name="keterangan_satuan" data-keterangan="${valueKeterangan}" value="${valueKeterangan}" class="form-control rounded-0" placeholder="Keterangan..">
-                </div>
-            </td>
-        `;
+                <td>
+                    ${nama_produk}
+                    <br>
+                    ${(diskonSatuan > 0) ? '<small class="text-primary"><s>Rp. ' + (harga * qty) + '</s></small> | <small class="text-danger">Rp. ' + total + '</small>' : '<small class="text-primary">Rp. ' + totalLama + '</small>'}
+                    <div class="input-group input-group-sm mt-1">
+                        <input type="text" name="keterangan_satuan" data-keterangan="${valueKeterangan}" value="${valueKeterangan}" class="form-control rounded-0" placeholder="Keterangan..">
+                    </div>
+                </td>`;
 
             table.rows[index].cells[1].innerHTML = `
                 <td class="text-center">
@@ -413,8 +414,7 @@
                             <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${params}, '${nama_produk}')">+</button>
                         </span>
                     </div>
-                </td>
-            `;
+                </td>`;
 
             calculateTotal();
         }
@@ -702,7 +702,8 @@
                         toastr.success(result.message, 'Success', {
                             timeOut: 2000
                         });
-                        window.open(result.url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");
+                        window.open(result.url, '_blank');
+                        // window.open(result.url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=900,height=600");
 
                         setTimeout(function() {
                             window.location.reload(1);
@@ -829,7 +830,8 @@
                         toastr.success(result.message, 'Success', {
                             timeOut: 2000
                         });
-                        window.open(result.url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");
+                        window.open(result.url, '_blank');
+                        // window.open(result.url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=900,height=600");
 
                         setTimeout(function() {
                             window.location.reload(1);
diff --git a/resources/views/pages/Kasir/transaksi.blade.php b/resources/views/pages/Kasir/transaksi.blade.php
index 742c8a4..6c03cb1 100644
--- a/resources/views/pages/Kasir/transaksi.blade.php
+++ b/resources/views/pages/Kasir/transaksi.blade.php
@@ -46,7 +46,7 @@
                                     aria-labelledby="custom-tabs-four-{{ $item->kode_kelompok_kategori }}-tab">
                                     <div class="row">
                                         @if ($item->kode_kelompok_kategori == 'PAK-SKOM')
-                                            <div class="col-lg-12 col-md-6 col-sm-6" style="padding: 0px">
+                                            <div class="col-lg-12 col-md-12 col-sm-12" style="padding: 0px">
                                                 <div class="row" style="padding: 0px">
                                                     <div class="col-xl-3 col-lg-4 col-md-4 col-sm-3"
                                                         style="margin-left: 0px;padding-left: 0px;">
@@ -105,7 +105,7 @@
                                                                         @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
                                                                             @if ($kelompokKategoriPivot->produk->urutan == 1)
                                                                                 <div
-                                                                                    class="col-xl-4 col-lg-6 col-md-4 col-sm-4">
+                                                                                    class="col-xl-4 col-lg-6 col-md-12 col-sm-6">
                                                                                     <div onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} );changeTab('vert-tabs-telur')"
                                                                                         class="card card-warning card-outline btn">
                                                                                         <div class="card-header">
@@ -135,7 +135,7 @@
                                                                         @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
                                                                             @if ($kelompokKategoriPivot->produk->urutan == 2)
                                                                                 <div
-                                                                                    class="col-xl-4 col-lg-6 col-md-4 col-sm-4">
+                                                                                    class="col-xl-4 col-lg-6 col-md-12 col-sm-6">
                                                                                     <div onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} );changeTab('vert-tabs-sambel')"
                                                                                         class="card card-warning card-outline btn">
                                                                                         <div class="card-header">
@@ -165,7 +165,7 @@
                                                                         @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
                                                                             @if ($kelompokKategoriPivot->produk->urutan == 3)
                                                                                 <div
-                                                                                    class="col-xl-4 col-lg-6 col-md-4 col-sm-4">
+                                                                                    class="col-xl-4 col-lg-6 col-md-12 col-sm-6">
                                                                                     <div onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} );changeTab('vert-tabs-topping')"
                                                                                         class="card card-warning card-outline btn">
                                                                                         <div class="card-header">
@@ -195,7 +195,7 @@
                                                                         @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
                                                                             @if ($kelompokKategoriPivot->produk->urutan == 4)
                                                                                 <div
-                                                                                    class="col-xl-4 col-lg-6 col-md-4 col-sm-4">
+                                                                                    class="col-xl-4 col-lg-6 col-md-12 col-sm-6">
                                                                                     <div onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} );changeTab('vert-tabs-free')"
                                                                                         class="card card-warning card-outline btn">
                                                                                         <div class="card-header">
@@ -224,7 +224,7 @@
                                                                         @foreach ($item->kelompokKategoriPivot as $key2 => $kelompokKategoriPivot)
                                                                             @if ($kelompokKategoriPivot->produk->urutan == 5)
                                                                                 <div
-                                                                                    class="col-xl-4 col-lg-6 col-md-4 col-sm-4">
+                                                                                    class="col-xl-4 col-lg-6 col-md-12 col-sm-6">
                                                                                     <div onclick="selectPaket( {{ $kelompokKategoriPivot->produk }} )"
                                                                                         class="card card-warning card-outline btn">
                                                                                         <div class="card-header">
diff --git a/resources/views/pages/Menu/index.blade.php b/resources/views/pages/Menu/index.blade.php
index 522032d..de80739 100644
--- a/resources/views/pages/Menu/index.blade.php
+++ b/resources/views/pages/Menu/index.blade.php
@@ -57,30 +57,61 @@
 </div>
 
 <!-- Modal Tambah Menu -->
-<div class="modal fade" id="modal-default">
-    <div class="modal-dialog modal-lg">
+<div class="modal fade" id="modal-default" data-backdrop="static">
+    <div class="modal-dialog modal-lg modal-dialog-centered">
         <div class="modal-content">
             <div class="modal-header">
-                <h4 class="modal-title">Default Modal</h4>
+                <h4 class="modal-title">Tambah Menu</h4>
                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                     <span aria-hidden="true">&times;</span>
                 </button>
             </div>
             <div class="modal-body">
                 <form>
-                    <div class="form-group">
-                        <label for="recipient-name" class="col-form-label">Recipient:</label>
-                        <input type="text" class="form-control" id="recipient-name">
+                    <div class="form-group row">
+                        <div class="col-md-6">
+                            <label for="kategori_produk" class="col-form-label">Kategori Produk:</label>
+                            <select type="text" class="form-control select2" id="kategori_produk" name="kategori_produk" onchange="kelompokKategori(this.value)">
+                                <option value="">Pilih Kategori</option>
+                                @foreach ($kategori_produks as $kategori)
+                                <option value="{{ $kategori->id }}">{{ $kategori->nama_kategori_produk }}</option>
+                                @endforeach
+                            </select>
+                        </div>
+                        <div class="col-md-6">
+                            <label for="kelompok_produk" class="col-form-label">Kelompok Produk:</label>
+                            <input type="text" class="form-control" id="kelompok_produk" name="kelompok_produk" value="">
+                        </div>
+                    </div>
+                    <div class="form-group row">
+                        <div class="col-md-6">
+                            <label for="kode_produk" class="col-form-label">Kode Produk:</label>
+                            <input type="text" class="form-control" id="kode_produk" name="kode_produk" value="">
+                        </div>
+                        <div class="col-md-6">
+                            <label for="nama_produk" class="col-form-label">Nama Produk:</label>
+                            <input type="text" class="form-control" id="nama_produk" name="nama_produk" value="">
+                        </div>
+                    </div>
+                    <div class="form-group row">
+                        <div class="col-md-6">
+                            <label for="harga_produk" class="col-form-label">Harga Produk:</label>
+                            <input type="number" class="form-control" id="harga_produk" name="harga_produk" value="">
+                        </div>
+                        <div class="col-md-6">
+                            <label for="stok_produk" class="col-form-label">Stok Produk:</label>
+                            <input type="text" class="form-control" id="stok_produk" name="stok_produk" value="">
+                        </div>
                     </div>
                     <div class="form-group">
-                        <label for="message-text" class="col-form-label">Message:</label>
-                        <textarea class="form-control" id="message-text"></textarea>
+                        <label for="deskripsi_produk" class="col-form-label">Deskripsi Produk:</label>
+                        <textarea class="form-control" id="deskripsi_produk" name="deskripsi_produk"></textarea>
                     </div>
                 </form>
             </div>
-            <div class="modal-footer justify-content-between">
-                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
-                <button type="button" class="btn btn-primary">Save changes</button>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-default" data-dismiss="modal">Tutup</button>
+                <button type="button" class="btn btn-primary">Simpan</button>
             </div>
         </div>
     </div>
@@ -106,8 +137,15 @@
 <link rel="stylesheet" href="{{asset('assets/datatables/datatables.min.css')}}">
 @endpush
 
+@push('style2')
+<link rel="stylesheet" href="{{ asset('assets/plugins/select2/css/select2.min.css') }}">
+<link rel="stylesheet" href="{{ asset('assets/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css') }}">
+@endpush
+
 @push('scripts')
 <script src="{{ asset('assets/datatables/datatables.min.js') }}"></script>
+<script src="{{ asset('assets/plugins/select2/js/select2.full.min.js') }}"></script>
+<script src="{{ asset('assets/plugins/toastr/toastr.min.js') }}"></script>
 <script>
     $(document).ready(function() {
         $('#tabelku').DataTable({
@@ -145,4 +183,51 @@
         })
     })
 </script>
+<script>
+    $('.select2').select2();
+
+    function kelompokKategori(id) {
+        $.ajax({
+            url: "{{ route('menu.kelompok-kategori', '') }}/" + id,
+            method: "GET",
+            success: function(result) {
+                console.log(result);
+            },
+            error: function(xhr, status, error) {
+                toastr.error(xhr.responseJSON.message, 'Error', {
+                    timeOut: 3000
+                });
+            }
+        })
+    }
+
+    // function tambah() {
+    //     var data = {
+    //         _token: "{{ csrf_token() }}",
+    //         orderMenus: orderMenus,
+    //     };
+
+    //     $.ajax({
+    //         url: "{{ route('menu.store') }}",
+    //         method: "POST",
+    //         data: data,
+    //         success: function(result) {
+    //             toastr.success(result.message, 'Success', {
+    //                 timeOut: 2000
+    //             });
+    //             window.open(result.url, '_blank');
+    //             // window.open(result.url, '_blank', "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=900,height=600");
+
+    //             setTimeout(function() {
+    //                 window.location.reload(1);
+    //             }, 1000);
+    //         },
+    //         error: function(xhr, status, error) {
+    //             toastr.error(xhr.responseJSON.message, 'Error', {
+    //                 timeOut: 3000
+    //             });
+    //         }
+    //     });
+    // }
+</script>
 @endpush
\ No newline at end of file
diff --git a/routes/web.php b/routes/web.php
index b5775e5..21f05e4 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -54,7 +54,9 @@ Route::group(['middleware' => ['auth', 'permission']], function () {
     });
 
     Route::group(['prefix' => 'menu'], function () {
-        Route::get('/', [Menu::class, 'index'])->name('menu.index')->comment("Halaman Menu");
+        Route::resource('menu', Menu::class);
+        // Route::get('/', [Menu::class, 'index'])->name('menu.index')->comment("Halaman Menu");
+        Route::get('/kelompok-kategori/{id}', [Menu::class, 'kelompokKategori'])->name('menu.kelompok-kategori')->comment("Ambil Data Kelompok Kategori");
         Route::get('/getDataMenu', [Menu::class, 'getDataMenu'])->name('menu.getDataMenu')->comment("Ambil data Menu");
     });