{{define "system"}}
<div class="card">
  <div class="crumb">诊断 / 系统状态</div>
  <div class="muted small" style="margin-top:8px">系统状态页负责平台健康、发现机制和接入策略查看。</div>
</div>

<div class="detail-grid">
  <div class="card">
    <h2 class="title-with-icon">{{icon "discovery"}}<span>设备发现与注册</span></h2>
    <div class="info-list">
      <div><span>当前设备数</span><strong>{{len .Devices}}</strong></div>
      <div><span>发现方式</span><strong>UDP 广播发现</strong></div>
      <div><span>注册方式</span><strong>自动发现 / 手动录入</strong></div>
    </div>
  </div>

  <div class="card">
    <h2 class="title-with-icon">{{icon "shield"}}<span>Agent 访问策略</span></h2>
    <div class="info-list">
      <div><span>访问模型</span><strong>统一令牌</strong></div>
      <div><span>更新方式</span><strong>部署脚本托管</strong></div>
      <div><span>页面策略</span><strong>默认不暴露敏感值</strong></div>
    </div>
  </div>
</div>

<div class="detail-grid">
  <div class="card">
    <h2 class="title-with-icon">{{icon "heartbeat"}}<span>后台健康</span></h2>
    <div class="info-list compact-list">
      <div><span>健康检查</span><strong class="mono">/health</strong></div>
      <div><span>接口文档</span><strong class="mono">/openapi.json</strong></div>
    </div>
    <div class="actions" style="margin-top:12px">
      <a class="btn ghost" href="/health">健康检查</a>
      <a class="btn ghost" href="/openapi.json">OpenAPI</a>
    </div>
  </div>

  <div class="card">
    <h2 class="title-with-icon">{{icon "tech"}}<span>当前纳管设备</span></h2>
    <div class="info-list compact-list">
      <div><span>在线设备</span><strong>{{len .Devices}}</strong></div>
      <div><span>接入端口</span><strong class="mono">9100 / 9000</strong></div>
    </div>
  </div>
</div>

<div class="detail-grid">
  <div class="card">
    <h2 class="title-with-icon">{{icon "audit"}}<span>数据备份 / 恢复</span></h2>
    <div class="info-list compact-list">
      <div><span>数据库文件</span><strong class="mono">{{if .DBPath}}{{.DBPath}}{{else}}未配置{{end}}</strong></div>
      <div><span>备份方式</span><strong>另存为数据库文件</strong></div>
    </div>
    <div class="actions" style="margin-top:12px">
      <button type="button" class="btn ghost js-export-db" data-export-url="/ui/system/db-backup" data-default-filename="app.db">备份数据库</button>
    </div>
    <form method="post" action="/ui/system/db-restore" enctype="multipart/form-data" style="margin-top:12px">
      <div class="field-grid">
        <label class="full"><span>恢复数据库</span><input type="file" name="file" accept=".db,application/octet-stream" required /></label>
      </div>
      <div class="actions" style="margin-top:12px">
        <button type="submit" class="secondary">恢复数据库</button>
      </div>
    </form>
  </div>
</div>
{{end}}