From 747c9cf771b6d38b7095c51ccd4e8e8f9d7c51ee Mon Sep 17 00:00:00 2001
From: mikhailkusuma <whatxwrong@gmail.com>
Date: Mon, 19 Feb 2024 20:58:45 +0700
Subject: [PATCH] Save data order to Local Storage
---
resources/views/pages/Kasir/js.blade.php | 310 ++++++++++++------
.../views/pages/Kasir/transaksi.blade.php | 5 +-
2 files changed, 213 insertions(+), 102 deletions(-)
diff --git a/resources/views/pages/Kasir/js.blade.php b/resources/views/pages/Kasir/js.blade.php
index 6d11623..0ccac40 100644
--- a/resources/views/pages/Kasir/js.blade.php
+++ b/resources/views/pages/Kasir/js.blade.php
@@ -16,6 +16,8 @@
})
</script>
<script src="{{ asset('assets/datatables/datatables.min.js') }}"></script>
+
+ <!-- Action for a table -->
<script>
$(document).ready(function() {
$('#tabelku').DataTable({
@@ -67,6 +69,8 @@
})
})
</script>
+
+ <!-- Action Print -->
<script>
function printDapurTigaKali(id) {
var url = "{{ route('transaksi.printDapurTigaKali', '') }}/" + id + '?print=true'
@@ -89,6 +93,7 @@
location.reload(true);
}
</script>
+
<script>
// set interval waktu pesanan
function showTime() {
@@ -187,26 +192,26 @@
}
table.rows[index].cells[0].innerHTML = `
- <td>
- ${params.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="" class="form-control rounded-3" placeholder="Keterangan.." value='${paketFreenyaini}'>
- </div>
- </td>
+ <td>
+ ${params.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="" class="form-control rounded-3" placeholder="Keterangan.." value='${paketFreenyaini}'>
+ </div>
+ </td>
`;
} else {
table.rows[index].cells[0].innerHTML = `
- <td>
- ${params.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="" class="form-control rounded-3" placeholder="Keterangan..">
- </div>
- </td>
- `;
+ <td>
+ ${params.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="" class="form-control rounded-3" placeholder="Keterangan..">
+ </div>
+ </td>
+ `;
}
table.rows[index].cells[1].innerHTML = `
@@ -252,80 +257,80 @@
paketFreenyaini = paketFreenya.join(', ');
}
$('#tbody-order-menus').append(`
- <tr id="row-${params.id}" data-id="${params.id}" data-row-id="${globalId}" data-nama="${params.nama_produk}" data-harga="${params.harga_produk}" data-qty="1" data-diskon-satuan="0" data-total="${params.harga_produk}">
- <td>
- ${params.nama_produk}
- <br>
- <small class="text-primary">Rp. ${params.harga_produk}</small>
- <div class="input-group input-group-sm mt-1">
- <input type="text" name="keterangan_satuan" class="form-control rounded-3" data-keterangan="${paketFreenyaini}" placeholder="Keterangan.." value="${paketFreenyaini}">
- </div>
- </td>
- <td class="text-center">
- <div class="input-group input-group-sm">
- <span class="input-group-append">
- <button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${globalId}, '${params.nama_produk}')"><b>-</b></button>
- </span>
- <input type="text" name="bayar" class="form-control rounded-3" readonly value="${menuQty}">
- <span class="input-group-append">
- <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${globalId}, '${params.nama_produk}')">+</button>
- </span>
- </div>
- <select name="status_pesanan_dinein" id="status_pesanan_dinein" class="custom-select-mystyle form-control-border">
- <option value="2" selected>Dine In</option>
- <option value="0">Take Away</option>
- </select>
- </td>
- <td class="text-center">
- <div class="input-group input-group-sm">
- <input type="number" name="diskon_satuan" oninput="inputNum(this)" class="form-control rounded-3" value="0" onkeyup="diskonSatuanMenu(${globalId}, '${params.nama_produk}', this.value)">
- </div>
- </td>
- <td class="text-center">
- <button class="btn btn-danger btn-sm" onclick="deleteMenu(${globalId})">
- <i class="fas fa-trash"></i>
- </button>
- </td>
- </tr>
- `);
+ <tr id="row-${params.id}" data-id="${params.id}" data-row-id="${globalId}" data-nama="${params.nama_produk}" data-harga="${params.harga_produk}" data-qty="1" data-diskon-satuan="0" data-total="${params.harga_produk}">
+ <td>
+ ${params.nama_produk}
+ <br>
+ <small class="text-primary">Rp. ${params.harga_produk}</small>
+ <div class="input-group input-group-sm mt-1">
+ <input type="text" name="keterangan_satuan" class="form-control rounded-3" data-keterangan="${paketFreenyaini}" placeholder="Keterangan.." value="${paketFreenyaini}">
+ </div>
+ </td>
+ <td class="text-center">
+ <div class="input-group input-group-sm">
+ <span class="input-group-append">
+ <button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${globalId}, '${params.nama_produk}')"><b>-</b></button>
+ </span>
+ <input type="text" name="bayar" class="form-control rounded-3" readonly value="${menuQty}">
+ <span class="input-group-append">
+ <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${globalId}, '${params.nama_produk}')">+</button>
+ </span>
+ </div>
+ <select name="status_pesanan_dinein" id="status_pesanan_dinein" class="custom-select-mystyle form-control-border">
+ <option value="2" selected>Dine In</option>
+ <option value="0">Take Away</option>
+ </select>
+ </td>
+ <td class="text-center">
+ <div class="input-group input-group-sm">
+ <input type="number" name="diskon_satuan" oninput="inputNum(this)" class="form-control rounded-3" value="0" onkeyup="diskonSatuanMenu(${globalId}, '${params.nama_produk}', this.value)">
+ </div>
+ </td>
+ <td class="text-center">
+ <button class="btn btn-danger btn-sm" onclick="deleteMenu(${globalId})">
+ <i class="fas fa-trash"></i>
+ </button>
+ </td>
+ </tr>
+ `);
} else {
$('#tbody-order-menus').append(`
- <tr id="row-${params.id}" data-id="${params.id}" data-row-id="${globalId}" data-nama="${params.nama_produk}" data-harga="${params.harga_produk}" data-qty="1" data-diskon-satuan="0" data-total="${params.harga_produk}">
- <td>
- ${params.nama_produk}
- <br>
- <small class="text-primary">Rp. ${params.harga_produk}</small>
- <div class="input-group input-group-sm mt-1">
- <input type="text" name="keterangan_satuan" data-keterangan="" class="form-control rounded-3" placeholder="Keterangan..">
- </div>
- </td>
- <td class="text-center">
- <div class="input-group input-group-sm">
- <span class="input-group-append">
- <button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${globalId}, '${params.nama_produk}')"><b>-</b></button>
- </span>
- <input type="text" name="bayar" class="form-control rounded-3" readonly value="${menuQty}">
- <span class="input-group-append">
- <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${globalId}, '${params.nama_produk}')">+</button>
- </span>
- </div>
- <select name="status_pesanan_dinein" id="status_pesanan_dinein" class="custom-select-mystyle form-control-border">
- <option value="2" selected>Dine In</option>
- <option value="0">Take Away</option>
- </select>
- </td>
- <td class="text-center">
- <div class="input-group input-group-sm">
- <input type="number" name="diskon_satuan" oninput="inputNum(this)" class="form-control rounded-3" value="0" onkeyup="diskonSatuanMenu(${globalId}, '${params.nama_produk}', this.value)">
- </div>
- </td>
- <td class="text-center">
- <button class="btn btn-danger btn-sm" onclick="deleteMenu(${globalId})">
- <i class="fas fa-trash"></i>
- </button>
- </td>
- </tr>
- `);
+ <tr id="row-${params.id}" data-id="${params.id}" data-row-id="${globalId}" data-nama="${params.nama_produk}" data-harga="${params.harga_produk}" data-qty="1" data-diskon-satuan="0" data-total="${params.harga_produk}">
+ <td>
+ ${params.nama_produk}
+ <br>
+ <small class="text-primary">Rp. ${params.harga_produk}</small>
+ <div class="input-group input-group-sm mt-1">
+ <input type="text" name="keterangan_satuan" data-keterangan="" class="form-control rounded-3" placeholder="Keterangan..">
+ </div>
+ </td>
+ <td class="text-center">
+ <div class="input-group input-group-sm">
+ <span class="input-group-append">
+ <button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${globalId}, '${params.nama_produk}')"><b>-</b></button>
+ </span>
+ <input type="text" name="bayar" class="form-control rounded-3" readonly value="${menuQty}">
+ <span class="input-group-append">
+ <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${globalId}, '${params.nama_produk}')">+</button>
+ </span>
+ </div>
+ <select name="status_pesanan_dinein" id="status_pesanan_dinein" class="custom-select-mystyle form-control-border">
+ <option value="2" selected>Dine In</option>
+ <option value="0">Take Away</option>
+ </select>
+ </td>
+ <td class="text-center">
+ <div class="input-group input-group-sm">
+ <input type="number" name="diskon_satuan" oninput="inputNum(this)" class="form-control rounded-3" value="0" onkeyup="diskonSatuanMenu(${globalId}, '${params.nama_produk}', this.value)">
+ </div>
+ </td>
+ <td class="text-center">
+ <button class="btn btn-danger btn-sm" onclick="deleteMenu(${globalId})">
+ <i class="fas fa-trash"></i>
+ </button>
+ </td>
+ </tr>
+ `);
}
calculateTotal();
@@ -478,15 +483,15 @@
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-3" 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-3" placeholder="Keterangan..">
+ </div>
+ </td>
+ `;
table.rows[index].cells[1].innerHTML = `
<td class="text-center">
@@ -725,7 +730,7 @@
document.getElementById('pesan-bayar-tunai').disabled = false;
return false;
}
-
+
var data = {
_token: "{{ csrf_token() }}",
orderCode: "{{ $orderCode }}",
@@ -1113,3 +1118,110 @@
}
}
</script>
+
+ <!-- Action save to storage -->
+ <script>
+ function OrderStorage() {
+ var table = document.getElementById("order-menus");
+ var orderMenus = [];
+
+ for (var i = 1, row; row = table.rows[i]; i++) {
+ var id = row.getAttribute('data-id');
+ var nama = row.getAttribute('data-nama');
+ var qty = row.getAttribute('data-qty');
+ var diskonSatuan = row.getAttribute('data-diskon-satuan');
+ var harga = row.getAttribute('data-harga');
+ var total = row.getAttribute('data-total');
+ if (diskonSatuan != 0 && diskonSatuan != null && diskonSatuan != undefined) {
+ total = total - (total * (diskonSatuan / 100));
+ } else {
+ total = total
+ }
+
+ if (id != null || qty != null || total != null) {
+ orderMenus.push({
+ id: id,
+ nama: nama,
+ qty: qty,
+ diskonSatuan: diskonSatuan,
+ harga: harga,
+ total: total,
+ keterangan: document.getElementsByName('keterangan_satuan')[i - 1].value,
+ status_pesanan_dinein: document.getElementsByName('status_pesanan_dinein')[i - 1].value
+ });
+ }
+ }
+
+ let json = JSON.stringify({
+ name: 'Data Pesanan',
+ nama_pemesan: document.getElementsByName('nama-pemesan')[0].value,
+ nomor_pemesan: document.getElementsByName('nomor-pemesan')[0].value,
+ nomor_meja: document.getElementsByName('nomor-meja')[0].value,
+ keterangan_pesanan: document.getElementsByName('keterangan-pesanan')[0].value,
+ orderMenus
+ });
+
+ localStorage.setItem('OrderStorage', json);
+ }
+
+ function showOrderStorage(){
+ let data = JSON.parse(localStorage.OrderStorage);
+
+ document.getElementsByName('nama-pemesan')[0].value = data.nama_pemesan,
+ document.getElementsByName('nomor-pemesan')[0].value = data.nomor_pemesan,
+ document.getElementsByName('nomor-meja')[0].value = data.nomor_meja,
+ document.getElementsByName('keterangan-pesanan')[0].value = data.keterangan_pesanan,
+
+ console.log(data);
+
+ data.orderMenus.forEach((i, key) => {
+ globalId++;
+
+ $('#tbody-order-menus').append(`
+ <tr id="row-${i.id}" data-id="${i.id}" data-row-id="${globalId}" data-nama="${i.nama}" data-harga="${i.harga}" data-qty="${i.qty}" data-diskon-satuan="${i.diskonSatuan}" data-total="${i.harga * i.qty}">
+ <td>
+ ${i.nama}
+ <br>
+ ${(parseInt(i.diskonSatuan) > 0) ? '<small class="text-primary"><s>Rp. ' + (i.harga * i.qty) + '</s></small> | <small class="text-danger">Rp. ' + ((i.harga * i.qty) - ((i.harga * i.qty) * (i.diskonSatuan / 100))) + '</small>' : '<small class="text-primary">Rp. ' + (i.harga * i.qty) + '</small>'}
+ <div class="input-group input-group-sm mt-1">
+ <input type="text" name="keterangan_satuan" class="form-control rounded-3" data-keterangan="${i.keterangan}" placeholder="Keterangan.." value="${i.keterangan}">
+ </div>
+ </td>
+ <td class="text-center">
+ <div class="input-group input-group-sm">
+ <span class="input-group-append">
+ <button type="button" class="btn btn-default btn-xs btn-flat" onclick="decrementMenu(${globalId}, '${i.nama}')"><b>-</b></button>
+ </span>
+ <input type="text" name="bayar" class="form-control rounded-3" readonly value="${i.qty}">
+ <span class="input-group-append">
+ <button type="button" class="btn btn-default btn-xs btn-flat" onclick="incrementMenu(${globalId}, '${i.nama}')">+</button>
+ </span>
+ </div>
+ <select name="status_pesanan_dinein" id="status_pesanan_dinein" class="custom-select-mystyle form-control-border">
+ <option value="2" ${(i.status_pesanan_dinein == 2) ? 'selected' : ''}>Dine In</option>
+ <option value="0" ${(i.status_pesanan_dinein == 0) ? 'selected' : ''}>Take Away</option>
+ </select>
+ </td>
+ <td class="text-center">
+ <div class="input-group input-group-sm">
+ <input type="number" name="diskon_satuan" oninput="inputNum(this)" class="form-control rounded-3" value="${i.diskonSatuan}" onkeyup="diskonSatuanMenu(${globalId}, '${i.nama}', this.value)">
+ </div>
+ </td>
+ <td class="text-center">
+ <button class="btn btn-danger btn-sm" onclick="deleteMenu(${globalId})">
+ <i class="fas fa-trash"></i>
+ </button>
+ </td>
+ </tr>
+ `);
+ });
+
+ calculateTotal();
+ }
+
+ showOrderStorage();
+
+ // show time every second
+ setInterval(OrderStorage, 1000);
+ </script>
+@endpush
\ No newline at end of file
diff --git a/resources/views/pages/Kasir/transaksi.blade.php b/resources/views/pages/Kasir/transaksi.blade.php
index 3b0de96..fd3beeb 100644
--- a/resources/views/pages/Kasir/transaksi.blade.php
+++ b/resources/views/pages/Kasir/transaksi.blade.php
@@ -581,11 +581,10 @@
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
- background-color: cyan;
+ background-color: white;
+ margin-top: 8px;
}
</style>
@endpush
@include('pages.Kasir.js')
-
-@endpush