/*
Template Name: Grenviro Monitoring
Author: Themesbrand
Website: https://Themesbrand.com/
Contact: Themesbrand@gmail.com
File: Invoice create init Js File
*/
var paymentSign = "$";
Array.from(document.getElementsByClassName("product-line-price")).forEach(function (item) {
item.value = paymentSign +"0.00"
});
function otherPayment() {
var paymentType = document.getElementById("choices-payment-currency").value;
paymentSign = paymentType;
Array.from(document.getElementsByClassName("product-line-price")).forEach(function (item) {
isUpdate = item.value.slice(1);
item.value = paymentSign + isUpdate;
});
recalculateCart();
}
var isPaymentEl = document.getElementById("choices-payment-currency");
var choices = new Choices(isPaymentEl, {
searchEnabled: false
});
// Profile Img
document
.querySelector("#profile-img-file-input")
.addEventListener("change", function () {
var preview = document.querySelector(".user-profile-image");
var file = document.querySelector(".profile-img-file-input").files[0];
var reader = new FileReader();
reader.addEventListener(
"load",
function () {
preview.src = reader.result;
//localStorage.setItem("invoiceLogo", reader.result);
},
false
);
if (file) {
reader.readAsDataURL(file);
}
});
flatpickr("#date-field", {
enableTime: true,
dateFormat: "d M, Y, h:i K",
});
isData();
function isData() {
var plus = document.getElementsByClassName("plus"),
minus = document.getElementsByClassName("minus");
if (plus) {
Array.from(plus).forEach(function (e) {
e.onclick = function (event) {
if (parseInt(e.previousElementSibling.value) < 10) {
event.target.previousElementSibling.value++;
var itemAmount = e.parentElement.parentElement.previousElementSibling.querySelector(".product-price").value;
var priceselection = e.parentElement.parentElement.nextElementSibling.querySelector(".product-line-price");
var productQty = e.parentElement.querySelector(".product-quantity").value;
updateQuantity(productQty, itemAmount, priceselection);
}
}
});
}
if (minus) {
Array.from(minus).forEach(function (e) {
e.onclick = function (event) {
if (parseInt(e.nextElementSibling.value) > 1) {
event.target.nextElementSibling.value--;
var itemAmount = e.parentElement.parentElement.previousElementSibling.querySelector(".product-price").value;
var priceselection = e.parentElement.parentElement.nextElementSibling.querySelector(".product-line-price");
// var productQty = 1;
var productQty = e.parentElement.querySelector(".product-quantity").value;
updateQuantity(productQty, itemAmount, priceselection);
}
};
});
}
}
var count = 1;
function new_link() {
count++;
var tr1 = document.createElement("tr");
tr1.id = count;
tr1.className = "product";
var delLink =
"
" +
'' +
count +
" | " +
'' +
' ' +
'' +
' ' +
'' +
"" +
" | " +
"" +
'' +
" | " +
"" +
' ' +
'' +
'' +
'' +
" " +
" | " +
'' +
" " +
'' +
" " +
" | " +
'' +
'Delete' +
" | " +
"
";
tr1.innerHTML = document.getElementById("newForm").innerHTML + delLink;
document.getElementById("newlink").appendChild(tr1);
var genericExamples = document.querySelectorAll("[data-trigger]");
Array.from(genericExamples).forEach(function (genericExamp) {
var element = genericExamp;
new Choices(element, {
placeholderValue: "This is a placeholder set in the config",
searchPlaceholderValue: "This is a search placeholder",
});
});
isData();
remove();
amountKeyup();
resetRow()
}
remove();
/* Set rates + misc */
var taxRate = 0.125;
var shippingRate = 65.0;
var discountRate = 0.15;
function remove() {
Array.from(document.querySelectorAll(".product-removal a")).forEach(function (el) {
el.addEventListener("click", function (e) {
removeItem(e);
resetRow()
});
});
}
function resetRow() {
Array.from(document.getElementById("newlink").querySelectorAll("tr")).forEach(function (subItem, index) {
var incid = index + 1;
subItem.querySelector('.product-id').innerHTML = incid;
});
}
/* Recalculate cart */
function recalculateCart() {
var subtotal = 0;
Array.from(document.getElementsByClassName("product")).forEach(function (item) {
Array.from(item.getElementsByClassName("product-line-price")).forEach(function (e) {
if (e.value) {
subtotal += parseFloat(e.value.slice(1));
}
});
});
/* Calculate totals */
var tax = subtotal * taxRate;
var discount = subtotal * discountRate;
var shipping = subtotal > 0 ? shippingRate : 0;
var total = subtotal + tax + shipping - discount;
document.getElementById("cart-subtotal").value =
paymentSign + subtotal.toFixed(2);
document.getElementById("cart-tax").value = paymentSign + tax.toFixed(2);
document.getElementById("cart-shipping").value =
paymentSign + shipping.toFixed(2);
document.getElementById("cart-total").value = paymentSign + total.toFixed(2);
document.getElementById("cart-discount").value =
paymentSign + discount.toFixed(2);
document.getElementById("totalamountInput").value =
paymentSign + total.toFixed(2);
document.getElementById("amountTotalPay").value =
paymentSign + total.toFixed(2);
}
function amountKeyup() {
// var listArray = [];
// listArray.push(document.getElementsByClassName('product-price'));
Array.from(document.getElementsByClassName('product-price')).forEach(function (item) {
item.addEventListener('keyup', function (e) {
var priceselection = item.parentElement.nextElementSibling.nextElementSibling.querySelector('.product-line-price');
var amount = e.target.value;
var itemQuntity = item.parentElement.nextElementSibling.querySelector('.product-quantity').value;
updateQuantity(amount, itemQuntity, priceselection);
});
});
}
amountKeyup();
/* Update quantity */
function updateQuantity(amount, itemQuntity, priceselection) {
var linePrice = amount * itemQuntity;
/* Update line price display and recalc cart totals */
linePrice = linePrice.toFixed(2);
priceselection.value = paymentSign + linePrice;
recalculateCart();
}
/* Remove item from cart */
function removeItem(removeButton) {
removeButton.target.closest("tr").remove();
recalculateCart();
}
//Choise Js
var genericExamples = document.querySelectorAll("[data-trigger]");
Array.from(genericExamples).forEach(function (genericExamp) {
var element = genericExamp;
new Choices(element, {
placeholderValue: "This is a placeholder set in the config",
searchPlaceholderValue: "This is a search placeholder",
});
});
//Address
function billingFunction() {
if (document.getElementById("same").checked) {
document.getElementById("shippingName").value =
document.getElementById("billingName").value;
document.getElementById("shippingAddress").value =
document.getElementById("billingAddress").value;
document.getElementById("shippingPhoneno").value =
document.getElementById("billingPhoneno").value;
document.getElementById("shippingTaxno").value =
document.getElementById("billingTaxno").value;
} else {
document.getElementById("shippingName").value = "";
document.getElementById("shippingAddress").value = "";
document.getElementById("shippingPhoneno").value = "";
document.getElementById("shippingTaxno").value = "";
}
}
var cleaveBlocks = new Cleave('#cardNumber', {
blocks: [4, 4, 4, 4],
uppercase: true
});
var genericExamples = document.querySelectorAll('[data-plugin="cleave-phone"]');
Array.from(genericExamples).forEach(function (genericExamp) {
var element = genericExamp;
new Cleave(element, {
delimiters: ['(', ')', '-'],
blocks: [0, 3, 3, 4]
});
});
let viewobj;
var invoices_list = localStorage.getItem("invoices-list");
var options = localStorage.getItem("option");
var invoice_no = localStorage.getItem("invoice_no");
var invoices = JSON.parse(invoices_list);
if (localStorage.getItem("invoice_no") === null && localStorage.getItem("option") === null) {
viewobj = '';
var value = "#VL" + Math.floor(11111111 + Math.random() * 99999999);
document.getElementById("invoicenoInput").value = value;
} else {
viewobj = invoices.find(o => o.invoice_no === invoice_no);
}
// Invoice Data Load On Form
if ((viewobj != '') && (options == "edit-invoice")) {
document.getElementById("registrationNumber").value = viewobj.company_details.legal_registration_no;
document.getElementById("companyEmail").value = viewobj.company_details.email;
document.getElementById('companyWebsite').value = viewobj.company_details.website;
new Cleave("#compnayContactno", {
prefix: viewobj.company_details.contact_no,
delimiters: ['(', ')', '-'],
blocks: [0, 3, 3, 4]
});
document.getElementById("companyAddress").value = viewobj.company_details.address;
document.getElementById("companyaddpostalcode").value = viewobj.company_details.zip_code;
var preview = document.querySelectorAll(".user-profile-image");
if (viewobj.img !== ''){
preview.src = viewobj.img;
}
document.getElementById("invoicenoInput").value = "#VAL" + viewobj.invoice_no;
document.getElementById("invoicenoInput").setAttribute('readonly',true);
document.getElementById("date-field").value = viewobj.date;
document.getElementById("choices-payment-status").value = viewobj.status;
document.getElementById("totalamountInput").value = "$" + viewobj.order_summary.total_amount;
document.getElementById("billingName").value = viewobj.billing_address.full_name;
document.getElementById("billingAddress").value = viewobj.billing_address.address;
new Cleave("#billingPhoneno", {
prefix: viewobj.company_details.contact_no,
delimiters: ['(', ')', '-'],
blocks: [0, 3, 3, 4]
});
document.getElementById("billingTaxno").value = viewobj.billing_address.tax;
document.getElementById("shippingName").value = viewobj.shipping_address.full_name;
document.getElementById("shippingAddress").value = viewobj.shipping_address.address;
new Cleave("#shippingPhoneno", {
prefix: viewobj.company_details.contact_no,
delimiters: ['(', ')', '-'],
blocks: [0, 3, 3, 4]
});
document.getElementById("shippingTaxno").value = viewobj.billing_address.tax;
var paroducts_list = viewobj.prducts;
var counter = 1;
do {
counter++;
if (paroducts_list.length > 1) {
document.getElementById("add-item").click();
}
} while (paroducts_list.length - 1 >= counter);
var counter_1 = 1;
setTimeout(() => {
Array.from(paroducts_list).forEach(function (element) {
document.getElementById("productName-" + counter_1).value = element.product_name;
document.getElementById("productDetails-" + counter_1).value = element.product_details;
document.getElementById("productRate-" + counter_1).value = element.rates;
document.getElementById("product-qty-" + counter_1).value = element.quantity;
document.getElementById("productPrice-" + counter_1).value = "$" + ((element.rates) * (element.quantity));
counter_1++;
});
}, 300);
document.getElementById("cart-subtotal").value = "$" + viewobj.order_summary.sub_total;
document.getElementById("cart-tax").value = "$" + viewobj.order_summary.estimated_tex;
document.getElementById("cart-discount").value = "$" + viewobj.order_summary.discount;
document.getElementById("cart-shipping").value = "$" + viewobj.order_summary.shipping_charge;
document.getElementById("cart-total").value = "$" + viewobj.order_summary.total_amount;
document.getElementById("choices-payment-type").value = viewobj.payment_details.payment_method;
document.getElementById("cardholderName").value = viewobj.payment_details.card_holder_name;
var cleave = new Cleave('#cardNumber', {
prefix: viewobj.payment_details.card_number,
delimiter: ' ',
blocks: [4, 4, 4, 4],
uppercase: true
});
document.getElementById("amountTotalPay").value = "$" + viewobj.order_summary.total_amount;
document.getElementById("exampleFormControlTextarea1").value = viewobj.notes;
}
document.addEventListener("DOMContentLoaded", function () {
// //Form Validation
var formEvent = document.getElementById('invoice_form');
var forms = document.getElementsByClassName('needs-validation');
// Loop over them and prevent submission
formEvent.addEventListener("submit", function (event) {
event.preventDefault();
// get fields value
var i_no = (document.getElementById("invoicenoInput").value).slice(4);
var email = document.getElementById("companyEmail").value;
var date = document.getElementById("date-field").value;
var invoice_amount = (document.getElementById("totalamountInput").value).slice(1);
var status = document.getElementById("choices-payment-status").value;
var billing_address_full_name = document.getElementById("billingName").value;
var billing_address_address = document.getElementById("billingAddress").value;
var billing_address_phone = (document.getElementById("billingPhoneno").value).replace(/[^0-9]/g, "");
var billing_address_tax = document.getElementById("billingTaxno").value;
var shipping_address_full_name = document.getElementById("shippingName").value;
var shipping_address_address = document.getElementById("shippingAddress").value;
var shipping_address_phone = (document.getElementById("shippingPhoneno").value).replace(/[^0-9]/g, "");
var shipping_address_tax = document.getElementById("shippingTaxno").value;
var payment_details_payment_method = document.getElementById("choices-payment-type").value;
var payment_details_card_holder_name = document.getElementById("cardholderName").value;
var payment_details_card_number = (document.getElementById("cardNumber").value).replace(/[^0-9]/g, "");
var payment_details_total_amount = (document.getElementById("amountTotalPay").value).slice(1);
var company_details_legal_registration_no = (document.getElementById("registrationNumber").value).replace(/[^0-9]/g, "");
var company_details_email = document.getElementById("companyEmail").value;
var company_details_website = document.getElementById('companyWebsite').value;
var company_details_contact_no = (document.getElementById("compnayContactno").value).replace(/[^0-9]/g, "");
var company_details_address = document.getElementById("companyAddress").value;
var company_details_zip_code = document.getElementById("companyaddpostalcode").value;
var order_summary_sub_total = (document.getElementById("cart-subtotal").value).slice(1);
var order_summary_estimated_tex = (document.getElementById("cart-tax").value).slice(1);
var order_summary_discount = (document.getElementById("cart-discount").value).slice(1);
var order_summary_shipping_charge = (document.getElementById("cart-shipping").value).slice(1);
var order_summary_total_amount = (document.getElementById("cart-total").value).slice(1);
var notes = document.getElementById("exampleFormControlTextarea1").value;
// get product value and make array
var products = document.getElementsByClassName("product");
var count = 1;
var new_product_obj = [];
Array.from(products).forEach(element => {
var product_name = element.querySelector("#productName-"+count).value;
var product_details = element.querySelector("#productDetails-"+count).value;
var product_rate = parseInt(element.querySelector("#productRate-"+count).value);
var product_qty = parseInt(element.querySelector("#product-qty-"+count).value);
var product_price = (element.querySelector("#productPrice-"+count).value).split("$");;
var product_obj = {
product_name: product_name,
product_details: product_details,
rates: product_rate,
quantity: product_qty,
amount: parseInt(product_price[1])
}
new_product_obj.push(product_obj);
count++;
});
if (formEvent.checkValidity() === false) {
formEvent.classList.add("was-validated");
} else {
if ((options == "edit-invoice") && (invoice_no == i_no)) {
objIndex = invoices.findIndex((obj => obj.invoice_no == i_no));
invoices[objIndex].invoice_no = i_no;
invoices[objIndex].customer = billing_address_full_name;
invoices[objIndex].img = '';
invoices[objIndex].email = email;
invoices[objIndex].date = date;
invoices[objIndex].invoice_amount = invoice_amount;
invoices[objIndex].status = status;
invoices[objIndex].billing_address = {
full_name: billing_address_full_name,
address: billing_address_address,
phone: billing_address_phone,
tax: billing_address_tax
};
invoices[objIndex].shipping_address = {
full_name: shipping_address_full_name,
address: shipping_address_address,
phone: shipping_address_phone,
tax: shipping_address_tax
};
invoices[objIndex].payment_details = {
payment_method: payment_details_payment_method,
card_holder_name: payment_details_card_holder_name,
card_number: payment_details_card_number,
total_amount: payment_details_total_amount
};
invoices[objIndex].company_details = {
legal_registration_no: company_details_legal_registration_no,
email: company_details_email,
website: company_details_website,
contact_no: company_details_contact_no,
address: company_details_address,
zip_code: company_details_zip_code
};
invoices[objIndex].order_summary = {
sub_total: order_summary_sub_total,
estimated_tex: order_summary_estimated_tex,
discount: order_summary_discount,
shipping_charge: order_summary_shipping_charge,
total_amount: order_summary_total_amount,
};
invoices[objIndex].prducts = new_product_obj;
invoices[objIndex].notes = notes;
localStorage.removeItem("invoices-list");
localStorage.removeItem("option");
localStorage.removeItem("invoice_no");
localStorage.setItem("invoices-list", JSON.stringify(invoices));
} else {
var new_data_object = {
invoice_no: i_no,
customer: billing_address_full_name,
img: '',
email: email,
date: date,
invoice_amount: invoice_amount,
status: status,
billing_address: {
full_name: billing_address_full_name,
address: billing_address_address,
phone: billing_address_phone,
tax: billing_address_tax
},
shipping_address: {
full_name: shipping_address_full_name,
address: shipping_address_address,
phone: shipping_address_phone,
tax: shipping_address_tax
},
payment_details: {
payment_method: payment_details_payment_method,
card_holder_name: payment_details_card_holder_name,
card_number: payment_details_card_number,
total_amount: payment_details_total_amount
},
company_details: {
legal_registration_no: company_details_legal_registration_no,
email: company_details_email,
website: company_details_website,
contact_no: company_details_contact_no,
address: company_details_address,
zip_code: company_details_zip_code
},
order_summary:{
sub_total: order_summary_sub_total,
estimated_tex: order_summary_estimated_tex,
discount: order_summary_discount,
shipping_charge: order_summary_shipping_charge,
total_amount: order_summary_total_amount
},
prducts: new_product_obj,
notes: notes
};
localStorage.setItem("new_data_object", JSON.stringify(new_data_object));
}
window.location.href = "apps-invoices-list";
}
});
});