Hugging Face's logo

Spaces:
test-sj-crm
/
psy_vk
Sleeping

App Files Community
DmitrMakeev commited on
Commit
0da4705
·
verified ·
1 Parent(s): 42d40c4

Update bas_vk_tab.html

Browse files
Files changed (1) hide show
  1. bas_vk_tab.html +307 -321
bas_vk_tab.html CHANGED
@@ -3,7 +3,7 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>WhatsMasterCRM</title>
7
 
8
 
9
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
@@ -11,16 +11,12 @@
11
  <script type="text/javascript" src="https://vk.com/js/api/openapi.js?169"></script>
12
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">
13
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
14
- <script type="text/javascript" src="https://oss.sheetjs.com/sheetjs/xlsx.full.min.js"></script>
15
-
16
-
17
 
18
- <!-- Подключение стилей Notyf -->
19
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/notyf/notyf.min.css">
20
 
21
- <!-- Подключение скрипта Notyf -->
22
- <script src="https://cdn.jsdelivr.net/npm/notyf/notyf.min.js"></script>
23
 
 
 
24
 
25
 
26
 
@@ -37,136 +33,167 @@
37
 
38
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
39
  <style>
40
- body {
41
- font-family: Arial, sans-serif;
42
- text-align: center;
43
- background-color: #f0f0f0;
44
- margin: 0;
45
- padding: 0;
46
- }
47
- h1 {
48
- background-color: #4CAF50;
49
- color: white;
50
- padding: 20px;
51
- margin: 0;
52
- border-bottom: 2px solid #388E3C;
53
- font-size: 28px;
54
- text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
55
- }
56
- button, #filter-clear, #download-json, #take-for-yourself {
57
- color: white;
58
- background-color: #4CAF50;
59
- border: none;
60
- cursor: pointer;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
61
  padding: 10px 20px;
62
  font-size: 16px;
63
- border-radius: 5px;
64
- margin: 5px;
65
- transition: background-color 0.3s ease;
66
- }
67
- button:hover, #filter-clear:hover, #download-json:hover, #take-for-yourself:hover {
68
- background-color: #388E3C;
69
- }
70
- #filter-field, #filter-type, #filter-value, #filter-field2, #filter-value2 {
71
- padding: 10px;
72
- font-size: 16px;
73
  margin: 5px;
74
  border-radius: 5px;
75
  border: 1px solid #ccc;
76
- background-color: #f0f0f0;
77
- transition: border-color 0.3s ease, box-shadow 0.3s ease;
78
- }
79
- #filter-field:focus, #filter-type:focus, #filter-value:focus, #filter-field2:focus, #filter-value2:focus {
80
- border-color: #4CAF50;
81
- box-shadow: 0 0 5px rgba(76, 175, 80, 0.5);
82
- }
83
- #filter-field option, #filter-type option, #filter-field2 option {
84
- background-color: #f0f0f0;
85
- color: #333;
86
- }
87
- #filter-field:hover, #filter-type:hover, #filter-value:hover, #filter-field2:hover, #filter-value2:hover {
88
- border-color: #4CAF50;
89
- }
90
- #mediaContainer {
91
- margin-top: 20px;
92
- display: flex;
93
- justify-content: center;
94
- align-items: center;
95
- flex-direction: column;
96
- max-width: 100%;
97
- height: auto;
98
- box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
99
- border-radius: 10px;
100
- padding: 20px;
101
- background-color: white;
102
- }
103
- #mediaContainer img, #mediaContainer video {
104
- max-width: 100%;
105
- height: auto;
106
- object-fit: contain;
107
- border-radius: 10px;
108
- }
109
- #imageUrl {
110
- margin-top: 20px;
111
- font-size: 16px;
112
- color: #333;
113
- cursor: pointer;
114
- text-decoration: underline;
115
- transition: color 0.3s ease;
116
- }
117
- #imageUrl:hover {
118
- color: #4CAF50;
119
- }
120
- #progressBarContainer {
121
- width: 80%;
122
- margin: 20px auto;
123
- background-color: #ddd;
124
- border-radius: 13px;
125
- padding: 3px;
126
- box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
127
- }
128
- #progressBar {
129
- width: 0%;
130
- height: 20px;
131
  background-color: #4CAF50;
