|
|
@@ -3,226 +3,284 @@
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
- <title>Mock GPS Simulator</title>
|
|
|
+ <title>Mock GPS Simulator Workbench</title>
|
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css">
|
|
|
- <link rel="stylesheet" href="./style.css">
|
|
|
+ <link rel="stylesheet" href="./workbench.css">
|
|
|
</head>
|
|
|
<body>
|
|
|
- <div class="layout">
|
|
|
- <aside class="panel">
|
|
|
- <div class="panel__header">
|
|
|
- <div class="panel__eyebrow">MOCK GPS SIM</div>
|
|
|
- <h1>外部模拟器</h1>
|
|
|
- <div id="socketStatus" class="badge badge--muted">未连接</div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <section class="group">
|
|
|
- <div class="group__title">资源加载</div>
|
|
|
- <label class="field">
|
|
|
- <span>游戏配置 URL</span>
|
|
|
- <input id="configUrlInput" type="text" value="https://oss-mbh5.colormaprun.com/wxmini/test/game.json">
|
|
|
- </label>
|
|
|
- <div class="row">
|
|
|
- <button id="loadConfigBtn" class="btn btn--primary">载入配置</button>
|
|
|
- <button id="fitCourseBtn" class="btn">适配视野</button>
|
|
|
- </div>
|
|
|
- <label class="field">
|
|
|
- <span>瓦片模板</span>
|
|
|
- <input id="tileUrlInput" type="text" placeholder="https://host/tiles/{z}/{x}/{y}.webp">
|
|
|
- </label>
|
|
|
- <div class="row">
|
|
|
- <button id="applyTilesBtn" class="btn">应用瓦片</button>
|
|
|
- <button id="resetTilesBtn" class="btn">恢复 OSM</button>
|
|
|
+ <div class="wb-shell">
|
|
|
+ <header class="wb-topbar">
|
|
|
+ <div class="wb-topbar__brand">
|
|
|
+ <div class="wb-topbar__eyebrow">MOCK GPS SIM</div>
|
|
|
+ <h1>模拟器工作台</h1>
|
|
|
+ <div class="wb-topbar__links">
|
|
|
+ <a href="/v1/">打开旧版面板</a>
|
|
|
</div>
|
|
|
- <label class="field">
|
|
|
- <span>KML URL</span>
|
|
|
- <input id="courseUrlInput" type="text" placeholder="https://host/course/c01.kml">
|
|
|
- </label>
|
|
|
- <div class="row">
|
|
|
- <button id="loadCourseBtn" class="btn">载入控制点</button>
|
|
|
- <button id="clearCourseBtn" class="btn">清空控制点</button>
|
|
|
+ </div>
|
|
|
+ <div class="wb-topbar__status">
|
|
|
+ <div class="wb-connection-bar">
|
|
|
+ <div class="wb-connection-pill">
|
|
|
+ <span class="wb-connection-pill__label">定位模拟</span>
|
|
|
+ <strong id="topGpsStatus" class="wb-connection-pill__value">未连接</strong>
|
|
|
+ </div>
|
|
|
+ <div class="wb-connection-pill">
|
|
|
+ <span class="wb-connection-pill__label">心率模拟</span>
|
|
|
+ <strong id="topHrStatus" class="wb-connection-pill__value">未连接</strong>
|
|
|
+ </div>
|
|
|
+ <div class="wb-connection-pill">
|
|
|
+ <span class="wb-connection-pill__label">调试日志</span>
|
|
|
+ <strong id="topLoggerStatus" class="wb-connection-pill__value">未连接</strong>
|
|
|
+ </div>
|
|
|
+ <div class="wb-connection-pill">
|
|
|
+ <span class="wb-connection-pill__label">网关桥接</span>
|
|
|
+ <strong id="topGatewayStatus" class="wb-connection-pill__value">未启用</strong>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div id="resourceStatus" class="hint">支持直接载入 game.json，也支持单独填瓦片模板和 KML 地址。</div>
|
|
|
- <div id="resourceDetail" class="group__status">尚未载入资源</div>
|
|
|
- <div id="courseJumpList" class="jump-list"></div>
|
|
|
- </section>
|
|
|
+ <div id="socketStatus" class="badge badge--muted">未连接</div>
|
|
|
+ </div>
|
|
|
+ </header>
|
|
|
|
|
|
- <section class="group">
|
|
|
- <div class="group__title">实时发送</div>
|
|
|
- <div id="realtimeStatus" class="group__status">桥接未连接</div>
|
|
|
- <div id="lastSendStatus" class="group__status">最近发送: --</div>
|
|
|
- <div class="row">
|
|
|
- <button id="connectBtn" class="btn btn--primary">连接桥接</button>
|
|
|
- <button id="sendOnceBtn" class="btn">发送一次</button>
|
|
|
- </div>
|
|
|
- <div class="row">
|
|
|
- <button id="streamBtn" class="btn btn--accent">开始连续发送</button>
|
|
|
- <button id="stopStreamBtn" class="btn">停止发送</button>
|
|
|
- </div>
|
|
|
- <label class="field">
|
|
|
- <span>发送频率</span>
|
|
|
- <select id="hzSelect">
|
|
|
- <option value="2">2 Hz</option>
|
|
|
- <option value="5" selected>5 Hz</option>
|
|
|
- <option value="10">10 Hz</option>
|
|
|
- </select>
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>精度 (m)</span>
|
|
|
- <input id="accuracyInput" type="number" min="1" max="100" value="6">
|
|
|
- </label>
|
|
|
- </section>
|
|
|
+ <div class="wb-layout">
|
|
|
+ <aside class="wb-sidebar">
|
|
|
+ <section class="wb-card">
|
|
|
+ <div class="wb-card__title">运行摘要</div>
|
|
|
+ <div class="stat"><span>资源状态</span><strong id="summaryResourceText">未载入</strong></div>
|
|
|
+ <div class="stat"><span>定位发送</span><strong id="summaryGpsSendText">待命</strong></div>
|
|
|
+ <div class="stat"><span>心率发送</span><strong id="summaryHrSendText">待命</strong></div>
|
|
|
+ <div class="stat"><span>路径状态</span><strong id="summaryPathText">待命</strong></div>
|
|
|
+ <div class="stat"><span>网关桥接</span><strong id="summaryGatewayText">未启用</strong></div>
|
|
|
+ </section>
|
|
|
|
|
|
- <section class="group">
|
|
|
- <div class="group__title">新网关桥接</div>
|
|
|
- <div id="gatewayBridgeStatus" class="group__status">未启用</div>
|
|
|
- <div id="gatewayBridgeTarget" class="group__status">目标设备: --</div>
|
|
|
- <div id="gatewayBridgeLast" class="group__status">最近状态: --</div>
|
|
|
- <label class="field">
|
|
|
- <span>桥接预设</span>
|
|
|
- <select id="gatewayBridgePresetSelect">
|
|
|
- <option value="">选择预设</option>
|
|
|
- </select>
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>预设名称</span>
|
|
|
- <input id="gatewayBridgePresetNameInput" type="text" placeholder="例如：家长端-A / 场控-B">
|
|
|
- </label>
|
|
|
- <div class="row">
|
|
|
- <button id="applyGatewayBridgePresetBtn" class="btn">套用预设</button>
|
|
|
- <button id="saveGatewayBridgePresetBtn" class="btn">保存预设</button>
|
|
|
- </div>
|
|
|
- <div class="row">
|
|
|
- <button id="deleteGatewayBridgePresetBtn" class="btn">删除预设</button>
|
|
|
- </div>
|
|
|
- <label class="field field--check">
|
|
|
- <input id="gatewayBridgeEnabledInput" type="checkbox">
|
|
|
- <span>启用新网关桥接</span>
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>网关地址</span>
|
|
|
- <input id="gatewayBridgeUrlInput" type="text" placeholder="ws://127.0.0.1:18080/ws">
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>Producer Token / Channel Token</span>
|
|
|
- <input id="gatewayBridgeTokenInput" type="text" placeholder="producerToken 或 dev-producer-token">
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>Channel ID</span>
|
|
|
- <input id="gatewayBridgeChannelIdInput" type="text" placeholder="ch-xxxx">
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>目标 Device ID</span>
|
|
|
- <input id="gatewayBridgeDeviceIdInput" type="text" placeholder="child-001">
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>目标 Group ID</span>
|
|
|
- <input id="gatewayBridgeGroupIdInput" type="text" placeholder="class-a">
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>Source ID</span>
|
|
|
- <input id="gatewayBridgeSourceIdInput" type="text" placeholder="mock-gps-sim">
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>Source Mode</span>
|
|
|
- <input id="gatewayBridgeSourceModeInput" type="text" placeholder="mock">
|
|
|
- </label>
|
|
|
- <div class="row">
|
|
|
- <button id="applyGatewayBridgeConfigBtn" class="btn btn--primary">应用桥接配置</button>
|
|
|
- <button id="reloadGatewayBridgeConfigBtn" class="btn">重新读取</button>
|
|
|
- </div>
|
|
|
- </section>
|
|
|
+ <section class="wb-card">
|
|
|
+ <div class="wb-card__title">当前位置</div>
|
|
|
+ <div class="stat"><span>纬度</span><strong id="latText">--</strong></div>
|
|
|
+ <div class="stat"><span>经度</span><strong id="lonText">--</strong></div>
|
|
|
+ <div class="stat"><span>航向</span><strong id="headingText">--</strong></div>
|
|
|
+ <div class="stat"><span>路径点</span><strong id="pathCountText">0</strong></div>
|
|
|
+ </section>
|
|
|
|
|
|
- <section class="group">
|
|
|
- <div class="group__title">心率模拟</div>
|
|
|
- <div id="heartRateStatus" class="group__status">心率模拟待命</div>
|
|
|
- <div id="lastHeartRateStatus" class="group__status">最近发送: --</div>
|
|
|
- <div class="row">
|
|
|
- <button id="sendHeartRateOnceBtn" class="btn">发送一次</button>
|
|
|
- <button id="startHeartRateStreamBtn" class="btn btn--accent">开始连续发送</button>
|
|
|
- </div>
|
|
|
- <div class="row">
|
|
|
- <button id="stopHeartRateStreamBtn" class="btn">停止发送</button>
|
|
|
- <button id="applyHeartRatePresetBtn" class="btn">应用分区样本</button>
|
|
|
- </div>
|
|
|
- <div class="row">
|
|
|
- <button id="toggleHeartRateSampleBtn" class="btn">模拟真实样本</button>
|
|
|
- </div>
|
|
|
- <label class="field">
|
|
|
- <span>心率值 (bpm)</span>
|
|
|
- <input id="heartRateInput" type="number" min="40" max="220" value="120">
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>发送频率</span>
|
|
|
- <select id="heartRateHzSelect">
|
|
|
- <option value="1" selected>1 Hz</option>
|
|
|
- <option value="2">2 Hz</option>
|
|
|
- <option value="4">4 Hz</option>
|
|
|
- </select>
|
|
|
- </label>
|
|
|
- <label class="field">
|
|
|
- <span>样本模板</span>
|
|
|
- <select id="heartRateSampleTemplateSelect">
|
|
|
- <option value="jog" selected>慢跑样本</option>
|
|
|
- <option value="tempo">节奏跑样本</option>
|
|
|
- <option value="interval">间歇跑样本</option>
|
|
|
- <option value="recovery">恢复走样本</option>
|
|
|
- </select>
|
|
|
- </label>
|
|
|
- </section>
|
|
|
+ <details class="wb-section" open>
|
|
|
+ <summary>资源加载</summary>
|
|
|
+ <div class="wb-section__body">
|
|
|
+ <label class="field">
|
|
|
+ <span>游戏配置 URL</span>
|
|
|
+ <input id="configUrlInput" type="text" value="https://oss-mbh5.colormaprun.com/wxmini/test/game.json">
|
|
|
+ </label>
|
|
|
+ <div class="row">
|
|
|
+ <button id="loadConfigBtn" class="btn btn--primary">载入配置</button>
|
|
|
+ <button id="fitCourseBtn" class="btn">适配视野</button>
|
|
|
+ </div>
|
|
|
+ <label class="field">
|
|
|
+ <span>瓦片模板</span>
|
|
|
+ <input id="tileUrlInput" type="text" placeholder="https://host/tiles/{z}/{x}/{y}.webp">
|
|
|
+ </label>
|
|
|
+ <div class="row">
|
|
|
+ <button id="applyTilesBtn" class="btn">应用瓦片</button>
|
|
|
+ <button id="resetTilesBtn" class="btn">恢复 OSM</button>
|
|
|
+ </div>
|
|
|
+ <label class="field">
|
|
|
+ <span>KML URL</span>
|
|
|
+ <input id="courseUrlInput" type="text" placeholder="https://host/course/c01.kml">
|
|
|
+ </label>
|
|
|
+ <div class="row">
|
|
|
+ <button id="loadCourseBtn" class="btn">载入控制点</button>
|
|
|
+ <button id="clearCourseBtn" class="btn">清空控制点</button>
|
|
|
+ </div>
|
|
|
+ <div id="resourceStatus" class="hint">支持直接载入 game.json，也支持单独填瓦片模板和 KML 地址。</div>
|
|
|
+ <div id="resourceDetail" class="group__status">尚未载入资源</div>
|
|
|
+ <div id="courseJumpList" class="jump-list"></div>
|
|
|
+ </div>
|
|
|
+ </details>
|
|
|
|
|
|
- <section class="group">
|
|
|
- <div class="group__title">路径回放</div>
|
|
|
- <div id="playbackStatus" class="group__status">路径待命</div>
|
|
|
- <input id="trackFileInput" class="file-input-hidden" type="file" accept=".gpx,.kml,.geojson,.json,application/json,application/gpx+xml,application/vnd.google-earth.kml+xml">
|
|
|
- <div class="row">
|
|
|
- <button id="importTrackBtn" class="btn">导入轨迹文件</button>
|
|
|
- <button id="togglePathModeBtn" class="btn">开启路径编辑</button>
|
|
|
- </div>
|
|
|
- <div class="row">
|
|
|
- <button id="clearPathBtn" class="btn">清空路径</button>
|
|
|
- <button id="fitPathBtn" class="btn">适配路径</button>
|
|
|
- </div>
|
|
|
- <div class="row">
|
|
|
- <button id="playPathBtn" class="btn btn--accent">开始回放</button>
|
|
|
- <button id="pausePathBtn" class="btn">暂停回放</button>
|
|
|
- </div>
|
|
|
- <label class="field">
|
|
|
- <span>移动速度 (km/h)</span>
|
|
|
- <input id="speedInput" type="number" min="1" max="25" step="0.1" value="6">
|
|
|
- </label>
|
|
|
- <label class="field field--check">
|
|
|
- <input id="loopPathInput" type="checkbox" checked>
|
|
|
- <span>循环回放</span>
|
|
|
- </label>
|
|
|
- <div id="pathHint" class="hint">点击“开启路径编辑”后，在地图上逐点添加路径。</div>
|
|
|
- </section>
|
|
|
+ <details class="wb-section" open>
|
|
|
+ <summary>定位发送</summary>
|
|
|
+ <div class="wb-section__body">
|
|
|
+ <div id="realtimeStatus" class="group__status">桥接未连接</div>
|
|
|
+ <div id="lastSendStatus" class="group__status">最近发送: --</div>
|
|
|
+ <div class="row">
|
|
|
+ <button id="connectBtn" class="btn btn--primary">连接桥接</button>
|
|
|
+ <button id="sendOnceBtn" class="btn">发送一次</button>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <button id="streamBtn" class="btn btn--accent">开始连续发送</button>
|
|
|
+ <button id="stopStreamBtn" class="btn">停止发送</button>
|
|
|
+ </div>
|
|
|
+ <label class="field">
|
|
|
+ <span>发送频率</span>
|
|
|
+ <select id="hzSelect">
|
|
|
+ <option value="2">2 Hz</option>
|
|
|
+ <option value="5" selected>5 Hz</option>
|
|
|
+ <option value="10">10 Hz</option>
|
|
|
+ </select>
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>精度 (m)</span>
|
|
|
+ <input id="accuracyInput" type="number" min="1" max="100" value="6">
|
|
|
+ </label>
|
|
|
+ </div>
|
|
|
+ </details>
|
|
|
|
|
|
- <section class="group">
|
|
|
- <div class="group__title">当前位置</div>
|
|
|
- <div class="stat"><span>纬度</span><strong id="latText">--</strong></div>
|
|
|
- <div class="stat"><span>经度</span><strong id="lonText">--</strong></div>
|
|
|
- <div class="stat"><span>航向</span><strong id="headingText">--</strong></div>
|
|
|
- <div class="stat"><span>路径点</span><strong id="pathCountText">0</strong></div>
|
|
|
- </section>
|
|
|
+ <details class="wb-section" open>
|
|
|
+ <summary>路径回放</summary>
|
|
|
+ <div class="wb-section__body">
|
|
|
+ <div id="playbackStatus" class="group__status">路径待命</div>
|
|
|
+ <input id="trackFileInput" class="file-input-hidden" type="file" accept=".gpx,.kml,.geojson,.json,application/json,application/gpx+xml,application/vnd.google-earth.kml+xml">
|
|
|
+ <div class="row">
|
|
|
+ <button id="importTrackBtn" class="btn">导入轨迹文件</button>
|
|
|
+ <button id="togglePathModeBtn" class="btn">开启路径编辑</button>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <button id="clearPathBtn" class="btn">清空路径</button>
|
|
|
+ <button id="fitPathBtn" class="btn">适配路径</button>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <button id="playPathBtn" class="btn btn--accent">开始回放</button>
|
|
|
+ <button id="pausePathBtn" class="btn">暂停回放</button>
|
|
|
+ </div>
|
|
|
+ <label class="field">
|
|
|
+ <span>移动速度 (km/h)</span>
|
|
|
+ <input id="speedInput" type="number" min="1" max="25" step="0.1" value="6">
|
|
|
+ </label>
|
|
|
+ <label class="field field--check">
|
|
|
+ <input id="loopPathInput" type="checkbox" checked>
|
|
|
+ <span>循环回放</span>
|
|
|
+ </label>
|
|
|
+ <div id="pathHint" class="hint">点击“开启路径编辑”后，在地图上逐点添加路径。</div>
|
|
|
+ </div>
|
|
|
+ </details>
|
|
|
|
|
|
- <section class="group">
|
|
|
- <div class="group__title">日志</div>
|
|
|
- <div id="log" class="log"></div>
|
|
|
- </section>
|
|
|
+ <details class="wb-section">
|
|
|
+ <summary>心率模拟</summary>
|
|
|
+ <div class="wb-section__body">
|
|
|
+ <div id="heartRateStatus" class="group__status">心率模拟待命</div>
|
|
|
+ <div id="lastHeartRateStatus" class="group__status">最近发送: --</div>
|
|
|
+ <div class="row">
|
|
|
+ <button id="sendHeartRateOnceBtn" class="btn">发送一次</button>
|
|
|
+ <button id="startHeartRateStreamBtn" class="btn btn--accent">开始连续发送</button>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <button id="stopHeartRateStreamBtn" class="btn">停止发送</button>
|
|
|
+ <button id="applyHeartRatePresetBtn" class="btn">应用分区样本</button>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <button id="toggleHeartRateSampleBtn" class="btn">模拟真实样本</button>
|
|
|
+ </div>
|
|
|
+ <label class="field">
|
|
|
+ <span>心率值 (bpm)</span>
|
|
|
+ <input id="heartRateInput" type="number" min="40" max="220" value="120">
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>发送频率</span>
|
|
|
+ <select id="heartRateHzSelect">
|
|
|
+ <option value="1" selected>1 Hz</option>
|
|
|
+ <option value="2">2 Hz</option>
|
|
|
+ <option value="4">4 Hz</option>
|
|
|
+ </select>
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>样本模板</span>
|
|
|
+ <select id="heartRateSampleTemplateSelect">
|
|
|
+ <option value="jog" selected>慢跑样本</option>
|
|
|
+ <option value="tempo">节奏跑样本</option>
|
|
|
+ <option value="interval">间歇跑样本</option>
|
|
|
+ <option value="recovery">恢复走样本</option>
|
|
|
+ </select>
|
|
|
+ </label>
|
|
|
+ </div>
|
|
|
+ </details>
|
|
|
|
|
|
- </aside>
|
|
|
+ <details class="wb-section">
|
|
|
+ <summary>新网关桥接</summary>
|
|
|
+ <div class="wb-section__body">
|
|
|
+ <div id="gatewayBridgeStatus" class="group__status">未启用</div>
|
|
|
+ <div id="gatewayBridgeTarget" class="group__status">目标设备: --</div>
|
|
|
+ <div id="gatewayBridgeLast" class="group__status">最近状态: --</div>
|
|
|
+ <label class="field">
|
|
|
+ <span>桥接预设</span>
|
|
|
+ <select id="gatewayBridgePresetSelect">
|
|
|
+ <option value="">选择预设</option>
|
|
|
+ </select>
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>预设名称</span>
|
|
|
+ <input id="gatewayBridgePresetNameInput" type="text" placeholder="例如：家长端-A / 场控-B">
|
|
|
+ </label>
|
|
|
+ <div class="row">
|
|
|
+ <button id="applyGatewayBridgePresetBtn" class="btn">套用预设</button>
|
|
|
+ <button id="saveGatewayBridgePresetBtn" class="btn">保存预设</button>
|
|
|
+ </div>
|
|
|
+ <div class="row">
|
|
|
+ <button id="deleteGatewayBridgePresetBtn" class="btn">删除预设</button>
|
|
|
+ </div>
|
|
|
+ <label class="field field--check">
|
|
|
+ <input id="gatewayBridgeEnabledInput" type="checkbox">
|
|
|
+ <span>启用新网关桥接</span>
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>网关地址</span>
|
|
|
+ <input id="gatewayBridgeUrlInput" type="text" placeholder="ws://127.0.0.1:18080/ws">
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>Producer Token / Channel Token</span>
|
|
|
+ <input id="gatewayBridgeTokenInput" type="text" placeholder="producerToken 或 dev-producer-token">
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>Channel ID</span>
|
|
|
+ <input id="gatewayBridgeChannelIdInput" type="text" placeholder="ch-xxxx">
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>目标 Device ID</span>
|
|
|
+ <input id="gatewayBridgeDeviceIdInput" type="text" placeholder="child-001">
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>目标 Group ID</span>
|
|
|
+ <input id="gatewayBridgeGroupIdInput" type="text" placeholder="class-a">
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>Source ID</span>
|
|
|
+ <input id="gatewayBridgeSourceIdInput" type="text" placeholder="mock-gps-sim">
|
|
|
+ </label>
|
|
|
+ <label class="field">
|
|
|
+ <span>Source Mode</span>
|
|
|
+ <input id="gatewayBridgeSourceModeInput" type="text" placeholder="mock">
|
|
|
+ </label>
|
|
|
+ <div class="row">
|
|
|
+ <button id="applyGatewayBridgeConfigBtn" class="btn btn--primary">应用桥接配置</button>
|
|
|
+ <button id="reloadGatewayBridgeConfigBtn" class="btn">重新读取</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </details>
|
|
|
+ </aside>
|
|
|
|
|
|
- <main class="map-shell">
|
|
|
- <div id="map"></div>
|
|
|
- <section class="floating-debug-log">
|
|
|
- <div class="floating-debug-log__header">
|
|
|
- <div class="floating-debug-log__title">调试日志</div>
|
|
|
- <button id="clearDebugLogBtn" class="floating-debug-log__clear" type="button">清空</button>
|
|
|
- </div>
|
|
|
- <div id="debugLog" class="log log--debug log--floating"></div>
|
|
|
+ <main class="wb-stage">
|
|
|
+ <div id="map"></div>
|
|
|
+ <section id="floatingDebugLogPanel" class="floating-debug-log">
|
|
|
+ <div class="floating-debug-log__header">
|
|
|
+ <div class="floating-debug-log__title-wrap">
|
|
|
+ <div class="floating-debug-log__title">调试日志</div>
|
|
|
+ <div id="debugLogMeta" class="floating-debug-log__meta">全部 · 0 条</div>
|
|
|
+ </div>
|
|
|
+ <div class="floating-debug-log__actions">
|
|
|
+ <label class="floating-debug-log__filter">
|
|
|
+ <span>范围</span>
|
|
|
+ <select id="debugLogScopeFilter">
|
|
|
+ <option value="all">全部</option>
|
|
|
+ </select>
|
|
|
+ </label>
|
|
|
+ <button id="toggleDebugLogPanelBtn" class="floating-debug-log__toggle" type="button">缩小</button>
|
|
|
+ <button id="clearDebugLogBtn" class="floating-debug-log__clear" type="button">清空</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div id="debugLog" class="log log--debug log--floating"></div>
|
|
|
+ </section>
|
|
|
+ </main>
|
|
|
+ </div>
|
|
|
+ <section class="wb-bottom-strip">
|
|
|
+ <section class="wb-card wb-card--bottom">
|
|
|
+ <div class="wb-card__title">最近事件</div>
|
|
|
+ <div id="log" class="log"></div>
|
|
|
</section>
|
|
|
- </main>
|
|
|
+ </section>
|
|
|
</div>
|
|
|
|
|
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
|
