reworked main page with vue framework
This commit is contained in:
parent
44144aaf1b
commit
f86553dd64
18
HTML/api/users.json
Normal file
18
HTML/api/users.json
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
[
|
||||
{
|
||||
"id": 0,
|
||||
"name": "John"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"name": "Jane"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"name": "Jack"
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"name": "Jill"
|
||||
}
|
||||
]
|
||||
|
|
@ -1,32 +1,34 @@
|
|||
adapters.html
|
||||
api
|
||||
api/dbg.json
|
||||
api/dbg2.json
|
||||
api/gendata.json
|
||||
api/mem.json
|
||||
api/set1.json
|
||||
api/set2.json
|
||||
api/set3.json
|
||||
api/stat.json
|
||||
api/status.json
|
||||
api/tmr.json
|
||||
api/wifiscan.json
|
||||
application.html
|
||||
favicon.ico
|
||||
index.html
|
||||
info.html
|
||||
reboot.html
|
||||
res
|
||||
res/appstyles.css
|
||||
res/ca_cert.pem
|
||||
res/cron.js
|
||||
res/crondata.js
|
||||
res/dynamic.css
|
||||
res/iconsfont.css
|
||||
res/iconsfont.woff2
|
||||
res/logo.png
|
||||
res/main.js
|
||||
res/res.js
|
||||
res/styles.css
|
||||
services.html
|
||||
adapters.html
|
||||
api
|
||||
api/dbg.json
|
||||
api/dbg2.json
|
||||
api/gendata.json
|
||||
api/mem.json
|
||||
api/set1.json
|
||||
api/set2.json
|
||||
api/set3.json
|
||||
api/stat.json
|
||||
api/status.json
|
||||
api/tmr.json
|
||||
api/users.json
|
||||
api/wifiscan.json
|
||||
application.html
|
||||
favicon.ico
|
||||
index.html
|
||||
info.html
|
||||
reboot.html
|
||||
res
|
||||
res/appstyles.css
|
||||
res/ca_cert.pem
|
||||
res/cron.js
|
||||
res/crondata.js
|
||||
res/dynamic.css
|
||||
res/iconsfont.css
|
||||
res/iconsfont.woff2
|
||||
res/logo.png
|
||||
res/main.js
|
||||
res/res.js
|
||||
res/styles.css
|
||||
res/vue.global.prod_3_3_4.js
|
||||
services.html
|
||||
system.html
|
||||
|
|
@ -7,17 +7,18 @@
|
|||
<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>
|
||||
|
|
@ -30,6 +31,23 @@
|
|||
</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>
|
||||
|
|
@ -38,7 +56,47 @@
|
|||
<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) {
|
||||
|
|
@ -63,7 +121,8 @@
|
|||
function ReadAndUpdate() {
|
||||
GetDataFile("/api/status.json", function(data){updateStatus(data);});
|
||||
}
|
||||
ReadAndUpdate();
|
||||
setInterval("ReadAndUpdate()",1000);
|
||||
//ReadAndUpdate();
|
||||
//setInterval("ReadAndUpdate()",1000);
|
||||
|
||||
</script>
|
||||
</html>
|
||||
BIN
HTML/res/vue.global.prod_3_3_4.js
Normal file
BIN
HTML/res/vue.global.prod_3_3_4.js
Normal file
Binary file not shown.
|
|
@ -1,9 +1,9 @@
|
|||
dependencies:
|
||||
idf:
|
||||
component_hash: null
|
||||
source:
|
||||
type: idf
|
||||
version: 5.0.3
|
||||
manifest_hash: cc4f7a08a6eeed39d05fbfb84ff3df9215bdf0009945794b887b5e99cbaee95b
|
||||
target: esp32
|
||||
version: 1.0.0
|
||||
dependencies:
|
||||
idf:
|
||||
component_hash: null
|
||||
source:
|
||||
type: idf
|
||||
version: 5.0.3
|
||||
manifest_hash: cc4f7a08a6eeed39d05fbfb84ff3df9215bdf0009945794b887b5e99cbaee95b
|
||||
target: esp32
|
||||
version: 1.0.0
|
||||
|
|
|
|||
589
sdkconfig.old
589
sdkconfig.old
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user