132
- border-radius: 10px;
133
- text-align: center;
134
- line-height: 20px;
135
  color: white;
136
- transition: width 0.3s ease;
137
- }
138
- .swal-button-custom {
139
- background-color: #4CAF50;
140
- font-size: 16px;
141
- padding: 10px 20px;
142
- }
143
- .swal-title-custom {
144
- font-size: 24px;
145
- color: #333;
146
- }
147
- .swal-content-custom {
148
- font-size: 16px;
149
- color: #666;
150
  }
151
- /* Переопределение стилей Notyf */
152
- .notyf__toast {
153
- background-color: #4CAF50 !important; /* Зеленый фон */
154
- color: #ffffff !important; /* Белый текст */
155
- font-size: 16px;
156
- }
157
- .notyf__toast--success {
158
- background-color: #4CAF50 !important; /* Зеленый фон для успешного уведомления */
159
- }
160
- .notyf__toast--error {
161
- background-color: #d9534f !important; /* Красный фон для ошибок (по желанию) */
162
- }
 
 
 
 
 
 
 
163
  </style>
164
  </head>
165
 
166
-
167
  <body>
168
  <div id="header">
169
- <h1>WhatsMasterCRM</h1>
170
  </div>
171
  <div>
172
  <select id="filter-field">
@@ -174,17 +201,19 @@ button:hover, #filter-clear:hover, #download-json:hover, #take-for-yourself:hove
174
  <option value="id">Номер в списке</option>
175
  <option value="name">Имя</option>
176
  <option value="phone">WhatsApp</option>
177
- <option value="vk_id">Ссылка на VK</option>
178
- <option value="chat_id">Ссылка на Tg</option>
179
- <option value="gc_url">Ссылка на пользователя в GC</option>
180
- <option value="b_city">Город</option>
181
  <option value="email">Email</option>
182
  <option value="b_mess">Реплики</option>
183
  <option value="curator">Куратор</option>
184
  <option value="shop_st">Статус покупки</option>
185
- <option value="ws_stop">Статус подписки</option>
 
 
 
186
  <option value="web_st">Вебинары</option>
187
- <option value="fin_prog">Прогресс по воронке</option>
 
 
 
188
  <option value="pr4">Канал трафика</option>
189
  <option value="pr5">Дата</option>
190
  <option value="key_pr">Ключ PR</option>
@@ -205,205 +234,162 @@ button:hover, #filter-clear:hover, #download-json:hover, #take-for-yourself:hove
205
  <input id="filter-value" type="text" placeholder="Значение фильтра">
206
 
207
  <button id="filter-clear">Очистить фильтр</button>
208
- <button id="download-xlsx">Скачать в XLSX</button>
209
  <button id="download-json">Рассылка по выбранным</button>
210
- <button id="take-for-yourself">Взять себе</button>
211
- <button id="download-json-new">Скачать JSON</button>
212
  </div>
213
  <div id="example-table"></div>
214
 
