<!DOCTYPE html>
|
<html lang="zh-CN">
|
<head>
|
<meta charset="UTF-8" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<title>数据上报测试客户端</title>
|
<link rel="stylesheet" href="/style.css" />
|
</head>
|
<body>
|
<div class="container">
|
<header>
|
<h1>数据上报测试客户端</h1>
|
<p>选择对应 Tab 进行各类数据上报联调测试</p>
|
</header>
|
|
<nav class="tabs" role="tablist">
|
<button type="button" class="tab active" data-tab="weight" role="tab" aria-selected="true">垃圾称重数据上报测试</button>
|
<button type="button" class="tab" data-tab="gps" role="tab" aria-selected="false">车载监控GPS位置上报测试</button>
|
<button type="button" class="tab" data-tab="driver" role="tab" aria-selected="false">车载监控司机异常消息测试</button>
|
<button type="button" class="tab" data-tab="health" role="tab" aria-selected="false">人员位置健康数据上报测试</button>
|
</nav>
|
|
<!-- Tab 1: 垃圾称重 -->
|
<section id="panel-weight" class="tab-panel active" role="tabpanel">
|
<form id="reportForm" class="card">
|
<div class="grid">
|
<label>
|
目标地址
|
<input id="targetUrl" name="targetUrl" type="text" required />
|
</label>
|
<label>
|
clientId
|
<input id="clientId" name="clientId" type="text" required />
|
</label>
|
<label>
|
secret
|
<input id="secret" name="secret" type="text" required />
|
</label>
|
<label>
|
设备号 deviceNo
|
<input id="deviceNo" name="deviceNo" type="text" value="A01" required />
|
</label>
|
<label>
|
上传时间 uploadTime
|
<input id="uploadTime" name="uploadTime" type="text" required />
|
<small>格式：yyyy-MM-dd HH:mm:ss</small>
|
</label>
|
<label>
|
垃圾种类 garbageType
|
<select id="garbageType" name="garbageType" required>
|
<option value="100">100 - 干垃圾</option>
|
<option value="200">200 - 湿垃圾</option>
|
<option value="300">300 - 可回收</option>
|
<option value="301" selected>301 - 可回收-纸壳</option>
|
<option value="302">302 - 可回收-饮料瓶</option>
|
<option value="303">303 - 可回收-易拉罐</option>
|
<option value="304">304 - 可回收-旧衣帽</option>
|
<option value="305">305 - 可回收-玻璃</option>
|
<option value="306">306 - 可回收-电子产品</option>
|
<option value="307">307 - 可回收-金属-铁</option>
|
<option value="308">308 - 可回收-金属-铝</option>
|
<option value="309">309 - 可回收-金属-铜</option>
|
<option value="310">310 - 可回收-金属-不锈钢</option>
|
<option value="311">311 - 可回收-其他</option>
|
<option value="400">400 - 有害垃圾</option>
|
</select>
|
</label>
|
<label>
|
垃圾重量 garbageWeight (kg)
|
<input id="garbageWeight" name="garbageWeight" type="number" step="0.001" min="0.001" value="50.23" required />
|
</label>
|
</div>
|
|
<label class="full">
|
附加信息 others（可选，JSON 字符串）
|
<textarea id="others" name="others" rows="4" placeholder='{"remark":"测试"}'></textarea>
|
</label>
|
|
<div class="actions">
|
<button type="button" id="nowBtn" class="secondary">填充当前时间</button>
|
<button type="submit" id="submitBtn">上报</button>
|
</div>
|
</form>
|
|
<section class="card">
|
<h2>调试结果</h2>
|
<pre id="result">等待上报...</pre>
|
</section>
|
</section>
|
|
<!-- Tab 2: GPS -->
|
<section id="panel-gps" class="tab-panel" role="tabpanel" hidden>
|
<div class="card">
|
<label>
|
目标地址
|
<input id="gpsTargetUrl" type="text" value="http://127.0.0.1:8001/open/push/cameragps" />
|
</label>
|
<label class="full">
|
上报 JSON（可直接编辑）
|
<textarea id="gpsPayload" rows="20" spellcheck="false"></textarea>
|
</label>
|
<div class="actions">
|
<button type="button" id="gpsSendBtn">发送</button>
|
</div>
|
</div>
|
<section class="card">
|
<h2>返回结果</h2>
|
<pre id="gpsResult">等待发送...</pre>
|
</section>
|
</section>
|
|
<!-- Tab 3: 司机异常 - 留白 -->
|
<section id="panel-driver" class="tab-panel" role="tabpanel" hidden>
|
<div class="card placeholder">
|
<h2>车载监控司机异常消息测试</h2>
|
<p>功能待明确需求后补充</p>
|
</div>
|
</section>
|
|
<!-- Tab 4: 人员健康 - 留白 -->
|
<section id="panel-health" class="tab-panel" role="tabpanel" hidden>
|
<div class="card placeholder">
|
<h2>人员位置健康数据上报测试</h2>
|
<p>功能待明确需求后补充</p>
|
</div>
|
</section>
|
</div>
|
<script src="/app.js"></script>
|
</body>
|
</html>
|
