gc_api_ras_

Sleeping

App Files Files Community

gc_api_ras_ / data_gc_tab.html

DmitrMakeev

Update data_gc_tab.html

3ac90bd verified over 1 year ago

raw

history blame

5.91 kB

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Tabulator Example</title>
	<link href="https://unpkg.com/[email protected]/dist/css/tabulator.min.css" rel="stylesheet">
	<script type="text/javascript" src="https://unpkg.com/[email protected]/dist/js/tabulator.min.js"></script>
	<style>
	body {
	font-family: Arial, sans-serif;
	text-align: center;
	background-color: #f0f0f0;
	margin: 0;
	padding: 0;
	}
	h1 {
	background-color: #4CAF50;
	color: white;
	padding: 20px;
	margin: 0;
	border-bottom: 2px solid #388E3C;
	font-size: 28px;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
	}
	button[type="submit"] {
	color: white;
	background-color: #4CAF50;
	border: none;
	cursor: pointer;
	padding: 10px 20px;
	font-size: 16px;
	border-radius: 5px;
	margin-top: 20px;
	transition: background-color 0.3s ease;
	}
	button[type="submit"]:hover {
	background-color: #388E3C;
	}
	#mediaContainer {
	margin-top: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	max-width: 100%;
	height: auto;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	padding: 20px;
	background-color: white;
	}
	#mediaContainer img, #mediaContainer video {
	max-width: 100%;
	height: auto;
	object-fit: contain;
	border-radius: 10px;
	}
	#imageUrl {
	margin-top: 20px;
	font-size: 16px;
	color: #333;
	cursor: pointer;
	text-decoration: underline;
	transition: color 0.3s ease;
	}
	#imageUrl:hover {
	color: #4CAF50;
	}
	#progressBarContainer {
	width: 80%;
	margin: 20px auto;
	background-color: #ddd;
	border-radius: 13px;
	padding: 3px;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
	}
	#progressBar {
	width: 0%;
	height: 20px;
	background-color: #4CAF50;
	border-radius: 10px;
	text-align: center;
	line-height: 20px;
	color: white;
	transition: width 0.3s ease;
	}
	</style>
	</head>
	<body>
	<div id="header">
	<h1>База синхронизации с GetCourse</h1>
	</div>
	<div id="example-table"></div>


	<script>
	document.addEventListener('DOMContentLoaded', function() {
	fetch('https://dmtuit-gc-api-ras.hf.space/data_gc_tab_out?api_sys=fasSd345D')
	.then(response => response.json())
	.then(data => {
	var table = new Tabulator("#example-table", {
	data: data, // set table data
	layout: "fitColumns", // fit columns to width of table
	columns: [
	{title:"Номер в списке", field:"id"},
	{title:"Имя", field:"name"},
	{title:"Телефон", field:"phone"},
	{title:"Email", field:"email"},
	{title:"Ссылка на VK", field:"vk_id, formatter: function(cell, formatterParams, onRendered) {
	var phone = cell.getValue();
	return `<a href="https://vk.comvk.me/id${vk_id}" target="_blank">${phone}</a>`;
	}},
	{title:"Ссылка на Tg", field:"chat_id", formatter: function(cell, formatterParams, onRendered) {
	var chatId = cell.getValue();
	if (chatId.startsWith('@')) {
	chatId = chatId.substring(1); // Удаление символа @ в начале
	}
	return `<a href="https://t.me/${chatId}" target="_blank">${chatId}</a>`;
	}},
	{title:"Ссылка на WhatsApp", field:"phone", formatter: function(cell, formatterParams, onRendered) {
	var phone = cell.getValue();
	return `<a href="https://web.whatsapp.com/send?phone=${phone}" target="_blank">${phone}</a>`;
	}},
	{title:"Статус WhatsApp", field:"ws_statys"},
	{title:"Стутус подписки", field:"ws_stop"},
	{title:"Вебинары", field:"web_statys"},
	{title:"Прогрес по воронке", field:"fin_progress"},
	{title:"Статус покупки", field:"shop_statys_full"},
	{title:"utm_source", field:"pr1"},
	{title:"utm_medium", field:"pr2"},
	{title:"utm_campaign", field:"pr3"},
	{title:"utm_term", field:"pr4"},
	{title:"utm_content", field:"pr5"},
	{title:"Cсылка на пользователя в GC", field:"ad_url"}
	],
	});
	})
	.catch(error => console.error('Error fetching data:', error));
	});
	</script>





	</body>
	</html>