215
- <script>
216
- vkBridge.send('VKWebAppInit');
217
- document.addEventListener('DOMContentLoaded', function() {
218
- fetch('https://dmtuit-psy.hf.space/data_gc_tab_out?api_sys=fasSd345D')
219
- .then(response => response.json())
220
- .then(data => {
221
- console.log('Data received:', data);
222
- data.reverse();
223
-
224
- var linkFormatter = function(cell, formatterParams, onRendered) {
225
- var curator = cell.getValue();
226
- var curatorLink = cell.getData().curator_link;
227
- return `<a href="${curatorLink}" target="_blank">${curator}</a>`;
228
- };
229
 
230
- var table = new Tabulator("#example-table", {
231
- data: data,
232
- layout: "fitColumns",
233
- pagination: "local",
234
- paginationSize: 50,
235
- selectable: true, // Enable row selection
236
- columns: [
237
- {title:"Номер в списке", field:"id"},
238
- {title:"Имя", field:"name", width:100},
239
- {title:"WhatsApp", field:"phone", formatter: function(cell, formatterParams, onRendered) {
240
- var phone = cell.getValue();
241
- var ws_stop = cell.getData().ws_stop;
242
- var ws_st = cell.getData().ws_st;
243
- var imageUrl1 = "https://i.ibb.co/YBvwFR6/whatsapp-2.png";
244
- var imageUrl2 = "https://i.ibb.co/LZx71cM/1.png";
245
- var imageUrl3 = "https://i.ibb.co/Cvn3QsK/whatsapp-3.png";
246
- var link = `<a href="https://web.whatsapp.com/send?phone=${phone}" target="_blank">`;
247
- if (ws_stop !== "1" && ws_st === "1") {
248
- return link + `<img src="${imageUrl2}" alt="WhatsApp" style="width: 98px; height: 14px;">`;
249
- } else if (ws_stop === "1" && ws_st === "1") {
250
- return link + `<img src="${imageUrl3}" alt="WhatsApp" style="width: 98px; height: 14px;">`;
251
- } else {
252
- return link + `<img src="${imageUrl1}" alt="WhatsApp" style="width: 98px; height: 14px;">`;
253
- }
254
- }},
255
- {title:"ВКонтакте", field:"vk_id", formatter: function(cell, formatterParams, onRendered) {
256
- var vk_id = cell.getValue();
257
- var imageUrlvk1 = "https://i.ibb.co/BKB8R4C/2-2.png";
258
- var imageUrlvk2 = "https://i.ibb.co/MPCGvQX/2-1.png";
259
- var link1 = `<a href="https://vk.com" target="_blank">`;
260
- var link2 = `<a href="https://vk.com/id${vk_id}" target="_blank">`;
261
- if (vk_id === "0" || vk_id === "") {
262
- return link1 + `<img src="${imageUrlvk1}" alt="Image" style="width: 98px; height: 14px;">`;
263
- } else {
264
- return link2 + `<img src="${imageUrlvk2}" alt="Image" style="width: 98px; height: 14px;">`;
265
- }
266
- }},
267
- {title:"Телеграм", field:"chat_id", formatter: function(cell, formatterParams, onRendered) {
268
- var chat_id = cell.getValue();
269
- var imageUrltg1 = "https://i.ibb.co/3S4Wt7m/3-2.png";
270
- var imageUrlntg2 = "https://i.ibb.co/rZrzQhb/3-1.png";
271
- var linktg1 = `<a href="https://t.me" target="_blank">`;
272
- var linktg2 = `<a href="https://t.me/${chat_id}" target="_blank">`;
273
- if (chat_id === "0" || chat_id === "") {
274
- return linktg1 + `<img src="${imageUrltg1}" alt="Image" style="width: 98px; height: 14px;">`;
275
- } else {
276
- return linktg2 + `<img src="${imageUrlntg2}" alt="Image" style="width: 98px; height: 14px;">`;
277
- }
278
- }},
279
- {title:"GetCurse", field:"gc_url", formatter: function(cell, formatterParams, onRendered) {
280
- var gc_url = cell.getValue();
281
- var imageUrlvkgc1 = "https://i.ibb.co/F8825KY/1-2.png";
282
- var imageUrlvkgc2 = "https://i.ibb.co/S3qwFKM/1-1.png";
283
- var linkgc1 = `<a href="https://vk.com/getcourseru" target="_blank">`;
284
- var linkgc2 = `<a href="${gc_url}" target="_blank">`;
285
- if (gc_url === "0" || gc_url === "") {
286
- return linkgc1 + `<img src="${imageUrlvkgc1}" alt="Image" style="width: 98px; height: 14px;">`;
287
- } else {
288
- return linkgc2 + `<img src="${imageUrlvkgc2}" alt="Image" style="width: 98px; height: 14px;">`;
289
- }
290
- }},
291
- {title:"Город", field:"b_city", width:95},
292
- {title:"Email", field:"email", width:95},
293
- {title:"Реплики", field:"b_mess", width:95, cellClick:function(e, cell){
294
- var data = cell.getData();
295
- const notyf = new Notyf({
296
- duration: 5000,
297
- position: {
298
- x: 'right',
299
- y: 'top'
300
- }
301
- });
302
- var message = `
303
- <strong>Информация:</strong><br>
304
- <b>Номер:</b> ${data.id}<br>
305
- <b>Имя:</b> ${data.name}<br>
306
- <b>WhatsApp:</b> ${data.phone}<br>
307
- <b>ВКонтакте:</b> ${data.vk_id}<br>
308
- <b>Телеграм:</b> ${data.chat_id}<br>
309
- <b>GetCurse:</b> ${data.gc_url}<br>
310
- <b>Город:</b> ${data.b_city}<br>
311
- <b>Email:</b> ${data.email}<br>
312
- <b>Реплики:</b> ${data.b_mess}
313
- `;
314
- notyf.open({
315
- type: 'info',
316
- message: message,
317
- });
318
- }},
319
- {title:"Куратор", field:"curator", formatter: linkFormatter},
320
- {title:"Статус покупки", field:"shop_st", formatter: function(cell, formatterParams, onRendered) {
321
- var status = cell.getValue();
322
- var color;
323
- switch (status) {
324
- case 'green':
325
- color = 'green';
326
- break;
327
- case 'red':
328
- color = 'red';
329
- break;
330
- case 'yellow':
331
- color = 'yellow';
332
- break;
333
- default:
334
- color = 'gray';
335
- }
336
- return `<div style="width: 20px; height: 20px; background-color: ${color}; border-radius: 50%;"></div>`;
337
- }},
338
- {title:"Канал трафика", field:"pr4", width:95},
339
- {title:"Дата", field:"pr5", width:95},
340
- {title:"Ключ PR", field:"key_pr", width:95},
341
- {title:"Канал", field:"canal", width:95},
342
- {title:"Дата", field:"data_t", width:95},
343
- ],
344
- });
345
 
346
- // Filtering functionality
347
- document.getElementById('filter-field').addEventListener('change', updateFilter);
348
- document.getElementById('filter-type').addEventListener('change', updateFilter);
349
- document.getElementById('filter-value').addEventListener('input', updateFilter);
350
 
351
- function updateFilter() {
352
- var field = document.getElementById('filter-field').value;
353
- var type = document.getElementById('filter-type').value;
354
- var value = document.getElementById('filter-value').value;
355
-
356
- if (field && type) {
357
- table.setFilter(field, type, value);
358
- }
359
- }
360
-
361
- // Clear filter
362
- document.getElementById('filter-clear').addEventListener('click', function() {
363
- document.getElementById('filter-field').value = "";
364
- document.getElementById('filter-type').value = "=";
365
- document.getElementById('filter-value').value = "";
366
- table.clearFilter(true);
367
- });
368
 
369
- // Download XLSX functionality
370
- document.getElementById('download-xlsx').addEventListener('click', function() {
371
- table.download("xlsx", "data.xlsx");
372
- });
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
373
 
374
- // Download JSON functionality for selected rows
375
- document.getElementById('download-json').addEventListener('click', function() {
376
- var selectedRows = table.getSelectedData(); // Get selected rows
377
- console.log('Selected rows for mailing:', selectedRows);
378
- var jsonData = JSON.stringify(selectedRows);
379
- console.log('JSON data for mailing:', jsonData);
380
- });
381
 
382
- // Download JSON functionality for all data
383
- document.getElementById('download-json-new').addEventListener('click', function() {
384
- var jsonData = JSON.stringify(data);
385
- var blob = new Blob([jsonData], { type: 'application/json' });
386
- var url = URL.createObjectURL(blob);
387
- var a = document.createElement('a');
388
- a.href = url;
389
- a.download = 'data.json';
390
- document.body.appendChild(a);
391
- a.click();
392
- URL.revokeObjectURL(url);
393
- });
394
 
395
- // Take for yourself functionality for selected rows
396
- document.getElementById('take-for-yourself').addEventListener('click', function() {
397
- var selectedRows = table.getSelectedData(); // Get selected rows
398
- console.log('Selected rows for take for yourself:', selectedRows);
399
- var jsonData = JSON.stringify(selectedRows);
400
- console.log('JSON data for take for yourself:', jsonData);
401
- });
402
- })
403
- .catch(error => {
404
- console.error('Ошибка при загрузке JSON:', error);
405
- });
406
- });
407
- </script>
408
  </body>
