diff --git a/resources/views/pages/Kasir/js.blade.php b/resources/views/pages/Kasir/js.blade.php
index 3d5e4b8..e81a3c4 100644
--- a/resources/views/pages/Kasir/js.blade.php
+++ b/resources/views/pages/Kasir/js.blade.php
@@ -724,7 +724,6 @@
                             timeOut: 2000
                         });
                         // location.reload();
-                        // window.open(result.url, '_blank');
                         window.open(result.url, '_blank',
                             "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=900,height=600"
                         );
diff --git a/resources/views/pages/Kasir/js_baru.blade.php b/resources/views/pages/Kasir/js_baru.blade.php
index 0b5e31a..15d7d62 100644
--- a/resources/views/pages/Kasir/js_baru.blade.php
+++ b/resources/views/pages/Kasir/js_baru.blade.php
@@ -14,7 +14,8 @@
             // adda nama menu to h5 wich id is menu-utama-yang-terpilih
             document.getElementById('menu-utama-yang-terpilih').innerHTML = namaMenu;
             // add total harga menu to input with id total-harga-menu-ini
-            document.getElementById('harga-menu-utama-yang-terpilih').innerHTML = totalHargaMenuIni;
+            document.getElementById('harga-menu-utama-yang-terpilih').innerHTML = totalHargaMenuIni +
+                '     ';
 
 
             // remove all li element in extra-menu-choised
@@ -25,13 +26,18 @@
                 const element = arrayExtraMenuChoised[index];
                 console.log(element.parent);
                 if (element.parent == globalId) {
-                    htmlnyayaini = `<li>
-                                <div class="row" style="justify-content: space-between;">
-                                    <input type="hidden" id="the-id-extra-menu-choised${globalId}" value="${element.id}">
-                                    <h5 id="the-menu-extra-menu-choised${globalId}">${element.nama_produk}</h5>
-                                    <h6 id="harga-extra-menu-choised${globalId}">${element.harga_produk}</h6>
-                                </div>
-                            </li>`;
+                    htmlnyayaini = `<li  id="linyaygdihapus${element.id}-${globalId}">
+                                        <div class="row" style="justify-content: space-between;">
+                                            <input type="hidden" id="the-id-extra-menu-choised${globalId}" value="${element.id}">
+                                            <h5 id="the-menu-extra-menu-choised${globalId}">${element.nama_produk}</h5>
+                                            <div class="row" style="align-items:center;">
+                                                <h6 id="harga-extra-menu-choised${globalId}" style="padding:0px;margin:0px">${element.harga_produk}</h6>
+                                                <button type="button" class="btn btn-default btn-xs" style="margin-left:4px" onclick="deleteAdditionalExtraMenu(${element.id}, '${globalId}', '${element.harga_produk}')">
+                                                    <i class="fas fa-trash"></i>
+                                                </button>
+                                            </div>
+                                        </div>
+                                    </li>`;
                     document.getElementById('extra-menu-choised').innerHTML += htmlnyayaini;
 
                 }
