Spaces:
Sleeping
Sleeping
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>Комменты Бизон 365</title> | |
<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; | |
} | |
.input-row { | |
display: flex; | |
flex-direction: column; | |
align-items: center; | |
gap: 10px; | |
margin-top: 20px; | |
} | |
.input-row label, .input-row input, .input-row select, .input-row textarea { | |
width: 80%; | |
padding: 10px; | |
font-size: 16px; | |
border: 1px solid #ccc; | |
border-radius: 5px; | |
} | |
.input-row input[type="number"] { | |
max-width: 100px; | |
} | |
#sendRequestButton, #sendGetRequestButton { | |
color: white; | |
background-color: #4CAF50; | |
border: none; | |
cursor: pointer; | |
padding: 10px 20px; | |
font-size: 16px; | |
border-radius: 5px; | |
margin-top: 10px; | |
} | |
#sendRequestButton:hover, #sendGetRequestButton:hover { | |
background-color: #388E3C; | |
} | |
.dropdown-container { | |
margin-top: 20px; | |
width: 80%; | |
display: flex; | |
justify-content: center; | |
} | |
select { | |
background-color: #e8f5e9; /* Зеленый фон для выпадающего списка */ | |
} | |
input[type="datetime-local"], input[type="date"] { | |
background-color: #e8f5e9; /* Зеленый фон для выбора даты и времени */ | |
border: 1px solid #4CAF50; /* Зеленая рамка */ | |
color: #4CAF50; /* Зеленый текст */ | |
} | |
input[type="datetime-local"]::-webkit-datetime-edit, | |
input[type="date"]::-webkit-datetime-edit { | |
color: #4CAF50; /* Зеленый текст внутри поля */ | |
} | |
input[type="datetime-local"]::-webkit-calendar-picker-indicator, | |
input[type="date"]::-webkit-calendar-picker-indicator { | |
filter: invert(45%) sepia(20%) saturate(3500%) hue-rotate(90deg) brightness(95%) contrast(90%); | |
} | |
</style> | |
</head> | |
<body> | |
<h1>Комменты Бизон 365</h1> | |
<div class="input-row"> | |
<label for="tokenInput">Enter Token:</label> | |
<input type="text" id="tokenInput" placeholder="Your Token"> | |
</div> | |
<div class="input-row"> | |
<label for="dateSelect">Select Date:</label> | |
<select id="dateSelect"> | |
<!-- Даты от 1 января 2000 года до 31 декабря 2020 года --> | |
<!-- Можно добавить все даты в зависимости от нужного формата --> | |
<option value="2000-01-01">2000-01-01</option> | |
<option value="2001-01-01">2001-01-01</option> | |
<option value="2002-01-01">2002-01-01</option> | |
<option value="2003-01-01">2003-01-01</option> | |
<option value="2004-01-01">2004-01-01</option> | |
<option value="2005-01-01">2005-01-01</option> | |
<option value="2006-01-01">2006-01-01</option> | |
<option value="2007-01-01">2007-01-01</option> | |
<option value="2008-01-01">2008-01-01</option> | |
<option value="2009-01-01">2009-01-01</option> | |
<option value="2010-01-01">2010-01-01</option> | |
<option value="2011-01-01">2011-01-01</option> | |
<option value="2012-01-01">2012-01-01</option> | |
<option value="2013-01-01">2013-01-01</option> | |
<option value="2014-01-01">2014-01-01</option> | |
<option value="2015-01-01">2015-01-01</option> | |
<option value="2016-01-01">2016-01-01</option> | |
<option value="2017-01-01">2017-01-01</option> | |
<option value="2018-01-01">2018-01-01</option> | |
<option value="2019-01-01">2019-01-01</option> | |
<option value="2020-01-01">2020-01-01</option> | |
</select> | |
</div> | |
<div class="input-row"> | |
<label for="limitInput">Limit:</label> | |
<input type="number" id="limitInput" value="20" min="1" max="100"> | |
</div> | |
<div class="input-row"> | |
<label for="typeSelect">Type:</label> | |
<select id="typeSelect"> | |
<option value="LiveWebinars">Live Webinars</option> | |
<option value="AutoWebinars">Auto Webinars</option> | |
</select> | |
</div> | |
<div class="input-row"> | |
<button id="sendRequestButton">Send Request</button> | |
</div> | |
<div class="input-row"> | |
<textarea id="responseArea" rows="10" cols="50" readonly></textarea> | |
</div> | |
<div class="dropdown-container" id="dropdown-container"></div> | |
<div class="input-row"> | |
<button id="sendGetRequestButton">Send GET Request</button> | |
</div> | |
<div class="input-row"> | |
<textarea id="secondResponseArea" rows="10" cols="50" readonly></textarea> | |
</div> | |
<script> | |
document.getElementById('sendRequestButton').addEventListener('click', function() { | |
const token = document.getElementById('tokenInput').value; | |
const selectedDate = document.getElementById('dateSelect').value; | |
const limit = document.getElementById('limitInput').value; | |
const type = document.getElementById('typeSelect').value; | |
const url = '/send_request'; | |
const params = new URLSearchParams(); | |
params.append('token', token); | |
params.append('minDate', selectedDate); // Используем выбранную дату как минимальную | |
params.append('limit', limit); | |
params.append('type', type); | |
fetch(url, { | |
method: 'POST', | |
headers: { | |
'Content-Type': 'application/x-www-form-urlencoded' | |
}, | |
body: params.toString() | |
}) | |
.then(response => response.json()) | |
.then(data => { | |
console.log('JSON Response:', data); | |
document.getElementById('responseArea').value = JSON.stringify(data, null, 2); | |
createDropdown(data); | |
}) | |
.catch(error => { | |
console.error('Error:', error); | |
document.getElementById('responseArea').value = 'Error: ' + error.message; | |
}); | |
}); | |
function createDropdown(data) { | |
const container = document.getElementById('dropdown-container'); | |
container.innerHTML = ''; // Очистить контейнер перед добавлением нового списка | |
const select = document.createElement('select'); | |
select.id = 'dropdown'; | |
select.style.backgroundColor = '#e8f5e9'; // Зеленый фон для выпадающего списка | |
data.forEach(item => { | |
const option = document.createElement('option'); | |
option.value = item; | |
option.text = item; | |
select.appendChild(option); | |
}); | |
container.appendChild(select); | |
} | |
document.getElementById('sendGetRequestButton').addEventListener('click', function() { | |
const selectedValue = document.getElementById('dropdown')?.value; | |
if (!selectedValue) { | |
alert('Please select a webinar from the dropdown.'); | |
return; | |
} | |
const token = document.getElementById('tokenInput').value; | |
const getUrl = `/send_get_request?token=${encodeURIComponent(token)}&webinarId=${encodeURIComponent(selectedValue)}`; | |
fetch(getUrl, { | |
method: 'GET' | |
}) | |
.then(response => response.json()) | |
.then(data => { | |
console.log('GET Response:', data); | |
document.getElementById('secondResponseArea').value = JSON.stringify(data, null, 2); | |
}) | |
.catch(error => { | |
console.error('Error:', error); | |
document.getElementById('secondResponseArea').value = 'Error: ' + error.message; | |
}); | |
}); | |
</script> | |
</body> | |
</html> | |