409
- </html>
 
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>WhatsCRM - Автопилот + Tilda + Бизон 365 + GetCurse</title>
7
 
8
 
9
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 
11
  <script type="text/javascript" src="https://vk.com/js/api/openapi.js?169"></script>
12
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">
13
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
 
 
 
14
 
15
+
 
16
 
 
 
17
 
18
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">
19
+ <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
20
 
21
 
22
 
 
33
 
34
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
35
  <style>
36
+ body {
37
+ font-family: Arial, sans-serif;
38
+ text-align: center;
39
+ background-color: #f0f0f0;
40
+ margin: 0;
41
+ padding: 0;
42
+ }
43
+ h1 {
44
+ background-color: #4CAF50;
45
+ color: white;
46
+ padding: 20px;
47
+ margin: 0;
48
+ border-bottom: 2px solid #388E3C;
49
+ font-size: 28px;
50
+ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
51
+ }
52
+ button[type="submit"] {
53
+ color: white;
54
+ background-color: #4CAF50;
55
+ border: none;
56
+ cursor: pointer;
57
+ padding: 10px 20px;
58
+ font-size: 16px;
59
+ border-radius: 5px;
60
+ margin-top: 20px;
61
+ transition: background-color 0.3s ease;
62
+ }
63
+ button[type="submit"]:hover {
64
+ background-color: #388E3C;
65
+ }
66
+ #mediaContainer {
67
+ margin-top: 20px;
68
+ display: flex;
69
+ justify-content: center;
70
+ align-items: center;
71
+ flex-direction: column;
72
+ max-width: 100%;
73
+ height: auto;
74
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
75
+ border-radius: 10px;
76
+ padding: 20px;
77
+ background-color: white;
78
+ }
79
+ #mediaContainer img, #mediaContainer video {
80
+ max-width: 100%;
81
+ height: auto;
82
+ object-fit: contain;
83
+ border-radius: 10px;
84
+ }
85
+ #imageUrl {
86
+ margin-top: 20px;
87
+ font-size: 16px;
88
+ color: #333;
89
+ cursor: pointer;
90
+ text-decoration: underline;
91
+ transition: color 0.3s ease;
92
+ }
93
+ #imageUrl:hover {
94
+ color: #4CAF50;
95
+ }
96
+ #progressBarContainer {
97
+ width: 80%;
98
+ margin: 20px auto;
99
+ background-color: #ddd;
100
+ border-radius: 13px;
101
+ padding: 3px;
102
+ box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
103
+ }
104
+ #progressBar {
105
+ width: 0%;
106
+ height: 20px;
107
+ background-color: #4CAF50;
108
+ border-radius: 10px;
109
+ text-align: center;
110
+ line-height: 20px;
111
+ color: white;
112
+ transition: width 0.3s ease;
113
+ }
114
+ #filter-field, #filter-type, #filter-value, #filter-clear , #download-json{
115
+ padding: 10px;
116
+ font-size: 16px;
117
+ margin: 5px;
118
+ }
119
+ #filter-value {
120
+ width: 200px;
121
+ }
122
+ #filter-clear {
123
+ padding: 10px 20px;
124
+ }
125
+ #filter-field, #filter-type, #filter-value, #filter-clear, #download-json {
126
+ padding: 10px;
127
+ font-size: 16px;
128
+ margin: 5px;
129
+ border-radius: 5px;
130
+ border: 1px solid #ccc;
131
+ }
132
+ #filter-value {
133
+ width: 200px;
134
+ background-color: #f0f0f0;
135
+ }
136
+ #filter-clear {
137
+ padding: 10px 20px;
138
+ background-color: #4CAF50;
139
+ color: white;
140
+ border: none;
141
+ cursor: pointer;
142
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
143
+ transition: background-color 0.3s ease;
144
+ }
145
+ #filter-clear:hover {
146
+ background-color: #388E3C;
147
+ }
148
+ #download-json {
149
+ padding: 10px 20px;
150
+ background-color: #4CAF50;
151
+ color: white;
152
+ border: none;
153
+ cursor: pointer;
154
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
155
+ transition: background-color 0.3s ease;
156
+ }
157
+ #download-json:hover {
158
+ background-color: #388E3C;
159
+ }
160
+ #take-for-yourself {
161
  padding: 10px 20px;
