nginx 1.15.11
电表数据展示
HTTP/1.1 200 OK
Server: nginx/1.15.11
Date: Tue, 24 Feb 2026 00:17:26 GMT
Content-Type: text/html
Show more
HTTP/1.1 200 OK
Server: nginx/1.15.11
Date: Tue, 24 Feb 2026 00:17:26 GMT
Content-Type: text/html
Content-Length: 20686
Last-Modified: Sat, 30 Aug 2025 16:08:00 GMT
Connection: close
ETag: "68b321e0-50ce"
Accept-Ranges: bytes
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="refresh" content="1800">
<title>\xe7\x94\xb5\xe8\xa1\xa8\xe6\x95\xb0\xe6\x8d\xae\xe5\xb1\x95\xe7\xa4\xba</title>
<style>
body {
font-family: 'Microsoft YaHei', Arial, sans-serif;
margin: 0;
padding: 10px;
background-color: #f5f5f5;
}
.container {
max-width: 100%;
height: calc(100vh - 20px); /* \xe5\xae\xb9\xe5\x99\xa8\xe9\xab\x98\xe5\xba\xa6\xe5\xa1\xab\xe6\xbb\xa1\xe8\xa7\x86\xe5\x8f\xa3\xef\xbc\x8c\xe5\x87\x8f\xe5\x8e\xbbpadding */
margin: 0 auto;
display: flex;
flex-direction: column;
}
h1 {
text-align: center;
color: #333;
margin: 10px 0;
font-size: 1.5rem;
}
.control-panel {
display: flex;
flex-wrap: wrap;
gap: 10px;
padding: 10px;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
margin-bottom: 10px;
}
.tips-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
display: none;
}
.tips-content {
background-color: white;
padding: 20px 30px;
border-radius: 8px;
text-align: center;
min-width: 250px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.spinner {
border: 3px solid #f3f3f3;
border-top: 3px solid #3498db;
border-radius: 50%;
width: 40px;
height: 40px;
animation: spin 1s linear infinite;
margin: 15px auto;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.tips-message {
margin-top: 10px;
font-size: 16px;
color: #333;
}
.date-inputs {
display: flex;
gap: 10px;
align-items: center;
}
.date-inputs label {
font-size: 0.9rem;
color: #333;
}
.date-inputs input {
padding: 6px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 0.9rem;
}
button {
padding: 6px 12px;
background-color: #3498db;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 0.9rem;
transition: background-color 0.3s;
}
button:hover {
background-color: #2980b9;
}
button.active {
background-color: #27ae60;
}
#data-container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); /* \xe8\xb0\x83\xe6\x95\xb4\xe6\x9c\x80\xe5\xb0\x8f\xe5\xae\xbd\xe5\xba\xa6 */
gap: 15px; /* \xe5\xa2\x9e\xe5\x8a\xa0\xe9\x97\xb4\xe8\xb7\x9d\xe9\x81\xbf\xe5\x85\x8d\xe9\x87\x8d\xe5\x8f\xa0 */
row-gap: 12px; /* \xe5\x9e\x82\xe7\x9b\xb4\xe9\x97\xb4\xe8\xb7\x9d\xe8\xb0\x83\xe6\x95\xb4\xe4\xb8\xba15px */
justify-items: stretch; /* \xe8\xae\xa9\xe5\x8d\xa1\xe7\x89\x87\xe6\x8b\x89\xe4\xbc\xb8\xe5\xa1\xab