web interface updated

This commit is contained in:
Bogdan Pilyugin 2022-08-28 16:13:44 +02:00
parent b4f0781b1e
commit fd36bb2764
7 changed files with 83 additions and 53 deletions

View File

@ -72,7 +72,9 @@
<div class="mlhdr">GPRS</div> <div class="mlhdr">GPRS</div>
<form name="gprs" method="post"> <form name="gprs" method="post">
<table class='cntr'> <table class='cntr'>
<script>PrintCheckBox('Включить GSM','gsmen','~gsmen~',null); <script>
if(~ifc_gprs~){
PrintCheckBox('Включить GSM','gsmen','~gsmen~',null);
PrintLabel('Модуль:','~gsmmod~'); PrintLabel('Модуль:','~gsmmod~');
PrintLabel('Оператор:','~gsmopr~'); PrintLabel('Оператор:','~gsmopr~');
PrintLabel('IMEI:','~gimei~'); PrintLabel('IMEI:','~gimei~');
@ -82,10 +84,13 @@
PrintLabel('Адрес шлюза:','~gsmgate~'); PrintLabel('Адрес шлюза:','~gsmgate~');
PrintLabel('DNS1:','~gsmdns~'); PrintLabel('DNS1:','~gsmdns~');
PrintLabel('DNS2:','~bkgsmdns~'); PrintLabel('DNS2:','~bkgsmdns~');
PrintLabel('DNS3:','~flgsmdns~');</script> PrintLabel('DNS3:','~flgsmdns~');
<tr><td></td></tr></table><br/> PrintSep();
<script>PrintSaveFail('~status_fail~'); PrintSaveFail('~status_fail~');
PrintSaveBtn('gprs'); PrintApplyBtn('gprs');</script> PrintSaveBtn('gprs'); PrintApplyBtn('gprs');}
else
PrintLabel("GPRS is not supported by the hardware","");
</script>
</form> </form>
</div> </div>
</div> </div>

View File

@ -14,6 +14,7 @@ favicon.ico
iconsfont.css iconsfont.css
iconsfont.woff2 iconsfont.woff2
index.html index.html
info.html
logo.png logo.png
main.js main.js
reboot.html reboot.html

View File

@ -20,19 +20,28 @@
<div class="mlp"> <div class="mlp">
<div class="mlpc"> <div class="mlpc">
<div class="mlhdr">Application 1</div> <div class="mlhdr"></div>
<div class='cntr' style='text-align:center;margin-top:20px'>
<span id="name" ><div class='hdr1'>YOUR BRAND DEVICE NAME</div></span><br/><br/>
<span id='localtime'>?</span><br/>
Uptime:<span id='uptime'>?</span><br/><br/>
Signal WiFi:<span id='wlev' style="color:#0099ff;font-weight:bold">?</span><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/>
</div>
</div> </div>
</div> </div>
<div class="mlp"> <div class="mlp">
<div class="mlpc"> <div class="mlpc">
<div class="mlhdr">Application 2</div> <div class="mlhdr"></div>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</div> </div>
</div> </div>
<div class="mlp"> <div class="mlp">
<div class="mlpc"> <div class="mlpc">
<div class="mlhdr">Application 3</div> <div class="mlhdr"></div>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</div> </div>
</div> </div>
@ -44,5 +53,32 @@
showMenu('header-toggle','navbar'); showMenu('header-toggle','navbar');
linkColor.forEach(l => l.addEventListener('click', colorLink)) linkColor.forEach(l => l.addEventListener('click', colorLink))
</script> </script>
</body> </body>
<script>
function secondsToHms(d) {
d = Number(d);
var dd = Math.floor(d/86400);
var h = Math.floor(d%86400/3600);
var m = Math.floor(d%3600/60);
var s = Math.floor(d%3600%60);
return (' '+dd+'d '+(h<10?"0":"")+h+":"+(m<10?"0":"")+m+":"+(s<10?"0":"")+s); }
function updateStatus(data) {
var dat = JSON.parse(data);
try
{
theDate = new Date(dat.time * 1000);
sec = dat.uptime;
document.getElementById('localtime').innerHTML=(theDate.toString()).slice(0,34);
document.getElementById('uptime').innerHTML= secondsToHms(sec);
document.getElementById('wlev').innerHTML= dat.wlev;
}
catch(e){return;}
}
function ReadAndUpdate() {
GetDataFile("/api/status.json", function(data){updateStatus(data);});
}
ReadAndUpdate();
setInterval("ReadAndUpdate()",1000);
</script>
</html> </html>

View File