162
  font-size: 16px;
 
 
 
 
 
 
 
 
 
 
163
  margin: 5px;
164
  border-radius: 5px;
165
  border: 1px solid #ccc;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
166
  background-color: #4CAF50;
 
 
 
167
  color: white;
168
+ cursor: pointer;
169
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
170
+ transition: background-color 0.3s ease;
 
 
 
 
 
 
 
 
 
 
 
171
  }
172
+ #take-for-yourself:hover {
173
+ background-color: #388E3C;
174
+ }
175
+ </style>
176
+
177
+ <style>
178
+ .swal-button-custom {
179
+ background-color: #4CAF50;
180
+ font-size: 16px;
181
+ padding: 10px 20px;
182
+ }
183
+ .swal-title-custom {
184
+ font-size: 24px;
185
+ color: #333;
186
+ }
187
+ .swal-content-custom {
188
+ font-size: 16px;
189
+ color: #666;
190
+ }
191
  </style>
192
  </head>
193
 
 
194
  <body>
195
  <div id="header">
196
+ <h1>WhatsCRM - Автопилот + Tilda + Бизон 365 + GetCurse</h1>
197
  </div>
198
  <div>
199
  <select id="filter-field">
 
201
  <option value="id">Номер в списке</option>
202
  <option value="name">Имя</option>
