product.js
3.19 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
var phoneInput = document.querySelector('#cardProduct [type="tel"]');
var counter = document.querySelector('#cardProduct .product-counter__input');
var price = 0;
$('#order-product').click(function (e){
e.preventDefault();
var message='Сума: ';
message += $('#cardProduct .product-counter__value').text();
message +='\nКод товара: ' + $('#product-code').val();
message +='\nКількість: ' + counter.querySelector('input').value;
console.log(message + phoneInput.value);
var phone = '+38' + phoneInput.value;
if(phone.length===17){
console.log('good')
}
})
if (phoneInput) {
phoneInput.addEventListener('input', phoneHandleInput);
}
$('#cardProduct').on('show.bs.modal', function (e) {
var button = $(e.relatedTarget);
price = button.data('price');
$('#cardProduct .product-counter__value').data('price', price);
var itemPrice = counter.parentElement.querySelector('.product-counter__value');
itemPrice.innerHTML = `${price} ${itemPrice.dataset.currency}`;
counter.querySelector('input').value = 1;
var sku = button.data('sku');
$('#product-code').val(sku);
$('#cardProduct .product-code').text('Код товара ' + sku);
})
if(counter){
counterFunc(counter);
}
function phoneHandleInput(e) {
e.target.value = phoneMasks(e.target.value);
}
function phoneMasks(phone) {
return phone.replace(/\D/g, '')
.replace(/^(\d)/, '($1')
.replace(/^(\(\d{3})(\d)/, '$1)$2')
.replace(/(\d{3})(\d{1,7})/, '$1-$2')
.replace(/(-\d{2})(\d{1,7})/, '$1-$2')
.replace(/(-\d{2})\d+?$/, '$1');
}
function counterFunc(counter) {
var itemPrice = counter.parentElement.querySelector('.product-counter__value');
itemPrice.innerHTML = `${price} ${itemPrice.dataset.currency}`;
counter.querySelector('input').value = 1;
counter.addEventListener('input', counterHandleInput);
counter.addEventListener('change', counterHandleChange);
counter.querySelector('.product-counter__increment').addEventListener('click', increment);
counter.querySelector('.product-counter__decrement').addEventListener('click', decrement);
function counterHandleInput(e) {
e.target.value = e.target.value.replace(/\D/g, '');
updateSummary();
}
function counterHandleChange(e) {
var value = e.target.value.replace(/\D/g, '');
if (value == 0) {
e.target.value = 1;
}
updateSummary();
}
function increment(e) {
e.preventDefault();
var value = Number(counter.querySelector('input').value);
counter.querySelector('input').value = value + 1;
updateSummary();
}
function decrement(e) {
e.preventDefault();
var value = Number(counter.querySelector('input').value);
if (value > 1) {
counter.querySelector('input').value = value - 1;
updateSummary();
}
}
function updateSummary() {
var amount = counter.querySelector('input').value;
if (amount >= 1) {
var oldSum = Number(price);
var newSum = String(oldSum * amount);
itemPrice.innerHTML = `${newSum} ${itemPrice.dataset.currency}`;
}
}
}