@ -40,36 +40,27 @@ var hedmen = `
<div class="nav__dropdown"> <div class="nav__dropdown">
<a href="#" class="nav__link"> <a href="#" class="nav__link">
<i class='icon-wifi nav__icon' ></i> <i class='icon-cog-alt nav__icon' ></i>
<span class="nav__name">CONNECTION</span> <span class="nav__name">SETTINGS</span>
<i class='icon-down-open nav__icon nav__dropdown-icon'></i> <i class='icon-down-open nav__icon nav__dropdown-icon'></i>
</a> </a>
<div class="nav__dropdown-collapse"> <div class="nav__dropdown-collapse">
<div class="nav__dropdown-content"> <div class="nav__dropdown-content">
<a href="adapters.html" class="nav__dropdown-item">Adapters</a> <a href="adapters.html" class="nav__dropdown-item">Network</a>
<a href="services.html" class="nav__dropdown-item">Services</a> <a href="services.html" class="nav__dropdown-item">Services</a>
<a href="system.html" class="nav__dropdown-item">System</a>
</div> </div>
</div> </div>
</div> </div>
<div class="nav__dropdown">
<a href="#" class="nav__link">
<i class='icon-cog-alt nav__icon' ></i>
<span class="nav__name">DEVICE</span>
<i class='icon-down-open nav__icon nav__dropdown-icon'></i>
</a>
<div class="nav__dropdown-collapse">
<div class="nav__dropdown-content">
<a href="system.html" class="nav__dropdown-item">Maintain</a>
</div>
</div>
</div>
</div> </div>
<a href="info.html" class="nav__link nav__logo">
<i class='icon-info-circled nav__icon' ></i>
<span class="nav__logo-name">About</span>
</a>
</div> </div>
</div> </div>
</nav> </nav>

View File

@ -32,12 +32,8 @@
<button id='sendt' type='button' class ='btn sbtn'>Передать</button><br/><br/><br/> <button id='sendt' type='button' class ='btn sbtn'>Передать</button><br/><br/><br/>
</td></tr> </td></tr>
</table> </table>
<div class="resfail" style="text-align:center;display:~status_fail~" color="#F00" > <script>PrintSaveFail('~status_fail~');
<font color="red"> PrintSaveBtn('sntp'); PrintApplyBtn('sntp')</script>
<h2>Ошибка формата данных!</h2></font><br /> </div>
<div style='margin:auto;text-align:center'>
<button type="submit" class ='btn' name='sav' value='prs'>Сохранить</button>
</div>
</form> </form>
</div> </div>
</div> </div>
@ -55,16 +51,17 @@
PrintTextInput('Логин','clnm1','~clname1~',3,31); PrintTextInput('Логин','clnm1','~clname1~',3,31);
PrintTextInput('Пароль','clps1','~clpass1~',3,31); PrintTextInput('Пароль','clps1','~clpass1~',3,31);
PrintSep(); PrintSep();
if(~ifc_mq2~){
PrintCheckBox('Включить MQTT 2','mqttenb2','~mqtten2~',null); PrintCheckBox('Включить MQTT 2','mqttenb2','~mqtten2~',null);
PrintTextInput('URL шлюза сообщений','cld2','~ipcld2~',3,31); PrintTextInput('URL шлюза сообщений','cld2','~ipcld2~',3,31);
PrintInt('Порт шлюза сообщений','mprt2','~mport2~',1000,65534); PrintInt('Порт шлюза сообщений','mprt2','~mport2~',1000,65534);
PrintTextInput('ID станции','idd2','~idcld2~',3,31); PrintTextInput('ID станции','idd2','~idcld2~',3,31);
PrintTextInput('Корневая тема','top2','~topic2~',3,31); PrintTextInput('Корневая тема','top2','~topic2~',3,31);
PrintTextInput('Логин','clnm2','~clname2~',3,31); PrintTextInput('Логин','clnm2','~clname2~',3,31);
PrintTextInput('Пароль','clps2','~clpass2~',3,31);</script> PrintTextInput('Пароль','clps2','~clpass2~',3,31);}</script>
</table> </table>
<script>PrintSaveFail('~status_fail~'); <script>PrintSaveFail('~status_fail~');
PrintSaveBtn();</script> PrintSaveBtn('mqtt'); PrintApplyBtn('mqtt')</script>
</form> </form>
</div> </div>
</div> </div>

View File

@ -18,45 +18,45 @@
<div class="mlp"> <div class="mlp">
<div class="mlpc"> <div class="mlpc">
<form name="conf1" method="post"> <form name="syst" method="post">
<div class="mlhdr">SYSTEM</div> <div class="mlhdr">SYSTEM</div>
<table class='cntr'><script>PrintTextInputNoReg('Имя устройства:','nam','~dname~', 3, 31 ); <table class='cntr'><script>PrintTextInputNoReg('Имя устройства:','nam','~dname~', 3, 31 );
PrintTextInput('Имя пользователя:','lgn','~login~', 3, 31 ); PrintTextInput('User name:','lgn','~login~', 3, 31 );
PrintTextInput('Пароль пользователя:','psn','~pass~', 5, 31 ); PrintTextInput('User password:','psn','~pass~', 5, 31 );
PrintCheckBox('Включить OTA обновление','ota','~ota~',null);</script></table> PrintCheckBox('Enable OTA update','ota','~ota~',null);</script></table>
<table class='cntr'><tr><td align="center">URL файла обновления:</td></tr></table> <table class='cntr'><tr><td align="center">Update firmware URL:</td></tr></table>
<table class='cntr'><tr><td><textarea type="text" raws="5" name='otaurl' title="64 символа" ">~otaurl~</textarea></td></tr> <table class='cntr'><tr><td><textarea type="text" raws="5" name='otaurl' title="64 символа" ">~otaurl~</textarea></td></tr>
</table> </table>
<table class='cntr'><script> <table class='cntr'><script>
PrintSep(); PrintSep();
PrintLabel('Версия ПО:','~fver~'); PrintLabel('Firmware version:','~fver~');
PrintLabel('Версия IDF:','~idfver~'); PrintLabel('IDF version:','~idfver~');
PrintLabel('Дата сборки:','~builddate~'); PrintLabel('Built date:','~builddate~');
PrintLabel('Серийный номер:','~serial10~');</script></table> PrintLabel('Serial number:','~serial10~');</script></table>
<script>PrintSaveFail('~status_fail~');</script> <script>PrintSaveFail('~status_fail~');</script>
<button type="submit" class ='btn' name='upd' value='prs'>Обновить ПО</button> <button type="submit" class ='btn' name='upd' value='prs'>Update manual</button>
<button type="submit" class ='btn' name='rst' value='prs'>Перезагрузить</button> <button type="submit" class ='btn' name='rst' value='prs'>Reboot</button>
<button type="submit" class ='btn' name='sav' value='prs'>Сохранить</button> <script>PrintSaveBtn('syst'); PrintApplyBtn('syst');</script>
</form> </form>
</div> </div>
</div> </div>
<div class="mlp"> <div class="mlp">
<div class="mlpc"> <div class="mlpc">
<form name="conf2" method="post"> <form name="stat" method="post">
<div class="mlhdr">STAT</div> <div class="mlhdr">STAT</div>
<table class='cntr'> <table class='cntr'>
<tr><td class='rl lab'>Ethernet:</td><td><span id='eth'>?</span></td></tr> <tr><td class='rl lab'>Ethernet:</td><td><span id='eth'>?</span></td></tr>
<tr><td class='rl lab'>WiFi:</td><td><span id='wfi'>?</span></td></tr> <tr><td class='rl lab'>WiFi:</td><td><span id='wfi'>?</span></td></tr>
<tr><td class='rl lab'>GPRS:</td><td><span id='gpr'>?</span></td></tr> <tr><td class='rl lab'>GPRS:</td><td><span id='gpr'>?</span></td></tr>
<tr><td height='20px'></td></tr> <tr><td height='20px'></td></tr>
<tr><td class='rl lab'>Основной адаптер:</td><td><span id='adp'>?</span></td></tr> <tr><td class='rl lab'>Current net adapter:</td><td><span id='adp'>?</span></td></tr>
<tr><td height='20px'></td></tr> <tr><td height='20px'></td></tr>
<tr><td class='rl lab'>MQTT соединение 1:</td><td><span id='mq1'>?</span></td></tr> <tr><td class='rl lab'>MQTT connection 1:</td><td><span id='mq1'>?</span></td></tr>
<tr><td class='rl lab'>MQTT соединение 2:</td><td><span id='mq2'>?</span></td></tr> <tr><td class='rl lab'>MQTT connection 2:</td><td><span id='mq2'>?</span></td></tr>
<tr><td height='20px'></td></tr> <tr><td height='20px'></td></tr>
<tr><td class='rl lab'>Свободной памяти:</td><td><span id='mem'>?</span></td></tr> <tr><td class='rl lab'>Free RAM:</td><td><span id='mem'>?</span></td></tr>
<tr><td class='rl lab'>Минимум памяти:</td><td><span id='mmem'>?</span></td></tr> <tr><td class='rl lab'>Minimal free RAM :</td><td><span id='mmem'>?</span></td></tr>
</table> </table>
</form> </form>
</div> </div>
@ -64,7 +64,7 @@
<div class="mlp"> <div class="mlp">
<div class="mlpc"> <div class="mlpc">
<form name="conf2" method="post"> <form name="cntrl" method="post">
<div class="mlhdr">CONTROL</div> <div class="mlhdr">CONTROL</div>
<div style='margin:auto;text-align:center'> <div style='margin:auto;text-align:center'>
</br> </br>

@ -1 +1 @@
Subproject commit 34be6b7dab4f342fcf2d8778471ea7bb357c53c2 Subproject commit ee9c5730324a6bd4aeddbd53010367ac139057a6