martabak-grand/resources/views/pages/Kasir/js_baru.blade.php

178 lines
9.5 KiB
PHP

@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 +
'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;';
// 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 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;
}
}
}
function pesanExtra(params) {
console.log(params);
jsonParams = JSON.stringify(params);
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>
<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
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');
// 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
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>
<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;
// 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() {
// 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 harga = row.getAttribute('data-harga');
var tampungdataharga = 0;
for (let index = 0; index < arrayExtraMenuChoised.length; index++) {
const element = arrayExtraMenuChoised[index];
if (rownya == element.parent) {
tampungdataharga += parseInt(element.harga_produk);
}
}
// Mengatur nilai atribut 'data-total' dari setiap elemen <tr> dengan
// nilai yang dihitung sebelumnya
harganya = parseInt(harga) + parseInt(tampungdataharga);
row.setAttribute('data-total', (harganya));
document.getElementById('price' + rownya).innerHTML = 'Rp. ' + (harganya);
});
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>
<small id="the-harga-extra-menu-choised${i.parent}" style="margin: 0px;align-self: center;padding: 0px;">${i.harga_produk}</small>
</div>
</li>
`);
});
// set total extra menu
calculationMenuUtamaDenganExtraMenu();
}
loadAdditionalFromLocalStorage();
function deleteAdditionalExtraMenu(id, parent = null, harga = null) {
console.log(id + ' ' + parent + ' ' + harga);
if (parent == null) {
var element = document.getElementById('linyaygdihapus' + id);
element.remove();
} else {
console.log('linyaygdihapus' + id + '-' + parent);
var element = document.getElementById('linyaygdihapus' + id + '-' + parent);
element.remove();
}
}
</script>
@endpush