{{define "device_control"}}
{{template "device_header" .}}

<div class="card">
  <div class="section-title">
    <div>
      <h2 class="title-with-icon">{{icon "control"}}<span>单设备配置</span></h2>
      <div class="muted small">当前工作台仅管理这一台设备的配置与服务。</div>
    </div>
    {{if .Device.Online}}<span class="pill ok">可操作</span>{{else}}<span class="pill bad">设备离线</span>{{end}}
  </div>
  <div class="actions" style="margin-bottom:12px">
    <a class="btn secondary" href="/ui/device-config">返回设备选择</a>
  </div>

  <div class="summary-strip control-summary">
    <div class="summary-chip">
      <div class="summary-chip-label">当前配置</div>
      <div class="summary-chip-value">{{if and .ConfigStatus .ConfigStatus.Metadata.ConfigID}}{{.ConfigStatus.Metadata.ConfigID}}{{else}}待读取{{end}}</div>
    </div>
    <div class="summary-chip">
      <div class="summary-chip-label">上一份配置</div>
      <div class="summary-chip-value">{{if and .ConfigStatus .ConfigStatus.PreviousConfig .ConfigStatus.PreviousConfig.Metadata.ConfigID}}{{.ConfigStatus.PreviousConfig.Metadata.ConfigID}}{{else}}-{{end}}</div>
    </div>
    <div class="summary-chip">
      <div class="summary-chip-label">服务状态</div>
      <div class="summary-chip-value">{{if and .ConfigStatus .ConfigStatus.MediaServer.Running}}运行中{{else}}未确认{{end}}</div>
    </div>
  </div>

  <div class="control-grid">
    <section class="panel-block">
      <div class="panel-head">
        <div>
          <h3 class="title-with-icon">{{icon "preview"}}<span>配置预览</span></h3>
        </div>
        <a class="btn secondary" href="/ui/devices/{{.Device.DeviceID}}/config-preview">{{icon "preview"}}<span>打开预览器</span></a>
      </div>
      <div class="info-list compact-list">
        <div><span>当前模板</span><strong>{{if and .ConfigStatus .ConfigStatus.Metadata.Template}}{{.ConfigStatus.Metadata.Template}}{{else}}-{{end}}</strong></div>
        <div><span>业务配置</span><strong>{{if and .ConfigStatus .ConfigStatus.Metadata.Profile}}{{.ConfigStatus.Metadata.Profile}}{{else}}-{{end}}</strong></div>
        <div><span>候选配置</span><strong class="mono">{{if and .ConfigStatus .ConfigStatus.Candidate .ConfigStatus.Candidate.Exists}}{{if .ConfigStatus.Candidate.Metadata.ConfigID}}{{.ConfigStatus.Candidate.Metadata.ConfigID}} / {{.ConfigStatus.Candidate.Metadata.ConfigVersion}}{{else}}已存在{{end}}{{else}}未上传{{end}}</strong></div>
      </div>
    </section>

    <section class="panel-block">
      <div class="panel-head">
        <div>
          <h3 class="title-with-icon">{{icon "apply"}}<span>配置应用</span></h3>
        </div>
      </div>
      <div class="info-list compact-list">
        <div><span>当前配置</span><strong class="mono">{{if and .ConfigStatus .ConfigStatus.Metadata.ConfigID}}{{.ConfigStatus.Metadata.ConfigID}}{{else}}待读取{{end}}</strong></div>
        <div><span>上一份配置</span><strong class="mono">{{if and .ConfigStatus .ConfigStatus.PreviousConfig .ConfigStatus.PreviousConfig.Metadata.ConfigID}}{{.ConfigStatus.PreviousConfig.Metadata.ConfigID}}{{else}}-{{end}}</strong></div>
      </div>
      <div class="actions">
        <form method="post" action="/ui/devices/{{.Device.DeviceID}}/config-candidate/apply">
          <input type="hidden" name="return_to" value="config" />
          <button type="submit" class="primary">应用候选配置</button>
        </form>
        <form method="post" action="/ui/devices/{{.Device.DeviceID}}/action">
          <input type="hidden" name="action" value="rollback" />
          <input type="hidden" name="return_to" value="config" />
          <button type="submit" class="secondary">回滚到上一份</button>
        </form>
      </div>
    </section>

    <section class="panel-block">
      <div class="panel-head">
        <div>
          <h3 class="title-with-icon">{{icon "service"}}<span>服务控制</span></h3>
        </div>
      </div>
      <div class="actions stack">
        <form method="post" action="/ui/devices/{{.Device.DeviceID}}/action">
          <input type="hidden" name="action" value="media_start" />
          <input type="hidden" name="return_to" value="config" />
          <button type="submit" class="secondary">启动服务</button>
        </form>
        <form method="post" action="/ui/devices/{{.Device.DeviceID}}/action">
          <input type="hidden" name="action" value="media_restart" />
          <input type="hidden" name="return_to" value="config" />
          <button type="submit" class="primary">重启服务</button>
        </form>
        <form method="post" action="/ui/devices/{{.Device.DeviceID}}/action">
          <input type="hidden" name="action" value="media_stop" />
          <input type="hidden" name="return_to" value="config" />
          <button type="submit" class="danger">停止服务</button>
        </form>
      </div>
    </section>

    <section class="panel-block">
      <div class="panel-head">
        <div>
          <h3 class="title-with-icon">{{icon "result"}}<span>执行结果摘要</span></h3>
        </div>
      </div>
      {{if .ResultTitle}}<div class="muted small" style="margin-bottom:8px">{{.ResultTitle}}</div>{{end}}
      {{if .Message}}<div class="msg">{{.Message}}</div>{{end}}
      {{if .Error}}<div class="error">{{.Error}}</div>{{end}}
      {{if .RawText}}<pre>{{.RawText}}</pre>{{else}}
      <div class="empty-state compact">
        <div class="empty-title">暂无最近操作</div>
        <div class="muted">从上面的配置应用或服务控制开始执行。</div>
      </div>{{end}}
    </section>
  </div>
</div>
{{end}}