<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Обновление ПО</title> <link rel="stylesheet" href="../styles/main.css" /> </head> <body> <header> <img src="../img/argus.png"> <h1>Аргус</h1> <h2><span>/</span> {{Organisation}}</h2> </header> <section class="account-info"> <div id="account-main"> <img id="person" src="../img/person.svg"> <span>{{User}}</span> <img id="down" src="../img/down.svg"> <img id="up" src="../img/up.svg"> </div> <a href="/logout"><div id="account-additional" class="additional">Выйти</div></a> </section> <section class="navigation"> <a href="/"> <div><img src="../img/chart.svg">Главная</div> </a> <a href="/devices"> <div class="selected"><img src="../img/cloud.svg">Устройства</div> </a> <a href="/reports"> <div><img src="../img/bubble.svg">Отчёты</div> </a> <a href="/live"> <div><img src="../img/waves.svg">Трансляция</div> </a> <a href="/videos"> <div><img src="../img/play.svg">Записи</div> </a> <a href="https://forms.yandex.ru/cloud/6515ecda3e9d08f17262c332/" target="_blank"> <div><img src="../img/bug.svg">Собщить об ошибке</div> </a> {{#if isAdmin}} <a class="admin-panel" href="/admin"> <div><img src="../img/keyboard.svg">Админка</div> </a> {{/if}} <a class="settings" href="/settings"> <div><img src="../img/gear.svg">Настройки</div> </a> </section> <section class="main"> <div class="name"> <span style="color: rgb(255, 69, 58);">В разработке</span> </div> <nav> <a href="/devices">Список устройств</a> {{#if EditTransport}} <a href="/devices/groups">Группы</a> {{/if}} <!-- <a href="/devices/drivers">Водители</a> --> <!-- <a href="/devices/newdevice">Добавить устройство</a> --> <!-- <a href="/devices/newdriver">Добавить водителя</a> --> <a class="update selected" href="/devices/update">Обновление ПО</a> </nav> <section class="bg"> <section class="content"> <section class="for-table"> <section class="organisation update"> <div class="update-org"> <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> <ul class="area-devices" id="devices-1"> <li class="device"><img><input type="checkbox" id="0001" class="checkbox-input device-filter" value="0001" hidden checked><label for="0001" class="checkbox-label"><div class="checkmark"></div>0001</label></li> <li class="device"><img><input type="checkbox" id="0002" class="checkbox-input device-filter" value="0002" hidden checked><label for="0002" class="checkbox-label"><div class="checkmark"></div>0002</label></li> </ul> </li> <li class="area-name"><img src="../img/ul.svg"><input type="checkbox" id="name-2" class="checkbox-input" hidden checked><label for="name-2" class="checkbox-label">Группа 2</label> <ul class="area-devices" id="devices-2"> <li class="device"><img><input type="checkbox" id="0003" class="checkbox-input device-filter" value="0003" hidden checked><label for="0003" class="checkbox-label"><div class="checkmark"></div>0003</label></li> <li class="device"><img><input type="checkbox" id="0004" class="checkbox-input device-filter" value="0004" hidden checked><label for="0004" class="checkbox-label"><div class="checkmark"></div>0004</label></li> <li class="device"><img><input type="checkbox" id="0005" class="checkbox-input device-filter" value="0005" hidden checked><label for="0005" class="checkbox-label"><div class="checkmark"></div>0005</label></li> <li class="device"><img><input type="checkbox" id="0006" class="checkbox-input device-filter" value="0006" hidden checked><label for="0006" class="checkbox-label"><div class="checkmark"></div>0006</label></li> </ul> </li> <li class="area-name"><img src="../img/ul.svg"><input type="checkbox" id="name-3" class="checkbox-input" hidden checked><label for="name-3" class="checkbox-label">Другое</label> <ul class="area-devices" id="devices-3"> <li class="device"><img><input type="checkbox" id="0007" class="checkbox-input device-filter" value="0007" hidden checked><label for="0007" class="checkbox-label"><div class="checkmark"></div>0007</label></li> </ul> </li> </ul> </div> <section class="update-info"> <h1>Новое обновление</h1> <div class="update-info-area"> <div id="upload-file" class="upload-input"> <img src="../img/upload.svg"> <span class="upload-text">Загрузить файл обновления</span> <span class="upload-description">ZIP, RAR, TAR (макс 100 мб)</span> </div> <input id="input-upload-file" type="file" name="updateFile" style="display: none;"> <label for="update-name">Название<span style="color: rgba(255, 69, 58, 1);">*</span></label> <input name="updateName" type="text" id="update-name" placeholder="Название обновления" required> <span class="input-name">Время обновления</span> <ul id="time-picker"> <li><input type="radio" name="updateTimeRadio" id="update-time-now" value="now" checked><label class="input-radio" for="update-time-now">Сейчас</label></li> <li><input type="radio" name="updateTimeRadio" id="update-time-later" value="later"><label class="input-radio" for="update-time-later">Ко времени</label></li> </ul> <input name="updateTime" type="datetime-local" id="update-time"> <button>Отправить</button> </div> </section> </section> <section id="table-area" class="table update"> <h1>Список водителей</h1> <input id="table-search" class="search" type="text" placeholder="Поиск"> <table id="deviceTable"> <thead> <tr> <th><input id="device-all" type="checkbox"><label for="device-all"><div class="checkmark"></div></label></th> <th>Группа</th> <th>Номер ТС</th> <th>Статус</th> <th>Время</th> <th>Файл</th> <th></th> </tr> </thead> <tbody> <!-- Сюда будут добавляться строки таблицы --> </tbody> </table> </section> <div id="count"> <!-- Сюда добавится итоговое количество результатов --> </div> <div id="pagination"> <!-- Сюда будут добавляться ссылки для переключения между страницами --> </div> </section> </section> </section> </section> <script src="../scripts/table-updates.js"></script> <script src="../scripts/jquery.min.js"></script> <script> const fileSelect = document.getElementById("upload-file"); const fileElem = document.getElementById("input-upload-file"); fileSelect.addEventListener( "click", (e) => { if (fileElem) { fileElem.click(); } }, false ); </script> <script> $("#update-time").hide(); $("#time-picker").click(function () { if ($("#update-time-later").is(":checked")) { $("#update-time").show(50); } else { $("#update-time").hide(50); } }); </script> <script> // Скрытие/Показ дополнительных меню аккаунта const accountMain = document.getElementById('account-main'); const accountAdditional = document.getElementById('account-additional'); const accountUp = document.getElementById('up'); const accountDown = document.getElementById('down'); accountAdditional.style.display = 'none'; accountUp.style.display = 'none'; accountMain.addEventListener('click', () => { if (accountAdditional.style.display === 'none') { accountAdditional.style.display = 'flex'; accountUp.style.display = 'unset'; accountDown.style.display = 'none'; } else { accountAdditional.style.display = 'none'; accountUp.style.display = 'none'; accountDown.style.display = 'unset'; } }); </script> <script> const checkboxes = document.querySelectorAll('.organisation .checkbox-input'); checkboxes.forEach((checkbox) => { applyFilterAndSearch(); checkbox.addEventListener('change', function() { document.querySelector('#device-all').checked = false; applyFilterAndSearch(); const devices = this.parentNode.querySelector('.area-devices'); if (this.checked) { devices.style.display = 'block'; // Активируем дочерние чекбоксы const childCheckboxes = devices.querySelectorAll('.device-filter'); childCheckboxes.forEach((childCheckbox) => { childCheckbox.checked = true; applyFilterAndSearch(); }); } else { devices.style.display = 'none'; applyFilterAndSearch(); // Деактивируем дочерние чекбоксы const childCheckboxes = devices.querySelectorAll('.device-filter'); childCheckboxes.forEach((childCheckbox) => { childCheckbox.checked = false; applyFilterAndSearch(); }); } // Деактивируем дочерние чекбоксы, если родительский чекбокс не выбран if (!this.checked) { const childCheckboxes = devices.querySelectorAll('.device-filter'); childCheckboxes.forEach((childCheckbox) => { childCheckbox.checked = false; applyFilterAndSearch(); }); devices.style.display = 'none'; } }); }); </script> <script> var table = document.querySelector('#deviceTable'); var tableCheckboxAll = table.querySelector('#device-all'); var tableCheckboxes = table.querySelectorAll('tbody input[type="checkbox"]'); tableCheckboxAll.addEventListener('click', function(event) { table = document.querySelector('#deviceTable'); tableCheckboxes = table.querySelectorAll('tbody input[type="checkbox"]'); if (tableCheckboxAll.checked) { tableCheckboxes.forEach((tableCheckbox) => { tableCheckbox.checked = true; }); } else { tableCheckboxes.forEach((tableCheckbox) => { tableCheckbox.checked = false; }); } }); $('#deviceTable').click( function(event) { table = document.querySelector('#deviceTable'); tableCheckboxes = table.querySelectorAll('tbody input[type="checkbox"]'); for (var i = 0; i < tableCheckboxes.length; i++) { tableCheckboxes[i].addEventListener('click', function(event) { for (var j = 0; j < tableCheckboxes.length; j++) { if (!tableCheckboxes[j].checked || tableCheckboxes[j].disabled) { tableCheckboxAll.checked = false; return; } } tableCheckboxAll.checked = true; }); } }); </script> </body> </html>