DmitrMakeev commited on
Commit
4989ec3
1 Parent(s): 1ef8582

Update biz_v.html

Browse files
Files changed (1) hide show
  1. biz_v.html +176 -265
biz_v.html CHANGED
@@ -124,14 +124,66 @@ button:hover {
124
  text-align: center;
125
  }
126
 
127
- /* Стили для спиннера */
128
- #spinner {
129
- position: fixed;
130
- top: 50%;
131
- left: 50%;
132
- transform: translate(-50%, -50%);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
133
  display: none;
134
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
135
  </style>
136
  </head>
137
  <body>
@@ -145,11 +197,15 @@ button:hover {
145
  <input type="file" name="file" accept=".csv">
146
  </div>
147
  <div class="input-row">
148
- <label>
149
- <input type="checkbox" name="verify_phone" value="1"> Наличие WhatsApp
 
 
150
  </label>
151
- <label>
152
- <input type="checkbox" name="add_curator" value="1"> Добавлять менеджера
 
 
153
  </label>
154
  </div>
155
  <input id="uploadButton" type="submit" value="Загрузить пользователей">
@@ -185,270 +241,125 @@ button:hover {
185
  </div>
186
  </div>
187
 
188
- <!-- Спиннер -->
189
- <div id="spinner">
190
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 115 115">
191
- <path fill="none" stroke="rgba(0, 0, 0, 0.05)" stroke-width="3" d="M 85 85 C -5 16 -39 127 78 30 C 126 -9 57 -16 85 85 C 94 123 124 111 85 85 Z" />
192
- <path id="el" fill="none" stroke-dasharray="60 310" stroke-dashoffset="445" stroke-linecap="round" stroke-width="3" d="M 85 85 C -5 16 -39 127 78 30 C 126 -9 57 -16 85 85 C 94 123 124 111 85 85 Z" />
193
- </svg>
194
- </div>
195
-
196
  <!-- Подключение скрипта Notyf -->
197
- <script src="https://cdn.jsdelivr.net/npm/notyf/notyf.min.js"></script>
198
- <script>
199
- document.getElementById('uploadForm').addEventListener('submit', function(event) {
200
- event.preventDefault();
201
- const form = new FormData(this);
202
- const notyf = new Notyf({
203
- duration: 5000,
204
- position: {
205
- x: 'right',
206
- y: 'top'
207
- },
208
- types: [
209
- {
210
- type: 'info',
211
- background: 'green',
212
- icon: {
213
- className: 'notyf__icon--info',
214
- tagName: 'span',
215
- text: ''
 
216
  }
217
- }
218
- ]
219
- });
220
- notyf.open({
221
- type: 'info',
222
- message: 'Загрузка началась, пожалуйста, подождите'
223
- });
224
- fetch('/upload_csv', {
225
- method: 'POST',
226
- body: form
227
- })
228
- .then(response => response.json())
229
- .then(data => {
230
- notyf.open({
231
- type: 'success',
232
- message: data.message
233
  });
234
- })
235
- .catch(error => {
236
- console.error('Error:', error);
237
  notyf.open({
238
- type: 'error',
239
- message: 'An error occurred while uploading the file.'
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
240
  });
241
  });
242
- });
243
-
244
- const notyf = new Notyf({
245
- duration: 5000,
246
- position: {
247
- x: 'right',
248
- y: 'top',
249
- },
250
- });
251
- let requestButtonClicked = false;
252
- document.getElementById('sendRequestButton').addEventListener('click', function() {
253
- if (requestButtonClicked) return;
254
- requestButtonClicked = true;
255
- const token = document.getElementById('tokenInput').value;
256
- const minDate = document.getElementById('dateSelect').value;
257
- const type = document.getElementById('typeSelect').value;
258
- const url = '/send_request';
259
 
260
- // Показать спиннер
261
- document.getElementById('spinner').style.display = 'block';
262
-
263
- fetch(url, {
264
- method: 'POST',
265
- headers: {
266
- 'Content-Type': 'application/x-www-form-urlencoded'
267
  },
268
- body: 'token=' + encodeURIComponent(token) + '&minDate=' + encodeURIComponent(minDate) + '&type=' + encodeURIComponent(type)
269
- })
270
- .then(response => response.json())
271
- .then(data => {
272
- console.log('JSON Response:', data);
273
- createDropdown(data);
274
-
275
- // Скрыть спиннер
276
- document.getElementById('spinner').style.display = 'none';
277
- })
278
- .catch(error => {
279
- console.error('Error:', error);
280
- notyf.error('Error: ' + error.message);
281
-
282
- // Скрыть спиннер
283
- document.getElementById('spinner').style.display = 'none';
284
- })
285
- .finally(() => {
286
- requestButtonClicked = false;
287
  });
288
- });
289
- function createDropdown(data) {
290
- const container = document.getElementById('dropdown-container');
291
- container.innerHTML = '';
292
- const select = document.createElement('select');
293
- select.id = 'dropdown';
294
- select.classList.add('form-group');
295
- data.forEach(item => {
296
- const option = document.createElement('option');
297
- option.value = item;
298
- option.text = item;
299
- select.appendChild(option);
300
- });
301
- container.appendChild(select);
302
- const sendGetRequestButton = document.getElementById('sendGetRequestButton');
303
- sendGetRequestButton.removeEventListener('click', handleGetRequest);
304
- sendGetRequestButton.addEventListener('click', handleGetRequest);
305
- }
306
- function handleGetRequest() {
307
- const selectedValue = document.getElementById('dropdown').value;
308
- const token = document.getElementById('tokenInput').value;
309
- const getUrl = '/send_get_request?token=' + encodeURIComponent(token) + '&webinarId=' + encodeURIComponent(selectedValue);
310
- fetch(getUrl, {
311
- method: 'GET'
312
- })
313
- .then(response => response.json())
314
- .then(data => {
315
- console.log('GET Response:', data);
316
- notyf.success('Пользователи добавлены в базу данных WhatsGRM');
317
- })
318
- .catch(error => {
319
- console.error('Error:', error);
320
- notyf.error('Error: ' + error.message);
321
  });
322
- }
323
-
324
- // JavaScript для спиннера
325
- const colorTable = [
326
- // ease in
327
- [0.0, 0xf15a31],
328
- [0.2, 0xffd31b],
329
- [0.33, 0xa6ce42],
330
- [0.4, 0x007ac1],
331
- [0.45, 0x007ac1],
332
- // ease out
333
- [0.55, 0x007ac1],
334
- [0.6, 0x007ac1],
335
- [0.67, 0xa6ce42],
336
- [0.8, 0xffd31b],
337
- [1.0, 0xf15a31]
338
- ];
339
-
340
- function lerp(x, x0, x1, y0, y1) {
341
- const t = (x - x0) / (x1 - x0);
342
- return y0 + t * (y1 - y0);
343
- }
344
-
345
- function lerpStroke(t) {
346
- return lerpTable(1, t, colorTable, false, lerpColor);
347
- }
348
-
349
- function lerpOffset(min, max, t) {
350
- return (max - min) * t + min;
351
- }
352
-
353
- function lerpColor(x, x0, x1, y0, y1) {
354
- const b0 = y0 & 0xff;
355
- const g0 = (y0 & 0xff00) >> 8;
356
- const r0 = (y0 & 0xff0000) >> 16;
357
-
358
- const b1 = y1 & 0xff;
359
- const g1 = (y1 & 0xff00) >> 8;
360
- const r1 = (y1 & 0xff0000) >> 16;
361
-
362
- const r = Math.floor(lerp(x, x0, x1, r0, r1));
363
- const g = Math.floor(lerp(x, x0, x1, g0, g1));
364
- const b = Math.floor(lerp(x, x0, x1, b0, b1));
365
-
366
- return "#" + ((r << 16) | (g << 8) | b).toString(16).padStart(6, "0");
367
- }
368
-
369
- function lerpTable(vIndex, tValue, table, canExtrapolate, lerpFunc = lerp) {
370
- const rowCount = table.length;
371
-
372
- for (let i = 0; i < rowCount; ++i) {
373
- const a = table[i][0];
374
-
375
- if (i === 0 && tValue < a) {
376
- if (canExtrapolate) {
377
- return lerpFunc(
378
- tValue,
379
- a,
380
- table[i + 1][0],
381
- table[i][vIndex],
382
- table[i + 1][vIndex]
383
- );
384
- }
385
- return table[i][vIndex];
386
- }
387
-
388
- if (i === rowCount - 1 && tValue >= a) {
389
- if (canExtrapolate) {
390
- return lerpFunc(
391
- tValue,
392
- table[i - 1][0],
393
- a,
394
- table[i - 1][vIndex],
395
- table[i][vIndex]
396
- );
397
- }
398
- return table[i][vIndex];
399
- }
400
-
401
- if (tValue >= a && tValue <= table[i + 1][0]) {
402
- return lerpFunc(
403
- tValue,
404
- a,
405
- table[i + 1][0],
406
- table[i][vIndex],
407
- table[i + 1][vIndex]
408
- );
409
- }
410
  }
411
-
412
- return 0;
413
- }
414
-
415
- const el = document.getElementById("el");
416
-
417
- const speed = 2;
418
- const speedDashoffset = 7600 / speed;
419
- const speedStroke = 6000 / speed;
420
- const pathWidth = 372;
421
- let startTime;
422
- let animationFrameId;
423
-
424
- const tick = (now) => {
425
- const dtOffset = ((now - startTime) % speedDashoffset) / speedDashoffset;
426
- const dtStroke = ((now - startTime) % speedStroke) / speedStroke;
427
-
428
- const stroke = lerpStroke(dtStroke);
429
- const offset = lerpOffset(pathWidth / 2, -pathWidth / 2, dtOffset);
430
-
431
- el.style.cssText = `stroke-dashoffset: ${offset}; stroke: ${stroke};`;
432
-
433
- animationFrameId = requestAnimationFrame(tick);
434
- };
435
-
436
- document.getElementById('sendRequestButton').addEventListener('click', function() {
437
- // Показать спиннер и начать анимацию
438
- document.getElementById('spinner').style.display = 'block';
439
- startTime = performance.now();
440
- tick(startTime);
441
-
442
- // Ваш существующий код для отправки запроса
443
- // ...
444
-
445
- // Пример завершения запроса (замените на ваш реальный код)
446
- setTimeout(() => {
447
- // Скрыть спиннер и остановить анимацию
448
- document.getElementById('spinner').style.display = 'none';
449
- cancelAnimationFrame(animationFrameId);
450
- }, 3000); // Имитация задержки в 3 секунды
451
- });
452
- </script>
453
  </body>
454
- </html>
 
124
  text-align: center;
125
  }
126
 
127
+ /* Custom Checkbox Styles */
128
+ .container-checkbox {
129
+ display: block;
130
+ position: relative;
131
+ padding-left: 35px;
132
+ margin-bottom: 12px;
133
+ cursor: pointer;
134
+ font-size: 16px;
135
+ -webkit-user-select: none;
136
+ -moz-user-select: none;
137
+ -ms-user-select: none;
138
+ user-select: none;
139
+ }
140
+
141
+ .container-checkbox input {
142
+ position: absolute;
143
+ opacity: 0;
144
+ cursor: pointer;
145
+ height: 0;
146
+ width: 0;
147
+ }
148
+
149
+ .checkmark {
150
+ position: absolute;
151
+ top: 0;
152
+ left: 0;
153
+ height: 25px;
154
+ width: 25px;
155
+ background-color: #eee;
156
+ }
157
+
158
+ .container-checkbox:hover input ~ .checkmark {
159
+ background-color: #ccc;
160
+ }
161
+
162
+ .container-checkbox input:checked ~ .checkmark {
163
+ background-color: #4CAF50;
164
+ }
165
+
166
+ .checkmark:after {
167
+ content: "";
168
+ position: absolute;
169
  display: none;
170
  }
171
+
172
+ .container-checkbox input:checked ~ .checkmark:after {
173
+ display: block;
174
+ }
175
+
176
+ .container-checkbox .checkmark:after {
177
+ left: 9px;
178
+ top: 5px;
179
+ width: 5px;
180
+ height: 10px;
181
+ border: solid white;
182
+ border-width: 0 3px 3px 0;
183
+ -webkit-transform: rotate(45deg);
184
+ -ms-transform: rotate(45deg);
185
+ transform: rotate(45deg);
186
+ }
187
  </style>
188
  </head>
189
  <body>
 
197
  <input type="file" name="file" accept=".csv">
198
  </div>
199
  <div class="input-row">
200
+ <label class="container-checkbox">
201
+ Наличие WhatsApp
202
+ <input type="checkbox" name="verify_phone" value="1">
203
+ <span class="checkmark"></span>
204
  </label>
205
+ <label class="container-checkbox">
206
+ Добавлять менеджера
207
+ <input type="checkbox" name="add_curator" value="1">
208
+ <span class="checkmark"></span>
209
  </label>
210
  </div>
211
  <input id="uploadButton" type="submit" value="Загрузить пользователей">
 
241
  </div>
242
  </div>
243
 
 
 
 
 
 
 
 
 
244
  <!-- Подключение скрипта Notyf -->
245
+ <script src="https://cdn.jsdelivr.net/npm/notyf/notyf.min.js"></script>
246
+ <script>
247
+ document.getElementById('uploadForm').addEventListener('submit', function(event) {
248
+ event.preventDefault();
249
+ const form = new FormData(this);
250
+ const notyf = new Notyf({
251
+ duration: 5000,
252
+ position: {
253
+ x: 'right',
254
+ y: 'top'
255
+ },
256
+ types: [
257
+ {
258
+ type: 'info',
259
+ background: 'green',
260
+ icon: {
261
+ className: 'notyf__icon--info',
262
+ tagName: 'span',
263
+ text: ''
264
+ }
265
  }
266
+ ]
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
267
  });
 
 
 
268
  notyf.open({
269
+ type: 'info',
270
+ message: 'Загрузка началась, пожалуйста, подождите'
271
+ });
272
+ fetch('/upload_csv', {
273
+ method: 'POST',
274
+ body: form
275
+ })
276
+ .then(response => response.json())
277
+ .then(data => {
278
+ notyf.open({
279
+ type: 'success',
280
+ message: data.message
281
+ });
282
+ })
283
+ .catch(error => {
284
+ console.error('Error:', error);
285
+ notyf.open({
286
+ type: 'error',
287
+ message: 'An error occurred while uploading the file.'
288
+ });
289
  });
290
  });
291
+ </script>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
292
 
293
+ <script>
294
+ const notyf = new Notyf({
295
+ duration: 5000,
296
+ position: {
297
+ x: 'right',
298
+ y: 'top',
 
299
  },
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
300
  });
301
+ let requestButtonClicked = false;
302
+ document.getElementById('sendRequestButton').addEventListener('click', function() {
303
+ if (requestButtonClicked) return;
304
+ requestButtonClicked = true;
305
+ const token = document.getElementById('tokenInput').value;
306
+ const minDate = document.getElementById('dateSelect').value;
307
+ const type = document.getElementById('typeSelect').value;
308
+ const url = '/send_request';
309
+ fetch(url, {
310
+ method: 'POST',
311
+ headers: {
312
+ 'Content-Type': 'application/x-www-form-urlencoded'
313
+ },
314
+ body: 'token=' + encodeURIComponent(token) + '&minDate=' + encodeURIComponent(minDate) + '&type=' + encodeURIComponent(type)
315
+ })
316
+ .then(response => response.json())
317
+ .then(data => {
318
+ console.log('JSON Response:', data);
319
+ createDropdown(data);
320
+ })
321
+ .catch(error => {
322
+ console.error('Error:', error);
323
+ notyf.error('Error: ' + error.message);
324
+ })
325
+ .finally(() => {
326
+ requestButtonClicked = false;
327
+ });
 
 
 
 
 
 
328
  });
329
+ function createDropdown(data) {
330
+ const container = document.getElementById('dropdown-container');
331
+ container.innerHTML = '';
332
+ const select = document.createElement('select');
333
+ select.id = 'dropdown';
334
+ select.classList.add('form-group');
335
+ data.forEach(item => {
336
+ const option = document.createElement('option');
337
+ option.value = item;
338
+ option.text = item;
339
+ select.appendChild(option);
340
+ });
341
+ container.appendChild(select);
342
+ const sendGetRequestButton = document.getElementById('sendGetRequestButton');
343
+ sendGetRequestButton.removeEventListener('click', handleGetRequest);
344
+ sendGetRequestButton.addEventListener('click', handleGetRequest);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
345
  }
346
+ function handleGetRequest() {
347
+ const selectedValue = document.getElementById('dropdown').value;
348
+ const token = document.getElementById('tokenInput').value;
349
+ const getUrl = '/send_get_request?token=' + encodeURIComponent(token) + '&webinarId=' + encodeURIComponent(selectedValue);
350
+ fetch(getUrl, {
351
+ method: 'GET'
352
+ })
353
+ .then(response => response.json())
354
+ .then(data => {
355
+ console.log('GET Response:', data);
356
+ notyf.success('Пользователи добавлены в базу данных WhatsGRM');
357
+ })
358
+ .catch(error => {
359
+ console.error('Error:', error);
360
+ notyf.error('Error: ' + error.message);
361
+ });
362
+ }
363
+ </script>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
364
  </body>
365
+ </html>