userbogd/WebguiappTemplate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

reworked main page with vue framework

Browse Source
This commit is contained in:
Bogdan Pilyugin 2023-07-12 15:53:12 +02:00
parent 44144aaf1b
commit f86553dd64
8 changed files with 3113 additions and 2909 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1542
.project
View File

File diff suppressed because it is too large Load Diff

18
HTML/api/users.json Normal file
View File

@ -0,0 +1,18 @@
[
{
"id": 0,
"name": "John"
},
{
"id": 1,
"name": "Jane"
},
{
"id": 2,
"name": "Jack"
},
{
"id": 3,
"name": "Jill"
}
]

64
HTML/espfs.paths
View File

@ -1,32 +1,34 @@
adapters.html adapters.html
api api
api/dbg.json api/dbg.json
api/dbg2.json api/dbg2.json
api/gendata.json api/gendata.json
api/mem.json api/mem.json
api/set1.json api/set1.json
api/set2.json api/set2.json
api/set3.json api/set3.json
api/stat.json api/stat.json
api/status.json api/status.json
api/tmr.json api/tmr.json
api/wifiscan.json api/users.json
application.html api/wifiscan.json
favicon.ico application.html
index.html favicon.ico
info.html index.html
reboot.html info.html
res reboot.html
res/appstyles.css res
res/ca_cert.pem res/appstyles.css
res/cron.js res/ca_cert.pem
res/crondata.js res/cron.js
res/dynamic.css res/crondata.js
res/iconsfont.css res/dynamic.css
res/iconsfont.woff2 res/iconsfont.css
res/logo.png res/iconsfont.woff2
res/main.js res/logo.png
res/res.js res/main.js
res/styles.css res/res.js
services.html res/styles.css
res/vue.global.prod_3_3_4.js
services.html
system.html system.html

69
HTML/index.html
View File

@ -7,17 +7,18 @@
<link rel="stylesheet" href="res/iconsfont.css"> <link rel="stylesheet" href="res/iconsfont.css">
<script src="res/main.js"></script> <script src="res/main.js"></script>
<script src="res/res.js"></script> <script src="res/res.js"></script>
<script src="res/vue.global.prod_3_3_4.js"></script>
<title>~name~</title> <title>~name~</title>
</head> </head>
<body> <body>
<script>PageSurround();</script> <script>PageSurround();</script>
<!--========== CONTENTS ==========--> <!--========== CONTENTS ==========-->
<main> <main>
<section> <section>
<div class="ml"> <div class="ml">
<!--
<div class="mlp"> <div class="mlp">
<div class="mlpc"> <div class="mlpc">
<div class="mlhdr"></div> <div class="mlhdr"></div>
@ -30,6 +31,23 @@
</div> </div>
</div> </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> </div>
</section> </section>
@ -38,7 +56,47 @@
<script> <script>
showMenu('header-toggle','navbar'); showMenu('header-toggle','navbar');
</script> </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> </body>
<script> <script>
function secondsToHms(d) { function secondsToHms(d) {
@ -63,7 +121,8 @@
function ReadAndUpdate() { function ReadAndUpdate() {
GetDataFile("/api/status.json", function(data){updateStatus(data);}); GetDataFile("/api/status.json", function(data){updateStatus(data);});
} }
ReadAndUpdate(); //ReadAndUpdate();
setInterval("ReadAndUpdate()",1000); //setInterval("ReadAndUpdate()",1000);
</script> </script>
</html> </html>

BIN
HTML/res/vue.global.prod_3_3_4.js Normal file
View File

Binary file not shown.

18
dependencies.lock
View File

@ -1,9 +1,9 @@
dependencies: dependencies:
idf: idf:
component_hash: null component_hash: null
source: source:
type: idf type: idf
version: 5.0.3 version: 5.0.3
manifest_hash: cc4f7a08a6eeed39d05fbfb84ff3df9215bdf0009945794b887b5e99cbaee95b manifest_hash: cc4f7a08a6eeed39d05fbfb84ff3df9215bdf0009945794b887b5e99cbaee95b
target: esp32 target: esp32
version: 1.0.0 version: 1.0.0

3722
sdkconfig
View File

File diff suppressed because it is too large Load Diff

589
sdkconfig.old
View File

File diff suppressed because it is too large Load Diff