update esp32_air_pump/data/index.html.

master
慕炎 2022-01-09 08:28:44 +00:00 committed by Gitee
parent 884fd67f77
commit d7623ea797
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
1 changed files with 138 additions and 140 deletions

View File

@ -1,8 +1,16 @@
<html lang="zh-cn"> <!--
微型气泵控制板
HW:Ver 1.0
FW:Ver 1.2
-->
<html lang="zh-cn">
<head> <head>
<title>Air Pump Control</title> <title>Air Pump Control</title>
<meta charset="utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta http-equiv="Cache-Control" content="max-age=7200" />
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
<style> <style>
/*input框*/ /*input框*/
input, input,
@ -140,162 +148,152 @@
} }
</style> </style>
<script> <script>
var running_type = ["无", "篮球", "摩托车", "汽车", "自行车", "自定义"]; var running_type = ["无", "篮球", "摩托车", "汽车", "自行车", "自定义"];
var pressure_type = [0, 0.6, 2.4, 2.5, 3.9, 2.4]; var pressure_type = [0, 0.6, 2.4, 2.5, 3.9, 2.4];
function loadXMLDoc(path,element)
{ function loadXMLDoc(path, element) {
var xmlhttp; var xmlhttp;
if (window.XMLHttpRequest) if (window.XMLHttpRequest) {
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XMLHttpRequest(); xmlhttp = new XMLHttpRequest();
} } else {
else
{
// IE6, IE5 浏览器执行代码 // IE6, IE5 浏览器执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} }
xmlhttp.onreadystatechange=function() xmlhttp.onreadystatechange = function() {
{ if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
if (xmlhttp.readyState==4 && xmlhttp.status==200) document.getElementById(element).innerHTML = xmlhttp.responseText;
{
document.getElementById(element).innerHTML=xmlhttp.responseText;
} }
}
xmlhttp.open("GET", path, true);
xmlhttp.send();
} }
xmlhttp.open("GET",path,true);
xmlhttp.send();
}
function UpdateInfo() function UpdateInfo() {
{ var xmlhttp;
var xmlhttp; if (window.XMLHttpRequest) {
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XMLHttpRequest(); xmlhttp = new XMLHttpRequest();
} } else {
else
{
// IE6, IE5 浏览器执行代码 // IE6, IE5 浏览器执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} }
xmlhttp.onreadystatechange=function() xmlhttp.onreadystatechange = function() {
{ if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
if (xmlhttp.readyState==4 && xmlhttp.status==200) var arr = xmlhttp.responseText.split(",");
{ document.getElementById('bat_voltage').innerHTML = arr[1];
var arr=xmlhttp.responseText.split(","); if (arr[3] == 1) {
document.getElementById('CurrentMillis').innerHTML = "已启动:" + arr[0];
document.getElementById('bat_voltage').innerHTML=arr[1]; } else {
if(arr[3]==1){ document.getElementById('CurrentMillis').innerHTML = "未启动";
document.getElementById('CurrentMillis').innerHTML="已启动:"+arr[0]; }
}else{ document.getElementById('running_type').innerHTML = arr[4];
document.getElementById('CurrentMillis').innerHTML="未启动"; document.getElementById('running_pressure_type').value = arr[5];
} running_type5(arr[4]);
document.getElementById('running_type').innerHTML=arr[4]; if (arr[2] == "-1.00") {
document.getElementById('running_pressure_type').value=arr[5]; document.getElementById('pressure_val').innerHTML = "<font color='red'>传感器异常</font>";
running_type5(arr[4]); document.getElementById('running_type_html').innerHTML = document.getElementById('running_type_html').innerHTML + " <font color='red'>传感器异常启动会限制执行1分钟</font>";
if(arr[2]=="-1.00"){ } else {
document.getElementById('pressure_val').innerHTML="<font color='red'>传感器异常</font>"; document.getElementById('pressure_val').innerHTML = arr[2];
document.getElementById('running_type_html').innerHTML=document.getElementById('running_type_html').innerHTML+" <font color='red'>传感器异常启动会限制执行1分钟</font>"; }
}else{
document.getElementById('pressure_val').innerHTML=arr[2];
}
} }
}
xmlhttp.open("GET", '/update', true);
xmlhttp.send();
} }
xmlhttp.open("GET",'/update',true);
xmlhttp.send();
}
function MyAutoRun() {
function MyAutoRun() UpdateInfo();
{
UpdateInfo();
}
setInterval("MyAutoRun()",1000);
function checkNum(obj) {
if (isNaN(obj.value)) { //检查是否是非数字值
obj.value = "";
}
if (obj != null) { //检查小数点后是否对于两位
if ( obj.value.toString().split(".").length > 1 && obj.value.toString().split(".")[1].length > 2 ) { //alert("小数点后多于两位!");
obj.value = Number(obj.value).toPrecision(2);
} }
if(obj.value<0){ setInterval("MyAutoRun()", 1000);
obj.value = 0-obj.value;
}
if(obj.value>6){
obj.value = 6;
}
}
}
function running_type5(obj){ function checkNum(obj) {
document.getElementById('running_type_html').innerHTML=running_type[obj]; if (isNaN(obj.value)) { //检查是否是非数字值
document.getElementById('running_type').value=obj; obj.value = "";
if(obj!="5"){ }
document.getElementById('running_pressure_type').value=pressure_type[obj]; if (obj != null) { //检查小数点后是否对于两位
} if (obj.value.toString().split(".").length > 1 && obj.value.toString().split(".")[1].length > 2) { //alert("小数点后多于两位!");
} obj.value = Number(obj.value).toPrecision(2);
</script> }
if (obj.value < 0) {
obj.value = 0 - obj.value;
}
if (obj.value > 6) {
obj.value = 6;
}
}
}
function running_type5(obj) {
document.getElementById('running_type_html').innerHTML = running_type[obj];
document.getElementById('running_type').value = obj;
if (obj != "5") {
document.getElementById('running_pressure_type').value = pressure_type[obj];
}
}
</script>
</head> </head>
<body style="background-color:black;color:white"> <body style="background-color:black;color:white">
<div> <div>
<font size=6>微型气泵状态监控</font> <font size=6>微型气泵状态监控</font>
</div> </div>
<div id="OperationHit"><h2></h2></div> <div id="OperationHit">
<table border="0"> <h2></h2>
<tr> </div>
<td height="50"></font> <span id=CurrentMillis></span> <table border="0">
</td> <tr>
</tr> <td height="50">
<tr> </font> <span id=CurrentMillis></span>
<td height="50"> </td>
<div>气压:<span id=pressure_val>0</span>Bar&nbsp;&nbsp;&nbsp;&nbsp;电压:<span id=bat_voltage>0</span>V</div> </tr>
</td> <tr>
</tr> <td height="50">
<tr> <div>气压:<span id=pressure_val>0</span>Bar&nbsp;&nbsp;&nbsp;&nbsp;电压:<span id=bat_voltage>0</span>V</div>
<td> </td>
</tr>
<tr>
<td>
<table border="0" cellspacing="0" cellpadding="0"> <table border="0" cellspacing="0" cellpadding="0">
<tr> <tr>
<td height="50"> <td height="50">
<button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="1">篮球</button> <button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="1">篮球</button>
<button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="2">摩托车</button> <button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="2">摩托车</button>
<button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="5">自定义</button> <br><br> <button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="5">自定义</button> <br><br>
<button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="3">汽车</button> <button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="3">汽车</button>
<button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="4">自行车</button> <button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(this.value);loadXMLDoc('/Control?Type=2&Index='+this.value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');" value="4">自行车</button>
</td> </td>
<td align="center"> <td align="center">
<table border="0" cellspacing="0" cellpadding="0" id="diy_show"> <table border="0" cellspacing="0" cellpadding="0" id="diy_show">
<tr> <tr>
<td> <td>
<input class="tl-input" type="text" name="running_pressure_type" id="running_pressure_type" size="2" onchange="checkNum(this);loadXMLDoc('/Control?Type=2&Index=5&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');"> <input class="tl-input" type="text" name="running_pressure_type" id="running_pressure_type" size="2" onchange="checkNum(this);loadXMLDoc('/Control?Type=2&Index=5&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');">
<button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(5);document.getElementById('running_pressure_type').value=(Number(document.getElementById('running_pressure_type').value)+0.1).toPrecision(2);checkNum(document.getElementById('running_pressure_type'));loadXMLDoc('/Control?Type=2&Index=5&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');">+</button> <button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(5);document.getElementById('running_pressure_type').value=(Number(document.getElementById('running_pressure_type').value)+0.1).toPrecision(2);checkNum(document.getElementById('running_pressure_type'));loadXMLDoc('/Control?Type=2&Index=5&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');">+</button>
<button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(5);document.getElementById('running_pressure_type').value=(Number(document.getElementById('running_pressure_type').value)-0.1).toPrecision(2);checkNum(document.getElementById('running_pressure_type'));loadXMLDoc('/Control?Type=2&Index=5&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');">-</button> <button type="button" class="ant-btn ant-btn-primary" onclick="running_type5(5);document.getElementById('running_pressure_type').value=(Number(document.getElementById('running_pressure_type').value)-0.1).toPrecision(2);checkNum(document.getElementById('running_pressure_type'));loadXMLDoc('/Control?Type=2&Index=5&Operation='+document.getElementById('running_pressure_type').value,'OperationHit');">-</button>
</td> </td>
</tr> </tr>
</table> </table>
</td>
</tr>
</table>
</td> </td>
</tr> </tr>
<tr> </table>
<td height="50"> </td>
<input value="0" id="running_type" hidden> &nbsp; </tr>
当前充气类型:<span id="running_type_html"></span> <tr>
</td> <td height="50">
</tr> <input value="0" id="running_type" hidden> &nbsp;
<tr> 当前充气类型:<span id="running_type_html"></span>
<td height="50"> </td>
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index='+document.getElementById('running_type').value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit')">气泵启停</button> </tr>
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=0&Index=0&Operation=2','OperationHit')">系统重启</button> <tr>
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=0&Index=0&Operation=0','OperationHit')">传感器重置</button> <td height="50">
</td> <button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index='+document.getElementById('running_type').value+'&Operation='+document.getElementById('running_pressure_type').value,'OperationHit')">气泵启停</button>
</tr> <button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=0&Index=0&Operation=2','OperationHit')">系统重启</button>
</table> <button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=0&Index=0&Operation=0','OperationHit')">传感器重置</button>
</td>
</tr>
</table>
</body> </body>
</html> </html>