Files
giao_dien_web_mau/demo-audio-1/js/cart.js

767 lines
24 KiB
JavaScript
Raw Normal View History

$(".click-voucher").click(function(){
$(".cart-voucher-group").toggleClass("hide");
});
//Kiểm tra cú pháp Email
function validateEmail(Email) {
var regaxEmail =
/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
if (regaxEmail.test(Email)) {
return true;
} else {
return false;
}
}
function check_field() {
//Kiếm tra cú pháp Số điện thoại
var number_regex1 = /^[0]\d{9}$/i;
var number_regex2 = /^[0]\d{10}$/i;
var error = "";
//Kiểm tra Họ tên
var check_name = document.getElementById("buyer_name").value;
if (check_name.length < 4) error += "- Tên quá ngắn\n";
//Kiểm tra Email
var check_email = document.getElementById("buyer_email").value;
if (check_email.length < 4) {
error += "- Bạn chưa nhập email\n";
}
if (check_email.length > 4) {
if (validateEmail(check_email) == false) error += "- Email không hợp lệ\n";
}
//Kiểm tra Số điện thoại
var check_tel = document.getElementById("buyer_tel").value;
if (check_tel.length < 4) error += "- Bạn chưa nhập SĐT\n";
else {
if (
number_regex1.test(check_tel) == false &&
number_regex2.test(check_tel) == false
)
error += "- Số điện thoại chưa chính xác\n";
}
//Kiểm tra Tỉnh-thành phố
var check_province = document.getElementById("id-province").value;
if (check_province == 0) error += "- Bạn chưa chọn thành phố\n";
//Kiểm tra Quận- huyện
var check_distric = document.getElementById("id-distric").value;
if (check_distric == 0) error += "- Bạn chưa chọn quận/huyện \n";
//Kiểm tra Phường-xã
var check_ward = document.getElementById("js-ward-tragop").value;
if (check_ward == 0) error += "- Bạn chưa chọn phường/xã \n";
if (error != "") {
alert(error);
return false;
}
if ($("#js-distric-tragop").val() != 0 || $("#js-ward-tragop").val() != 0) {
$("#buyer_address").val(
$("#buyer_address").val() +
" , " +
$("#js-ward-tragop").val() +
" , " +
$("#js-distric-tragop").val() +
" , " +
$("#js-province-tragop").val()
);
}
$(".js-send-cart").addClass("submited");
$(".js-send-cart").html("Đang xử lý...");
return true;
}
// check input validation section
function check_valid_input(pattern, target) {
// check valid value for input in cart page
$(target).on("input", function () {
var stringValue = $(target).val();
var status = pattern.test(stringValue);
if (status == false) {
$(this).css("outline-color", "rgb(194 29 29)"); //red
var targetName = $(this).prev().html().replace("*", "");
this.setCustomValidity(targetName + " quá ngắn/chưa đúng");
this.reportValidity();
} else {
this.setCustomValidity("");
this.reportValidity();
$(this).css("outline-color", "rgb(45 182 99)"); //green
}
});
return;
}
//for mail
function check_valid_input_executer() {
// add check func for each input here and call this func to check all input
//for mail
check_valid_input(
/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
"#buyer_email"
);
//for name
check_valid_input(/^[a-zA-Z ]{4,20}$/, "#buyer_name");
//for phone number
check_valid_input(/(84|0[3|5|7|8|9])+([0-9]{8})\b/, "#buyer_tel");
//for address
check_valid_input(/.{10}/, "#buyer_address");
}
// end check input validation section
//Get province selection ( lay quan huyen )
function getProvince(province_id) {
var params = {
action_type: "district-list",
province: province_id,
};
var target = "#js-district-holder";
Hura.Ajax.get("province", params).then(function (data) {
//console.log(data);
// productTpl is in template: javascript/tpl
var html = Hura.Template.parse(provinceTpl, data);
Hura.Template.render(
target,
'<select name="user_info[district]" id="ship_to_district"><option value="0">Quận/Huyện</option>' +
html +
"</select>"
);
});
}
//on page ready
$(document).ready(function () {
calculateCartTotalPrice();
listenDeleteCartItem();
listenQuantityChange();
//ap dung coupon/voucher
listenVoucherCode("#js_voucher_input");
getVoucherList("#js-pop-voucher-holder");
$(".js-bank-money").click(function(){
$("#show-info-bank").addClass("hide");
});
$(".js-bank-online").click(function(){
$("#show-info-bank").removeClass("hide");
});
});
var TOTAL_CART_VALUE_NODE = ".js-total-cart-price";
function formatCurrency(a) {
var b = parseFloat(a)
.toFixed(2)
.replace(/(\d)(?=(\d{3})+\.)/g, "$1.")
.toString();
var len = b.length;
b = b.substring(0, len - 3);
return b;
}
function strToNumber(str) {
str += "";
while (str.indexOf(".") > 0) {
str = str.replace(".", "");
}
var result = parseFloat(str);
return isNaN(result) ? 0 : result;
}
function tinhSoLuongSanPham() {
var total_item = 0;
$(".js-buy-quantity").each(function () {
total_item += parseInt($(this).val());
});
$("#js-total-quantity").html(total_item + " sản phẩm");
}
function checkTotalShippingFee(){
var province = $("#id-province").val();
var district = $("#id-distric").val();
var cart_total_before_fee_discount = $("#js-total-before-fee-discount").val();
if(province==0 || district == 0){
return;
}
var params = {
action : "shipping",
action_type: "get-shipping-and-cod",
order_value : cart_total_before_fee_discount,
province : province,
district : district
}
Hura.Ajax.post('shipping',params).then(function(data){
console.log(data)
$('#js_price_ship').val(data.ship)
calculateCartTotalPrice()
})
}
//tinh tong gia don hang
function calculateCartTotalPrice() {
var dom_target = ".js-total-cart-price";
var total_cart_price = 0;
$(".item-cart-price").each(function () {
total_cart_price += Hura.Util.strToNumber($(this).html());
});
//log for other reference
$("#js-total-before-fee-discount").val(total_cart_price);
//giam gia khac: voucher, membership, loyalty point conversion
var total_discount = 0;
total_discount += Number($("#js-discount-voucher").val());
total_discount += parseInt($("#js-discount-membership").val());
var voucher_value = parseInt($("#js-discount-voucher").val());
//phi khac: shipping, COD...
var total_other_fee = 0;
total_other_fee += parseInt($("#js-fee-shipping").val());
total_other_fee += parseInt($("#js-fee-cod").val());
//console.log(total_discount);
var priceFreeship = parseInt($('#js_price_freeship').val());
if($('#js_price_ship').val() == "nomal"){
$("#js-inner-ship").html(`
<div class="cart-customer-total d-flex align-items-center justify-content-between">
<div>
<span class="text">Phí vận chuyển: </span>
</div>
<p class="cart-customer-total-price">Chưa tính</p>
</div>
`);
$(dom_target).html(formatCurrency(total_cart_price)+' đ');
$(TOTAL_CART_VALUE_NODE).html(formatCurrency(total_cart_price - total_discount )+' đ');
}else{
var priceShip = parseInt($('#js_price_ship').val());
if(total_cart_price >= priceFreeship || priceShip == 0){
console.log(total_cart_price);
console.log(priceFreeship)
$("#js-inner-ship").html(`
<div class="cart-customer-total d-flex align-items-center justify-content-between">
<div>
<span class="text">Phí vận chuyển: </span>
</div>
<p class="cart-customer-total-price">Freeship</p>
</div>
`);
$(dom_target).html(formatCurrency(total_cart_price)+' đ');
$(TOTAL_CART_VALUE_NODE).html(formatCurrency(total_cart_price - total_discount )+' đ');
}else{
var minusPriceShip = priceFreeship - total_cart_price;
console.log(total_cart_price);
console.log(priceFreeship)
$("#js-inner-ship").html(`
<div class="cart-customer-total d-flex align-items-center justify-content-between">
<div>
<span class="text">Phí vận chuyển: </span>
</div>
<p class="cart-customer-total-price">${formatCurrency(priceShip) + ' đ'}</p>
</div>
<div class="text-ship d-flex justify-content-between">
<div class="text-ship-left">
Mua thêm <span class="text-red-b" style="color:yellow;font-size:14px;">${formatCurrency(minusPriceShip)} đ</span> đ đưc <span class="text-red-b" style="color:yellow;font-size:14px;"> Freeship</span>
</div>
<div class="text-ship-right">
<a href="/">Mua thêm</a>
</div>
</div>
`);
console.log(total_discount)
$(dom_target).html(formatCurrency(total_cart_price)+' đ');
$(TOTAL_CART_VALUE_NODE).html(formatCurrency(total_cart_price - total_discount + priceShip )+' đ');
}
}
}
//thay doi tong gia cua 1 san pham
function changeItemTotalPrice() {
var $row = $(this).closest(".js-item-row");
var item_type = $row.data("item_type");
var price = $row.find(".js-buy-price").attr("data-price");
var quantity = parseInt($row.find(".js-buy-quantity").val());
var total_price = price * quantity;
//loai bo so luong vo ly
if (quantity < 1) {
$row.find(".js-buy-quantity").val(0);
total_price = 0;
}
$row.find(".item-cart-price").html(formatCurrency(total_price)+' đ');
calculateCartTotalPrice();
//console.log("updating cart = " + item_type);
//save to cart
switch (item_type) {
case "product":
Hura.Cart.Product.update($row.data("item_id"), $row.data("variant_id"), {quantity: quantity,});
break;
case "deal":
Hura.Cart.Deal.update($row.data("item_id"), { quantity: quantity });
break;
case "combo":
Hura.Cart.Combo.update($row.data("item_id"), { quantity: quantity });
break;
}
//
}
//nghe thay doi so luong sp
function listenQuantityChange() {
var $track_change = $(".js-quantity-change");
//thay doi so luong sp mua, neu nhap so luong
$track_change.on("change", function (e) {
var quantity_stock = $(this).attr("data-stock");
var $row = $(this).closest(".js-item-row");
var current_quantity = $(this).val();
if($(this).val() < 1) $(this).val(1);
if(current_quantity > quantity_stock) {
alert("Bạn được mua tối đa "+ quantity_stock + " sản phẩm này");
$row.find(".js-buy-quantity").val(quantity_stock);
changeItemTotalPrice.call(this);
tinhSoLuongSanPham.call(this);
return ;
}
changeItemTotalPrice.call(this);
tinhSoLuongSanPham.call(this);
});
//thay doi so luong sp theo - hoac +
$track_change.on("click", function (e) {
if (e.target.nodeName === "INPUT") return;
var quantity_change = parseInt(this.getAttribute("data-value"));
var $row = $(this).closest(".cart-item-info");
var current_quantity = parseInt($row.find(".js-buy-quantity").val());
var quantity_stock = parseInt($row.find(".js-buy-quantity").attr("data-stock"));
//loai bo so luong vo ly
if (current_quantity + quantity_change < 1) {
$row.find(".js-buy-quantity").val(1);
return;
}
if(current_quantity + quantity_change > quantity_stock) {
alert("Bạn được mua tối đa "+ quantity_stock + " sản phẩm này");
$row.find(".js-buy-quantity").val(quantity_stock);
changeItemTotalPrice.call(this);
tinhSoLuongSanPham.call(this);
return ;
}
$row.find(".js-buy-quantity").val(current_quantity + quantity_change);
//then update
changeItemTotalPrice.call(this);
tinhSoLuongSanPham.call(this);
});
}
function downloadCartImage() {
var seconds = new Date().getTime() / 1000;
var print_url = "{{ global.domain }}/print/user.php?view=cart&f="+parseInt(seconds)+"&uid="+Hura.User.getUserId();
window.location = "https://screenshot.hurasoft.com/screenshot.php?url=" + encodeURIComponent(print_url);
}
//nghe xoa san pham
function listenDeleteCartItem() {
$(".item-cart-icon").on("click", function () {
var $row = $(this).closest(".cart-item-info");
var item_type = $row.data("item_type");
var item_id = $row.data("item_id");
calculateCartTotalPrice();
//console.log("deleting item from cart = " + item_type);
var deleteStatus;
//save to cart
switch (item_type) {
case "product":
deleteStatus = Hura.Cart.Product.remove(
item_id,
$row.data("variant_id")
);
location.reload();
break;
case "deal":
deleteStatus = Hura.Cart.Deal.remove(item_id);
location.reload();
break;
case "combo":
deleteStatus = Hura.Cart.Combo.remove(item_id);
location.reload();
break;
}
if (deleteStatus) {
deleteStatus.then(function () {
$row.remove();
tinhSoLuongSanPham();
});
}
});
}
// Voucher
function debounce(func, wait, immediate) {
var timeout;
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
if (!immediate) func.apply(context, args);
};
var callNow = immediate && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
if (callNow) func.apply(context, args);
};
};
function voucher_input_change() {
$('#js_voucher_input').change();
}
function listenVoucherCode(dom_node) {
var cart_total_before_fee_discount = $("#js-total-before-fee-discount").val();
var $message_holder = $("#js-voucher-message");
var check_deal = 0
$(".js-item-row").each(function(){
var check = $(this).attr("data-check-deal")
if (check == 1) {
check_deal = 1;
}
})
$(dom_node).change(debounce(function(){
if (check_deal == 1) {
$message_holder.html('<span class="red">Mã voucher không được áp dụng. Vui lòng xóa sản phẩm DEAL trong giỏ hàng</span>');
} else{
var voucher_code = this.value.trim();
//update field to send when submit
$("#js_coupon_code").val(voucher_code);
$("#js-discount-voucher").val(0);
$("#price-discount").html('');
$message_holder.html('');
//xu ly hien thi
if(voucher_code.length > 2) {
var params = {
action_type: 'check',
code : voucher_code ,
order_value : cart_total_before_fee_discount,
product_ids : ''
}
Hura.Ajax.post('coupon', params).then(function (data) {
//console.log(data);
var voucher_info = data;
if(voucher_info.status == 'error') {
//bao loi
$message_holder.html(voucher_info.message);
return ;
}
$message_holder.html("Bạn đang sử dụng mã coupon/voucher: <b style='color: #f00;font-size: 16px'>" + voucher_info.coupon_info.code + "</b>");
$message_holder.show();
//xu ly khac
switch (voucher_info.coupon_info.type) {
case "cash": //giam tru tien
$("#js-discount-voucher").val(Hura.Util.strToNumber(voucher_info.coupon_info.cash_discount));
$("#price-discount").html(formatCurrency(voucher_info.coupon_info.cash_discount));
break;
case "priceoff"://giam gia %
//var total_price_in_cart = $('#js-total-before-fee-discount').val();
var total_price_in_cart = {% if global.module.name == 'combo_set' %}0{% else %}{{ page.cart_summary.total_value }}{% endif%};
var after_discount = Math.ceil( total_price_in_cart * voucher_info.coupon_info.content / 100);
$("#js-discount-voucher").val(Hura.Util.strToNumber(after_discount));
$("#price-discount").html(formatCurrency(voucher_info.total_cash_discount));
break;
case "pro":
//todo:
break;
case "other":
//todo:
break;
}
calculateCartTotalPrice();
})
}else{
$("#js-discount-voucher").val(0);
$message_holder.html('');
//recalculate total
calculateCartTotalPrice();
}
}
},100));
}
function getVoucherList(holder) {
var params = {
action_type: 'get-active-list',
limit: 50
}
Hura.Ajax.post('coupon', params).then(function (response) {
//console.log(response);
buildListVoucher(response, holder);
$(".js-voucher-active").click(function(){
$(".js-voucher-active").removeClass('current-voucher');
$(this).addClass('current-voucher');
});
})
}
function buildListVoucher(response, holder) {
var html = '';
var current_time = (new Date()).getTime()/1000;
if (response.total > 0) {
Object.keys(response).forEach(function(key, keyIndex) {
var data = response[key];
Object.keys(data).forEach(function(item, itemIndex) {
var status = data[item].can_use_with_cart.status;
var code = data[item].code
var title = data[item].title;
var id_coupon = data[item].id;
var to_time = data[item].to_time;
var time_left = to_time - current_time;
var check_product = data[item].can_use_with_cart.status;
if (time_left > 0 && check_product == 'yes') {
html+=`<div class="voucher-item active-voucher js-voucher-active" onclick="voucherSelected('`+code+`')">`;
} else{
html+='<div class="voucher-item">';
}
html+= '<div class="code"> Nhập <b class="d-block text-18">'+code+'</b> </div>';
html+= '<div class="text"> <p>'+ title +'</p><i class="circle"></i></div> </div>';
})
})
} else{
html+= `
<div class="no-voucher text-center">
<i class="no-voucher-img lazy" style="background-image:url(/static/assets/default/images/cart-ticket.png)"></i>
<p class="text-20 font-600 m-0"> Chưa voucher nào ! </p>
</div>
`;
}
$(holder).html(html);
}
function convertToSlug(Text) {
// var newText = Text.split('.').join(" ");
if (Text.lastIndexOf(".") > 0) {
var newText = Text.substr(Text.lastIndexOf(".") + 2);
// console.log(newText);
} else newText = Text;
return newText
.toLowerCase()
.replace(/à|á|ạ|ả|ã|â|ầ|ấ|ậ|ẩ|ẫ|ă|ằ|ắ|ặ|ẳ|ẵ/g, "a")
.replace(/è|é|ẹ|ẻ|ẽ|ê|ề|ế|ệ|ể|ễ/g, "e")
.replace(/ì|í|ị|ỉ|ĩ/g, "i")
.replace(/ò|ó|ọ|ỏ|õ|ô|ồ|ố|ộ|ổ|ỗ|ơ|ờ|ớ|ợ|ở|ỡ/g, "o")
.replace(/ù|ú|ụ|ủ|ũ|ư|ừ|ứ|ự|ử|ữ/g, "u")
.replace(/ỳ|ý|ỵ|ỷ|ỹ/g, "y")
.replace(/đ/g, "d")
.replace(/\u0300|\u0301|\u0303|\u0309|\u0323/g, "")
.replace(/\u02C6|\u0306|\u031B/g, "")
.replace(/[^\w ]+/g, '')
.replace(/ +/g, '-');
}
function getDistrict(province_id) {
var params = {
action_type: "district-list",
province: province_id,
};
Hura.Ajax.get("province", params).then(function (data) {
var html = '';
$.each(data, function (key, item) {
html += `<li onclick="selectebDistricTg(this);" data-key="` + item.id + `">` + item.name + `</li>`;
});
$('#js-list-district-list').html(html);
})
}
function getWardListNew(district_id) {
var params = {
action_type: 'ward-list',
district: district_id
};
Hura.Ajax.get("province", params).then(function (data) {
var html = '';
$.each(data, function (key, item) {
html += `<li onclick="selectebWardTg(this);" data-key="` + item.id + `">` + item.name + `</li>`;
});
$('#js-list-ward-list').html(html);
})
}
function searchProvinceTg(elm, holder) {
let value = convertToSlug($(elm).val());
var value_comvert = value.toUpperCase();
$(holder + " li").filter(function () {
var text = $(this).text();
var text_rpl = text.replace(/\./g, ' ');
var text_cv = convertToSlug(text_rpl)
var text_comvert = text_cv.toUpperCase();
$(this).toggle(text_comvert.indexOf(value_comvert) > -1)
})
}
function provinceFocus() {
$("#js-province-tragop").focus(function () {
$("#js-list-province").show();
});
$("#js-province-tragop-ale").focus(function () {
$("#js-list-province-ale").show();
});
}
provinceFocus();
// CLICK OUTSIDE CLOSE SEARCH
function closeProvince() {
$(document).on("click", function (e) {
if(e.target != document.querySelector("#js-province-tragop") && e.target != document.querySelector("#js-search-province")) {
$("#js-list-province").css("display","none");
$(".customer-province").removeClass('active');
}
if(e.target != document.querySelector("#js-distric-tragop") && e.target != document.querySelector("#js-search-distric")) {
$("#js-list-district").css("display","none");
$(".customer-distric").removeClass('active1');
}
if(e.target != document.querySelector("#js-ward-tragop") && e.target != document.querySelector("#js-search-ward")) {
$("#js-list-ward").css("display","none");
$(".customer-ward").removeClass('active2');
}
});
}
closeProvince();
function selectebProvinCeTg(elm) {
let province_name = $(elm).text();
let key = $(elm).attr("data-key");
$("#id-province").attr("value", key);
$("#js-province-tragop").val(province_name);
$("#id-province").attr("value", key);
getDistrict(key);
$("#js-list-province").hide();
}
function districFocus() {
$("#js-distric-tragop").focus(function () {
$("#js-list-district").show();
});
}
districFocus();
function selectebDistricTg(elm) {
let distric_name = $(elm).text();
let key = $(elm).attr("data-key");
$("#js-distric-tragop").val(distric_name);
$("#id-distric").attr("value", key);
getWardListNew(key);
$("#js-list-district").hide();
checkTotalShippingFee();
}
function wardFocus() {
$("#js-ward-tragop").focus(function () {
$("#js-list-ward").show();
});
}
wardFocus();
function selectebWardTg(elm) {
let ward_name = $(elm).text();
let key = $(elm).attr("data-key");
$("#js-ward-tragop").val(ward_name);
$("#js-list-ward").hide();
}