safesight-control/internal/web/ui/templates/dashboard.html

{{define "dashboard"}}
<div class="card">
  <div class="section-title">
    <div>
      <h2>视觉节点态势</h2>
      <div class="muted small">面向多台视觉识别边缘节点的运行总览。</div>
    </div>
    <div class="actions">
      <a class="btn ghost" href="/ui/devices">设备列表</a>
      <a class="btn ghost" href="/ui/device-config">配置管理</a>
    </div>
  </div>
  <div class="stats">
    <div class="stat"><div class="k">设备总数</div><div class="v">{{.DeviceCount}}</div><div class="hint">已纳管的边缘设备</div></div>
    <div class="stat"><div class="k">在线节点</div><div class="v">{{.OnlineCount}}</div><div class="hint">可执行识别任务</div></div>
    <div class="stat"><div class="k">离线节点</div><div class="v">{{.OfflineCount}}</div><div class="hint">需要检查网络或设备服务</div></div>
    <div class="stat"><div class="k">执行中任务</div><div class="v">{{.RunningTaskCount}}</div><div class="hint">正在下发或控制节点</div></div>
  </div>
</div>

<div class="row">
  <div class="card">
    <h2>视频分析概览</h2>
    <div class="muted small">当前版本基于节点在线状态和视频分析服务查询入口汇总。</div>
    <div class="actions" style="margin-top:12px">
      <a class="btn ghost" href="/ui/devices">查看视频分析服务</a>
      <a class="btn ghost" href="/ui/recognition">识别配置</a>
      <a class="btn ghost" href="/ui/models">模型管理</a>
    </div>
  </div>
  <div class="card">
    <h2>运维工作流</h2>
    <div class="muted small">按常见现场操作顺序进入对应页面。</div>
    <div class="actions" style="margin-top:8px">
      <a class="btn ghost" href="/ui/devices">查看设备列表</a>
      <a class="btn ghost" href="/ui/device-config">配置管理</a>
      <a class="btn ghost" href="/ui/recognition">配置识别方案</a>
      <a class="btn ghost" href="/ui/logs">日志分析</a>
    </div>
  </div>
</div>

<div class="row">
  <div class="card">
    <h2>快速入口</h2>
    <div class="actions" style="margin-top:8px">
      <a class="btn ghost" href="/ui/devices-add">新增设备</a>
      <a class="btn ghost" href="/ui/api">高级调试</a>
    </div>
  </div>
  <div class="card">
    <h2>任务健康</h2>
    <div class="stats" style="grid-template-columns:repeat(3,minmax(0,1fr))">
      <div class="stat"><div class="k">执行中任务</div><div class="v">{{.RunningTaskCount}}</div></div>
      <div class="stat"><div class="k">失败任务</div><div class="v">{{.FailedTaskCount}}</div></div>
      <div class="stat"><div class="k">成功任务</div><div class="v">{{.SuccessTaskCount}}</div></div>
    </div>
  </div>
</div>

<div class="card">
  <h2>需要关注的节点</h2>
  <div class="table-wrap" style="margin-top:10px">
    <table>
      <thead>
        <tr><th>节点</th><th>状态</th><th>管理地址</th><th>最后心跳</th><th>操作</th></tr>
      </thead>
      <tbody>
        {{range .AttentionDevices}}
          <tr>
            <td><a class="mono" href="/ui/devices/{{.DeviceID}}">{{.DeviceName}}</a><div class="muted small mono">{{.DeviceID}}</div></td>
            <td><span class="pill bad">离线</span></td>
            <td class="mono">{{.IP}}:{{.AgentPort}}</td>
            <td>{{ago .LastSeenMs}}</td>
            <td><a class="btn ghost" href="/ui/devices/{{.DeviceID}}">查看</a></td>
          </tr>
        {{else}}
          <tr><td colspan="5" class="muted">暂无需要关注的节点。</td></tr>
        {{end}}
      </tbody>
    </table>
  </div>
</div>

<div class="card">
  <h2>最近任务</h2>
  <div class="table-wrap" style="margin-top:10px">
    <table>
      <thead>
        <tr><th>任务标识</th><th>操作</th><th>状态</th><th>节点数</th></tr>
      </thead>
      <tbody>
        {{range .Tasks}}
        <tr>
          <td><a class="mono" href="/ui/tasks/{{.ID}}">{{.ID}}</a></td>
          <td>
            {{if eq .Type "config_apply"}}下发识别配置
            {{else if eq .Type "reload"}}重载识别服务
            {{else if eq .Type "rollback"}}回滚识别配置
            {{else if eq .Type "media_start"}}启动视频分析服务
            {{else if eq .Type "media_restart"}}重启视频分析服务
            {{else if eq .Type "media_stop"}}停止视频分析服务
            {{else}}<span class="mono">{{.Type}}</span>{{end}}
          </td>
          <td>
            {{if eq .Status "success"}}<span class="pill ok">成功</span>
            {{else if eq .Status "failed"}}<span class="pill bad">失败</span>
            {{else if eq .Status "running"}}<span class="pill run">执行中</span>
            {{else}}<span class="pill">待执行</span>{{end}}
          </td>
          <td>{{len .DeviceIDs}}</td>
        </tr>
        {{else}}
        <tr><td colspan="4" class="muted">暂无任务记录。</td></tr>
        {{end}}
      </tbody>
    </table>
  </div>
</div>
{{end}}