2025-05-13 16:55:49 +08:00
|
|
|
|
// #ifndef WEBPAGES_H
|
|
|
|
|
|
// #define WEBPAGES_H
|
|
|
|
|
|
|
|
|
|
|
|
// #include <Arduino.h>
|
|
|
|
|
|
|
|
|
|
|
|
// const char index_html[] PROGMEM = R"rawliteral(
|
|
|
|
|
|
// <!DOCTYPE html>
|
|
|
|
|
|
// <html>
|
|
|
|
|
|
// <head>
|
|
|
|
|
|
// <title>ESP32 Data Display</title>
|
|
|
|
|
|
// <meta charset="UTF-8">
|
|
|
|
|
|
// <script>
|
|
|
|
|
|
// async function fetchData()
|
|
|
|
|
|
// {
|
|
|
|
|
|
// const durationResponse = await fetch('/duration');
|
|
|
|
|
|
// const durationText = await durationResponse.text();
|
|
|
|
|
|
// document.getElementById('activeDuration').innerText = durationText;
|
|
|
|
|
|
|
|
|
|
|
|
// const tempResponse = await fetch('/temperature');
|
|
|
|
|
|
// const tempText = await tempResponse.text();
|
|
|
|
|
|
// document.getElementById('temperature').innerText = tempText;
|
|
|
|
|
|
|
|
|
|
|
|
// const lightAResponse = await fetch('/lightA');
|
|
|
|
|
|
// const lightAText = await lightAResponse.text();
|
|
|
|
|
|
// document.getElementById('lightA').innerText = lightAText;
|
|
|
|
|
|
|
|
|
|
|
|
// const lightBResponse = await fetch('/lightB');
|
|
|
|
|
|
// const lightBText = await lightBResponse.text();
|
|
|
|
|
|
// document.getElementById('lightB').innerText = lightBText;
|
|
|
|
|
|
|
|
|
|
|
|
// const wiperResponse = await fetch('/wiper');
|
|
|
|
|
|
// const wiperText = await wiperResponse.text();
|
|
|
|
|
|
// document.getElementById('wiper').innerText = wiperText;
|
|
|
|
|
|
|
|
|
|
|
|
// const busResponse = await fetch('/busVoltage');
|
|
|
|
|
|
// const busText = await busResponse.text();
|
|
|
|
|
|
// document.getElementById('busVoltage').innerText = busText;
|
|
|
|
|
|
|
|
|
|
|
|
// const shuntResponse = await fetch('/shuntVoltage');
|
|
|
|
|
|
// const shuntText = await shuntResponse.text();
|
|
|
|
|
|
// document.getElementById('shuntVoltage').innerText = shuntText;
|
|
|
|
|
|
|
|
|
|
|
|
// const currentResponse = await fetch('/current');
|
|
|
|
|
|
// const currentText = await currentResponse.text();
|
|
|
|
|
|
// document.getElementById('current').innerText = currentText;
|
|
|
|
|
|
|
|
|
|
|
|
// const powerResponse = await fetch('/power');
|
|
|
|
|
|
// const powerText = await powerResponse.text();
|
|
|
|
|
|
// document.getElementById('power').innerText = powerText;
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
// async function setWiper()
|
|
|
|
|
|
// {
|
|
|
|
|
|
// const wiperValue = document.getElementById('wiperValue').value;
|
|
|
|
|
|
// const response = await fetch('/setWiper', {
|
|
|
|
|
|
// method: 'POST',
|
|
|
|
|
|
// headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
|
|
|
|
|
|
// body: 'value=' + encodeURIComponent(wiperValue)
|
|
|
|
|
|
// });
|
|
|
|
|
|
// if (response.ok) {
|
|
|
|
|
|
// alert('Wiper value set successfully!');
|
|
|
|
|
|
// } else {
|
|
|
|
|
|
// alert('Failed to set Wiper value!');
|
|
|
|
|
|
// }
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
// async function resetDuration()
|
|
|
|
|
|
// {
|
|
|
|
|
|
// const response = await fetch('/resetDuration', { method: 'POST' });
|
|
|
|
|
|
// if (response.ok) {
|
|
|
|
|
|
// alert('累计使用时长已清空');
|
|
|
|
|
|
// } else {
|
|
|
|
|
|
// alert('清空失败');
|
|
|
|
|
|
// }
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
// setInterval(fetchData, 1000);
|
|
|
|
|
|
// </script>
|
|
|
|
|
|
// </head>
|
|
|
|
|
|
// <body onload="fetchData()">
|
|
|
|
|
|
// <h1>实时数据显示</h1>
|
|
|
|
|
|
// <p>累计使用时长: <span id="activeDuration">加载中...</span></p>
|
|
|
|
|
|
// <button onclick="resetDuration()">清空累计时长</button>
|
|
|
|
|
|
// <p>温度: <span id="temperature">加载中...</span> °C</p>
|
|
|
|
|
|
// <p>光照强度(A): <span id="lightA">加载中...</span> lx</p>
|
|
|
|
|
|
// <p>光照强度(B): <span id="lightB">加载中...</span> lx</p>
|
|
|
|
|
|
// <p>电位器Wiper值: <span id="wiper">加载中...</span></p>
|
|
|
|
|
|
// <p>总线电压: <span id="busVoltage">加载中...</span> V</p>
|
|
|
|
|
|
// <p>分流电压: <span id="shuntVoltage">加载中...</span> mV</p>
|
|
|
|
|
|
// <p>电流: <span id="current">加载中...</span> mA</p>
|
|
|
|
|
|
// <p>功率: <span id="power">加载中...</span> mW</p>
|
|
|
|
|
|
// <h2>设置Wiper值</h2>
|
|
|
|
|
|
// <input type="number" id="wiperValue" placeholder="输入Wiper值" />
|
|
|
|
|
|
// <button onclick="setWiper()">设置</button>
|
|
|
|
|
|
// </body>
|
|
|
|
|
|
// </html>
|
|
|
|
|
|
// )rawliteral"; // 添加分号
|
|
|
|
|
|
|
|
|
|
|
|
// #endif // WEBPAGES_H
|
|
|
|
|
|
|
|
|
|
|
|
|
2025-02-12 11:38:33 +08:00
|
|
|
|
#ifndef WEBPAGES_H
|
|
|
|
|
|
#define WEBPAGES_H
|
|
|
|
|
|
|
|
|
|
|
|
#include <Arduino.h>
|
|
|
|
|
|
|
|
|
|
|
|
const char index_html[] PROGMEM = R"rawliteral(
|
|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
<html>
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<title>ESP32 Data Display</title>
|
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
|
<script>
|
|
|
|
|
|
async function fetchData()
|
|
|
|
|
|
{
|
|
|
|
|
|
const durationResponse = await fetch('/duration');
|
|
|
|
|
|
const durationText = await durationResponse.text();
|
|
|
|
|
|
document.getElementById('activeDuration').innerText = durationText;
|
|
|
|
|
|
|
|
|
|
|
|
const tempResponse = await fetch('/temperature');
|
|
|
|
|
|
const tempText = await tempResponse.text();
|
|
|
|
|
|
document.getElementById('temperature').innerText = tempText;
|
|
|
|
|
|
|
|
|
|
|
|
const lightAResponse = await fetch('/lightA');
|
|
|
|
|
|
const lightAText = await lightAResponse.text();
|
|
|
|
|
|
document.getElementById('lightA').innerText = lightAText;
|
|
|
|
|
|
|
|
|
|
|
|
const lightBResponse = await fetch('/lightB');
|
|
|
|
|
|
const lightBText = await lightBResponse.text();
|
|
|
|
|
|
document.getElementById('lightB').innerText = lightBText;
|
|
|
|
|
|
|
|
|
|
|
|
const wiperResponse = await fetch('/wiper');
|
|
|
|
|
|
const wiperText = await wiperResponse.text();
|
|
|
|
|
|
document.getElementById('wiper').innerText = wiperText;
|
|
|
|
|
|
|
|
|
|
|
|
const busResponse = await fetch('/busVoltage');
|
|
|
|
|
|
const busText = await busResponse.text();
|
|
|
|
|
|
document.getElementById('busVoltage').innerText = busText;
|
|
|
|
|
|
|
|
|
|
|
|
const shuntResponse = await fetch('/shuntVoltage');
|
|
|
|
|
|
const shuntText = await shuntResponse.text();
|
|
|
|
|
|
document.getElementById('shuntVoltage').innerText = shuntText;
|
|
|
|
|
|
|
|
|
|
|
|
const currentResponse = await fetch('/current');
|
|
|
|
|
|
const currentText = await currentResponse.text();
|
|
|
|
|
|
document.getElementById('current').innerText = currentText;
|
|
|
|
|
|
|
|
|
|
|
|
const powerResponse = await fetch('/power');
|
|
|
|
|
|
const powerText = await powerResponse.text();
|
|
|
|
|
|
document.getElementById('power').innerText = powerText;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
async function setWiper()
|
|
|
|
|
|
{
|
|
|
|
|
|
const wiperValue = document.getElementById('wiperValue').value;
|
|
|
|
|
|
const response = await fetch('/setWiper', {
|
|
|
|
|
|
method: 'POST',
|
|
|
|
|
|
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
|
|
|
|
|
|
body: 'value=' + encodeURIComponent(wiperValue)
|
|
|
|
|
|
});
|
|
|
|
|
|
if (response.ok) {
|
|
|
|
|
|
alert('Wiper value set successfully!');
|
|
|
|
|
|
} else {
|
|
|
|
|
|
alert('Failed to set Wiper value!');
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
async function resetDuration()
|
|
|
|
|
|
{
|
|
|
|
|
|
const response = await fetch('/resetDuration', { method: 'POST' });
|
|
|
|
|
|
if (response.ok) {
|
|
|
|
|
|
alert('累计使用时长已清空');
|
|
|
|
|
|
} else {
|
|
|
|
|
|
alert('清空失败');
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
setInterval(fetchData, 1000);
|
|
|
|
|
|
</script>
|
|
|
|
|
|
</head>
|
|
|
|
|
|
<body onload="fetchData()">
|
|
|
|
|
|
<h1>实时数据显示</h1>
|
|
|
|
|
|
<p>累计使用时长: <span id="activeDuration">加载中...</span></p>
|
|
|
|
|
|
<button onclick="resetDuration()">清空累计时长</button>
|
|
|
|
|
|
<p>温度: <span id="temperature">加载中...</span> °C</p>
|
|
|
|
|
|
<p>光照强度(A): <span id="lightA">加载中...</span> lx</p>
|
|
|
|
|
|
<p>光照强度(B): <span id="lightB">加载中...</span> lx</p>
|
|
|
|
|
|
<p>电位器Wiper值: <span id="wiper">加载中...</span></p>
|
|
|
|
|
|
<p>总线电压: <span id="busVoltage">加载中...</span> V</p>
|
|
|
|
|
|
<p>分流电压: <span id="shuntVoltage">加载中...</span> mV</p>
|
|
|
|
|
|
<p>电流: <span id="current">加载中...</span> mA</p>
|
|
|
|
|
|
<p>功率: <span id="power">加载中...</span> mW</p>
|
|
|
|
|
|
<h2>设置Wiper值</h2>
|
2025-05-13 16:55:49 +08:00
|
|
|
|
<input type="range" id="wiperValue" min="0" max="127" step="1" value="2" />
|
2025-02-12 11:38:33 +08:00
|
|
|
|
<button onclick="setWiper()">设置</button>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html>
|
|
|
|
|
|
)rawliteral"; // 添加分号
|
|
|
|
|
|
|
|
|
|
|
|
#endif // WEBPAGES_H
|