128 lines
3.8 KiB
HTML
128 lines
3.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="res/styles.css">
|
|
<link rel="stylesheet" href="res/iconsfont.css">
|
|
<script src="res/main.js"></script>
|
|
<script src="res/res.js"></script>
|
|
<script src="res/vue.global.prod_3_3_4.js"></script>
|
|
<title>~name~</title>
|
|
</head>
|
|
<body>
|
|
<script>PageSurround();</script>
|
|
|
|
<!--========== CONTENTS ==========-->
|
|
<main>
|
|
<section>
|
|
<div class="ml">
|
|
|
|
<!--
|
|
<div class="mlp">
|
|
<div class="mlpc">
|
|
<div class="mlhdr"></div>
|
|
<div class='cntr' style='text-align:center;margin-top:20px'>
|
|
<span id="name" ><div class='hdr1'>This device brand 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 class="mlp">
|
|
<div class="mlpc">
|
|
<div class="mlhdr"></div>
|
|
<div class='cntr' style='text-align:center;margin-top:20px'>
|
|
<span id="name" ><div class='hdr1'>This device brand name</div></span><br/><br/>
|
|
<div id="app">
|
|
{{ TimeToISO(status_json.time)}}<br/>
|
|
Uptime: {{ToHms(status_json.uptime)}}<br/><br/>
|
|
Signal WiFi:<span style="color:#0099ff;font-weight:bold">{{status_json.wlev}}</span><br/>
|
|
<br/><br/><br/><br/><br/><br/><br/><br/><br/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</section>
|
|
|
|
</main>
|
|
<script>
|
|
showMenu('header-toggle','navbar');
|
|
</script>
|
|
|
|
<script>
|
|
const app = Vue.createApp({
|
|
data(){
|
|
return {
|
|
status: true,
|
|
status_json: {},
|
|
interval: null}
|
|
},
|
|
methods: {
|
|
async getData() {
|
|
const res = await fetch("./api/status.json");
|
|
this.status_json = await res.json();
|
|
},
|
|
|
|
TimeToISO(t) {
|
|
theDate = new Date(t * 1000);
|
|
return (theDate.toString()).slice(0,34);
|
|
},
|
|
|
|
ToHms(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);}
|
|
},
|
|
mounted() {
|
|
this.getData()
|
|
},
|
|
created(){
|
|
this.interval = setInterval(() =>{
|
|
this.getData()},1000)
|
|
},
|
|
destroyed(){
|
|
clearInterval(this.interval)
|
|
}
|
|
|
|
}).mount('#app');
|
|
</script>
|
|
</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> |