203
  <option value="phone">WhatsApp</option>
 
 
 
 
204
  <option value="email">Email</option>
205
  <option value="b_mess">Реплики</option>
206
  <option value="curator">Куратор</option>
207
  <option value="shop_st">Статус покупки</option>
208
+ <option value="ad_url">Ссылка на пользователя в GC</option>
209
+ <option value="vk_id">Ссылка на VK</option>
210
+ <option value="chat_id">Ссылка на Tg</option>
211
+ <option value="ws_stop">Стутус подписки</option>
212
  <option value="web_st">Вебинары</option>
213
+ <option value="fin_prog">Прогрес по воронке</option>
214
+ <option value="pr1">pr1</option>
215
+ <option value="pr2">pr2</option>
216
+ <option value="pr3">pr3</option>
217
  <option value="pr4">Канал трафика</option>
218
  <option value="pr5">Дата</option>
219
  <option value="key_pr">Ключ PR</option>
 
234
  <input id="filter-value" type="text" placeholder="Значение фильтра">
235
 
236
  <button id="filter-clear">Очистить фильтр</button>
237
+
238
  <button id="download-json">Рассылка по выбранным</button>
239
+ <button id="take-for-yourself">Взять себе</button> <!-- Добавлена вторая кнопка -->
 
240
  </div>
