update html
This commit is contained in:
parent
2a497625de
commit
ea2eef0ad1
|
|
@ -7,38 +7,69 @@
|
|||
<h1>ESPMega PRO</h1>
|
||||
<h3>Device Configurations</h3>
|
||||
<p class="config_title">IP Address</p>
|
||||
<input type="text" id="ip_address" name="ip_address" class="conf_txt" value="$(ip_address)$"><br>
|
||||
<input type="text" id="ip_address" name="ip_address" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">Network Mask</p>
|
||||
<input type="text" id="netmask" name="netmask" class="conf_txt" value="$(netmask)$"><br>
|
||||
<input type="text" id="netmask" name="netmask" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">Gateway</p>
|
||||
<input type="text" id="gateway" name="gateway" class="conf_txt" value="$(gateway)$"><br>
|
||||
<input type="text" id="gateway" name="gateway" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">DNS Server</p>
|
||||
<input type="text" id="dns" name="dns" class="conf_txt" value="$(dns)$"><br>
|
||||
<input type="text" id="dns" name="dns" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">Hostname</p>
|
||||
<input type="text" id="hostname" name="hostname" class="conf_txt" value="$(hostname)$"><br>
|
||||
<input type="text" id="hostname" name="hostname" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">BMS Server - IP Address</p>
|
||||
<input type="text" id="bms_ip" name="bms_ip" class="conf_txt" value="$(bms_ip)$"><br>
|
||||
<input type="text" id="bms_ip" name="bms_ip" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">BMS Server - Port</p>
|
||||
<input type="text" id="bms_port" name="bms_port" class="conf_txt" value="$(bms_port)$"><br>
|
||||
<input type="text" id="bms_port" name="bms_port" class="conf_txt" value="Loading ..."><br>
|
||||
<label class="container">Authentication
|
||||
<input type="checkbox" name="bms_useauth" id="bms_useauth" $(bms_use_auth)$ value="yes">
|
||||
<input type="checkbox" name="bms_useauth" id="bms_useauth" value="yes">
|
||||
<span class="checkmark"></span>
|
||||
</label>
|
||||
<p class="config_title">BMS Server - Username</p>
|
||||
<input type="text" id="bms_username" name="bms_username" class="conf_txt" value="$(bms_username)$"><br>
|
||||
<input type="text" id="bms_username" name="bms_username" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">BMS Server - Password</p>
|
||||
<input type="password" id="bms_password" name="bms_password" class="conf_txt" value="$(bms_password)$"><br>
|
||||
<input type="password" id="bms_password" name="bms_password" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">BMS Server - Endpoint</p>
|
||||
<input type="text" id="bms_endpoint" name="bms_endpoint" class="conf_txt" value="$(bms_endpoint)$"><br>
|
||||
<input type="text" id="bms_endpoint" name="bms_endpoint" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">Web Interface - Username</p>
|
||||
<input type="text" id="web_username" name="web_username" class="conf_txt" value="$(web_username)$"><br>
|
||||
<input type="text" id="web_username" name="web_username" class="conf_txt" value="Loading ..."><br>
|
||||
<p class="config_title">Web Interface - Password</p>
|
||||
<input type="password" id="web_password" name="web_password" class="conf_txt" value="$(web_password)$"><br>
|
||||
<input type="submit" class="btn" value="Save">
|
||||
<input type="password" id="web_password" name="web_password" class="conf_txt" value="Loading ..."><br>
|
||||
<input id="save_btn" type="submit" class="btn" value="Save">
|
||||
<button type="button" class="conf" onclick="window.location.href='/'">Back</button><br /><br />
|
||||
<b>SIWAT SYSTEM 2023</b>
|
||||
</form>
|
||||
<script>
|
||||
window.onload = function () {
|
||||
var saveButton = document.getElementById("save_btn");
|
||||
saveButton.style.pointerEvents = "none";
|
||||
saveButton.style.opacity = "0.6";
|
||||
// Get the configuration data
|
||||
fetch("/get_config")
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
// Handle the response data
|
||||
console.log(data);
|
||||
document.getElementById("ip_address").value = data.ip_address;
|
||||
document.getElementById("netmask").value = data.netmask;
|
||||
document.getElementById("gateway").value = data.gateway;
|
||||
document.getElementById("dns").value = data.dns;
|
||||
document.getElementById("hostname").value = data.hostname;
|
||||
document.getElementById("bms_ip").value = data.bms_ip;
|
||||
document.getElementById("bms_port").value = data.bms_port;
|
||||
document.getElementById("bms_useauth").checked = data.bms_useauth;
|
||||
document.getElementById("bms_username").value = data.bms_username;
|
||||
document.getElementById("bms_password").value = data.bms_password;
|
||||
document.getElementById("bms_endpoint").value = data.bms_endpoint;
|
||||
document.getElementById("web_username").value = data.web_username;
|
||||
document.getElementById("web_password").value = data.web_password;
|
||||
saveButton.style.pointerEvents = "auto";
|
||||
saveButton.style.opacity = "1";
|
||||
})
|
||||
.catch(error => {
|
||||
// Handle any errors
|
||||
console.error(error);
|
||||
});
|
||||
}
|
||||
function send_config() {
|
||||
event.preventDefault();
|
||||
// Get the form data
|
||||
|
|
@ -291,6 +322,7 @@
|
|||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.spinner-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
|
@ -301,6 +333,7 @@
|
|||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.9); /* semi-transparent black background */
|
||||
background: rgba(0, 0, 0, 0.9);
|
||||
/* semi-transparent black background */
|
||||
}
|
||||
</style>
|
||||
|
|
@ -4,31 +4,43 @@
|
|||
<h3>Device Information</h3>
|
||||
<p style="text-align: left">
|
||||
Hostname
|
||||
<span style="float: right">$(hostname)$</span>
|
||||
<span style="float: right" id="hostname">Loading ...</span>
|
||||
</p>
|
||||
<p style="text-align: left">
|
||||
IP Address
|
||||
<span style="float: right">$(ip_address)$</span>
|
||||
<span style="float: right" id="ip_address">Loading ...</span>
|
||||
</p>
|
||||
<p style="text-align: left">
|
||||
MAC Address
|
||||
<span style="float: right">$(mac_address)$</span>
|
||||
<span style="float: right" id="mac_address">Loading ...</span>
|
||||
</p>
|
||||
<p style="text-align: left">
|
||||
Device
|
||||
<span style="float: right">$(model)$</span>
|
||||
Model
|
||||
<span style="float: right" id="model">Loading ...</span>
|
||||
</p>
|
||||
<p style="text-align: left">
|
||||
FW Version
|
||||
<span style="float: right" id="fw_version">Loading ...</span>
|
||||
</p>
|
||||
<p style="text-align: left">
|
||||
SDK Version
|
||||
<span style="float: right" id="sdk_version">Loading ...</span>
|
||||
</p>
|
||||
<p style="text-align: left">
|
||||
IDF Version
|
||||
<span style="float: right" id="idf_version">Loading ...</span>
|
||||
</p>
|
||||
<p style="text-align: left">
|
||||
API Server
|
||||
<span style="float: right">$(mqtt_connection_string)$</span>
|
||||
<span style="float: right" id="api_server">Loading ...</span>
|
||||
</p>
|
||||
<p style="text-align: left">
|
||||
API Endpoint
|
||||
<span style="float: right">$(base_topic)$</span>
|
||||
<span style="float: right" id="api_endpoint">Loading ...</span>
|
||||
</p>
|
||||
<p style="text-align: left">
|
||||
Centrally Managed
|
||||
<span style="float: right">$(mqtt_connected)$</span>
|
||||
<span style="float: right" id="centrally_managed">Loading ...</span>
|
||||
</p>
|
||||
<button type="button" class="conf" onclick="window.location.href='config'">Settings</button><br /><br />
|
||||
<hr>
|
||||
|
|
@ -48,6 +60,27 @@
|
|||
<b>SIWAT SYSTEM 2023</b>
|
||||
</form>
|
||||
<script>
|
||||
window.onload(function () {
|
||||
fetch("/get_device_info")
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
console.log(data);
|
||||
document.getElementById("hostname").innerHTML = data.hostname;
|
||||
document.getElementById("ip_address").innerHTML = data.ip_address;
|
||||
document.getElementById("mac_address").innerHTML = data.mac_address;
|
||||
document.getElementById("model").innerHTML = data.model;
|
||||
document.getElementById("fw_version").innerHTML = data.fw_version;
|
||||
document.getElementById("sdk_version").innerHTML = data.sdk_version;
|
||||
document.getElementById("idf_version").innerHTML = data.idf_version;
|
||||
document.getElementById("api_server").innerHTML = data.api_server+":"+data.api_port;
|
||||
document.getElementById("api_endpoint").innerHTML = data.api_endpoint;
|
||||
document.getElementById("centrally_managed").innerHTML = data.centrally_managed;
|
||||
}).catch(error => {
|
||||
console.error(error);
|
||||
});
|
||||
}
|
||||
);
|
||||
|
||||
function sub(obj) {
|
||||
var fileName = obj.value.split("\\");
|
||||
document.getElementById("file-input").innerHTML =
|
||||
|
|
|
|||
Loading…
Reference in New Issue