130 lines
4.7 KiB
HTML
130 lines
4.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
<title>Matches</title>
|
|
<link rel="stylesheet" href="./css/index.css">
|
|
<link rel="stylesheet" href="./css/base.css">
|
|
<link rel="icon" href="./imgs/logo.png">
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<!-- 侧边栏 -->
|
|
<nav class="sidebar" aria-label="侧边栏">
|
|
<div class="sidebar-logo">
|
|
<img src="./imgs/logo.png" alt="logo" />
|
|
</div>
|
|
<div class="sidebar-menu">
|
|
<ul>
|
|
<li class="active" tabindex="0" aria-label="矿机状态">
|
|
<a href="#">Miner Status</a>
|
|
<ul class="sidebar-submenu">
|
|
<li class="active" tabindex="0" aria-label="总览"> <a href="#">Overview </a></li>
|
|
<li tabindex="0" aria-label="模块" style="opacity:0.4;cursor:not-allowed;"> <a href="#">Modules</a></li>
|
|
</ul>
|
|
</li>
|
|
<li tabindex="0" aria-label="矿机配置"> <a href="#">Miner Configuration</a></li>
|
|
<li tabindex="0" aria-label="网络"> <a href="#">Network</a></li>
|
|
<li tabindex="0" aria-label="系统"> <a href="#">System</a></li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
<!-- 主内容 -->
|
|
<div class="main">
|
|
<!-- 顶部栏 -->
|
|
<div class="header">
|
|
<div class="header-user">
|
|
<span class="icon" aria-label="用户">👥</span>
|
|
Cgminer
|
|
</div>
|
|
<button class="restart-btn"
|
|
tabindex="0"
|
|
aria-label="重启"
|
|
onclick="handleRestart()"
|
|
onkeydown="if(event.key==='Enter'){handleRestart();}">
|
|
<span role="img" aria-label="重启">🔄</span> Restart
|
|
</button>
|
|
</div>
|
|
<!-- Summary -->
|
|
<div class="summary-row">
|
|
<div class="summary-card" aria-label="Elapsed">
|
|
<div class="label">Elapsed</div>
|
|
<div class="value" id="elapsed">96427.17</div>
|
|
<div class="unit">GH/S</div>
|
|
</div>
|
|
<div class="summary-card" aria-label="RT">
|
|
<div class="label">RT</div>
|
|
<div class="value" id="rt">95706.09</div>
|
|
<div class="unit">GH/S</div>
|
|
</div>
|
|
<div class="summary-card" aria-label="Average">
|
|
<div class="label">Average</div>
|
|
<div class="value" id="average">95706.09</div>
|
|
<div class="unit">GH/S</div>
|
|
</div>
|
|
</div>
|
|
<!-- Fan -->
|
|
<div class="fan-row">
|
|
<div class="fan-card" aria-label="Fan1">
|
|
<div class="label">Fan1</div>
|
|
<div class="circle">
|
|
<svg width="60" height="60">
|
|
<circle cx="30" cy="30" r="26" stroke="#e0e6ed" stroke-width="6" fill="none"/>
|
|
<circle cx="30" cy="30" r="26" stroke="#1976d2" stroke-width="6" fill="none"
|
|
stroke-dasharray="163.36" stroke-dashoffset="32.67" stroke-linecap="round"
|
|
transform="rotate(-90 30 30)"/>
|
|
</svg>
|
|
</div>
|
|
<div class="value" id="fan1">3000</div>
|
|
<div class="unit">Speed (r/min)</div>
|
|
</div>
|
|
<div class="fan-card" aria-label="Fan2">
|
|
<div class="label">Fan2</div>
|
|
<div class="circle">
|
|
<svg width="60" height="60">
|
|
<circle cx="30" cy="30" r="26" stroke="#e0e6ed" stroke-width="6" fill="none"/>
|
|
<circle cx="30" cy="30" r="26" stroke="#1976d2" stroke-width="6" fill="none"
|
|
stroke-dasharray="163.36" stroke-dashoffset="32.67" stroke-linecap="round"
|
|
transform="rotate(-90 30 30)"/>
|
|
</svg>
|
|
</div>
|
|
<div class="value" id="fan2">3000</div>
|
|
<div class="unit">Speed (r/min)</div>
|
|
</div>
|
|
</div>
|
|
<!-- Pools -->
|
|
<div class="section" aria-label="矿池信息">
|
|
<div class="section-title">Pools</div>
|
|
<div style="overflow-x:auto;">
|
|
<table class="pools-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Pool</th>
|
|
<th>URL</th>
|
|
<th>User</th>
|
|
<th>Status</th>
|
|
<th>Diff</th>
|
|
<th>GetWorks</th>
|
|
<th>Accepted</th>
|
|
<th>Rejected</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="pools-tbody">
|
|
<!-- JS渲染 -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- Diagnostic -->
|
|
<div class="section" aria-label="诊断日志">
|
|
<div class="section-title">Diagnostic</div>
|
|
<div class="diagnostic-log" id="diagnostic-log">
|
|
<!-- JS渲染 -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="./js/index.js"></script>
|
|
</body>
|
|
</html> |