241
  <div id="example-table"></div>
242
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
243
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
244
 
 
 
 
 
245
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
246
 
247
+ <script>
248
+ vkBridge.send('VKWebAppInit');
249
+ document.addEventListener('DOMContentLoaded', function() {
250
+ fetch('https://dmtuit-gcapirabiz.hf.space/data_gc_tab_out?api_sys=fasSd345D')
251
+ .then(response => response.json())
252
+ .then(data => {
253
+ console.log('Data received:', data); // Логирование данных
254
+ // Переворачиваем массив данных
255
+ data.reverse();
256
+ var linkFormatter = function(cell, formatterParams, onRendered) {
257
+ var curator = cell.getValue();
258
+ var curatorLink = cell.getData().curator_link;
259
+ return `<a href="${curatorLink}" target="_blank">${curator}</a>`;
260
+ };
261
+ var table = new Tabulator("#example-table", {
262
+ data: data, // set table data
263
+ layout: "fitColumns", // fit columns to width of table
264
+ pagination: "local", // enable local pagination
265
+ paginationSize: 50, // number of rows per page
266
+ selectable: true, // enable row selection
267
+ columns: [
268
+ {title:"Номер в списке", field:"id"},
269
+ {title:"Имя", field:"name", width:100},
270
+ {title:"WhatsApp", field:"phone", formatter: function(cell, formatterParams, onRendered) {
271
+ var phone = cell.getValue();
272
+ return `<a href="https://web.whatsapp.com/send?phone=${phone}" target="_blank">${phone}</a>`;
273
+ }, width:120},
274
+ {title:"Город", field:"b_city", width:110},
275
+ {title:"Email", field:"email", width:110},
276
+ {title:"Реплики", field:"b_mess", width:95, cellClick:function(e, cell){
277
+ var data = cell.getData();
278
+ Swal.fire({
279
+ title: 'Детали пользователя',
280
+ html: `
281
+ <strong>Имя:</strong> ${data.name}<br>
282
+ <strong>WhatsApp:</strong> <a href="https://web.whatsapp.com/send?phone=${data.phone}" target="_blank">${data.phone}</a><br>
283
+ <strong>Реплики:</strong> ${data.b_mess}
284
+ `,
285
+ icon: 'success',
286
+ confirmButtonText: 'Закрыть',
287
+ confirmButtonColor: '#4CAF50',
288
+ customClass: {
289
+ confirmButton: 'button is-success',
290
+ title: 'title-custom',
291
+ content: 'content-custom'
292
+ }
293
+ });
294
+ }},
295
+ {title:"Куратор", field:"curator", formatter: linkFormatter},
296
+ {title:"Статус покупки", field:"shop_st", formatter: function(cell, formatterParams, onRendered) {
297
+ var status = cell.getValue();
298
+ var color;
299
+ switch (status) {
300
+ case 'green':
301
+ color = 'green';
302
+ break;
303
+ case 'red':
304
+ color = 'red';
305
+ break;
306
+ case 'yellow':
307
+ color = 'yellow';
308
+ break;
309
+ default:
310
+ color = 'gray';
311
+ }
312
+ return `<div style="width: 20px; height: 20px; background-color: ${color};"></div>`;
313
+ }},
314
+ {title:"Ссылка на пользователя в GC", field:"ad_url", formatter: function(cell, formatterParams, onRendered) {
315
+ var ad_url = cell.getValue();
316
+ return `<a href="${ad_url}" target="_blank">${ad_url}</a>`;
317
+ }},
318
+ {title:"Ссылка на VK", field:"vk_id", formatter: function(cell, formatterParams, onRendered) {
319
+ var vk_id = cell.getValue();
320
+ return `<a href="https://vk.com/id${vk_id}" target="_blank">${vk_id}</a>`;
321
+ }},
322
+ {title:"Ссылка на Tg", field:"chat_id", formatter: function(cell, formatterParams, onRendered) {
323
+ var chatId = cell.getValue();
324
+ if (chatId.startsWith('@')) {
325
+ chatId = chatId.substring(1); // Удаление символа @ в начале
326
+ }
327
+ return `<a href="https://t.me/${chatId}" target="_blank">${chatId}</a>`;
328
+ }},
329
+ {title:"Статус WhatsApp", field:"ws_st"},
330
+ {title:"Стутус подписки", field:"ws_stop"},
331
+ {title:"Вебинары-присутствовал", field:"web_st", formatter:"star", formatterParams:{stars:7}, hozAlign:"center", width:120},
332
+ {title:"Вебинары-досмотрел до конца", field:"b_fin", formatter:function(cell, formatterParams, onRendered){
333
+ var value = cell.getValue();
334
+ var icon;
335
+ if (value === 'True') {
336
+ icon = ' <img src="https://mrbeliever-background-remover.hf.space/--replicas/dv2tz/file=/tmp/gradio/2da6c3c9a4c2ee2ce9460af207d56dbade620115/image.png" width="30" height="14" />'; // Иконка для активного статуса
337
+ } else {
338
+ icon = ''; // Пустая строка для неактивного статуса или если значение не определено
339
+ }
340
+ return icon;
341
+ }, width:100},
342
+
343
+ {title:"Прогрес по воронке", field:"fin_prog", formatter:"progress", formatterParams:{color:["#00dd00", "orange", "rgb(255,0,0)"]}, sorter:"number", width:100},
344
+ {title:"pr1", field:"pr1"},
345
+ {title:"pr2", field:"pr2"},
346
+ {title:"pr3", field:"pr3"},
347
+ {title:"Канал трафика", field:"pr4"},
348
+ {title:"Дата", field:"pr5"},
349
+ {title:"Ключ PR", field:"key_pr"},
350
+ {title:"Канал", field:"canal"},
351
+ {title:"Дата", field:"data_t", width:150}
352
+ ],
353
+ });
354
+ var fieldEl = document.getElementById("filter-field");
355
+ var typeEl = document.getElementById("filter-type");
356
+ var valueEl = document.getElementById("filter-value");
357
+ function updateFilter() {
358
+ var filterVal = fieldEl.options[fieldEl.selectedIndex].value;
359
+ var typeVal = typeEl.options[typeEl.selectedIndex].value;
360
+ if (filterVal) {
361
+ table.setFilter(filterVal, typeVal, valueEl.value);
362
+ }
363
+ }
364
+ document.getElementById("filter-field").addEventListener("change", updateFilter);
365
+ document.getElementById("filter-type").addEventListener("change", updateFilter);
366
+ document.getElementById("filter-value").addEventListener("keyup", updateFilter);
367
+ document.getElementById("filter-clear").addEventListener("click", function() {
368
+ fieldEl.value = "";
369
+ typeEl.value = "=";
370
+ valueEl.value = "";
371
+ table.clearFilter();
372
+ });
373
+ function handleDownloadJson() {
374
+ var tableData = table.getData("active");
375
+ var jsonData = JSON.stringify(tableData, null, 2);
376
+ console.log("Данные для рассылки:", jsonData);
377
+ }
378
+ function handleTakeForYourself() {
379
+ var tableData = table.getData("active");
380
+ var jsonData = JSON.stringify(tableData, null, 2);
381
+ console.log("Данные для себя:", jsonData);
382
+ }
383
+ document.getElementById("download-json").addEventListener("click", handleDownloadJson);
384
+ document.getElementById("take-for-yourself").addEventListener("click", handleTakeForYourself);
385
+ })
386
+ .catch(error => console.error('Error fetching data:', error));
387
+ });
388
+ </script>
389
 
 
 
 
 
 
 
 
390
 
 
 
 
 
 
 
 
 
 
 
 
 
391
 
392
+
 
 
 
 
 
 
 
 
 
 
 
 
393
  </body>
394
+
395
+ </html>