@@ -41,11 +47,16 @@
         function pesanExtra(params) {
             console.log(params);
             jsonParams = JSON.stringify(params);
-            htmlnyayaini = `<li>
+            htmlnyayaini = `<li id="linyaygdihapus${params.id}">
                                 <div class="row" style="justify-content: space-between;">
                                     <input type="hidden" id="id-extra-menu-choised" value="${params.id}">
                                     <h5 id="menu-extra-menu-choised">${params.nama_produk}</h5>
-                                    <h6 id="harga-extra-menu-choised">${params.harga_produk}</h6>
+                                    <div class="row" style="align-items:center;">
+                                        <h6 id="harga-extra-menu-choised" style="padding:0px;margin:0px">${params.harga_produk}</h6>
+                                        <button type="button" class="btn btn-default btn-xs" style="margin-left:4px" onclick="deleteAdditionalExtraMenu(${params.id})">
+                                            <i class="fas fa-trash"></i>
+                                        </button>
+                                    </div>
                                 </div>
                             </li>`;
             // get element by id
@@ -61,6 +72,14 @@
             // get all li element in extraMenuChoised
             var li = extraMenuChoised.getElementsByTagName('li');
 
+            // remove all li element in the-extra-menu-choised
+            document.getElementById('the-extra-menu-choised' + idTableRowExtra.value).innerHTML = '';
+
+            // remove all element in arrayExtraMenuChoised where parent is idTableRowExtra.value
+            arrayExtraMenuChoised = arrayExtraMenuChoised.filter(function(el) {
+                return el.parent !== idTableRowExtra.value;
+            });
+
             // loop through all li element
             for (let i = 0; i < li.length; i++) {
                 // get id-extra-menu-choised element
@@ -74,12 +93,7 @@
                                 <div class="row" style="justify-content: space-between;">
                                     <input type="hidden" id="the-id-extra-menu-choised${idTableRowExtra.value}" value="${idExtraMenuChoised.value}">
                                     <small id="the-menu-extra-menu-choised${idTableRowExtra.value}">${menuExtraMenuChoised.innerText}</small>
-                                    <div class="row">
-                                        <small id="the-harga-extra-menu-choised${idTableRowExtra.value}" style="margin: 0px;align-self: center;padding: 0px;">${hargaExtraMenuChoised.innerText}</small>
-                                        <button type="button" class="btn btn-default btn-xs" style="margin-left:4px">
-                                            <i class="fas fa-trash" onclick="deleteAdditionalExtraMenu(${idExtraMenuChoised.value}, '${idTableRowExtra.value}', '${hargaExtraMenuChoised.innerText}')"></i>
-                                        </button>
-                                    </div>
+                                    <small id="the-harga-extra-menu-choised${idTableRowExtra.value}" style="margin: 0px;align-self: center;padding: 0px;">${hargaExtraMenuChoised.innerText}</small>
                                 </div>
                             </li>`;
                 document.getElementById('the-extra-menu-choised' + idTableRowExtra.value).innerHTML += htmlnyayaini;
@@ -133,12 +147,7 @@
                         <div class="row" style="justify-content: space-between;">
                             <input type="hidden" id="the-id-extra-menu-choised${i.parent}" value="${i.id}">
                             <small id="the-menu-extra-menu-choised${i.parent}">${i.nama_produk}</small>
-                            <div class="row">
-                                <small id="the-harga-extra-menu-choised${i.parent}" style="margin: 0px;align-self: center;padding: 0px;">${i.harga_produk}</small>
-                                <button type="button" class="btn btn-default btn-xs" style="margin-left:4px">
-                                    <i class="fas fa-trash" onclick="deleteAdditionalExtraMenu(${i.id}, '${i.parent}', '${i.harga_produk}')"></i>
-                                </button>
-                            </div>
+                            <small id="the-harga-extra-menu-choised${i.parent}" style="margin: 0px;align-self: center;padding: 0px;">${i.harga_produk}</small>
                         </div>
                     </li>
                 `);
@@ -149,32 +158,40 @@
         }
         loadAdditionalFromLocalStorage();
 
-        function deleteAdditionalExtraMenu(id, parent, harga) {
-            console.log(id);
-            // get index of arrayExtraMenuChoised
-            var index = arrayExtraMenuChoised.findIndex(x => x.id == id);
-            // remove element from arrayExtraMenuChoised
-            arrayExtraMenuChoised.splice(index, 1);
-            // get element by id
-            var element = document.getElementById('linyaini' + id + parent);
-            // remove element from DOM
-            console.log(element);
-            element.remove();
-            // recalculate total
-            // Mendapatkan semua elemen <tr> dalam tabel dengan id 'tbody-order-menus'
-            var tableRowsNya = document.querySelectorAll('#tbody-order-menus tr');
+        function deleteAdditionalExtraMenu(id, parent = null, harga = null) {
+            console.log(id + ' ' + parent + ' ' + harga);
 
-            // Iterasi melalui setiap elemen <tr> dan mencetak nilai atribut 'data-total'
-            tableRowsNya.forEach(function(row) {
-                var rownya = row.getAttribute('data-row-id');
-                var dataTotal = row.getAttribute('data-total');
-                dataTotal = parseInt(dataTotal) - parseInt(harga);
-                if (rownya == parent) {
-                    row.setAttribute('data-total', dataTotal);
-                    document.getElementById('price' + parent).innerHTML = 'Rp. ' + dataTotal;
-                }
-            });
-            calculateTotal();
+            if (parent == null) {
+                var element = document.getElementById('linyaygdihapus' + id);
+                element.remove();
+            } else {
+                // console.log(id);
+                // // get index of arrayExtraMenuChoised
+                // var index = arrayExtraMenuChoised.findIndex(x => x.id == id);
+                // // remove element from arrayExtraMenuChoised
+                // arrayExtraMenuChoised.splice(index, 1);
+                // get element by id
+                console.log('linyaygdihapus' + id + '-' + parent);
+                var element = document.getElementById('linyaygdihapus' + id + '-' + parent);
+                // remove element from DOM
+                // console.log(element);
+                element.remove();
+                // // recalculate total
+                // // Mendapatkan semua elemen <tr> dalam tabel dengan id 'tbody-order-menus'
+                // var tableRowsNya = document.querySelectorAll('#tbody-order-menus tr');
+
+                // // Iterasi melalui setiap elemen <tr> dan mencetak nilai atribut 'data-total'
+                // tableRowsNya.forEach(function(row) {
+                //     var rownya = row.getAttribute('data-row-id');
+                //     var dataTotal = row.getAttribute('data-total');
+                //     dataTotal = parseInt(dataTotal) - parseInt(harga);
+                //     if (rownya == parent) {
+                //         row.setAttribute('data-total', dataTotal);
+                //         document.getElementById('price' + parent).innerHTML = 'Rp. ' + dataTotal;
+                //     }
+                // });
+            }
+            // calculateTotal();
         }
     </script>
 @endpush
diff --git a/resources/views/pages/Kasir/js_baru_tmbl hapus di tabel kanan .blade.php b/resources/views/pages/Kasir/js_baru_tmbl hapus di tabel kanan .blade.php
new file mode 100644
index 0000000..0b5e31a
--- /dev/null
+++ b/resources/views/pages/Kasir/js_baru_tmbl hapus di tabel kanan .blade.php	
@@ -0,0 +1,180 @@
+@push('scripts')
+    <script type="text/javascript">
+        $(document).ready(function() {
+
+        });
+        // create array to store all extra menu choised
+        var arrayExtraMenuChoised = [];
+
+        function setIdRowTable(globalId, namaMenu, totalHargaMenuIni) {
+            console.log(globalId);
+            console.log(namaMenu);
+            console.log(totalHargaMenuIni);
+            document.getElementById('id-table-row-extra').value = globalId;
+            // adda nama menu to h5 wich id is menu-utama-yang-terpilih
+            document.getElementById('menu-utama-yang-terpilih').innerHTML = namaMenu;
+            // add total harga menu to input with id total-harga-menu-ini
+            document.getElementById('harga-menu-utama-yang-terpilih').innerHTML = totalHargaMenuIni;
+
+
+            // remove all li element in extra-menu-choised
+            var extraMenuChoised = document.getElementById('extra-menu-choised');
+            extraMenuChoised.innerHTML = '';
+
+            for (let index = 0; index < arrayExtraMenuChoised.length; index++) {
+                const element = arrayExtraMenuChoised[index];
+                console.log(element.parent);
+                if (element.parent == globalId) {
+                    htmlnyayaini = `<li>
+                                <div class="row" style="justify-content: space-between;">
+                                    <input type="hidden" id="the-id-extra-menu-choised${globalId}" value="${element.id}">
+                                    <h5 id="the-menu-extra-menu-choised${globalId}">${element.nama_produk}</h5>
+                                    <h6 id="harga-extra-menu-choised${globalId}">${element.harga_produk}</h6>
+                                </div>
+                            </li>`;
+                    document.getElementById('extra-menu-choised').innerHTML += htmlnyayaini;
+
+                }
+            }
+        }
+
+        function pesanExtra(params) {
+            console.log(params);
+            jsonParams = JSON.stringify(params);
+            htmlnyayaini = `<li>
+                                <div class="row" style="justify-content: space-between;">
+                                    <input type="hidden" id="id-extra-menu-choised" value="${params.id}">
+                                    <h5 id="menu-extra-menu-choised">${params.nama_produk}</h5>
+                                    <h6 id="harga-extra-menu-choised">${params.harga_produk}</h6>
+                                </div>
+                            </li>`;
+            // get element by id
+            var extraMenuChoised = document.getElementById('extra-menu-choised');
+            // append htmlnyayaini to extraMenuChoised
+            extraMenuChoised.innerHTML += htmlnyayaini;
+        }
+
+        function simpanPesananExtra() {
+            var idTableRowExtra = document.getElementById('id-table-row-extra');
+            // get extra-menu-choised element
+            var extraMenuChoised = document.getElementById('extra-menu-choised');
+            // get all li element in extraMenuChoised
+            var li = extraMenuChoised.getElementsByTagName('li');
+
+            // loop through all li element
+            for (let i = 0; i < li.length; i++) {
+                // get id-extra-menu-choised element
+                var idExtraMenuChoised = li[i].getElementsByTagName('input')[0];
+                // get menu-extra-menu-choised element
+                var menuExtraMenuChoised = li[i].getElementsByTagName('h5')[0];
+                // get harga-extra-menu-choised element
+                var hargaExtraMenuChoised = li[i].getElementsByTagName('h6')[0];
+
+                htmlnyayaini = `<li style="margin:10px" id="linyaini${idExtraMenuChoised.value}${idTableRowExtra.value}">
+                                <div class="row" style="justify-content: space-between;">
+                                    <input type="hidden" id="the-id-extra-menu-choised${idTableRowExtra.value}" value="${idExtraMenuChoised.value}">
+                                    <small id="the-menu-extra-menu-choised${idTableRowExtra.value}">${menuExtraMenuChoised.innerText}</small>
+                                    <div class="row">
+                                        <small id="the-harga-extra-menu-choised${idTableRowExtra.value}" style="margin: 0px;align-self: center;padding: 0px;">${hargaExtraMenuChoised.innerText}</small>
+                                        <button type="button" class="btn btn-default btn-xs" style="margin-left:4px">
+                                            <i class="fas fa-trash" onclick="deleteAdditionalExtraMenu(${idExtraMenuChoised.value}, '${idTableRowExtra.value}', '${hargaExtraMenuChoised.innerText}')"></i>
+                                        </button>
+                                    </div>
+                                </div>
+                            </li>`;
+                document.getElementById('the-extra-menu-choised' + idTableRowExtra.value).innerHTML += htmlnyayaini;
+
+                // push extra menu choised to extraMenuChoised array
+                arrayExtraMenuChoised.push({
+                    parent: idTableRowExtra.value,
+                    id: idExtraMenuChoised.value,
+                    nama_produk: menuExtraMenuChoised.innerText,
+                    harga_produk: hargaExtraMenuChoised.innerText
+                });
+            }
+            calculationMenuUtamaDenganExtraMenu();
+            // log extraMenuChoised
+            console.log(arrayExtraMenuChoised);
+        }
+
+        function calculationMenuUtamaDenganExtraMenu() {
+            for (let index = 0; index < arrayExtraMenuChoised.length; index++) {
+                const element = arrayExtraMenuChoised[index];
+
+                // Mendapatkan semua elemen <tr> dalam tabel dengan id 'tbody-order-menus'
+                var tableRowsNya = document.querySelectorAll('#tbody-order-menus tr');
+
+                // Iterasi melalui setiap elemen <tr> dan mencetak nilai atribut 'data-total'
+                tableRowsNya.forEach(function(row) {
+                    var rownya = row.getAttribute('data-row-id');
+                    var dataTotal = row.getAttribute('data-total');
+                    dataTotal = parseInt(dataTotal) + parseInt(element.harga_produk);
+                    if (rownya == element.parent) {
+                        row.setAttribute('data-total', dataTotal);
+                        document.getElementById('price' + element.parent).innerHTML = 'Rp. ' + dataTotal;
+                    }
+                });
+            }
+
+            calculateTotal();
+        }
+
+        function loadAdditionalFromLocalStorage() {
+            var data = localStorage.getItem('AdditionalStorage');
+            if (data === null || data === undefined) {
+                return false;
+            }
+            data = JSON.parse(data);
+            arrayExtraMenuChoised = data.arrayExtraMenuChoised;
+            // console.log(arrayExtraMenuChoised);
+            arrayExtraMenuChoised.forEach((i, key) => {
+                $('#the-extra-menu-choised' + i.parent).append(`
+                    <li style="margin:10px" id="linyaini${i.id}${i.parent}">
+                        <div class="row" style="justify-content: space-between;">
+                            <input type="hidden" id="the-id-extra-menu-choised${i.parent}" value="${i.id}">
+                            <small id="the-menu-extra-menu-choised${i.parent}">${i.nama_produk}</small>
+                            <div class="row">
+                                <small id="the-harga-extra-menu-choised${i.parent}" style="margin: 0px;align-self: center;padding: 0px;">${i.harga_produk}</small>
+                                <button type="button" class="btn btn-default btn-xs" style="margin-left:4px">
+                                    <i class="fas fa-trash" onclick="deleteAdditionalExtraMenu(${i.id}, '${i.parent}', '${i.harga_produk}')"></i>
+                                </button>
+                            </div>
+                        </div>
+                    </li>
+                `);
+            });
+
+            // set total extra menu
+            calculationMenuUtamaDenganExtraMenu();
+        }
+        loadAdditionalFromLocalStorage();
+
+        function deleteAdditionalExtraMenu(id, parent, harga) {
+            console.log(id);
+            // get index of arrayExtraMenuChoised
+            var index = arrayExtraMenuChoised.findIndex(x => x.id == id);
+            // remove element from arrayExtraMenuChoised
+            arrayExtraMenuChoised.splice(index, 1);
+            // get element by id
+            var element = document.getElementById('linyaini' + id + parent);
+            // remove element from DOM
+            console.log(element);
+            element.remove();
+            // recalculate total
+            // Mendapatkan semua elemen <tr> dalam tabel dengan id 'tbody-order-menus'
+            var tableRowsNya = document.querySelectorAll('#tbody-order-menus tr');
+
+            // Iterasi melalui setiap elemen <tr> dan mencetak nilai atribut 'data-total'
+            tableRowsNya.forEach(function(row) {
+                var rownya = row.getAttribute('data-row-id');
+                var dataTotal = row.getAttribute('data-total');
+                dataTotal = parseInt(dataTotal) - parseInt(harga);
+                if (rownya == parent) {
+                    row.setAttribute('data-total', dataTotal);
+                    document.getElementById('price' + parent).innerHTML = 'Rp. ' + dataTotal;
+                }
+            });
+            calculateTotal();
+        }
+    </script>
+@endpush
diff --git a/resources/views/pages/Kasir/modal_extra.blade.php b/resources/views/pages/Kasir/modal_extra.blade.php
index 07069b7..72735b2 100644
--- a/resources/views/pages/Kasir/modal_extra.blade.php
+++ b/resources/views/pages/Kasir/modal_extra.blade.php
@@ -1,5 +1,5 @@
 <div class="modal fade" id="modal-add-extra">
-    <div class="modal-dialog modal-lg">
+    <div class="modal-dialog modal-xl">
         <div class="modal-content">
             <div class="modal-header">
                 <h4 class="modal-title">Pilih Extra Topping</h4>
diff --git a/resources/views/pages/Kasir/print_dapur.blade.php b/resources/views/pages/Kasir/print_dapur.blade.php
index 643fdab..599c409 100644
--- a/resources/views/pages/Kasir/print_dapur.blade.php
+++ b/resources/views/pages/Kasir/print_dapur.blade.php
@@ -150,7 +150,6 @@
                     </tr>
                     @php
                         $tampungid;
-
                     @endphp
                     @foreach ($pesanan->detailPesanan as $item2)
                         @if ($item2->id_parent !== null && $item2->id_parent == $item->id)