system parameters, groups, fixes and more
This commit is contained in:
@ -72,26 +72,28 @@
|
||||
</nav>
|
||||
<section class="bg">
|
||||
<section class="content">
|
||||
<section class="for-table">
|
||||
<section style="min-height: 800px;" class="for-table">
|
||||
|
||||
<section class="organisation">
|
||||
<h1>Организация</h1>
|
||||
|
||||
<ul class="area">
|
||||
<li class="area-name"><img src="../img/ul.svg"><input type="checkbox" id="name-1" class="checkbox-input" hidden checked><label for="name-1" class="checkbox-label">Группа 1</label>
|
||||
{{#each Groups}}
|
||||
<li class="area-name"><img src="../img/ul.svg"><input type="checkbox" id="{{name}}" class="checkbox-input" hidden checked><label for="{{name}}" class="checkbox-label">{{name}}</label>
|
||||
<ul class="area-devices" id="devices-1">
|
||||
{{#each Registrars}}
|
||||
<li class="device">
|
||||
<img>
|
||||
<input type="radio" name="camera-serial" id="radio-{{this.serial}}" class="radio-input" value="{{this.serial}}" hidden>
|
||||
<label for="radio-{{this.serial}}" class="radio-label">
|
||||
{{this.serial}}
|
||||
</label>
|
||||
</li>
|
||||
{{/each}}
|
||||
{{#each devices}}
|
||||
<li class="device">
|
||||
<img>
|
||||
<input type="radio" name="camera-serial" id="radio-{{this.serial}}" class="radio-input" value="{{this.serial}}" hidden>
|
||||
<label for="radio-{{this.serial}}" class="radio-label">
|
||||
{{this.serial}}
|
||||
</label>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
|
||||
</section>
|
||||
@ -101,16 +103,16 @@
|
||||
<section class="table" style="position: relative;">
|
||||
|
||||
<div class="map">
|
||||
<div id="properties" class="properties" style="display: none;">
|
||||
<!-- <div id="properties" class="properties" style="display: none;">
|
||||
<div class="propert"><h1>Группа</h1><br><h2 id="propert-group">Автобусы</h2></div>
|
||||
<div class="propert"><h1>Скорость</h1><br><h2 id="propert-speed"> км/ч</h2></div>
|
||||
<div class="propert"><h1>Номерной знак</h1><br><h2 id="propert-plate"></h2></div>
|
||||
<div class="propert"><h1>Геопозиция</h1><br><h2 id="propert-geo"></h2></div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div id="map"></div>
|
||||
</div>
|
||||
|
||||
<div class="cameras">
|
||||
<div class="cameras" id="cameras">
|
||||
<div class="video-container">
|
||||
<div id="camera-1" onclick="playVideo(1);">
|
||||
<img src="../../img/play-circle.svg">
|
||||
@ -251,6 +253,58 @@
|
||||
<script src="../scripts/jquery.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const areaNames = document.querySelectorAll('.area-name');
|
||||
|
||||
areaNames.forEach(function (areaName) {
|
||||
const areaCheckbox = areaName.querySelector('.checkbox-input');
|
||||
const deviceCheckboxes = areaName.querySelectorAll('.device .checkbox-input');
|
||||
const deviceList = areaName.querySelector('.area-devices');
|
||||
|
||||
// Функция для скрытия/показа дочерних элементов
|
||||
function toggleChildDevices(show) {
|
||||
if (show) {
|
||||
deviceList.style.display = 'block';
|
||||
} else {
|
||||
deviceList.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
// Инициализация состояния чекбоксов и скрытия/показа дочерних элементов
|
||||
toggleChildDevices(areaCheckbox.checked);
|
||||
deviceCheckboxes.forEach(function (deviceCheckbox) {
|
||||
deviceCheckbox.checked = areaCheckbox.checked;
|
||||
});
|
||||
|
||||
areaCheckbox.addEventListener('change', function () {
|
||||
const isChecked = areaCheckbox.checked;
|
||||
deviceCheckboxes.forEach(function (deviceCheckbox) {
|
||||
deviceCheckbox.checked = isChecked;
|
||||
});
|
||||
toggleChildDevices(isChecked);
|
||||
});
|
||||
|
||||
deviceCheckboxes.forEach(function (deviceCheckbox) {
|
||||
deviceCheckbox.addEventListener('change', function () {
|
||||
const allUnchecked = Array.from(deviceCheckboxes).every(function (checkbox) {
|
||||
return !checkbox.checked;
|
||||
});
|
||||
|
||||
if (allUnchecked) {
|
||||
areaCheckbox.checked = false;
|
||||
toggleChildDevices(false);
|
||||
} else {
|
||||
areaCheckbox.checked = true;
|
||||
toggleChildDevices(true);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<script>
|
||||
function combineDateTime(dateString, timeString) {
|
||||
const date = new Date(dateString);
|
||||
@ -274,6 +328,7 @@ let HasData;
|
||||
var selectedChannel = 1;
|
||||
|
||||
async function sendPostRequest() {
|
||||
document.getElementById("cameras").style.opacity = "30%";
|
||||
// Получение данных из полей ввода
|
||||
const selectedDate = document.getElementById("selectedDate").value;
|
||||
const videoTime = document.getElementById("video-time").value;
|
||||
@ -305,6 +360,8 @@ async function sendPostRequest() {
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
|
||||
document.getElementById("cameras").style.opacity = "100%";
|
||||
|
||||
const existingChart = Chart.getChart("speed");
|
||||
|
||||
if (existingChart) {
|
||||
|
Reference in New Issue
Block a user