css reducion
This commit is contained in:
parent
5f156ab6a0
commit
b8cf13b7d5
20 changed files with 1603 additions and 1677 deletions
|
|
@ -1,48 +1,58 @@
|
|||
var subtotal = 0;
|
||||
var editingSpecialId = null;
|
||||
var activeCatalogueTags = [];
|
||||
var activeCakeTags = [];
|
||||
|
||||
// ====== Sidebar ======
|
||||
function toggleSidebar() {
|
||||
document.body.classList.toggle('sidebar-collapsed');
|
||||
localStorage.setItem('sidebarCollapsed', document.body.classList.contains('sidebar-collapsed'));
|
||||
}
|
||||
|
||||
// ====== Overlay ======
|
||||
function openSpecialCakeOverlay() {
|
||||
editingSpecialId = null;
|
||||
document.getElementById("sc-overlay-title").textContent = "Dodaj tort specjalny";
|
||||
document.getElementById("sc-name").value = "";
|
||||
document.getElementById("sc-price").value = "";
|
||||
document.getElementById("sc-size").value = "";
|
||||
document.getElementById("sc-shape").value = "";
|
||||
document.getElementById("sc-flavour").value = "";
|
||||
document.getElementById("sc-notes").value = "";
|
||||
document.getElementById("sc-new-tag").value = "";
|
||||
var cbs = document.querySelectorAll(".sc-tag-cb");
|
||||
document.getElementById('sc-overlay-title').textContent = 'Dodaj tort specjalny';
|
||||
document.getElementById('sc-name').value = '';
|
||||
document.getElementById('sc-price').value = '';
|
||||
document.getElementById('sc-size').value = '';
|
||||
document.getElementById('sc-shape').value = '';
|
||||
document.getElementById('sc-flavour').value = '';
|
||||
document.getElementById('sc-notes').value = '';
|
||||
document.getElementById('sc-new-tag').value = '';
|
||||
var cbs = document.querySelectorAll('.sc-tag-cb');
|
||||
for (var i = 0; i < cbs.length; i++) cbs[i].checked = false;
|
||||
document.getElementById("sc-overlay").classList.add("open");
|
||||
document.getElementById("sc-name").focus();
|
||||
document.getElementById('sc-overlay').classList.add('open');
|
||||
document.getElementById('sc-name').focus();
|
||||
}
|
||||
|
||||
function closeSpecialCakeOverlay() {
|
||||
document.getElementById("sc-overlay").classList.remove("open");
|
||||
document.getElementById('sc-overlay').classList.remove('open');
|
||||
editingSpecialId = null;
|
||||
}
|
||||
|
||||
function getOverlayFormData() {
|
||||
return {
|
||||
name: document.getElementById("sc-name").value.trim(),
|
||||
price: document.getElementById("sc-price").value,
|
||||
size: document.getElementById("sc-size").value.trim(),
|
||||
shape: document.getElementById("sc-shape").value,
|
||||
flavour: document.getElementById("sc-flavour").value.trim(),
|
||||
notes: document.getElementById("sc-notes").value.trim(),
|
||||
name: document.getElementById('sc-name').value.trim(),
|
||||
price: document.getElementById('sc-price').value,
|
||||
size: document.getElementById('sc-size').value.trim(),
|
||||
shape: document.getElementById('sc-shape').value,
|
||||
flavour: document.getElementById('sc-flavour').value.trim(),
|
||||
notes: document.getElementById('sc-notes').value.trim(),
|
||||
tagIds: (function() {
|
||||
var ids = [];
|
||||
var cbs = document.querySelectorAll(".sc-tag-cb:checked");
|
||||
var cbs = document.querySelectorAll('.sc-tag-cb:checked');
|
||||
for (var i = 0; i < cbs.length; i++) ids.push(cbs[i].value);
|
||||
return ids;
|
||||
})(),
|
||||
tagNames: (function() {
|
||||
var names = [];
|
||||
var cbs = document.querySelectorAll(".sc-tag-cb:checked");
|
||||
var cbs = document.querySelectorAll('.sc-tag-cb:checked');
|
||||
for (var i = 0; i < cbs.length; i++)
|
||||
names.push(cbs[i].closest(".tag-chip").textContent.trim());
|
||||
names.push(cbs[i].closest('.tag-chip').textContent.trim());
|
||||
return names;
|
||||
})(),
|
||||
newTag: document.getElementById("sc-new-tag").value.trim()
|
||||
newTag: document.getElementById('sc-new-tag').value.trim()
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -50,30 +60,30 @@ function buildSpecialCakeHTML(d) {
|
|||
var parts = [];
|
||||
if (d.size) parts.push(d.size);
|
||||
if (d.flavour) parts.push(d.flavour);
|
||||
if (d.shape === "round") parts.push("okragly");
|
||||
else if (d.shape === "square") parts.push("kwadrat");
|
||||
if (d.notes) parts.push("notatka: " + d.notes);
|
||||
var detail = parts.length ? parts.join(", ") : "";
|
||||
var tagHtml = d.tagNames.length > 0 || d.newTag ? '<div style="margin-top:0.25rem;display:flex;flex-wrap:wrap;gap:0.125rem">' : "";
|
||||
if (d.shape === 'round') parts.push('okragly');
|
||||
else if (d.shape === 'square') parts.push('kwadrat');
|
||||
if (d.notes) parts.push('notatka: ' + d.notes);
|
||||
var detail = parts.length ? parts.join(', ') : '';
|
||||
var tagHtml = d.tagNames.length > 0 || d.newTag ? '<div class="basket-item-tags">' : '';
|
||||
for (var i = 0; i < d.tagNames.length; i++)
|
||||
tagHtml += '<span class="tag-chip" style="font-size:0.625rem;padding:0.125rem 0.375rem">' + d.tagNames[i] + "</span>";
|
||||
tagHtml += '<span class="tag-chip sm">' + d.tagNames[i] + '</span>';
|
||||
if (d.newTag)
|
||||
tagHtml += '<span class="tag-chip" style="font-size:0.625rem;padding:0.125rem 0.375rem">' + d.newTag + "</span>";
|
||||
if (d.tagNames.length > 0 || d.newTag) tagHtml += "</div>";
|
||||
tagHtml += '<span class="tag-chip sm">' + d.newTag + '</span>';
|
||||
if (d.tagNames.length > 0 || d.newTag) tagHtml += '</div>';
|
||||
var priceVal = Number(d.price).toFixed(2);
|
||||
var tagIdsStr = d.tagIds.join(",");
|
||||
var tagIdsStr = d.tagIds.join(',');
|
||||
var html =
|
||||
'<div style="flex:1;min-width:0;padding-right:0.5rem">' +
|
||||
'<div class="basket-item-body">' +
|
||||
'<div class="name">' + d.name + '</div>' +
|
||||
'<div class="detail">' + detail + '</div>' +
|
||||
tagHtml +
|
||||
'</div>' +
|
||||
'<div class="price">' + priceVal + ' PLN</div>' +
|
||||
'<div style="display:flex;flex-direction:column;gap:0.125rem">' +
|
||||
'<button type="button" class="action-btn" onclick="editSpecialCake(this)" title="Edytuj">' +
|
||||
'<span class="material-symbols-outlined" style="font-size:1rem">edit</span></button>' +
|
||||
'<div class="basket-item-actions">' +
|
||||
'<button type="button" class="btn-icon" onclick="editSpecialCake(this)" title="Edytuj">' +
|
||||
'<span class="material-symbols-outlined">edit</span></button>' +
|
||||
'<button type="button" class="remove" onclick="removeSpecialCake(this)" title="Usuń">' +
|
||||
'<span class="material-symbols-outlined" style="font-size:1rem">close</span></button>' +
|
||||
'<span class="material-symbols-outlined">close</span></button>' +
|
||||
'</div>' +
|
||||
'<input type="hidden" name="special_name[]" value="' + d.name + '">' +
|
||||
'<input type="hidden" name="special_price[]" value="' + d.price + '">' +
|
||||
|
|
@ -97,162 +107,149 @@ function saveSpecialCake() {
|
|||
}
|
||||
} else {
|
||||
d.id = Date.now();
|
||||
var item = document.createElement("li");
|
||||
item.setAttribute("data-special-id", d.id);
|
||||
var item = document.createElement('li');
|
||||
item.setAttribute('data-special-id', d.id);
|
||||
item.innerHTML = buildSpecialCakeHTML(d);
|
||||
document.getElementById("basket-items").appendChild(item);
|
||||
document.getElementById('basket-items').appendChild(item);
|
||||
}
|
||||
closeSpecialCakeOverlay();
|
||||
updateTotals();
|
||||
}
|
||||
|
||||
function editSpecialCake(btn) {
|
||||
var item = btn.closest("li");
|
||||
var id = item.getAttribute("data-special-id");
|
||||
var item = btn.closest('li');
|
||||
var id = item.getAttribute('data-special-id');
|
||||
editingSpecialId = id;
|
||||
document.getElementById("sc-overlay-title").textContent = "Edytuj tort specjalny";
|
||||
document.getElementById('sc-overlay-title').textContent = 'Edytuj tort specjalny';
|
||||
var hidden = item.querySelectorAll('input[type="hidden"]');
|
||||
var vals = {};
|
||||
for (var i = 0; i < hidden.length; i++) {
|
||||
var name = hidden[i].getAttribute("name");
|
||||
var name = hidden[i].getAttribute('name');
|
||||
vals[name] = hidden[i].value;
|
||||
}
|
||||
document.getElementById("sc-name").value = vals["special_name[]"] || "";
|
||||
document.getElementById("sc-price").value = vals["special_price[]"] || "";
|
||||
document.getElementById("sc-size").value = vals["special_size[]"] || "";
|
||||
document.getElementById("sc-shape").value = vals["special_shape[]"] || "";
|
||||
document.getElementById("sc-flavour").value = vals["special_flavour[]"] || "";
|
||||
document.getElementById("sc-notes").value = vals["special_notes[]"] || "";
|
||||
var currentTagIds = (vals["special_tags[]"] || "").split(",").filter(function(x) { return x; });
|
||||
document.getElementById("sc-new-tag").value = "";
|
||||
var cbs = document.querySelectorAll(".sc-tag-cb");
|
||||
document.getElementById('sc-name').value = vals['special_name[]'] || '';
|
||||
document.getElementById('sc-price').value = vals['special_price[]'] || '';
|
||||
document.getElementById('sc-size').value = vals['special_size[]'] || '';
|
||||
document.getElementById('sc-shape').value = vals['special_shape[]'] || '';
|
||||
document.getElementById('sc-flavour').value = vals['special_flavour[]'] || '';
|
||||
document.getElementById('sc-notes').value = vals['special_notes[]'] || '';
|
||||
var currentTagIds = (vals['special_tags[]'] || '').split(',').filter(function(x) { return x; });
|
||||
document.getElementById('sc-new-tag').value = '';
|
||||
var cbs = document.querySelectorAll('.sc-tag-cb');
|
||||
for (var i = 0; i < cbs.length; i++) {
|
||||
cbs[i].checked = currentTagIds.indexOf(cbs[i].value) >= 0;
|
||||
}
|
||||
document.getElementById("sc-overlay").classList.add("open");
|
||||
document.getElementById("sc-name").focus();
|
||||
document.getElementById('sc-overlay').classList.add('open');
|
||||
document.getElementById('sc-name').focus();
|
||||
}
|
||||
|
||||
function removeSpecialCake(btn) {
|
||||
var item = btn.closest("li");
|
||||
item.remove();
|
||||
btn.closest('li').remove();
|
||||
updateTotals();
|
||||
}
|
||||
|
||||
// ====== Basket ======
|
||||
function changeCake(id, name, price, delta) {
|
||||
var input = document.querySelector('[name="cake[' + id + ']"]');
|
||||
if (input != null) {
|
||||
var qty = Number(input.value) + delta;
|
||||
if (qty <= 0) {
|
||||
var item = input.closest("li");
|
||||
if (item) item.remove();
|
||||
input.closest('li').remove();
|
||||
updateTotals();
|
||||
updateCatalogueQty(id, 0);
|
||||
return;
|
||||
}
|
||||
input.value = qty;
|
||||
var item = input.closest("li");
|
||||
item.querySelector(".qty").innerText = qty;
|
||||
item.querySelector(".price").innerText = price * qty + " PLN";
|
||||
var item = input.closest('li');
|
||||
item.querySelector('.qty').innerText = qty;
|
||||
item.querySelector('.price').innerText = price * qty + ' PLN';
|
||||
updateTotals();
|
||||
updateCatalogueQty(id, qty);
|
||||
return;
|
||||
}
|
||||
if (delta <= 0) return;
|
||||
var item = document.createElement("li");
|
||||
item.setAttribute("data-cake-id", id);
|
||||
var item = document.createElement('li');
|
||||
item.setAttribute('data-cake-id', id);
|
||||
item.innerHTML =
|
||||
'<div style="flex:1;min-width:0;padding-right:0.5rem">' +
|
||||
'<div class="name">' +
|
||||
name +
|
||||
"</div>" +
|
||||
'<div class="detail">' +
|
||||
price +
|
||||
' PLN × <span class="qty">1</span></div>' +
|
||||
"</div>" +
|
||||
'<div class="price">' +
|
||||
price +
|
||||
" PLN</div>" +
|
||||
'<div class="basket-item-body">' +
|
||||
'<div class="name">' + name + '</div>' +
|
||||
'<div class="detail">' + price + ' PLN × <span class="qty">1</span></div>' +
|
||||
'</div>' +
|
||||
'<div class="price">' + price + ' PLN</div>' +
|
||||
'<button type="button" class="remove" onclick="removeCake(this)">' +
|
||||
'<span class="material-symbols-outlined">close</span>' +
|
||||
"</button>" +
|
||||
'<input type="hidden" name="cake[' +
|
||||
id +
|
||||
']" value="1">';
|
||||
document.getElementById("basket-items").appendChild(item);
|
||||
'</button>' +
|
||||
'<input type="hidden" name="cake[' + id + ']" value="1">';
|
||||
document.getElementById('basket-items').appendChild(item);
|
||||
updateTotals();
|
||||
updateCatalogueQty(id, 1);
|
||||
}
|
||||
|
||||
function removeCake(btn) {
|
||||
var item = btn.closest("li");
|
||||
var id = item.getAttribute("data-cake-id");
|
||||
var item = btn.closest('li');
|
||||
var id = item.getAttribute('data-cake-id');
|
||||
item.remove();
|
||||
updateTotals();
|
||||
updateCatalogueQty(id, 0);
|
||||
}
|
||||
|
||||
var subtotal = 0;
|
||||
|
||||
// ====== Totals ======
|
||||
function updatePrepaid() {
|
||||
var paid = Number(document.querySelector('[name="paid"]')?.value || 0);
|
||||
document.getElementById("paid-amount").innerText = paid.toFixed(2) + " PLN";
|
||||
document.getElementById("total-price").innerText = (subtotal - paid).toFixed(2) + " PLN";
|
||||
document.getElementById('paid-amount').innerText = paid.toFixed(2) + ' PLN';
|
||||
document.getElementById('total-price').innerText = (subtotal - paid).toFixed(2) + ' PLN';
|
||||
}
|
||||
|
||||
function updateTotals() {
|
||||
subtotal = 0;
|
||||
var items = document.querySelectorAll("#basket-items li");
|
||||
var items = document.querySelectorAll('#basket-items li');
|
||||
items.forEach(function (item) {
|
||||
var priceText = item.querySelector(".price").innerText;
|
||||
var price = Number(priceText.split(" ")[0]);
|
||||
if (item.hasAttribute("data-special-id")) {
|
||||
var priceText = item.querySelector('.price').innerText;
|
||||
var price = Number(priceText.split(' ')[0]);
|
||||
if (item.hasAttribute('data-special-id')) {
|
||||
subtotal += price;
|
||||
} else {
|
||||
var qty = Number(item.querySelector(".qty").innerText);
|
||||
var qty = Number(item.querySelector('.qty').innerText);
|
||||
subtotal += price * qty;
|
||||
}
|
||||
});
|
||||
document.getElementById("subtotal-price").innerText = subtotal.toFixed(2) + " PLN";
|
||||
document.getElementById('subtotal-price').innerText = subtotal.toFixed(2) + ' PLN';
|
||||
updatePrepaid();
|
||||
}
|
||||
|
||||
function updateCatalogueQty(id, qty) {
|
||||
var el = document.getElementById("qty-" + id);
|
||||
var el = document.getElementById('qty-' + id);
|
||||
if (el) el.innerText = qty;
|
||||
}
|
||||
|
||||
var activeCatalogueTags = [];
|
||||
|
||||
// ====== Catalogue Filters ======
|
||||
function toggleCatalogueTagFilter(btn) {
|
||||
var tag = btn.getAttribute("data-tag");
|
||||
var tag = btn.getAttribute('data-tag');
|
||||
var idx = activeCatalogueTags.indexOf(tag);
|
||||
if (idx >= 0) {
|
||||
activeCatalogueTags.splice(idx, 1);
|
||||
btn.classList.remove("active");
|
||||
btn.classList.remove('active');
|
||||
} else {
|
||||
activeCatalogueTags.push(tag);
|
||||
btn.classList.add("active");
|
||||
btn.classList.add('active');
|
||||
}
|
||||
applyCatalogueFilters();
|
||||
}
|
||||
|
||||
function getCatalogueTextQuery() {
|
||||
var input = document.querySelector(
|
||||
'#catalogue-grid').closest('.card').querySelector('input[type="text"]'
|
||||
);
|
||||
return input ? input.value.toLowerCase() : "";
|
||||
var input = document.querySelector('#catalogue-grid').closest('.card').querySelector('input[type="text"]');
|
||||
return input ? input.value.toLowerCase() : '';
|
||||
}
|
||||
|
||||
function applyCatalogueFilters() {
|
||||
var query = getCatalogueTextQuery();
|
||||
var items = document.querySelectorAll("#catalogue-grid > li");
|
||||
var items = document.querySelectorAll('#catalogue-grid > li');
|
||||
items.forEach(function (item) {
|
||||
var name = item.getAttribute("data-name").toLowerCase();
|
||||
var name = item.getAttribute('data-name').toLowerCase();
|
||||
var matchesText = name.includes(query);
|
||||
var matchesTags = true;
|
||||
if (activeCatalogueTags.length > 0) {
|
||||
var itemTags = (item.getAttribute("data-tags") || "").split(",");
|
||||
var itemTags = (item.getAttribute('data-tags') || '').split(',');
|
||||
for (var i = 0; i < activeCatalogueTags.length; i++) {
|
||||
if (itemTags.indexOf(activeCatalogueTags[i]) < 0) {
|
||||
matchesTags = false;
|
||||
|
|
@ -260,7 +257,7 @@ function applyCatalogueFilters() {
|
|||
}
|
||||
}
|
||||
}
|
||||
item.style.display = matchesText && matchesTags ? "" : "none";
|
||||
item.style.display = matchesText && matchesTags ? '' : 'none';
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -268,12 +265,97 @@ function filterCatalogue(input) {
|
|||
applyCatalogueFilters();
|
||||
}
|
||||
|
||||
// ====== Cakes Table Filters ======
|
||||
function toggleCakeTagFilter(btn) {
|
||||
var tag = btn.getAttribute('data-tag');
|
||||
var idx = activeCakeTags.indexOf(tag);
|
||||
if (idx >= 0) {
|
||||
activeCakeTags.splice(idx, 1);
|
||||
btn.classList.remove('active');
|
||||
} else {
|
||||
activeCakeTags.push(tag);
|
||||
btn.classList.add('active');
|
||||
}
|
||||
var rows = document.querySelectorAll('#cakes-table tbody tr');
|
||||
for (var i = 0; i < rows.length; i++) {
|
||||
if (activeCakeTags.length === 0) { rows[i].style.display = ''; continue; }
|
||||
var rowTags = (rows[i].getAttribute('data-tags') || '').split(',');
|
||||
var match = false;
|
||||
for (var j = 0; j < activeCakeTags.length; j++) {
|
||||
if (rowTags.indexOf(activeCakeTags[j]) >= 0) { match = true; break; }
|
||||
}
|
||||
rows[i].style.display = match ? '' : 'none';
|
||||
}
|
||||
}
|
||||
|
||||
// ====== Order Table Filters ======
|
||||
function filterOrders(input) {
|
||||
var q = input.value.toLowerCase();
|
||||
var table = input.closest('.card').querySelector('.data-table');
|
||||
if (!table) return;
|
||||
var rows = table.querySelectorAll('tbody tr');
|
||||
for (var i = 0; i < rows.length; i++) {
|
||||
var id = rows[i].children[0].textContent.toLowerCase();
|
||||
var customer = rows[i].children[1].textContent.toLowerCase();
|
||||
rows[i].style.display = id.includes(q) || customer.includes(q) ? '' : 'none';
|
||||
}
|
||||
}
|
||||
|
||||
// ====== Location Toggle ======
|
||||
function setLocation(btn, value) {
|
||||
var group = btn.closest('.toggle-group');
|
||||
group.querySelectorAll('.toggle-btn').forEach(function(b) { b.classList.remove('active'); });
|
||||
btn.classList.add('active');
|
||||
group.querySelector('input[type="hidden"]').value = value;
|
||||
}
|
||||
|
||||
// ====== Blocked Date Confirmation ======
|
||||
function confirmBlockedDate(form) {
|
||||
var date = form.querySelector('[name="date"]').value;
|
||||
var blocked = JSON.parse(form.getAttribute("data-blocked-dates") || "[]");
|
||||
var blocked = JSON.parse(form.getAttribute('data-blocked-dates') || '[]');
|
||||
var hasSpecial = form.querySelector('[name="special_name[]"]');
|
||||
if (hasSpecial && blocked.indexOf(date) >= 0) {
|
||||
return confirm("Data " + date + " jest zablokowana dla zamówień z tortami specjalnymi. Czy na pewno chcesz kontynuować?");
|
||||
return confirm('Data ' + date + ' jest zablokowana dla zamówień z tortami specjalnymi. Czy na pewno chcesz kontynuować?');
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
// ====== Init ======
|
||||
function initOrderPage() {
|
||||
var form = document.querySelector('.order-form');
|
||||
if (!form) return;
|
||||
var state = form.getAttribute('data-state');
|
||||
if (state) {
|
||||
try {
|
||||
var data = JSON.parse(state);
|
||||
for (var id in data) {
|
||||
updateCatalogueQty(Number(id), data[id]);
|
||||
}
|
||||
} catch(e) {}
|
||||
}
|
||||
updateTotals();
|
||||
}
|
||||
|
||||
function setActiveLink() {
|
||||
var path = window.location.pathname;
|
||||
var links = document.querySelectorAll('.link');
|
||||
for (var i = 0; i < links.length; i++) {
|
||||
links[i].classList.toggle('active', links[i].getAttribute('href') === path);
|
||||
}
|
||||
}
|
||||
|
||||
function setSidebarState() {
|
||||
var collapsed = localStorage.getItem('sidebarCollapsed') === 'true';
|
||||
document.body.classList.toggle('sidebar-collapsed', collapsed);
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
setSidebarState();
|
||||
setActiveLink();
|
||||
initOrderPage();
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterSettle', function() {
|
||||
setActiveLink();
|
||||
initOrderPage();
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue