198 lines
11 KiB
PHP
198 lines
11 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 +
|
|
' ';
|
|
|
|
|
|
// 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() {
|
|
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>
|
|
<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(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
|