Compare commits
13 Commits
e4c22c8d73
...
master
| Author | SHA1 | Date | |
|---|---|---|---|
| 389ac3550f | |||
|
|
dc84f6478e | ||
|
|
f16bb9cc12 | ||
| 82dc88879b | |||
| b6a590e795 | |||
| e0e22cfe44 | |||
| df655fb939 | |||
| 29b0f5b718 | |||
| 930ec14440 | |||
| 23dcb80772 | |||
| 5a4ad0b5f2 | |||
| b5bc1fabbe | |||
| a121f8052f |
32
README.md
@@ -3,6 +3,21 @@
|
||||
<h2>Mô tả</h2>
|
||||
<p>Là nơi tổng hợp các giao diện mẫu (HTML, CSS, JS) để tham khảo, sử dụng cho các dự án.</p>
|
||||
|
||||
|
||||
<h2>Hướng dẫn tạo dự án mẫu</h2>
|
||||
<p>
|
||||
Quy trình:
|
||||
<ol>
|
||||
<li>Kéo tất cả file giao diện từ Repo về máy</li>
|
||||
<li>Tạo 1 folder dự án mẫu</li>
|
||||
<li>Upload code lên Repo (<a href="#huong-dan-su-dung-git">Hướng dẫn up code sử dụng git</a>)</li>
|
||||
<li>Cắt giao diện</li>
|
||||
<li>Cuối mỗi ngày sẽ upload code đã cắt trong ngày hôm đó</li>
|
||||
</ol>
|
||||
</p>
|
||||
<p>Khi cắt 1 giao diện mẫu mới sẽ có cấu trúc các file theo thư mục "<a href="https://repo.hurasoft.com/ducdt/giao_dien_web_mau/src/branch/master/demo-ten_mau-stt_mau" target="_blank">demo-ten_mau-stt_mau</a>" đã tạo ở trên (Download folder mẫu về, chỉnh sửa các thông tin theo quy định và cắt ghép).</p>
|
||||
|
||||
|
||||
<h2>Hướng dẫn đặt tên</h2>
|
||||
<p>Mỗi thư mục sẽ đặt tên theo quy định: <strong>demo-tên_mẫu-số_thứ_tự_mẫu</strong>. Mô tả của thư mục sẽ là URL dẫn đến giao diện đã được cắt ghép hoàn chỉnh </p>
|
||||
<p>VD: Giao diện mẹ và bé, mẫu 2 </p>
|
||||
@@ -12,30 +27,27 @@
|
||||
</ul>
|
||||
|
||||
|
||||
<h2>Hướng dẫn tạo dự án mẫu</h2>
|
||||
<p>Khi cắt 1 giao diện mẫu mới sẽ có cấu trúc các file theo thư mục "<a href="https://repo.hurasoft.com/ducdt/giao_dien_web_mau/src/branch/master/demo-ten_mau-stt_mau" target="_blank">demo-ten_mau-stt_mau</a>" đã tạo ở trên (Download folder mẫu về, chỉnh sửa các thông tin theo quy định và cắt ghép).</p>
|
||||
|
||||
<h2>Quy định cấu trúc</h2>
|
||||
<p>Cấu trúc 1 dự án mẫu sẽ bao gồm các thư mục con:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://repo.hurasoft.com/ducdt/giao_dien_web_mau/src/branch/master/demo-ten_mau-stt_mau/images" style="font-weight: bold;" target="_blank">images</a> :
|
||||
<ul>
|
||||
<ul>
|
||||
<li>Chứa tất cả ảnh sử dụng cho dự án. Quy định về ảnh: Tất cả các ảnh icons (icon search, icon menu,...)</li>
|
||||
<li>Kích thước mỗi ảnh icon khi export từ figma sẽ lấy kích thước <strong>x2</strong> (Để khi sử dụng ở mobile không bị vỡ nét)</li>
|
||||
<li>Sau đó sẽ gộp chung các ảnh icon thành 1 ảnh lớn</li>
|
||||
<li>
|
||||
<p>Trong file CSS sẽ tạo 1 class chứa ảnh ở trên, background-size sẽ giảm 50% để hiển thị chính xác kích thước của icon. Khi sử dụng sẽ bắt theo tọa độ ảnh: </p>
|
||||
<p>VD: ảnh có kích thước 500x500, vị trí hiển thị icon là: x = -200px, y = 0 <br>
|
||||
<strong>.icons {background: url(../images/sprite.png) no-repeat;background-size: 250px 250px;}</strong> <br>
|
||||
<p>VD: ảnh có kích thước 500x500, vị trí hiển thị icon là: x = -200px, y = 0<br/>
|
||||
<strong>.icons {background: url(../images/sprite.png) no-repeat;background-size: 250px 250px;}</strong><br/>
|
||||
<strong>.icons.icon-search{background-position: -200px 0;}</strong>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<li>
|
||||
<a href="https://repo.hurasoft.com/ducdt/giao_dien_web_mau/src/branch/master/demo-ten_mau-stt_mau/js" style="font-weight: bold;" target="_blank">js</a>:
|
||||
<ul>
|
||||
<li>Chứa các file JS sử dụng cho dự án.</li>
|
||||
@@ -43,7 +55,7 @@
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<li>
|
||||
<a href="https://repo.hurasoft.com/ducdt/giao_dien_web_mau/src/branch/master/demo-ten_mau-stt_mau/scss" style="font-weight: bold;" target="_blank">scss</a> :
|
||||
<ul>
|
||||
<li>Chứa các file CSS sử dụng cho dự án.</li>
|
||||
@@ -52,7 +64,7 @@
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<li>
|
||||
<a href="https://repo.hurasoft.com/ducdt/giao_dien_web_mau/src/branch/master/demo-ten_mau-stt_mau/index.html" style="font-weight: bold;" target="_blank">index.html</a>:
|
||||
<ul>
|
||||
<li>Là file HTML</li>
|
||||
@@ -75,7 +87,7 @@
|
||||
<li>Chi tiết tin tức : <strong>class="article-page article-detail-page"</strong> </li>
|
||||
</ul>
|
||||
|
||||
<h2>Hướng dẫn up code sử dụng git</h2>
|
||||
<h2 id="huong-dan-su-dung-git">Hướng dẫn up code sử dụng git</h2>
|
||||
<p> Các bước up code:
|
||||
<ol>
|
||||
<li>Lấy tất cả code từ git url về máy</li>
|
||||
|
||||
25
demo-audio-01/assets/css/library.css
Normal file
1110
demo-audio-01/assets/css/style.css
Normal file
BIN
demo-audio-01/assets/images/Group 10.png
Normal file
|
After Width: | Height: | Size: 671 B |
BIN
demo-audio-01/assets/images/Group 21.png
Normal file
|
After Width: | Height: | Size: 896 B |
BIN
demo-audio-01/assets/images/Group 22.png
Normal file
|
After Width: | Height: | Size: 993 B |
BIN
demo-audio-01/assets/images/Group 25.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
demo-audio-01/assets/images/Group 26.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
demo-audio-01/assets/images/Group 27.png
Normal file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
demo-audio-01/assets/images/Group 7.png
Normal file
|
After Width: | Height: | Size: 1.2 KiB |
BIN
demo-audio-01/assets/images/Group 8.png
Normal file
|
After Width: | Height: | Size: 836 B |
BIN
demo-audio-01/assets/images/Rectangle 123.png
Normal file
|
After Width: | Height: | Size: 151 KiB |
BIN
demo-audio-01/assets/images/Vector.png
Normal file
|
After Width: | Height: | Size: 1.1 KiB |
BIN
demo-audio-01/assets/images/avatar.png
Normal file
|
After Width: | Height: | Size: 6.6 KiB |
BIN
demo-audio-01/assets/images/background-product-saleoff.png
Normal file
|
After Width: | Height: | Size: 219 KiB |
BIN
demo-audio-01/assets/images/banner_slider-home.png
Normal file
|
After Width: | Height: | Size: 778 KiB |
BIN
demo-audio-01/assets/images/brand-1.png
Normal file
|
After Width: | Height: | Size: 5.7 KiB |
BIN
demo-audio-01/assets/images/brand-2.png
Normal file
|
After Width: | Height: | Size: 6.9 KiB |
BIN
demo-audio-01/assets/images/btn-review.png
Normal file
|
After Width: | Height: | Size: 624 B |
BIN
demo-audio-01/assets/images/cart-item1.png
Normal file
|
After Width: | Height: | Size: 6.5 KiB |
BIN
demo-audio-01/assets/images/da-thong-bao.png
Normal file
|
After Width: | Height: | Size: 7.5 KiB |
BIN
demo-audio-01/assets/images/danhmuc_10.png
Normal file
|
After Width: | Height: | Size: 5.4 KiB |
BIN
demo-audio-01/assets/images/danhmuc_2.png
Normal file
|
After Width: | Height: | Size: 5.7 KiB |
BIN
demo-audio-01/assets/images/danhmuc_3.png
Normal file
|
After Width: | Height: | Size: 4.5 KiB |
BIN
demo-audio-01/assets/images/danhmuc_4.png
Normal file
|
After Width: | Height: | Size: 3.3 KiB |
BIN
demo-audio-01/assets/images/danhmuc_5.png
Normal file
|
After Width: | Height: | Size: 3.1 KiB |
BIN
demo-audio-01/assets/images/danhmuc_6.png
Normal file
|
After Width: | Height: | Size: 7.3 KiB |
BIN
demo-audio-01/assets/images/danhmuc_7.png
Normal file
|
After Width: | Height: | Size: 5.0 KiB |
BIN
demo-audio-01/assets/images/danhmuc_8.png
Normal file
|
After Width: | Height: | Size: 5.3 KiB |
BIN
demo-audio-01/assets/images/danhmuc_9.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
BIN
demo-audio-01/assets/images/fire-deal.png
Normal file
|
After Width: | Height: | Size: 881 B |
BIN
demo-audio-01/assets/images/flag_vn (1).png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
demo-audio-01/assets/images/group_icon_star.png
Normal file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
demo-audio-01/assets/images/icon-deal (1).png
Normal file
|
After Width: | Height: | Size: 580 B |
BIN
demo-audio-01/assets/images/icon-deal.png
Normal file
|
After Width: | Height: | Size: 580 B |
BIN
demo-audio-01/assets/images/icon_2023.png
Normal file
|
After Width: | Height: | Size: 7.1 KiB |
BIN
demo-audio-01/assets/images/icon_phone.png
Normal file
|
After Width: | Height: | Size: 850 B |
BIN
demo-audio-01/assets/images/icon_search.png
Normal file
|
After Width: | Height: | Size: 794 B |
BIN
demo-audio-01/assets/images/icon_ship.png
Normal file
|
After Width: | Height: | Size: 905 B |
BIN
demo-audio-01/assets/images/images-cate-homepage.png
Normal file
|
After Width: | Height: | Size: 166 KiB |
BIN
demo-audio-01/assets/images/item product.png
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
demo-audio-01/assets/images/list-star.png
Normal file
|
After Width: | Height: | Size: 957 B |
BIN
demo-audio-01/assets/images/logo.png
Normal file
|
After Width: | Height: | Size: 5.0 KiB |
BIN
demo-audio-01/assets/images/menu_sale.png
Normal file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
demo-audio-01/assets/images/product-image.png
Normal file
|
After Width: | Height: | Size: 19 KiB |
BIN
demo-audio-01/assets/images/star_rating.png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
1984
demo-audio-01/index.html
Normal file
766
demo-audio-01/js/cart.js
Normal file
@@ -0,0 +1,766 @@
|
||||
|
||||
$(".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 có mã 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();
|
||||
}
|
||||
|
||||
367
demo-audio-01/js/global.js
Normal file
@@ -0,0 +1,367 @@
|
||||
|
||||
// LAZY LOADING BLOCK ELEMENT
|
||||
var lazy_load_group = [];
|
||||
|
||||
var lazyLoadInstance = new LazyLoad({
|
||||
elements_selector: ".lazy"
|
||||
});
|
||||
|
||||
|
||||
lazy_load_group.push(
|
||||
{
|
||||
id: 'js-deal-box',
|
||||
target: '#js-deal-box',
|
||||
loadFn: function () {
|
||||
getDealProduct();
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
//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;
|
||||
}
|
||||
}
|
||||
|
||||
//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 tên chứa ký tự đặc biệt
|
||||
var nameRegex = /[^a-z0-9A-Z_ÀÁÂÃÈÉÊÌÍÒÓÔÕÙÚĂĐĨŨƠàáâãèéêìíòóôõùúăđĩũơƯĂẠẢẤẦẨẪẬẮẰẲẴẶẸẺẼỀỀỂưăạảấầẩẫậắằẳẵặẹẻẽềềểỄỆỈỊỌỎỐỒỔỖỘỚỜỞỠỢỤỦỨỪễếệỉịọỏốồổỗộớờởỡợụủứừỬỮỰỲỴÝỶỸửữựỳỵỷỹ]/u;
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// ADD ITEM TO CART SUCCESS FORM
|
||||
var successForm = document.querySelector(".success-form");
|
||||
function cartButton(idCart) {
|
||||
Hura.Cart.Product.add(idCart, 0, { quantity: 1 }).then(function (
|
||||
add_status
|
||||
) {
|
||||
if (add_status.status === "error") {
|
||||
alert("Đã tồn tại sản phẩm trong giỏ hàng");
|
||||
} else {
|
||||
modalSuccess();
|
||||
change_cart_amount();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// CALL MODAL SUCCESS
|
||||
function modalSuccess() {
|
||||
successForm.classList.toggle("hide");
|
||||
setTimeout(function () {
|
||||
successForm.classList.toggle("hide");
|
||||
}, 1200);
|
||||
}
|
||||
|
||||
// CHANGE AMOUNT CART HEADER
|
||||
function change_cart_amount() {
|
||||
Hura.Cart.getSummary().then(function (data) {
|
||||
if (data.total_item != 0) {
|
||||
$(".header-features-cart-amount").show().html(data.total_item);
|
||||
$(".name-amount-sp").show();
|
||||
$(".amount-sp-in-cart").show().html(""+ data.total_item +"");
|
||||
} else {
|
||||
$(".header-features-cart-amount").hide();
|
||||
$(".name-amount-sp").hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
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);
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
// GET SEARCH PRODUCT
|
||||
function searchProduct(value) {
|
||||
var params = {
|
||||
action: "search",
|
||||
action_type: "search",
|
||||
content: "product",
|
||||
q: value,
|
||||
};
|
||||
|
||||
Hura.Ajax.get("search", params).then(function (data) {
|
||||
//console.log(data.list);
|
||||
|
||||
if (data.list.length > 0) {
|
||||
$(".search-results").css("display", "block");
|
||||
var html = Hura.Template.parse(searchResultsTpl, data.list);
|
||||
Hura.Template.render(".search-results-list", html);
|
||||
} else {
|
||||
$(".search-results").css("display", "none");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
function getSearchValue() {
|
||||
$('#js-search-box').keyup(debounce(function(e){
|
||||
let value = e.target.value;
|
||||
if (value) {
|
||||
searchProduct(value);
|
||||
} else {
|
||||
$(".search-results").css("display", "none");
|
||||
}
|
||||
},200));
|
||||
}
|
||||
|
||||
|
||||
// CART HEADER POPUP
|
||||
function cartHeaderPopup() {
|
||||
$(".cart-header").on("mouseenter", function () {
|
||||
var target = ".cart-ttip-item-container";
|
||||
Hura.Cart.getCart().then(function (data) {
|
||||
if (data == 0) {
|
||||
$(target).html("<h5>Có 0 sản phẩm trong giỏ hàng</h5>");
|
||||
$(target).find("h5").attr("class", "header-null-cart");
|
||||
} else {
|
||||
var html = Hura.Template.parse(headerCartTpl, data);
|
||||
$(target).html(html);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function totalCartPopup(){
|
||||
Hura.Cart.getSummary().then(function (summary_data) {
|
||||
$("#js-header-cart-quantity").html(
|
||||
"<i>(Số lượng: " + summary_data.total_quantity + " sản phẩm)</i>"
|
||||
);
|
||||
$("#js-header-cart-total-price").html(
|
||||
summary_data.total_value.toLocaleString() + "₫"
|
||||
);
|
||||
if (summary_data.total_quantity == 0) {
|
||||
$("#btn-cart-ttip").addClass( "hide" );
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
// FIXED HEADER
|
||||
function fixed_header() {
|
||||
$(window).scroll(function () {
|
||||
var distanceFromTop = $(document).scrollTop();
|
||||
|
||||
if (distanceFromTop > 350) {
|
||||
$(".header-mid").addClass("fixed-nav");
|
||||
|
||||
} else {
|
||||
$(".header-mid").removeClass("fixed-nav");
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// FORMAT 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;
|
||||
}
|
||||
|
||||
// CONVERT STRING TO NUMBER
|
||||
function strToNumber(str) {
|
||||
str += "";
|
||||
while (str.indexOf(".") > 0) {
|
||||
str = str.replace(".", "");
|
||||
}
|
||||
var result = parseFloat(str);
|
||||
return isNaN(result) ? 0 : result;
|
||||
}
|
||||
|
||||
function checkSummary(productSummary) {
|
||||
var summary = [];
|
||||
if (productSummary) {
|
||||
var splitSummary = productSummary.split("\r\n");
|
||||
splitSummary.forEach(function (value, item) {
|
||||
if (item < 10 && 1 < 2) {
|
||||
summary.push(splitSummary[item]);
|
||||
}
|
||||
})
|
||||
}
|
||||
return summary.join("\r\n");
|
||||
}
|
||||
|
||||
// REWORK SPECIAL OFFER PRODUCT
|
||||
function checkKhuyenMai(specialOffer) {
|
||||
var offer = [];
|
||||
if (specialOffer) {
|
||||
var splitOffer = specialOffer.split("\n");
|
||||
splitOffer.forEach(function (value, item) {
|
||||
if (item < 10 && 1 < 2) {
|
||||
offer.push(`<div class="item">` + splitOffer[item] + `</div>`);
|
||||
}
|
||||
})
|
||||
}
|
||||
return offer.join('');
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// DEAL TIME DOWN
|
||||
function saleTimeDown() {
|
||||
// SET TIMER
|
||||
let timeDealLeft = parseInt($(".box-deal-home .p-item").first().attr("data-time"));
|
||||
const timer = setInterval(timeDown, 1000);
|
||||
|
||||
function timeDown() {
|
||||
// GET TIME LEFT PER SECOND
|
||||
let timeLeft = timeDealLeft;
|
||||
timeDealLeft = timeLeft - 1;
|
||||
|
||||
if ($(".global-time-deal").length) $(".global-time-deal").html(renderTimeLeft(timeLeft));
|
||||
|
||||
if (timeLeft === 0) {
|
||||
clearInterval(timer);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// RENDER HOMEPAGE TIME LEFT
|
||||
function renderTimeLeft(timeLeft) {
|
||||
const sec = String(timeLeft % 60).padStart(2, 0);
|
||||
const min = String(Math.trunc((timeLeft / 60) % 60)).padStart(2, 0);
|
||||
const hour = String(Math.trunc(timeLeft / 3600) % 24).padStart(2, 0);
|
||||
const day = String(Math.trunc(timeLeft / 86400) % 3600).padStart(2, 0);
|
||||
|
||||
const firstLetterSec = Math.floor(sec / 10);
|
||||
const secondLetterSec = sec % 10;
|
||||
const firstLetterMin = Math.floor(min / 10);
|
||||
const secondLetterMin = min % 10;
|
||||
const firstLetterHour = Math.floor(hour / 10);
|
||||
const secondLetterHour = hour % 10;
|
||||
const firstLetterDay = Math.floor(day / 10);
|
||||
const secondLetterDay = day % 10;
|
||||
|
||||
return `
|
||||
<p>${day}</p>
|
||||
<span>:</span>
|
||||
<p>${hour}</p>
|
||||
<span>:</span>
|
||||
<p>${min}</p>
|
||||
<span>:</span>
|
||||
<p>${sec}</p>
|
||||
`;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// GET HOT-DEAL PRODUCT
|
||||
function getDealProduct() {
|
||||
let params = {
|
||||
action_type: "list",
|
||||
type: "active",
|
||||
show: 20,
|
||||
}
|
||||
|
||||
let target = "#js-deal-box";
|
||||
|
||||
Hura.Ajax.get("deal", params).then(function (data) {
|
||||
//console.log(data.list);
|
||||
let html = Hura.Template.parse(productDealTpl, data.list);
|
||||
Hura.Template.render(target, html);
|
||||
|
||||
saleTimeDown();
|
||||
dealLineWidth();
|
||||
|
||||
resetImagePageDeal();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// RESET IMAGE IN PAGE DEAL
|
||||
function resetImagePageDeal() {
|
||||
if ($(".page-deal").length > 0) {
|
||||
$(".p-item .p-img").each(function(){
|
||||
let firstChild = $(this).children(":first");
|
||||
let lastChild = $(this).find(".swiper-lazy-preloader");
|
||||
let imageDataSrc = firstChild.attr("data-src");
|
||||
firstChild.attr("src", imageDataSrc);
|
||||
lastChild.css("display","none");
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// CUSTOM BOTTOM LINE PRODUCT DEAL
|
||||
function dealLineWidth() {
|
||||
$(".js-line-deal-left").each(function () {
|
||||
let quantitySaleLeft = parseInt($(this).parent().attr("data-quantity-left"));
|
||||
let quantitySaleTotal = parseInt($(this).parent().attr("data-quantity-sale-total"));
|
||||
|
||||
if (quantitySaleLeft >= 0) {
|
||||
let lineDealWidth = quantitySaleLeft / quantitySaleTotal * 100 + "%";
|
||||
$(this).css("width", lineDealWidth);
|
||||
} else {
|
||||
$(this).css("width", 0);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// SORT SELECT BOX
|
||||
function sortSelect() {
|
||||
var href = window.location.href;
|
||||
|
||||
$(".js-select-sort-item").each(function () {
|
||||
if ($(this).val() === href) {
|
||||
$(this).attr("selected", "selected");
|
||||
}
|
||||
});
|
||||
}
|
||||
sortSelect();
|
||||
238
demo-audio-01/js/homepage.js
Normal file
@@ -0,0 +1,238 @@
|
||||
|
||||
lazy_load_group.push(
|
||||
{
|
||||
id: 'js-hottpye-bestsale',
|
||||
target: '#js-hottpye-bestsale',
|
||||
loadFn: function () {
|
||||
getProductBestsale();
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
)
|
||||
|
||||
function lazyCategoryBox(){
|
||||
for (let i = 0; i <= category_to_fetch.length - 1 && 1<2; i++) {
|
||||
let idCat = category_to_fetch[i]
|
||||
lazy_load_group.push(
|
||||
{
|
||||
id: "js-product-" + idCat,
|
||||
target: "#js-product-" + idCat,
|
||||
loadFn: function () {
|
||||
getCategoryProduct(idCat)
|
||||
},
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
var swiper = new Swiper(".banner_homepage", {
|
||||
pagination: {
|
||||
el: ".swiper-pagination",
|
||||
type: "fraction",
|
||||
},
|
||||
navigation: {
|
||||
nextEl: ".swiper-button-next",
|
||||
prevEl: ".swiper-button-prev",
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
var swiper = new Swiper(".list-feedback", {
|
||||
slidesPerView: 3,
|
||||
spaceBetween: 10,
|
||||
navigation: {
|
||||
nextEl: ".swiper-button-next",
|
||||
prevEl: ".swiper-button-prev",
|
||||
},
|
||||
breakpoints: {
|
||||
1610: {
|
||||
slidesPerView: 4,
|
||||
},
|
||||
1210: {
|
||||
slidesPerView: 3,
|
||||
},
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<script>
|
||||
// SWIPER HOMEPAGE CATEGORY
|
||||
function swiperDealBox() {
|
||||
new Swiper(".swiper-deal-box", {
|
||||
slidesPerView: 4,
|
||||
spaceBetween: 12,
|
||||
rewind: true,
|
||||
speed: 1000,
|
||||
preloadImages: false,
|
||||
lazy: true,
|
||||
|
||||
navigation: {
|
||||
nextEl: ".swiper-button-next",
|
||||
prevEl: ".swiper-button-prev",
|
||||
},
|
||||
breakpoints: {
|
||||
1200: {
|
||||
slidesPerView: 4,
|
||||
},
|
||||
1600: {
|
||||
slidesPerView: 5,
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
swiperDealBox();
|
||||
</script>
|
||||
|
||||
<script>
|
||||
// AJAX CATEGORY BOX - NEW PRODUCT
|
||||
function getProductBestsale() {
|
||||
var params = {
|
||||
action_type: "product-list",
|
||||
hotType: "bestsale",
|
||||
sort: "order",
|
||||
page: 1,
|
||||
show: 12,
|
||||
};
|
||||
var target = "#js-hottpye-bestsale";
|
||||
Hura.Ajax.get("product", params).then(function (data) {
|
||||
//console.log(data.list);
|
||||
if (data.total == 0) {
|
||||
$(target).html(
|
||||
`<h3 class="box-empty d-flex align-items-center justify-content-center">Sản phẩm đang được cập nhật...!</h3>`
|
||||
);
|
||||
} else {
|
||||
var html = Hura.Template.parse(productBestSale, data.list.splice(0, 4));
|
||||
Hura.Template.render(target, html);
|
||||
let total = data.total;
|
||||
$("#total").html(`${total}`);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
// AJAX CATEGORY BOX - HOT PRODUCT
|
||||
function getCategoryProduct(id) {
|
||||
var params = {
|
||||
action_type: "product-list",
|
||||
category: id,
|
||||
|
||||
};
|
||||
var target = "#js-product-hot-" + id;
|
||||
var targetSmall = "#js-product-" + id;
|
||||
|
||||
Hura.Ajax.get("product", params).then(function (data) {
|
||||
//console.log(data.list);
|
||||
if (data.total == 0) {
|
||||
$(target).html(
|
||||
`<h3 class="box-empty d-flex align-items-center justify-content-center">Sản phẩm đang được cập nhật...!</h3>`
|
||||
);
|
||||
|
||||
$(targetSmall).html(
|
||||
`<h3 class="box-empty d-flex align-items-center justify-content-center">Sản phẩm đang được cập nhật...!</h3>`
|
||||
);
|
||||
|
||||
} else {
|
||||
|
||||
var html = Hura.Template.parse(listHotCategoryHome, data.list.splice(0,1));
|
||||
Hura.Template.render(target, html);
|
||||
let quantity_change_btns = $(`#js-product-hot-${id}`).find(".js-quantity-change");
|
||||
quantity_change_btns.each(function(){
|
||||
$(this).addClass(`js-quantity-change-${id}`);
|
||||
$('.js-buy-quantity').addClass(`js-quantity-change-${id}`);
|
||||
})
|
||||
listenQuantityBuy(id);
|
||||
|
||||
|
||||
var htmlSmall = Hura.Template.parse(listCategoryHome, data.list.splice(0,6));
|
||||
Hura.Template.render(targetSmall, htmlSmall);
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
// ADD PRODUCT TO CART - PRODUCT DETAILS
|
||||
function addProductToCart(product_id, variant_id_fake, props) {
|
||||
let props_quantity = parseInt($(`.js-buy-quantity-temp-${product_id}`).attr("value"));
|
||||
let stockQuantity = parseInt($(".bk-check-out-of-stock").attr("value"));
|
||||
console.log(props_quantity);
|
||||
|
||||
var variant_id = 0;
|
||||
var data = $('.js-variant-option-container input[type="hidden"]').val();
|
||||
if (data) {
|
||||
var newData = JSON.parse(data)
|
||||
variant_id = newData.variant_id;
|
||||
}
|
||||
|
||||
if (stockQuantity) {
|
||||
var product_props = {
|
||||
quantity: props_quantity,
|
||||
buyer_note: "",
|
||||
};
|
||||
|
||||
Hura.Cart.Product.add(product_id, variant_id, product_props).then(function (
|
||||
response
|
||||
) {
|
||||
// Error response
|
||||
if (response.status === "error") {
|
||||
if (response.error_type == "item-in-cart") {
|
||||
alert("Sản phẩm đã trong giỏ hàng");
|
||||
} else if (response.error_type == "invalid-item-id")
|
||||
alert("ID sản phẩm không đúng");
|
||||
else alert(response.message);
|
||||
}
|
||||
// Success response
|
||||
else {
|
||||
modalSuccess();
|
||||
change_cart_amount();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
alert("Sản phẩm không có sẵn. Vui lòng liên hệ. Xin cảm ơn!")
|
||||
}
|
||||
}
|
||||
|
||||
// LANG NGHE THAY DOI SO LUONG SP
|
||||
function listenQuantityBuy(id) {
|
||||
|
||||
let $track_change = $(`.js-quantity-change-${id}`);
|
||||
|
||||
//thay doi so luong sp mua, neu nhap so luong
|
||||
$track_change.on("change", function (e) {
|
||||
let $row1 = $(this).closest(".cart-quantity-select");
|
||||
if($(this).val() < 1 && 1<2) $(this).val(1);
|
||||
$row1.find(".js-buy-quantity-temp").attr("value", e.target.value);
|
||||
});
|
||||
|
||||
//thay doi so luong sp theo - hoac +
|
||||
$track_change.on("click", function (e) {
|
||||
|
||||
if (e.target.nodeName === "INPUT") return;
|
||||
|
||||
let quantity_change = parseInt(this.getAttribute("data-value"));
|
||||
let $row = $(this).closest(".cart-quantity-select");
|
||||
let current_quantity = parseInt($row.find(".js-buy-quantity").val());
|
||||
|
||||
|
||||
//loai bo so luong vo ly
|
||||
if(current_quantity + quantity_change < 1 && 1 < 2) {
|
||||
$(".js-buy-quantity").val(1);
|
||||
return ;
|
||||
}
|
||||
|
||||
let totalQuantity = current_quantity + quantity_change;
|
||||
|
||||
$row.find(".js-buy-quantity").val(totalQuantity);
|
||||
$row.find(".js-buy-quantity-temp").attr("value", totalQuantity);
|
||||
});
|
||||
}
|
||||
21
demo-audio-01/js/library.js
Normal file
753
demo-audio-01/js/product_detail.js
Normal file
@@ -0,0 +1,753 @@
|
||||
|
||||
lazy_load_group.push(
|
||||
{
|
||||
id: 'js-bottom-product-box',
|
||||
target: '#js-bottom-product-box',
|
||||
loadFn: function () {
|
||||
getRelativeProduct();
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
id: 'js-review-holder',
|
||||
target: '#js-review-holder',
|
||||
loadFn: function () {
|
||||
getRatingComment();
|
||||
},
|
||||
},
|
||||
)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// GET PRODUCT RELATIVE
|
||||
function getRelativeProduct() {
|
||||
var categoryID = parseInt($('.section-details').attr('data-item_category-id'));
|
||||
var params = {
|
||||
action_type: "product-list",
|
||||
category: categoryID,
|
||||
};
|
||||
|
||||
var target = "#js-bottom-product-box";
|
||||
|
||||
Hura.Ajax.get("product", params).then(function (data) {
|
||||
//console.log(data.list)
|
||||
var currentProductID = parseInt($('.section-details').attr('data-item_id'));
|
||||
var newDataList = data.list.filter(item => item.id !== currentProductID);
|
||||
|
||||
if (data.list.length > 0) {
|
||||
var html = Hura.Template.parse(listRelativeProduct, newDataList);
|
||||
Hura.Template.render(target, html);
|
||||
} else {
|
||||
$("#js-bottom-product-box").html(`<p class="alert-mess">Sản phẩm đang cập nhập</p>`)
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// SWIPER BOTTOM PRODUCT BOX
|
||||
function productBottomBoxSwiper() {
|
||||
new Swiper(".bottom-product-box-swiper", {
|
||||
slidesPerView: 4,
|
||||
spaceBetween: 12,
|
||||
rewind: true,
|
||||
navigation: {
|
||||
nextEl: ".swiper-button-next",
|
||||
prevEl: ".swiper-button-prev",
|
||||
},
|
||||
breakpoints: {
|
||||
// when window width is >= 1600px
|
||||
1600: {
|
||||
slidesPerView: 5,
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
const galleryTop = new Swiper(".gallery-top", {
|
||||
spaceBetween: 16,
|
||||
slidesPerView: 1,
|
||||
thumbs: {
|
||||
swiper: galleryThumbs,
|
||||
},
|
||||
// AUTO SILDED AT FISRT AND END
|
||||
on: {
|
||||
slideChange: function () {
|
||||
let activeIndex = this.activeIndex + 1;
|
||||
|
||||
let activeSlide = document.querySelector(
|
||||
`.gallery-thumbs .swiper-slide:nth-child(${activeIndex})`
|
||||
);
|
||||
let nextSlide = document.querySelector(
|
||||
`.gallery-thumbs .swiper-slide:nth-child(${activeIndex + 1})`
|
||||
);
|
||||
let prevSlide = document.querySelector(
|
||||
`.gallery-thumbs .swiper-slide:nth-child(${activeIndex - 1})`
|
||||
);
|
||||
|
||||
if (
|
||||
nextSlide &&
|
||||
!nextSlide.classList.contains("swiper-slide-visible")
|
||||
) {
|
||||
this.thumbs.swiper.slideNext();
|
||||
} else if (
|
||||
prevSlide &&
|
||||
!prevSlide.classList.contains("swiper-slide-visible")
|
||||
) {
|
||||
this.thumbs.swiper.slidePrev();
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
// FANCY-BOX
|
||||
function fancyBox() {
|
||||
Fancybox.bind('[data-fancybox="gallery"]', {
|
||||
Toolbar: {
|
||||
display: [
|
||||
{
|
||||
id: "counter",
|
||||
position: "center",
|
||||
},
|
||||
"zoom",
|
||||
"slideshow",
|
||||
"fullscreen",
|
||||
"thumbs",
|
||||
"close",
|
||||
],
|
||||
},
|
||||
//click: "unset",
|
||||
on: {
|
||||
initLayout: (fancybox) => {
|
||||
// Create left column
|
||||
const $leftCol = document.createElement("div");
|
||||
$leftCol.classList.add("fancybox__leftCol");
|
||||
|
||||
while (fancybox.$container.firstChild) {
|
||||
$leftCol.appendChild(fancybox.$container.firstChild);
|
||||
}
|
||||
|
||||
// Add elements to DOM
|
||||
fancybox.$container.appendChild(fancybox.$backdrop);
|
||||
fancybox.$container.appendChild($leftCol);
|
||||
fancybox.$leftCol = $leftCol;
|
||||
},
|
||||
"Carousel.ready Carousel.change": (fancybox, carousel, slideIndex) => {
|
||||
// Get index of the current gallery item
|
||||
slideIndex =
|
||||
slideIndex === undefined
|
||||
? carousel.options.initialPage
|
||||
: slideIndex;
|
||||
|
||||
// console.log(slideIndex);
|
||||
// Get link related to current item
|
||||
const $trigger = fancybox.items[slideIndex].$trigger;
|
||||
|
||||
// Get data from `data-info` attribute
|
||||
const data = $trigger.dataset.info || "";
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
fancyBox();
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// ADD PRODUCT TO CART - PRODUCT DETAILS
|
||||
function addProductToCart(product_id, variant_id_fake, props) {
|
||||
const props_quantity = parseInt($(".js-buy-quantity-temp").attr("value"));
|
||||
const stockQuantity = parseInt($(".bk-check-out-of-stock").attr("value"));
|
||||
//console.log(stockQuantity);
|
||||
|
||||
var variant_id = 0;
|
||||
var data = $('.js-variant-option-container input[type="hidden"]').val();
|
||||
if (data) {
|
||||
var newData = JSON.parse(data)
|
||||
variant_id = newData.variant_id;
|
||||
}
|
||||
|
||||
if (stockQuantity) {
|
||||
var product_props = {
|
||||
quantity: props_quantity,
|
||||
buyer_note: "",
|
||||
};
|
||||
|
||||
Hura.Cart.Product.add(product_id, variant_id, product_props).then(function (
|
||||
response
|
||||
) {
|
||||
// Error response
|
||||
if (response.status === "error") {
|
||||
if (response.error_type == "item-in-cart") {
|
||||
alert("Sản phẩm đã trong giỏ hàng");
|
||||
} else if (response.error_type == "invalid-item-id")
|
||||
alert("ID sản phẩm không đúng");
|
||||
else alert(response.message);
|
||||
}
|
||||
// Success response
|
||||
else {
|
||||
modalSuccess();
|
||||
change_cart_amount();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
alert("Sản phẩm không có sẵn. Vui lòng chọn sản phẩm khác hoặc liên hệ. Xin cảm ơn!")
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// BUY NOW
|
||||
function buyNow(product_id, variant_id_fake, props) {
|
||||
addProductToCart(product_id, variant_id_fake, props);
|
||||
const stockQuantityCheck = parseInt($(".bk-check-out-of-stock").attr("value"));
|
||||
if (stockQuantityCheck) {
|
||||
setTimeout(function () {
|
||||
window.location.href = "./cart";
|
||||
}, 1500);
|
||||
}
|
||||
}
|
||||
|
||||
// LANG NGHE THAY DOI SO LUONG SP
|
||||
function listenQuantityBuy() {
|
||||
const $track_change = $(".js-quantity-change");
|
||||
|
||||
//thay doi so luong sp mua, neu nhap so luong
|
||||
$track_change.on("change", function (e) {
|
||||
if($(this).val() < 1 && 1<2) $(this).val(1);
|
||||
$(".js-buy-quantity-temp").attr("value", e.target.value);
|
||||
});
|
||||
|
||||
//thay doi so luong sp theo - hoac +
|
||||
$track_change.on("click", function (e) {
|
||||
if (e.target.nodeName === "INPUT") return;
|
||||
|
||||
let quantity_change = parseInt(this.getAttribute("data-value"));
|
||||
let $row = $(this).closest(".cart-quantity-select");
|
||||
let current_quantity = parseInt($row.find(".js-buy-quantity").val());
|
||||
|
||||
//loai bo so luong vo ly
|
||||
if(current_quantity + quantity_change < 1 && 1 < 2) {
|
||||
$(".js-buy-quantity").val(1);
|
||||
return ;
|
||||
}
|
||||
|
||||
let totalQuantity = current_quantity + quantity_change;
|
||||
|
||||
$row.find(".js-buy-quantity").val(totalQuantity);
|
||||
$(".js-buy-quantity-temp").attr("value", totalQuantity);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function renReplyReview(new_replies){
|
||||
var html = '';
|
||||
|
||||
new_replies.forEach(function(value,item){
|
||||
var check_user = `<span class="avatar">
|
||||
<b class="avatar-user">`+value.user_name+`</b>
|
||||
</span>
|
||||
<b class="name">`+value.user_name+`</b>`;
|
||||
if (value.is_user_admin == 1) {
|
||||
check_user = `<i class="cmt-logo"></i>
|
||||
<b class="name">`+value.user_name+`</b>
|
||||
<i class="qtv">QTV</i>`
|
||||
}
|
||||
|
||||
if(value.is_user_admin == 1 || value.approved == 1){
|
||||
html += `
|
||||
<div class="item_reply">
|
||||
<div class="comment_right">
|
||||
<div class="comment-name">
|
||||
`+check_user+`
|
||||
</div>
|
||||
|
||||
<div class="reply-content">`+value.content+`</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
})
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
|
||||
// COMMENT KHÁCH HÀNG
|
||||
|
||||
const is_admin_login = "no";
|
||||
const customer_info = 0;
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
|
||||
|
||||
$(".comment-form textarea").focus(function(){
|
||||
$(this).parent().find(".form-input").show();
|
||||
});
|
||||
|
||||
layComment({{ page.product_info.productId }}, "product", "", "", "new");
|
||||
$("#js-show-comment").click(function(){
|
||||
$("#js-box-review").toggle();
|
||||
});
|
||||
|
||||
$("#comment_keyword").keydown(function(e){
|
||||
if(e.keyCode==13){
|
||||
var search_field = $(".search-comment select").val();
|
||||
var keyword = $("#comment_keyword").val();
|
||||
//console.log(search_field +"---"+keyword);
|
||||
layComment({{ page.product_info.productId }},keyword,search_field,'new');
|
||||
}
|
||||
});
|
||||
|
||||
$(".comment-action-list .sort a").click(function(){
|
||||
$(".comment-action-list .sort a").removeClass("current");
|
||||
$(this).addClass("current");
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
function checkReply(is_admin_login, customer_info, replyTo) {
|
||||
var formReply = "";
|
||||
if (is_admin_login == "yes") {
|
||||
formReply =`
|
||||
<div class="input-text" style="margin-bottom: 20px;align-items: center;display: flex;">
|
||||
<p style="margin: 0 10px 0 0;color: #f15a22;">Bạn đang đăng nhập là Admin</p>
|
||||
<input type=hidden id="name`+replyTo+`" value='Admin'/>
|
||||
<input type=hidden id="email`+replyTo+`" value='admin@gmail.com'/>
|
||||
|
||||
<a href="javascript:;" class="send_form" onclick="postComment(`+replyTo+`,'reply')"> Gửi bình luận </a>
|
||||
</div>
|
||||
`;
|
||||
} else if (is_admin_login == "no" && customer_info.length > 0) {
|
||||
formReply =
|
||||
`
|
||||
<div class="input-text">
|
||||
<input type=hidden id="name`+replyTo+`" value=''/>
|
||||
<input type=hidden id="email`+replyTo+`" value=''/>
|
||||
|
||||
<a href="javascript:;" class="send_form" onclick="postComment(`+replyTo+`,'reply')"> Gửi bình luận </a>
|
||||
</div>
|
||||
`;
|
||||
} else
|
||||
formReply =
|
||||
`
|
||||
<div class="comment-form-input" id="comment-form-input-0" style="display: block;">
|
||||
<div class="form-group input-text">
|
||||
<input type="text" id="name`+replyTo+`" placeholder="Họ và tên" name='user_post[user_name]' class="inputText" value=""/>
|
||||
|
||||
<input type="text" id="email`+replyTo+`" placeholder="Email" name='user_post[user_email]' class="inputText" value=""/>
|
||||
|
||||
<a href="javascript:;" class="btn-send-comment send_form" onclick="postComment(`+replyTo+`,'reply')"> Gửi bình luận </a>
|
||||
</div>
|
||||
|
||||
</div>`;
|
||||
|
||||
return formReply;
|
||||
}
|
||||
|
||||
function checkReplyReview(is_admin_login, customer_info , replyTo) {
|
||||
var formReply = '';
|
||||
if( is_admin_login == 'yes') {
|
||||
formReply = `
|
||||
<p class="note">Bạn đang đăng nhập là Admin</p>
|
||||
<input type=hidden id="review-name`+replyTo+`" value='Admin'/>
|
||||
<input type=hidden id="review-email`+replyTo+`" value='admin@gmail.com'/>
|
||||
<input type="button" onclick="postReview(`+replyTo+`,'reply')" value="Gửi" class="btn-send-comment" />
|
||||
`;
|
||||
} else if ( is_admin_login == 'no' && customer_info.length > 0 ) {
|
||||
formReply = `
|
||||
<input type=hidden id="review-name`+replyTo+`" value=''/>
|
||||
<input type=hidden id="review-email`+replyTo+`" value=''/>
|
||||
<input type="button" onclick="postReview(`+replyTo+`,'reply')" value="Gửi" class="btn-send-comment" />
|
||||
`;
|
||||
} else
|
||||
formReply = `
|
||||
<div class="comment-form-input" id="comment-form-input-0" style="display: block;">
|
||||
<div class="form-group clearfix">
|
||||
<input type="text" id="review-name`+replyTo+`" name='user_post[user_name]' class="inputText" placeholder="Họ tên*" value=""/>
|
||||
<input type="text" id="review-email`+replyTo+`" name='user_post[user_email]' class="inputText" placeholder="Email*" value=""/>
|
||||
<input type="button" onclick="postReview(`+replyTo+`,'reply')" value="Gửi" class="btn-send-comment" />
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
return formReply ;
|
||||
}
|
||||
|
||||
function layComment(productId, item_type, searchText, searchField, sort) {
|
||||
var params = {
|
||||
action_type: "get",
|
||||
item_type: "product",
|
||||
item_id: productId,
|
||||
search: searchText,
|
||||
search_field: searchField,
|
||||
order_by: "new",
|
||||
};
|
||||
|
||||
Hura.Ajax.get("comment", params).then(function (data) {
|
||||
//console.log("comment - ", data);
|
||||
var html = Hura.Template.parse(commentTpl, data);
|
||||
Hura.Template.render("#comment-list", html);
|
||||
|
||||
$(".js-avatar-user").each(function () {
|
||||
var name = $(this).html().substring(0, 1);
|
||||
$(this).html(name);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function getReply(commentId) {
|
||||
var replyParams = {
|
||||
action_type: "get-reply",
|
||||
item_id: commentId,
|
||||
};
|
||||
|
||||
var target = "#reply_list_" + commentId;
|
||||
Hura.Ajax.get("comment", replyParams).then(function (data) {
|
||||
// console.log("getReply - ", data);
|
||||
var html = Hura.Template.parse(replyTpl, data);
|
||||
Hura.Template.render(target, html);
|
||||
$(".js-avatar-user").each(function () {
|
||||
var name = $(this).html().substring(0, 1);
|
||||
$(this).html(name);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function send_vote(){
|
||||
var error = "";
|
||||
var number_regex1 = /^[0]\d{9}$/i;
|
||||
var number_regex2 = /^[0]\d{10}$/i;
|
||||
var idUpload = $('#js-file-upload-id').val();
|
||||
|
||||
var check_message = document.getElementById('rating-content').value;
|
||||
if(check_message.length < 4) error += "- Bạn chưa nhập nội dung\n";
|
||||
else if(check_message.indexOf('<script') > -1) {
|
||||
error += "- Nội dung chứa các ký tự không hợp lệ, bạn vui lòng kiểm tra lại\n";
|
||||
}
|
||||
|
||||
var check_name = document.getElementById('rating-name').value;
|
||||
if(check_name.length < 4) error += "- Tên quá ngắn\n";
|
||||
else if(check_name.indexOf('<script') > -1) {
|
||||
error += "- Họ tên chứa các ký tự không hợp lệ, bạn vui lòng kiểm tra lại\n";
|
||||
}
|
||||
|
||||
var check_email = document.getElementById('rating-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";
|
||||
}
|
||||
|
||||
if(error!=''){
|
||||
alert(error);
|
||||
return false;
|
||||
}
|
||||
|
||||
var reviewParams = {
|
||||
action_type: "review",
|
||||
info : {
|
||||
item_type : 'product',
|
||||
item_id : {{ page.product_info.productId }},
|
||||
item_title : `{{ page.product_info.productName }}`,
|
||||
user_name : $("#rating-name").val(),
|
||||
user_email : $("#rating-email").val(),
|
||||
user_avatar : '',
|
||||
user_note : '',
|
||||
rate : $("#select-rate-pro input:checked").val(),
|
||||
title : `Đánh giá sản phẩm {{ page.product_info.productName }}`,
|
||||
content : $("#rating-content").val(),
|
||||
files : idUpload
|
||||
}
|
||||
}
|
||||
|
||||
Hura.Ajax.post('customer', reviewParams).then(function (data) {
|
||||
//console.log("data",data);
|
||||
alert('Bạn đã gửi thành công!'); location.reload();
|
||||
})
|
||||
}
|
||||
|
||||
function getRatingComment() {
|
||||
var params = {
|
||||
action_type: "list",
|
||||
item_id :{{ page.product_info.productId }},
|
||||
search : '',
|
||||
search_field :'',
|
||||
order_by :'new',
|
||||
numPerPage :20,
|
||||
item_type : 'product'
|
||||
};
|
||||
|
||||
|
||||
Hura.Ajax.get("review", params).then(function (data) {
|
||||
//console.log(data);
|
||||
var html = Hura.Template.parse(rating_tpl, data);
|
||||
Hura.Template.render("#js-review-holder", html);
|
||||
$(".js-avatar-user").each(function(){
|
||||
var name = $(this).html().substring(0, 1);
|
||||
$(this).html(name);
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
function postComment(id, reply) {
|
||||
if (check_field(id) == false) return false;
|
||||
if (reply == "") {
|
||||
var item_type = $(".form-post [name='user_post[item_type]']").val();
|
||||
var item_id = $(".form-post [name='user_post[item_id]']").val();
|
||||
var item_title = $(".form-post [name='user_post[item_title]']").val();
|
||||
var title = $(".form-post [name='user_post[title]']").val();
|
||||
var avatar = $(".form-post [name='user_post[user_avatar]']").val();
|
||||
var user_name = $("#name" + id).val();
|
||||
var user_email = $("#email" + id).val();
|
||||
var content = $("#content" + id).val();
|
||||
var rate = $("#rating-review0 input:checked").val();
|
||||
var idUpload = $('#js-file-upload-id').val();
|
||||
|
||||
var params = {
|
||||
action_type: "comment",
|
||||
type :"ajax",
|
||||
info: {
|
||||
item_type : 'product',
|
||||
item_id : '{{ page.product_info.productId }}',
|
||||
item_title : `{{ page.product_info.productName }}`,
|
||||
reply_to : reply_to,
|
||||
user_email : user_email,
|
||||
user_name : user_name,
|
||||
user_avatar : '',
|
||||
user_note : '',
|
||||
rate : 5,
|
||||
title : `{{ page.product_info.productName }}`,
|
||||
content : content,
|
||||
files : ''
|
||||
},
|
||||
};
|
||||
|
||||
// console.log(params);
|
||||
|
||||
Hura.Ajax.post("customer", params).then(function (data) {
|
||||
alert("Bạn đã gửi thành công");
|
||||
location.reload();
|
||||
});
|
||||
} else {
|
||||
var reply_to = id;
|
||||
var item_type = $(".form-reply" + id + "[name='user_post[item_type]']").val();
|
||||
var item_id = $(".form-reply" + id + "[name='user_post[item_id]']").val();
|
||||
var item_title = $(".form-reply" + id + "[name='user_post[item_title]']").val();
|
||||
var title = $(".form-reply" + id + "[name='user_post[title]']").val();
|
||||
var avatar = $(".form-reply" + id + "[name='user_post[user_avatar]']").val();
|
||||
var user_name = $("#name" + id).val();
|
||||
var user_email = $("#email" + id).val();
|
||||
var content = $("#content" + id).val();
|
||||
|
||||
var params = {
|
||||
action_type: "comment-reply",
|
||||
info: {
|
||||
item_type: item_type,
|
||||
item_id: item_id,
|
||||
item_title: item_title,
|
||||
reply_to: reply_to,
|
||||
user_email: user_email,
|
||||
user_name: user_name,
|
||||
user_avatar: "",
|
||||
user_note: "",
|
||||
rate: 5,
|
||||
title: title,
|
||||
content: content,
|
||||
files: "",
|
||||
},
|
||||
};
|
||||
|
||||
Hura.Ajax.post("customer", params).then(function (data) {
|
||||
alert("Bạn đã gửi thành công");
|
||||
location.reload();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
function check_field(id) {
|
||||
var error = "";
|
||||
var name = document.getElementById("name"+id).value;
|
||||
var email = document.getElementById("email"+id).value;
|
||||
var content = document.getElementById("content"+id).value;
|
||||
|
||||
if(email.length < 4) {
|
||||
error += "- Bạn chưa nhập email\n";
|
||||
}
|
||||
if(email.length > 4){
|
||||
if(validateEmail(email)==false) error += "- Email không hợp lệ\n";
|
||||
}
|
||||
|
||||
if(name.length < 4) error += "- Tên quá ngắn\n";
|
||||
else if(name.indexOf('<script') > -1) {
|
||||
error += "- Họ tên chứa các ký tự không hợp lệ, bạn vui lòng kiểm tra lại\n";
|
||||
}
|
||||
|
||||
|
||||
if(content.length < 4) error += "- Nội dung quá ngắn\n";
|
||||
else if(content.indexOf('<script') > -1) {
|
||||
error += "- Nội dung chứa các ký tự không hợp lệ, bạn vui lòng kiểm tra lại\n";
|
||||
}
|
||||
|
||||
|
||||
|
||||
if(error==''){
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
alert(error);
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
function check_field_review(id) {
|
||||
var error = "";
|
||||
var name = document.getElementById("review-name"+id).value;
|
||||
var email = document.getElementById("review-email"+id).value;
|
||||
var content = document.getElementById("review-content"+id).value;
|
||||
|
||||
if(name.length < 4) error += "- Tên quá ngắn\n";
|
||||
else if(name.indexOf('<script') > -1) {
|
||||
error += "- Họ tên chứa các ký tự không hợp lệ, bạn vui lòng kiểm tra lại\n";
|
||||
}
|
||||
|
||||
if(content.length < 4) error += "- Bạn chưa nhập nội dung\n";
|
||||
else if(content.indexOf('<script') > -1) {
|
||||
error += "- Nội dung chứa các ký tự không hợp lệ, bạn vui lòng kiểm tra lại\n";
|
||||
}
|
||||
|
||||
|
||||
if(email.length < 4) {
|
||||
error += "- Bạn chưa nhập email\n";
|
||||
}
|
||||
if(email.length > 4){
|
||||
if(validateEmail(email)==false) error += "- Email không hợp lệ\n";
|
||||
}
|
||||
|
||||
if(error==''){
|
||||
return true;
|
||||
}
|
||||
else {
|
||||
alert(error);
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
function postReview(id,reply) {
|
||||
if(check_field_review(id)==false) return false;
|
||||
var reply_to = id;
|
||||
var user_name = $("#review-name"+id).val();
|
||||
var user_email = $("#review-email"+id).val();
|
||||
var content = $("#review-content"+id).val();
|
||||
|
||||
var params = {
|
||||
action_type: "review-reply",
|
||||
type :"ajax",
|
||||
info : {
|
||||
item_type : 'product',
|
||||
item_id : '{{ page.product_info.productId }}',
|
||||
item_title : `{{ page.product_info.productName }}`,
|
||||
reply_to : reply_to,
|
||||
user_email : user_email,
|
||||
user_name : user_name,
|
||||
user_avatar : '',
|
||||
user_note : '',
|
||||
rate : 5,
|
||||
title : `{{ page.product_info.productName }}`,
|
||||
content : content,
|
||||
files : ''
|
||||
}
|
||||
}
|
||||
|
||||
Hura.Ajax.post('customer', params).then(function (data) {
|
||||
alert("Bạn đã gửi thành công");
|
||||
location.reload();
|
||||
})
|
||||
};
|
||||
|
||||
function formatDate(a) {
|
||||
var a = new Date(parseInt(a) * 1000);
|
||||
|
||||
var year = a.getFullYear();
|
||||
var month = a.getMonth() + 1;
|
||||
var date = a.getDate();
|
||||
var hour = a.getHours();
|
||||
var min = a.getMinutes();
|
||||
var sec = a.getSeconds();
|
||||
// var time = date + '/' + month + '/' + year + ' ' + hour + ':' + min + ':' + sec ;
|
||||
var time = date + "/" + month + "/" + year;
|
||||
return time;
|
||||
}
|
||||
|
||||
function closeFormCommentInput() {
|
||||
$(".form-input").hide();
|
||||
}
|
||||
|
||||
function showFormReply(a) {
|
||||
$("#" + a).show();
|
||||
}
|
||||
|
||||
function showReplyForm(id){
|
||||
var element = $("#reply-comment-"+id);
|
||||
$("#reply-comment-"+id).toggle();
|
||||
}
|
||||
|
||||
function closeCommentFormInput(a){
|
||||
$(a).hide();
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// GET TIME NOW
|
||||
function getTimeDealLeftProduct() {
|
||||
const timeDealEndProduct = parseInt($('.section-details').attr("data-item_time-deal-end"));
|
||||
const timeNow = (new Date().getTime()) / 1000;
|
||||
const timeDealLeftProduct = timeDealEndProduct - timeNow;
|
||||
|
||||
$(".bk-data-product-hidden .p-item").attr("data-time", timeDealLeftProduct);
|
||||
}
|
||||
|
||||
|
||||
// GET HOT-DEAL PRODUCT
|
||||
function getDetailDealInfo(id) {
|
||||
let params = {
|
||||
action_type: "info",
|
||||
type: "active",
|
||||
id: id,
|
||||
}
|
||||
|
||||
let target = "#deal-line-detail";
|
||||
|
||||
Hura.Ajax.get("deal", params).then(function (data) {
|
||||
if (data.quantity > data.sale_quantity) {
|
||||
let html = Hura.Template.parse(dealLineDetail, data);
|
||||
Hura.Template.render(target, html);
|
||||
} else {
|
||||
$('.box-add-number-sp').remove();
|
||||
$('.product-buy').remove();
|
||||
}
|
||||
|
||||
|
||||
saleTimeDown();
|
||||
dealLineWidth();
|
||||
|
||||
resetImagePageDeal();
|
||||
});
|
||||
}
|
||||
|
||||
{% if page.product_info.sale_rules.type == 'deal' %}
|
||||
getDetailDealInfo({{ page.product_info.sale_rules.type_id }});
|
||||
{% endif %}
|
||||
25
demo-audio-1/Demoaudio Mẫu 1/assets/css/library.css
Normal file
1110
demo-audio-1/Demoaudio Mẫu 1/assets/css/style.css
Normal file
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Group 10.png
Normal file
|
After Width: | Height: | Size: 671 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Group 21.png
Normal file
|
After Width: | Height: | Size: 896 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Group 22.png
Normal file
|
After Width: | Height: | Size: 993 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Group 25.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Group 26.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Group 27.png
Normal file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Group 7.png
Normal file
|
After Width: | Height: | Size: 1.2 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Group 8.png
Normal file
|
After Width: | Height: | Size: 836 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Rectangle 123.png
Normal file
|
After Width: | Height: | Size: 151 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/Vector.png
Normal file
|
After Width: | Height: | Size: 1.1 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/avatar.png
Normal file
|
After Width: | Height: | Size: 6.6 KiB |
|
After Width: | Height: | Size: 219 KiB |
|
After Width: | Height: | Size: 778 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/brand-1.png
Normal file
|
After Width: | Height: | Size: 5.7 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/brand-2.png
Normal file
|
After Width: | Height: | Size: 6.9 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/btn-review.png
Normal file
|
After Width: | Height: | Size: 624 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/cart-item1.png
Normal file
|
After Width: | Height: | Size: 6.5 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/da-thong-bao.png
Normal file
|
After Width: | Height: | Size: 7.5 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/danhmuc_10.png
Normal file
|
After Width: | Height: | Size: 5.4 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/danhmuc_2.png
Normal file
|
After Width: | Height: | Size: 5.7 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/danhmuc_3.png
Normal file
|
After Width: | Height: | Size: 4.5 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/danhmuc_4.png
Normal file
|
After Width: | Height: | Size: 3.3 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/danhmuc_5.png
Normal file
|
After Width: | Height: | Size: 3.1 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/danhmuc_6.png
Normal file
|
After Width: | Height: | Size: 7.3 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/danhmuc_7.png
Normal file
|
After Width: | Height: | Size: 5.0 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/danhmuc_8.png
Normal file
|
After Width: | Height: | Size: 5.3 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/danhmuc_9.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/fire-deal.png
Normal file
|
After Width: | Height: | Size: 881 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/flag_vn (1).png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/group_icon_star.png
Normal file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/icon-deal (1).png
Normal file
|
After Width: | Height: | Size: 580 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/icon-deal.png
Normal file
|
After Width: | Height: | Size: 580 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/icon_2023.png
Normal file
|
After Width: | Height: | Size: 7.1 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/icon_phone.png
Normal file
|
After Width: | Height: | Size: 850 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/icon_search.png
Normal file
|
After Width: | Height: | Size: 794 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/icon_ship.png
Normal file
|
After Width: | Height: | Size: 905 B |
|
After Width: | Height: | Size: 166 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/item product.png
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/list-star.png
Normal file
|
After Width: | Height: | Size: 957 B |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/logo.png
Normal file
|
After Width: | Height: | Size: 5.0 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/menu_sale.png
Normal file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/product-image.png
Normal file
|
After Width: | Height: | Size: 19 KiB |
BIN
demo-audio-1/Demoaudio Mẫu 1/assets/images/star_rating.png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
1984
demo-audio-1/Demoaudio Mẫu 1/index.html
Normal file
766
demo-audio-1/Demoaudio Mẫu 1/js/cart.js
Normal file
@@ -0,0 +1,766 @@
|
||||
|
||||
$(".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 có mã 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();
|
||||
}
|
||||
|
||||
367
demo-audio-1/Demoaudio Mẫu 1/js/global.js
Normal file
@@ -0,0 +1,367 @@
|
||||
|
||||
// LAZY LOADING BLOCK ELEMENT
|
||||
var lazy_load_group = [];
|
||||
|
||||
var lazyLoadInstance = new LazyLoad({
|
||||
elements_selector: ".lazy"
|
||||
});
|
||||
|
||||
|
||||
lazy_load_group.push(
|
||||
{
|
||||
id: 'js-deal-box',
|
||||
target: '#js-deal-box',
|
||||
loadFn: function () {
|
||||
getDealProduct();
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
//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;
|
||||
}
|
||||
}
|
||||
|
||||
//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 tên chứa ký tự đặc biệt
|
||||
var nameRegex = /[^a-z0-9A-Z_ÀÁÂÃÈÉÊÌÍÒÓÔÕÙÚĂĐĨŨƠàáâãèéêìíòóôõùúăđĩũơƯĂẠẢẤẦẨẪẬẮẰẲẴẶẸẺẼỀỀỂưăạảấầẩẫậắằẳẵặẹẻẽềềểỄỆỈỊỌỎỐỒỔỖỘỚỜỞỠỢỤỦỨỪễếệỉịọỏốồổỗộớờởỡợụủứừỬỮỰỲỴÝỶỸửữựỳỵỷỹ]/u;
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// ADD ITEM TO CART SUCCESS FORM
|
||||
var successForm = document.querySelector(".success-form");
|
||||
function cartButton(idCart) {
|
||||
Hura.Cart.Product.add(idCart, 0, { quantity: 1 }).then(function (
|
||||
add_status
|
||||
) {
|
||||
if (add_status.status === "error") {
|
||||
alert("Đã tồn tại sản phẩm trong giỏ hàng");
|
||||
} else {
|
||||
modalSuccess();
|
||||
change_cart_amount();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// CALL MODAL SUCCESS
|
||||
function modalSuccess() {
|
||||
successForm.classList.toggle("hide");
|
||||
setTimeout(function () {
|
||||
successForm.classList.toggle("hide");
|
||||
}, 1200);
|
||||
}
|
||||
|
||||
// CHANGE AMOUNT CART HEADER
|
||||
function change_cart_amount() {
|
||||
Hura.Cart.getSummary().then(function (data) {
|
||||
if (data.total_item != 0) {
|
||||
$(".header-features-cart-amount").show().html(data.total_item);
|
||||
$(".name-amount-sp").show();
|
||||
$(".amount-sp-in-cart").show().html(""+ data.total_item +"");
|
||||
} else {
|
||||
$(".header-features-cart-amount").hide();
|
||||
$(".name-amount-sp").hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
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);
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
// GET SEARCH PRODUCT
|
||||
function searchProduct(value) {
|
||||
var params = {
|
||||
action: "search",
|
||||
action_type: "search",
|
||||
content: "product",
|
||||
q: value,
|
||||
};
|
||||
|
||||
Hura.Ajax.get("search", params).then(function (data) {
|
||||
//console.log(data.list);
|
||||
|
||||
if (data.list.length > 0) {
|
||||
$(".search-results").css("display", "block");
|
||||
var html = Hura.Template.parse(searchResultsTpl, data.list);
|
||||
Hura.Template.render(".search-results-list", html);
|
||||
} else {
|
||||
$(".search-results").css("display", "none");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
function getSearchValue() {
|
||||
$('#js-search-box').keyup(debounce(function(e){
|
||||
let value = e.target.value;
|
||||
if (value) {
|
||||
searchProduct(value);
|
||||
} else {
|
||||
$(".search-results").css("display", "none");
|
||||
}
|
||||
},200));
|
||||
}
|
||||
|
||||
|
||||
// CART HEADER POPUP
|
||||
function cartHeaderPopup() {
|
||||
$(".cart-header").on("mouseenter", function () {
|
||||
var target = ".cart-ttip-item-container";
|
||||
Hura.Cart.getCart().then(function (data) {
|
||||
if (data == 0) {
|
||||
$(target).html("<h5>Có 0 sản phẩm trong giỏ hàng</h5>");
|
||||
$(target).find("h5").attr("class", "header-null-cart");
|
||||
} else {
|
||||
var html = Hura.Template.parse(headerCartTpl, data);
|
||||
$(target).html(html);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function totalCartPopup(){
|
||||
Hura.Cart.getSummary().then(function (summary_data) {
|
||||
$("#js-header-cart-quantity").html(
|
||||
"<i>(Số lượng: " + summary_data.total_quantity + " sản phẩm)</i>"
|
||||
);
|
||||
$("#js-header-cart-total-price").html(
|
||||
summary_data.total_value.toLocaleString() + "₫"
|
||||
);
|
||||
if (summary_data.total_quantity == 0) {
|
||||
$("#btn-cart-ttip").addClass( "hide" );
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
// FIXED HEADER
|
||||
function fixed_header() {
|
||||
$(window).scroll(function () {
|
||||
var distanceFromTop = $(document).scrollTop();
|
||||
|
||||
if (distanceFromTop > 350) {
|
||||
$(".header-mid").addClass("fixed-nav");
|
||||
|
||||
} else {
|
||||
$(".header-mid").removeClass("fixed-nav");
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// FORMAT 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;
|
||||
}
|
||||
|
||||
// CONVERT STRING TO NUMBER
|
||||
function strToNumber(str) {
|
||||
str += "";
|
||||
while (str.indexOf(".") > 0) {
|
||||
str = str.replace(".", "");
|
||||
}
|
||||
var result = parseFloat(str);
|
||||
return isNaN(result) ? 0 : result;
|
||||
}
|
||||
|
||||
function checkSummary(productSummary) {
|
||||
var summary = [];
|
||||
if (productSummary) {
|
||||
var splitSummary = productSummary.split("\r\n");
|
||||
splitSummary.forEach(function (value, item) {
|
||||
if (item < 10 && 1 < 2) {
|
||||
summary.push(splitSummary[item]);
|
||||
}
|
||||
})
|
||||
}
|
||||
return summary.join("\r\n");
|
||||
}
|
||||
|
||||
// REWORK SPECIAL OFFER PRODUCT
|
||||
function checkKhuyenMai(specialOffer) {
|
||||
var offer = [];
|
||||
if (specialOffer) {
|
||||
var splitOffer = specialOffer.split("\n");
|
||||
splitOffer.forEach(function (value, item) {
|
||||
if (item < 10 && 1 < 2) {
|
||||
offer.push(`<div class="item">` + splitOffer[item] + `</div>`);
|
||||
}
|
||||
})
|
||||
}
|
||||
return offer.join('');
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// DEAL TIME DOWN
|
||||
function saleTimeDown() {
|
||||
// SET TIMER
|
||||
let timeDealLeft = parseInt($(".box-deal-home .p-item").first().attr("data-time"));
|
||||
const timer = setInterval(timeDown, 1000);
|
||||
|
||||
function timeDown() {
|
||||
// GET TIME LEFT PER SECOND
|
||||
let timeLeft = timeDealLeft;
|
||||
timeDealLeft = timeLeft - 1;
|
||||
|
||||
if ($(".global-time-deal").length) $(".global-time-deal").html(renderTimeLeft(timeLeft));
|
||||
|
||||
if (timeLeft === 0) {
|
||||
clearInterval(timer);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// RENDER HOMEPAGE TIME LEFT
|
||||
function renderTimeLeft(timeLeft) {
|
||||
const sec = String(timeLeft % 60).padStart(2, 0);
|
||||
const min = String(Math.trunc((timeLeft / 60) % 60)).padStart(2, 0);
|
||||
const hour = String(Math.trunc(timeLeft / 3600) % 24).padStart(2, 0);
|
||||
const day = String(Math.trunc(timeLeft / 86400) % 3600).padStart(2, 0);
|
||||
|
||||
const firstLetterSec = Math.floor(sec / 10);
|
||||
const secondLetterSec = sec % 10;
|
||||
const firstLetterMin = Math.floor(min / 10);
|
||||
const secondLetterMin = min % 10;
|
||||
const firstLetterHour = Math.floor(hour / 10);
|
||||
const secondLetterHour = hour % 10;
|
||||
const firstLetterDay = Math.floor(day / 10);
|
||||
const secondLetterDay = day % 10;
|
||||
|
||||
return `
|
||||
<p>${day}</p>
|
||||
<span>:</span>
|
||||
<p>${hour}</p>
|
||||
<span>:</span>
|
||||
<p>${min}</p>
|
||||
<span>:</span>
|
||||
<p>${sec}</p>
|
||||
`;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// GET HOT-DEAL PRODUCT
|
||||
function getDealProduct() {
|
||||
let params = {
|
||||
action_type: "list",
|
||||
type: "active",
|
||||
show: 20,
|
||||
}
|
||||
|
||||
let target = "#js-deal-box";
|
||||
|
||||
Hura.Ajax.get("deal", params).then(function (data) {
|
||||
//console.log(data.list);
|
||||
let html = Hura.Template.parse(productDealTpl, data.list);
|
||||
Hura.Template.render(target, html);
|
||||
|
||||
saleTimeDown();
|
||||
dealLineWidth();
|
||||
|
||||
resetImagePageDeal();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// RESET IMAGE IN PAGE DEAL
|
||||
function resetImagePageDeal() {
|
||||
if ($(".page-deal").length > 0) {
|
||||
$(".p-item .p-img").each(function(){
|
||||
let firstChild = $(this).children(":first");
|
||||
let lastChild = $(this).find(".swiper-lazy-preloader");
|
||||
let imageDataSrc = firstChild.attr("data-src");
|
||||
firstChild.attr("src", imageDataSrc);
|
||||
lastChild.css("display","none");
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// CUSTOM BOTTOM LINE PRODUCT DEAL
|
||||
function dealLineWidth() {
|
||||
$(".js-line-deal-left").each(function () {
|
||||
let quantitySaleLeft = parseInt($(this).parent().attr("data-quantity-left"));
|
||||
let quantitySaleTotal = parseInt($(this).parent().attr("data-quantity-sale-total"));
|
||||
|
||||
if (quantitySaleLeft >= 0) {
|
||||
let lineDealWidth = quantitySaleLeft / quantitySaleTotal * 100 + "%";
|
||||
$(this).css("width", lineDealWidth);
|
||||
} else {
|
||||
$(this).css("width", 0);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// SORT SELECT BOX
|
||||
function sortSelect() {
|
||||
var href = window.location.href;
|
||||
|
||||
$(".js-select-sort-item").each(function () {
|
||||
if ($(this).val() === href) {
|
||||
$(this).attr("selected", "selected");
|
||||
}
|
||||
});
|
||||
}
|
||||
sortSelect();
|
||||