@alexsab-ru/scripts 0.8.5 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/README.md +153 -153
- package/README_RU.md +153 -153
- package/index.js +4 -4
- package/lib/analytics.js +111 -111
- package/lib/calltouch.js +73 -73
- package/lib/cookie.js +51 -51
- package/lib/form.js +336 -334
- package/package.json +29 -29
package/lib/form.js
CHANGED
|
@@ -1,335 +1,337 @@
|
|
|
1
|
-
import { getCookie, setCookie, deleteCookie } from './cookie';
|
|
2
|
-
import { createRequest } from './calltouch';
|
|
3
|
-
import { reachGoal, getFormDataObject } from './analytics';
|
|
4
|
-
|
|
5
|
-
export const noValidPhone = (phoneValue) => {
|
|
6
|
-
return ([...new Set(phoneValue.replace(/^(\+7)/g, "").replace(/\D/g, ""))].length === 1);
|
|
7
|
-
};
|
|
8
|
-
|
|
9
|
-
export function maskphone(e) {
|
|
10
|
-
let num = this.value.replace(/^(\+7|8|7)/g, "").replace(/\D/g, "").split(/(?=.)/),
|
|
11
|
-
i = num.length;
|
|
12
|
-
|
|
13
|
-
if(this.value != "" && this.value != "+") {
|
|
14
|
-
if (0 <= i) num.unshift("+7");
|
|
15
|
-
if (1 <= i) num.splice(1, 0, " ");
|
|
16
|
-
if (4 <= i) num.splice(5, 0, " ");
|
|
17
|
-
if (7 <= i) num.splice(9, 0, "-");
|
|
18
|
-
if (9 <= i) num.splice(12, 0, "-");
|
|
19
|
-
this.value = num.join("");
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
export const phoneChecker = (phone) => {
|
|
25
|
-
let form = phone.closest("form");
|
|
26
|
-
if (!phone.value.length) {
|
|
27
|
-
showErrorMes(form, ".phone", "Телефон является обязательным полем");
|
|
28
|
-
return false;
|
|
29
|
-
} else {
|
|
30
|
-
const phoneRe = new RegExp(/^\+7 [0-9]{3} [0-9]{3}-[0-9]{2}-[0-9]{2}$/);
|
|
31
|
-
if (!phoneRe.test(phone.value) || noValidPhone(phone.value)) {
|
|
32
|
-
showErrorMes(form, ".phone", "Введен некорректный номер телефона");
|
|
33
|
-
return false;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
showErrorMes(form, ".phone", "");
|
|
37
|
-
return true;
|
|
38
|
-
};
|
|
39
|
-
|
|
40
|
-
// TEXTAREA
|
|
41
|
-
const minLengthTextareaField = 10; // минимальное кол-во символов
|
|
42
|
-
// проверка на минимальное кол-во символов и скрытие ошибки
|
|
43
|
-
const checkTextareaLength = (textarea, minLength) => {
|
|
44
|
-
if (textarea.value.length >= minLength) {
|
|
45
|
-
textarea.nextSibling.nextElementSibling.classList.add("hidden");
|
|
46
|
-
}
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
// BUTTON
|
|
50
|
-
// Состояние кнопки
|
|
51
|
-
const stateBtn = (btn, value, disable = false) => {
|
|
52
|
-
if (btn.tagName == 'INPUT') {
|
|
53
|
-
btn.value = value;
|
|
54
|
-
btn.disabled = disable;
|
|
55
|
-
} else {
|
|
56
|
-
btn.innerText = value;
|
|
57
|
-
if (disable) {
|
|
58
|
-
btn.setAttribute('disabled', true);
|
|
59
|
-
} else {
|
|
60
|
-
btn.removeAttribute('disabled');
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
|
-
};
|
|
64
|
-
|
|
65
|
-
const showErrorMes = (form, el, text) => {
|
|
66
|
-
let field = form.querySelector(el);
|
|
67
|
-
field.innerText = text;
|
|
68
|
-
field.classList.remove("hidden");
|
|
69
|
-
};
|
|
70
|
-
|
|
71
|
-
const showMessageModal = (messageModal, icon, message) => {
|
|
72
|
-
document.querySelectorAll(".modal-overlay").forEach((el) => {
|
|
73
|
-
el.classList.add("hidden");
|
|
74
|
-
});
|
|
75
|
-
messageModal
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
document.querySelectorAll("input[name=
|
|
103
|
-
|
|
104
|
-
element.addEventListener("
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
const
|
|
142
|
-
|
|
143
|
-
const
|
|
144
|
-
const
|
|
145
|
-
|
|
146
|
-
if (!phoneChecker(phone)) {
|
|
147
|
-
return;
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
if (props.validation && typeof props.validation === 'function') {
|
|
151
|
-
props.validation(form);
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
// если флажок не установлен - фронт
|
|
155
|
-
if (!agree.checked) {
|
|
156
|
-
showErrorMes(form, "." + props.agreeSelector, "Чтобы продолжить, установите флажок");
|
|
157
|
-
return;
|
|
158
|
-
}
|
|
159
|
-
|
|
160
|
-
stateBtn(btn, "Отправляем...", true);
|
|
161
|
-
|
|
162
|
-
// Отпрвка цели что форма submit только после всех проверок
|
|
163
|
-
reachGoal("form_submit");
|
|
164
|
-
|
|
165
|
-
let formData = new FormData(form);
|
|
166
|
-
let sendMailCookie = props.sendMailCookie;
|
|
167
|
-
if(formData.get('dealer')) {
|
|
168
|
-
sendMailCookie += "_" + formData.get('dealer');
|
|
169
|
-
}
|
|
170
|
-
if(getCookie('fta')) {
|
|
171
|
-
formData.append("fta", true);
|
|
172
|
-
}
|
|
173
|
-
if(getCookie('__gtm_campaign_url')) {
|
|
174
|
-
let source = new URL(getCookie('__gtm_campaign_url'));
|
|
175
|
-
source.search.slice(1).split("&").forEach(function(pair) {
|
|
176
|
-
let param = pair.split("=");
|
|
177
|
-
formData.append(param[0], param[1]);
|
|
178
|
-
});
|
|
179
|
-
}
|
|
180
|
-
formData.append(
|
|
181
|
-
"page_url",
|
|
182
|
-
window.location.origin + window.location.pathname
|
|
183
|
-
);
|
|
184
|
-
|
|
185
|
-
if(typeof window.re != 'undefined') {
|
|
186
|
-
formData.append("re", window.re);
|
|
187
|
-
}
|
|
188
|
-
|
|
189
|
-
window.location.search
|
|
190
|
-
.slice(1)
|
|
191
|
-
.split("&")
|
|
192
|
-
.forEach(function (pair) {
|
|
193
|
-
let param = pair.split("=");
|
|
194
|
-
if(formData.get(param[0])){
|
|
195
|
-
formData.set(param[0], decodeURIComponent(param[1]));
|
|
196
|
-
} else {
|
|
197
|
-
formData.append(param[0], decodeURIComponent(param[1]));
|
|
198
|
-
}
|
|
199
|
-
});
|
|
200
|
-
|
|
201
|
-
let formDataObj = {};
|
|
202
|
-
try {
|
|
203
|
-
// Отправка заявки на обратный возов в CallTouch
|
|
204
|
-
if(props.ct_routeKey != '') {
|
|
205
|
-
const requestData = await createRequest(props.ct_routeKey, phone.value, props.verbose);
|
|
206
|
-
formData.append("ct_callback", true);
|
|
207
|
-
formData.append("ctw_createRequest", JSON.stringify(requestData));
|
|
208
|
-
} else {
|
|
209
|
-
throw new Error('Empty ct_routeKey');
|
|
210
|
-
}
|
|
211
|
-
} catch (error) {
|
|
212
|
-
if(props.ct_routeKey != '') {
|
|
213
|
-
formData.append("ctw_createRequest", error);
|
|
214
|
-
}
|
|
215
|
-
props.verbose && console.error("Error during request Calltouch callback:", error);
|
|
216
|
-
formDataObj = getFormDataObject(formData, form.id);
|
|
217
|
-
}
|
|
218
|
-
|
|
219
|
-
const params = new URLSearchParams([...formData]);
|
|
220
|
-
|
|
221
|
-
await fetch(url, {
|
|
222
|
-
method: "POST",
|
|
223
|
-
mode: "cors",
|
|
224
|
-
cache: "no-cache",
|
|
225
|
-
credentials: "same-origin",
|
|
226
|
-
headers: {
|
|
227
|
-
"Content-Type": "application/x-www-form-urlencoded",
|
|
228
|
-
},
|
|
229
|
-
body: params,
|
|
230
|
-
})
|
|
231
|
-
.then((res) => res.json())
|
|
232
|
-
.then((data) => {
|
|
233
|
-
props.verbose && console.log(data);
|
|
234
|
-
stateBtn(btn, btnText);
|
|
235
|
-
if (data.answer == "required") {
|
|
236
|
-
reachGoal("form_required");
|
|
237
|
-
showErrorMes(form, data.field, data.message);
|
|
238
|
-
return;
|
|
239
|
-
} else if (data.answer == "error") {
|
|
240
|
-
reachGoal("form_error");
|
|
241
|
-
|
|
242
|
-
// Вызов callback_error при ошибке
|
|
243
|
-
if (props.callback_error && typeof props.callback_error === 'function') {
|
|
244
|
-
props.callback_error(data);
|
|
245
|
-
} else if (messageModal) {
|
|
246
|
-
showMessageModal(messageModal, errorIcon, errorText + "<br>" + data.error);
|
|
247
|
-
}
|
|
248
|
-
return;
|
|
249
|
-
} else {
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
}
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
}
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
}
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
//
|
|
298
|
-
|
|
299
|
-
//
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
1
|
+
import { getCookie, setCookie, deleteCookie } from './cookie';
|
|
2
|
+
import { createRequest } from './calltouch';
|
|
3
|
+
import { reachGoal, getFormDataObject } from './analytics';
|
|
4
|
+
|
|
5
|
+
export const noValidPhone = (phoneValue) => {
|
|
6
|
+
return ([...new Set(phoneValue.replace(/^(\+7)/g, "").replace(/\D/g, ""))].length === 1);
|
|
7
|
+
};
|
|
8
|
+
|
|
9
|
+
export function maskphone(e) {
|
|
10
|
+
let num = this.value.replace(/^(\+7|8|7)/g, "").replace(/\D/g, "").split(/(?=.)/),
|
|
11
|
+
i = num.length;
|
|
12
|
+
|
|
13
|
+
if(this.value != "" && this.value != "+") {
|
|
14
|
+
if (0 <= i) num.unshift("+7");
|
|
15
|
+
if (1 <= i) num.splice(1, 0, " ");
|
|
16
|
+
if (4 <= i) num.splice(5, 0, " ");
|
|
17
|
+
if (7 <= i) num.splice(9, 0, "-");
|
|
18
|
+
if (9 <= i) num.splice(12, 0, "-");
|
|
19
|
+
this.value = num.join("");
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
export const phoneChecker = (phone) => {
|
|
25
|
+
let form = phone.closest("form");
|
|
26
|
+
if (!phone.value.length) {
|
|
27
|
+
showErrorMes(form, ".phone", "Телефон является обязательным полем");
|
|
28
|
+
return false;
|
|
29
|
+
} else {
|
|
30
|
+
const phoneRe = new RegExp(/^\+7 [0-9]{3} [0-9]{3}-[0-9]{2}-[0-9]{2}$/);
|
|
31
|
+
if (!phoneRe.test(phone.value) || noValidPhone(phone.value)) {
|
|
32
|
+
showErrorMes(form, ".phone", "Введен некорректный номер телефона");
|
|
33
|
+
return false;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
showErrorMes(form, ".phone", "");
|
|
37
|
+
return true;
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
// TEXTAREA
|
|
41
|
+
const minLengthTextareaField = 10; // минимальное кол-во символов
|
|
42
|
+
// проверка на минимальное кол-во символов и скрытие ошибки
|
|
43
|
+
const checkTextareaLength = (textarea, minLength) => {
|
|
44
|
+
if (textarea.value.length >= minLength) {
|
|
45
|
+
textarea.nextSibling.nextElementSibling.classList.add("hidden");
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
|
|
49
|
+
// BUTTON
|
|
50
|
+
// Состояние кнопки
|
|
51
|
+
const stateBtn = (btn, value, disable = false) => {
|
|
52
|
+
if (btn.tagName == 'INPUT') {
|
|
53
|
+
btn.value = value;
|
|
54
|
+
btn.disabled = disable;
|
|
55
|
+
} else {
|
|
56
|
+
btn.innerText = value;
|
|
57
|
+
if (disable) {
|
|
58
|
+
btn.setAttribute('disabled', true);
|
|
59
|
+
} else {
|
|
60
|
+
btn.removeAttribute('disabled');
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
};
|
|
64
|
+
|
|
65
|
+
export const showErrorMes = (form, el, text) => {
|
|
66
|
+
let field = form.querySelector(el);
|
|
67
|
+
field.innerText = text;
|
|
68
|
+
field.classList.remove("hidden");
|
|
69
|
+
};
|
|
70
|
+
|
|
71
|
+
export const showMessageModal = (messageModal, icon, message) => {
|
|
72
|
+
document.querySelectorAll(".modal-overlay").forEach((el) => {
|
|
73
|
+
el.classList.add("hidden");
|
|
74
|
+
});
|
|
75
|
+
if(messageModal){
|
|
76
|
+
messageModal.querySelector("#icon").innerHTML = icon;
|
|
77
|
+
messageModal.querySelector("p").innerHTML = message;
|
|
78
|
+
messageModal.classList.remove("hidden");
|
|
79
|
+
}
|
|
80
|
+
};
|
|
81
|
+
|
|
82
|
+
const propsParams = {
|
|
83
|
+
callback: null,
|
|
84
|
+
callback_error: null,
|
|
85
|
+
validation: null,
|
|
86
|
+
ct_routeKey: '',
|
|
87
|
+
confirmModalText: '',
|
|
88
|
+
verbose: false,
|
|
89
|
+
agreeSelector: "agree",
|
|
90
|
+
sendMailCookie: "SEND_MAIL",
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
export const errorIcon = '<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52"><path fill="#ed1c24" d="M26,0A26,26,0,1,0,52,26,26,26,0,0,0,26,0Zm9.6,17.5a1.94,1.94,0,0,1,2,2,2,2,0,1,1-2-2Zm-19.2,0a1.94,1.94,0,0,1,2,2,2,2,0,1,1-2-2ZM39.65,40.69a.93.93,0,0,1-.45.11,1,1,0,0,1-.89-.55,13.81,13.81,0,0,0-24.62,0,1,1,0,1,1-1.78-.9,15.8,15.8,0,0,1,28.18,0A1,1,0,0,1,39.65,40.69Z"></path></svg>';
|
|
94
|
+
export const successIcon = '<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52"><path fill="#279548" d="M26,0A26,26,0,1,0,52,26,26,26,0,0,0,26,0Zm9.6,17.5a1.94,1.94,0,0,1,2,2,2,2,0,1,1-2-2Zm-19.2,0a2,2,0,1,1-2,2A2,2,0,0,1,16.4,17.5ZM40.09,32.15a15.8,15.8,0,0,1-28.18,0,1,1,0,0,1,1.78-.9,13.81,13.81,0,0,0,24.62,0,1,1,0,1,1,1.78.9Z"></path></svg>';
|
|
95
|
+
export const errorText = '<b class="text-bold block text-2xl mb-4">Упс!</b> Что-то пошло не так. Перезагрузите страницу и попробуйте снова. ';
|
|
96
|
+
export const successText = '<b class="text-bold block text-2xl mb-4">Спасибо!</b> В скором времени мы свяжемся с Вами!';
|
|
97
|
+
export const messageModal = document.getElementById("message-modal");
|
|
98
|
+
|
|
99
|
+
export const connectForms = (url, props = propsParams) => {
|
|
100
|
+
props = {...propsParams, ...props};
|
|
101
|
+
|
|
102
|
+
document.querySelectorAll("input[name=phone]").forEach(function (element) {
|
|
103
|
+
// element.addEventListener("focus", maskphone);
|
|
104
|
+
element.addEventListener("input", maskphone);
|
|
105
|
+
element.addEventListener("change", () => phoneChecker(element));
|
|
106
|
+
});
|
|
107
|
+
|
|
108
|
+
// AGREE CHECKBOX
|
|
109
|
+
// Проверка на состояние чекбокса, показ/скрытие ошибки
|
|
110
|
+
document.querySelectorAll("input[name=" + props.agreeSelector + "]").forEach(function (element) {
|
|
111
|
+
let errorMes = element.parentElement.querySelector("." + props.agreeSelector);
|
|
112
|
+
element.addEventListener("change", (e) => {
|
|
113
|
+
if (!e.target.checked) {
|
|
114
|
+
errorMes.classList.remove("hidden");
|
|
115
|
+
} else {
|
|
116
|
+
errorMes.classList.add("hidden");
|
|
117
|
+
}
|
|
118
|
+
});
|
|
119
|
+
});
|
|
120
|
+
|
|
121
|
+
// CHANGE textarea для всез браузеров
|
|
122
|
+
document.querySelectorAll("textarea").forEach(function (textarea) {
|
|
123
|
+
if (textarea.addEventListener) {
|
|
124
|
+
textarea.addEventListener(
|
|
125
|
+
"input",
|
|
126
|
+
function () {
|
|
127
|
+
// event handling code for sane browsers
|
|
128
|
+
checkTextareaLength(textarea, minLengthTextareaField);
|
|
129
|
+
},
|
|
130
|
+
false
|
|
131
|
+
);
|
|
132
|
+
} else if (textarea.attachEvent) {
|
|
133
|
+
textarea.attachEvent("onpropertychange", function () {
|
|
134
|
+
// IE-specific event handling code
|
|
135
|
+
checkTextareaLength(textarea, minLengthTextareaField);
|
|
136
|
+
});
|
|
137
|
+
}
|
|
138
|
+
});
|
|
139
|
+
|
|
140
|
+
async function submitForm(form){
|
|
141
|
+
const btn = form.querySelector('[type="submit"]');
|
|
142
|
+
const btnText = btn.value || btn.innerText;
|
|
143
|
+
const agree = form.querySelector('[name="' + props.agreeSelector + '"]');
|
|
144
|
+
const phone = form.querySelector('[name="phone"]');
|
|
145
|
+
|
|
146
|
+
if (!phoneChecker(phone)) {
|
|
147
|
+
return;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
if (props.validation && typeof props.validation === 'function') {
|
|
151
|
+
props.validation(form);
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
// если флажок не установлен - фронт
|
|
155
|
+
if (!agree.checked) {
|
|
156
|
+
showErrorMes(form, "." + props.agreeSelector, "Чтобы продолжить, установите флажок");
|
|
157
|
+
return;
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
stateBtn(btn, "Отправляем...", true);
|
|
161
|
+
|
|
162
|
+
// Отпрвка цели что форма submit только после всех проверок
|
|
163
|
+
reachGoal("form_submit");
|
|
164
|
+
|
|
165
|
+
let formData = new FormData(form);
|
|
166
|
+
let sendMailCookie = props.sendMailCookie;
|
|
167
|
+
if(formData.get('dealer')) {
|
|
168
|
+
sendMailCookie += "_" + formData.get('dealer');
|
|
169
|
+
}
|
|
170
|
+
if(getCookie('fta')) {
|
|
171
|
+
formData.append("fta", true);
|
|
172
|
+
}
|
|
173
|
+
if(getCookie('__gtm_campaign_url')) {
|
|
174
|
+
let source = new URL(getCookie('__gtm_campaign_url'));
|
|
175
|
+
source.search.slice(1).split("&").forEach(function(pair) {
|
|
176
|
+
let param = pair.split("=");
|
|
177
|
+
formData.append(param[0], param[1]);
|
|
178
|
+
});
|
|
179
|
+
}
|
|
180
|
+
formData.append(
|
|
181
|
+
"page_url",
|
|
182
|
+
window.location.origin + window.location.pathname
|
|
183
|
+
);
|
|
184
|
+
|
|
185
|
+
if(typeof window.re != 'undefined') {
|
|
186
|
+
formData.append("re", window.re);
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
window.location.search
|
|
190
|
+
.slice(1)
|
|
191
|
+
.split("&")
|
|
192
|
+
.forEach(function (pair) {
|
|
193
|
+
let param = pair.split("=");
|
|
194
|
+
if(formData.get(param[0])){
|
|
195
|
+
formData.set(param[0], decodeURIComponent(param[1]));
|
|
196
|
+
} else {
|
|
197
|
+
formData.append(param[0], decodeURIComponent(param[1]));
|
|
198
|
+
}
|
|
199
|
+
});
|
|
200
|
+
|
|
201
|
+
let formDataObj = {};
|
|
202
|
+
try {
|
|
203
|
+
// Отправка заявки на обратный возов в CallTouch
|
|
204
|
+
if(props.ct_routeKey != '') {
|
|
205
|
+
const requestData = await createRequest(props.ct_routeKey, phone.value, props.verbose);
|
|
206
|
+
formData.append("ct_callback", true);
|
|
207
|
+
formData.append("ctw_createRequest", JSON.stringify(requestData));
|
|
208
|
+
} else {
|
|
209
|
+
throw new Error('Empty ct_routeKey');
|
|
210
|
+
}
|
|
211
|
+
} catch (error) {
|
|
212
|
+
if(props.ct_routeKey != '') {
|
|
213
|
+
formData.append("ctw_createRequest", error);
|
|
214
|
+
}
|
|
215
|
+
props.verbose && console.error("Error during request Calltouch callback:", error);
|
|
216
|
+
formDataObj = getFormDataObject(formData, form.id);
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
const params = new URLSearchParams([...formData]);
|
|
220
|
+
|
|
221
|
+
await fetch(url, {
|
|
222
|
+
method: "POST",
|
|
223
|
+
mode: "cors",
|
|
224
|
+
cache: "no-cache",
|
|
225
|
+
credentials: "same-origin",
|
|
226
|
+
headers: {
|
|
227
|
+
"Content-Type": "application/x-www-form-urlencoded",
|
|
228
|
+
},
|
|
229
|
+
body: params,
|
|
230
|
+
})
|
|
231
|
+
.then((res) => res.json())
|
|
232
|
+
.then((data) => {
|
|
233
|
+
props.verbose && console.log(data);
|
|
234
|
+
stateBtn(btn, btnText);
|
|
235
|
+
if (data.answer == "required") {
|
|
236
|
+
reachGoal("form_required");
|
|
237
|
+
showErrorMes(form, data.field, data.message);
|
|
238
|
+
return;
|
|
239
|
+
} else if (data.answer == "error") {
|
|
240
|
+
reachGoal("form_error");
|
|
241
|
+
|
|
242
|
+
// Вызов callback_error при ошибке
|
|
243
|
+
if (props.callback_error && typeof props.callback_error === 'function') {
|
|
244
|
+
props.callback_error(data);
|
|
245
|
+
} else if (messageModal) {
|
|
246
|
+
showMessageModal(messageModal, errorIcon, errorText + "<br>" + data.error);
|
|
247
|
+
}
|
|
248
|
+
return;
|
|
249
|
+
} else {
|
|
250
|
+
if(data.attention != true) {
|
|
251
|
+
reachGoal("form_success", formDataObj);
|
|
252
|
+
}
|
|
253
|
+
setCookie(sendMailCookie, true, {'domain': window.location.hostname,'path':'/','expires':600});
|
|
254
|
+
// Вызов callback при успехе
|
|
255
|
+
if (props.callback && typeof props.callback === 'function') {
|
|
256
|
+
props.callback(data);
|
|
257
|
+
} else if (messageModal) {
|
|
258
|
+
showMessageModal(messageModal, successIcon, successText);
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
form.reset();
|
|
262
|
+
})
|
|
263
|
+
.catch((error) => {
|
|
264
|
+
reachGoal("form_error");
|
|
265
|
+
console.error("Ошибка отправки данных формы: " + error);
|
|
266
|
+
deleteCookie(sendMailCookie);
|
|
267
|
+
// Вызов callback_error при ошибке
|
|
268
|
+
if (props.callback_error && typeof props.callback_error === 'function') {
|
|
269
|
+
props.callback_error(data);
|
|
270
|
+
} else if (messageModal) {
|
|
271
|
+
showMessageModal(messageModal, errorIcon, errorText + "<br>" + error);
|
|
272
|
+
}
|
|
273
|
+
stateBtn(btn, btnText);
|
|
274
|
+
});
|
|
275
|
+
return false;
|
|
276
|
+
}
|
|
277
|
+
|
|
278
|
+
async function sendForm(form) {
|
|
279
|
+
let formData = new FormData(form);
|
|
280
|
+
let sendMailCookie = props.sendMailCookie;
|
|
281
|
+
if(formData.get('dealer')) {
|
|
282
|
+
sendMailCookie += "_" + formData.get('dealer');
|
|
283
|
+
}
|
|
284
|
+
if (getCookie(sendMailCookie)) {
|
|
285
|
+
const confirmModal = document.getElementById('confirm-modal');
|
|
286
|
+
if (confirmModal) {
|
|
287
|
+
confirmModal.querySelector('p').innerHTML = props.confirmModalText || '<span style="color: tomato; font-weight: bold">ПЕРЕДАЙ ТЕКСТ В ОБЪЕКТЕ <br><pre style="color: black; font-weight: 400">props = {confirmModalText: <i>"text"</i>}</pre></span>';
|
|
288
|
+
confirmModal.classList.remove("hidden");
|
|
289
|
+
|
|
290
|
+
const accept = confirmModal.querySelector('#accept-confirm');
|
|
291
|
+
const acceptClose = confirmModal.querySelector('#accept-close');
|
|
292
|
+
|
|
293
|
+
// Проверка на уже добавленный обработчик
|
|
294
|
+
if (!accept.dataset.listenerAdded) {
|
|
295
|
+
accept.dataset.listenerAdded = 'true';
|
|
296
|
+
accept.addEventListener('click', async () => {
|
|
297
|
+
// Закрываем модальное окно
|
|
298
|
+
confirmModal.classList.add("hidden");
|
|
299
|
+
// Удаляем куку
|
|
300
|
+
deleteCookie(sendMailCookie);
|
|
301
|
+
// Повторно отправляем форму
|
|
302
|
+
await submitForm(form);
|
|
303
|
+
return;
|
|
304
|
+
});
|
|
305
|
+
}
|
|
306
|
+
|
|
307
|
+
// Проверка на уже добавленный обработчик
|
|
308
|
+
if (!acceptClose.dataset.listenerAdded) {
|
|
309
|
+
acceptClose.dataset.listenerAdded = 'true';
|
|
310
|
+
acceptClose.addEventListener('click', () => {
|
|
311
|
+
// Закрываем модальное окно
|
|
312
|
+
const modals = document.querySelectorAll('.modal-overlay');
|
|
313
|
+
form.reset();
|
|
314
|
+
if (modals.length) {
|
|
315
|
+
modals.forEach((modal) => modal.classList.add("hidden"));
|
|
316
|
+
}
|
|
317
|
+
confirmModal.classList.add("hidden");
|
|
318
|
+
return;
|
|
319
|
+
});
|
|
320
|
+
}
|
|
321
|
+
return;
|
|
322
|
+
}
|
|
323
|
+
}else{
|
|
324
|
+
// Если куки нет, просто отправляем форму
|
|
325
|
+
await submitForm(form);
|
|
326
|
+
return;
|
|
327
|
+
}
|
|
328
|
+
}
|
|
329
|
+
|
|
330
|
+
// Отправка всех форм
|
|
331
|
+
document.querySelectorAll("form:not(.vue-form)").forEach((form) => {
|
|
332
|
+
form.addEventListener('submit', async (event) => {
|
|
333
|
+
event.preventDefault();
|
|
334
|
+
await sendForm(form);
|
|
335
|
+
})
|
|
336
|
+
});
|
|
335
337
|
}
|