341 lines
9.8 KiB
JavaScript
341 lines
9.8 KiB
JavaScript
var IqModalCart = {
|
|
form: "#cart-order-form",
|
|
btn_modal_add: ".add-product-basket",
|
|
btn_add: ".add-from-basket",
|
|
btn_remove: ".remove-from-basket",
|
|
table_input: ".table-input-event-onchange",
|
|
oTable: null,
|
|
cart_holder: "#insert_show_products_order",
|
|
is_for: null,
|
|
modal: "#modals-load-content",
|
|
remove_item_cart: ".remove_item_form_cart",
|
|
insert_show_total_order: "#insert_show_total_order",
|
|
input_is_for: "is_for",
|
|
comp_holder: "#holder_html_view_comp_product",
|
|
comp_products: "switchers-comp-product",
|
|
count_comp_products: "count_comp_products",
|
|
addOnlyMode: false,
|
|
confirmModal: "#modal-confirm-add",
|
|
pendingAction: null,
|
|
|
|
_log: function($msg) {
|
|
console.log($msg);
|
|
},
|
|
init: function() {
|
|
var _self = this;
|
|
_self.url = $(_self.form).attr("action");
|
|
_self.is_for = $('input[name="' + _self.input_is_for + '"]').val();
|
|
var addOnlyVal = $(_self.form).data("add-only-mode");
|
|
_self.addOnlyMode =
|
|
addOnlyVal === 1 || addOnlyVal === "1" || addOnlyVal === true;
|
|
_self.reInitCart($(_self.cart_holder));
|
|
_self.initConfirmModal();
|
|
|
|
return _self;
|
|
},
|
|
initConfirmModal: function() {
|
|
var _self = this;
|
|
$("#confirm-add-btn")
|
|
.off("click")
|
|
.on("click", function() {
|
|
$(_self.confirmModal).modal("hide");
|
|
if (_self.pendingAction) {
|
|
_self.pendingAction();
|
|
_self.pendingAction = null;
|
|
}
|
|
});
|
|
},
|
|
parseCurrency: function(value) {
|
|
if (value === undefined || value === null) {
|
|
return null;
|
|
}
|
|
|
|
var normalized = String(value)
|
|
.replace(/<[^>]*>/g, "")
|
|
.replace(/€/g, "")
|
|
.replace(/€/g, "")
|
|
.replace(/\s/g, "")
|
|
.replace(/\./g, "")
|
|
.replace(",", ".");
|
|
var amount = parseFloat(normalized);
|
|
|
|
return isNaN(amount) ? null : amount;
|
|
},
|
|
formatCurrency: function(value) {
|
|
if (value === undefined || value === null || isNaN(value)) {
|
|
return "-";
|
|
}
|
|
|
|
return (
|
|
value.toLocaleString("de-DE", {
|
|
minimumFractionDigits: 2,
|
|
maximumFractionDigits: 2,
|
|
}) + " €"
|
|
);
|
|
},
|
|
showConfirm: function(productName, productPrice, qtyInfo, callback, options) {
|
|
var _self = this;
|
|
var $confirmModal = $(_self.confirmModal);
|
|
var confirmOptions = options || {};
|
|
var confirmType = confirmOptions.type || "add";
|
|
var additionalCost = _self.parseCurrency(productPrice);
|
|
var currentTotal = _self.parseCurrency(
|
|
$("#value-amount").text() || $confirmModal.data("current-total"),
|
|
);
|
|
var newTotal =
|
|
currentTotal !== null && additionalCost !== null
|
|
? currentTotal + additionalCost
|
|
: null;
|
|
|
|
var title = $confirmModal.data("title-" + confirmType);
|
|
var info = $confirmModal.data("info-" + confirmType);
|
|
$("#modal-confirm-add-label").text(title || $confirmModal.data("title-add"));
|
|
$("#confirm-add-info-text").text(info || $confirmModal.data("info-add"));
|
|
$("#confirm-add-product-name").text(productName || "-");
|
|
$("#confirm-add-product-price").html(
|
|
additionalCost !== null
|
|
? "+ " +
|
|
_self.formatCurrency(additionalCost) +
|
|
" " +
|
|
($confirmModal.data("per-delivery") || "")
|
|
: productPrice || "-",
|
|
);
|
|
$("#confirm-add-qty-info").text(qtyInfo || "");
|
|
$("#confirm-add-new-total").text(_self.formatCurrency(newTotal));
|
|
$("#confirm-add-next-billing-date").text(
|
|
$confirmModal.data("next-billing-date") || "-",
|
|
);
|
|
_self.pendingAction = callback;
|
|
$confirmModal.modal("show");
|
|
},
|
|
setDatabase: function(oTable) {
|
|
var _self = this;
|
|
_self.oTable = oTable;
|
|
},
|
|
reInitModal: function() {
|
|
var _self = this;
|
|
$(_self.oTable)
|
|
.find(_self.btn_modal_add)
|
|
.on("click", function() {
|
|
_self.add_product_modal($(this));
|
|
});
|
|
},
|
|
add_product_modal: function(_obj) {
|
|
var _self = this;
|
|
var productName = _obj.data("product-name") || "";
|
|
var productPrice = _obj.data("product-price") || "";
|
|
var $modal = $(_self.modal);
|
|
$modal.one("hidden.bs.modal", function() {
|
|
_self.showConfirm(
|
|
productName,
|
|
productPrice,
|
|
"1x",
|
|
function() {
|
|
_self
|
|
.performRequest({
|
|
product_id: _obj.data("product-id"),
|
|
qty: 1,
|
|
action: "addProduct",
|
|
})
|
|
.done(_self.refreshView);
|
|
},
|
|
{ type: "add" },
|
|
);
|
|
});
|
|
$modal.modal("hide");
|
|
},
|
|
reInitCart: function(obj) {
|
|
var _self = this;
|
|
var _obj = obj;
|
|
obj
|
|
.find(_self.btn_add)
|
|
.off("click")
|
|
.on("click", function() {
|
|
_self.add_product($(this), _obj);
|
|
});
|
|
obj
|
|
.find(_self.btn_remove)
|
|
.off("click")
|
|
.on("click", function() {
|
|
_self.remove_product($(this), _obj);
|
|
});
|
|
obj
|
|
.find(_self.table_input)
|
|
.off("change")
|
|
.on("change", function() {
|
|
_self.update_input_table($(this), _obj);
|
|
});
|
|
obj
|
|
.find(_self.remove_item_cart)
|
|
.off("click")
|
|
.on("click", function(event) {
|
|
event.preventDefault();
|
|
_self.remove_from_cart($(this), _obj);
|
|
});
|
|
if (_self.is_for === "me" || _self.is_for === "abo-me") {
|
|
$('input[name^="' + _self.comp_products + '"]')
|
|
.off("change")
|
|
.on("change", function() {
|
|
_self.update_comp_product($(this));
|
|
});
|
|
}
|
|
},
|
|
update_comp_product: function(_obj) {
|
|
var _self = this;
|
|
_self
|
|
.performRequest({
|
|
comp_product_id: _obj.val(),
|
|
comp_num: _obj.data("comp_num"),
|
|
count_comp_products: $(
|
|
'input[name="' + _self.count_comp_products + '"]',
|
|
).val(),
|
|
action: "updateCompProduct",
|
|
})
|
|
.done(_self.refreshView);
|
|
},
|
|
add_product: function(_obj, _holder) {
|
|
var _self = this;
|
|
console.log(_self);
|
|
var input = _holder.find(
|
|
'input[name="product_qty_' + _obj.data("order-item-id") + '"]',
|
|
);
|
|
var currentQty = parseInt(input.val());
|
|
var qty = currentQty + 1;
|
|
qty = _self.checkNumber(qty);
|
|
|
|
var productName = _obj.data("product-name") || "";
|
|
var productPrice = _obj.data("product-price") || "";
|
|
var qtyInfo = currentQty + " \u2192 " + qty;
|
|
console.log(qtyInfo);
|
|
_self.showConfirm(
|
|
productName,
|
|
productPrice,
|
|
qtyInfo,
|
|
function() {
|
|
input.val(qty);
|
|
_self.update_cart(_holder, _obj, qty);
|
|
},
|
|
{ type: "increase" },
|
|
);
|
|
},
|
|
remove_product: function(_obj, _holder) {
|
|
var _self = this;
|
|
var input = _holder.find(
|
|
'input[name="product_qty_' + _obj.data("order-item-id") + '"]',
|
|
);
|
|
var qty = parseInt(input.val()) - 1;
|
|
qty = _self.checkNumber(qty);
|
|
input.val(qty);
|
|
_self.update_cart(_holder, _obj, qty);
|
|
},
|
|
update_input_table: function(_obj, _holder) {
|
|
var _self = this;
|
|
var qty = parseInt(_obj.val());
|
|
qty = _self.checkNumber(qty);
|
|
_obj.val(qty);
|
|
_self.update_cart(_holder, _obj, qty);
|
|
},
|
|
update_cart: function(_holder, _obj, qty) {
|
|
var _self = this;
|
|
_self
|
|
.performRequest({
|
|
product_id: _obj.data("product-id"),
|
|
order_item_id: _obj.data("order-item-id"),
|
|
cart_order_id: _holder.data("cart-order-id"),
|
|
qty: qty,
|
|
action: "updateCart",
|
|
})
|
|
.done(_self.refreshView);
|
|
},
|
|
remove_from_cart: function(_obj, _holder) {
|
|
var _self = this;
|
|
_self
|
|
.performRequest({
|
|
product_id: _obj.data("product-id"),
|
|
order_item_id: _obj.data("order-item-id"),
|
|
cart_order_id: _holder.data("cart-order-id"),
|
|
action: "removeFromCart",
|
|
})
|
|
.done(_self.refreshView);
|
|
},
|
|
|
|
refreshView: function(data) {
|
|
var _self = IqModalCart;
|
|
var obj = $(_self.cart_holder);
|
|
obj.html(data.html_cart);
|
|
$(_self.insert_show_total_order).html(data.html_total);
|
|
if (data.html_summary) {
|
|
$("#combined_summary_card").html(data.html_summary);
|
|
}
|
|
$(_self.modal).modal("hide");
|
|
if (data.html_comp !== undefined) {
|
|
$(_self.comp_holder).html(data.html_comp);
|
|
}
|
|
if ($("#value-amount")) {
|
|
$("#value-amount").html(data.amount);
|
|
$(_self.confirmModal).data("current-total", data.amount);
|
|
}
|
|
_self.reInitCart(obj);
|
|
},
|
|
performRequest: function(data) {
|
|
var _self = this;
|
|
var url = _self.url,
|
|
contentType = "application/x-www-form-urlencoded; charset=UTF-8";
|
|
|
|
console.log(data);
|
|
console.log(url);
|
|
|
|
return $.ajax({
|
|
url: url,
|
|
data: data,
|
|
type: "POST",
|
|
dataType: "json",
|
|
cache: false,
|
|
contentType: contentType,
|
|
encode: true,
|
|
headers: {
|
|
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
|
|
},
|
|
})
|
|
.done(function(data) {
|
|
console.log("performRequest");
|
|
console.log(data);
|
|
})
|
|
.fail(function(jqXHR, textStatus, errorThrown) {
|
|
console.log(jqXHR);
|
|
console.log(jqXHR.responseText);
|
|
console.log(textStatus);
|
|
console.log(errorThrown);
|
|
if (
|
|
jqXHR.status === 403 &&
|
|
jqXHR.responseJSON &&
|
|
jqXHR.responseJSON.message
|
|
) {
|
|
var errorEl = document.getElementById("insert_show_error_message");
|
|
if (!errorEl) {
|
|
errorEl = document.createElement("div");
|
|
errorEl.id = "insert_show_error_message";
|
|
errorEl.className = "alert alert-danger mt-2";
|
|
var cartHolder = document.querySelector(
|
|
"#insert_show_products_order",
|
|
);
|
|
if (cartHolder) {
|
|
cartHolder.insertBefore(errorEl, cartHolder.firstChild);
|
|
}
|
|
}
|
|
errorEl.textContent = jqXHR.responseJSON.message;
|
|
} else {
|
|
console.log("Sorry, there was a problem!");
|
|
}
|
|
});
|
|
},
|
|
checkNumber: function(number) {
|
|
if (number < 1 || isNaN(number)) {
|
|
return 1;
|
|
}
|
|
if (number >= 999) {
|
|
return 999;
|
|
}
|
|
return number;
|
|
},
|
|
};
|