{{define "asset_templates"}}
{{template "asset_tabs" .}}
<div class="card">
  <div class="section-title">
    <div>
      <h2 class="title-with-icon">{{icon "template"}}<span>模板列表</span></h2>
      <div class="form-hint">标准模板应作为基线，复制后再做定制化修改。空白模板仅用于高级场景。</div>
    </div>
    <div class="actions compact">
      <a class="btn ghost" href="/ui/assets/templates?mode=blank">{{icon "add"}}<span>新建空白模板</span></a>
    </div>
  </div>
  <div class="table-wrap">
    <table>
      <thead>
        <tr>
          <th>模板</th>
          <th>描述</th>
          <th>流程结构</th>
          <th>来源</th>
        </tr>
      </thead>
      <tbody>
        {{range .AssetTemplates}}
        <tr>
          <td><a class="mono" href="/ui/assets/templates?name={{.Name}}">{{.Name}}</a></td>
          <td>{{if .Description}}{{.Description}}{{else}}-{{end}}</td>
          <td>{{.NodeCount}}节点 / {{.EdgeCount}}连线</td>
          <td>{{if .ReadOnly}}标准模板{{else}}用户模板{{end}}</td>
        </tr>
        {{else}}
        <tr><td colspan="4"><div class="empty-state compact"><div class="empty-title">还没有模板</div></div></td></tr>
        {{end}}
      </tbody>
    </table>
  </div>
</div>

{{if .TemplateCreateMode}}
<div class="card">
  <div class="section-title">
    <div>
      <h2 class="title-with-icon">{{icon "template"}}<span>{{if eq .TemplateCreateMode "clone"}}复制标准模板{{else}}新建空白模板{{end}}</span></h2>
      <div class="form-hint">
        {{if eq .TemplateCreateMode "clone"}}复制后会保留原有节点和连线结构，再进入可视化编辑。{{else}}空白模板会打开空白画布，不包含任何预置处理链。{{end}}
      </div>
    </div>
  </div>
  <form method="post" action="/ui/assets/templates/create" class="inline-form">
    <input type="hidden" name="clone_source" value="{{.TemplateCloneSource}}" />
    <label>
      <span>模板名称</span>
      <input name="name" value="{{.TemplateDraftName}}" placeholder="例如 std_workshop_face_recognition_shoe_alarm_copy" />
    </label>
    <label class="grow">
      <span>模板描述</span>
      <input name="description" value="{{.TemplateDraftDescription}}" placeholder="说明这个模板用于什么业务流程" />
    </label>
    <button type="submit" class="btn secondary">{{icon "apply"}}<span>{{if eq .TemplateCreateMode "clone"}}复制并编辑{{else}}创建并编辑{{end}}</span></button>
  </form>
</div>
{{end}}

{{if .AssetTemplate}}
<div class="card">
  <div class="section-title">
    <div>
      <h2 class="title-with-icon">{{icon "template"}}<span>模板详情</span></h2>
    </div>
    <div class="actions compact">
      <a class="btn secondary" href="/ui/assets/templates/{{.AssetTemplate.Name}}/graph">{{icon "assets"}}<span>{{if .AssetTemplate.ReadOnly}}可视化预览{{else}}可视化编辑{{end}}</span></a>
      <a class="btn ghost" href="/ui/assets/templates?clone={{.AssetTemplate.Name}}">{{icon "add"}}<span>{{if .AssetTemplate.ReadOnly}}复制标准模板{{else}}复制模板{{end}}</span></a>
      <button
        type="button"
        class="btn secondary js-export-json"
        data-export-url="/ui/assets/templates/{{.AssetTemplate.Name}}/export"
        data-default-filename="{{.AssetTemplate.Name}}.json"
      >{{icon "apply"}}<span>另存为 JSON</span></button>
      {{if not .AssetTemplate.ReadOnly}}
      <form method="post" action="/ui/assets/templates/{{.AssetTemplate.Name}}/delete" onsubmit="return confirm('确认删除这个用户模板吗？');">
        <button type="submit" class="btn danger">{{icon "close"}}<span>删除模板</span></button>
      </form>
      {{end}}
    </div>
  </div>
  <div class="info-list">
    <div>
      <span>模板名</span>
      {{if .AssetTemplate.ReadOnly}}
      <strong class="mono">{{.AssetTemplate.Name}}</strong>
      {{else}}
      <div class="editable-line">
        <strong class="mono js-inline-edit-display">{{.AssetTemplate.Name}}</strong>
        <button type="button" class="btn ghost icon-only js-inline-edit-toggle" data-target="template-name-edit" aria-label="修改模板名" title="修改模板名">{{icon "edit"}}</button>
      </div>
      <form method="post" action="/ui/assets/templates/{{.AssetTemplate.Name}}/rename" id="template-name-edit" class="inline-edit-form" hidden>
        <input type="hidden" name="description" value="{{.AssetTemplate.Description}}" />
        <input name="name" value="{{.AssetTemplate.Name}}" class="mono" />
        <button type="submit" class="btn secondary icon-only" aria-label="保存模板名" title="保存模板名">{{icon "apply"}}</button>
        <button type="button" class="btn ghost icon-only js-inline-edit-cancel" data-target="template-name-edit" aria-label="取消" title="取消">{{icon "close"}}</button>
      </form>
      {{end}}
    </div>
    <div><span>模板类型</span><strong>{{if .AssetTemplate.ReadOnly}}标准模板（只读）{{else}}用户模板{{end}}</strong></div>
    <div><span>来源文件</span><strong class="mono">{{if .AssetTemplate.Source}}{{.AssetTemplate.Source}}{{else}}-{{end}}</strong></div>
    <div><span>节点数</span><strong>{{.AssetTemplate.NodeCount}}</strong></div>
    <div><span>连线数</span><strong>{{.AssetTemplate.EdgeCount}}</strong></div>
    <div><span>MinIO</span><strong class="mono">{{if .AssetTemplate.MinIOEndpoint}}{{.AssetTemplate.MinIOEndpoint}}{{else}}-{{end}}</strong></div>
    <div><span>Bucket</span><strong>{{if .AssetTemplate.MinIOBucket}}{{.AssetTemplate.MinIOBucket}}{{else}}-{{end}}</strong></div>
    <div class="full"><span>取 token 接口</span><strong class="mono">{{if .AssetTemplate.ExternalGetTokenURL}}{{.AssetTemplate.ExternalGetTokenURL}}{{else}}-{{end}}</strong></div>
    <div class="full"><span>告警上报接口</span><strong class="mono">{{if .AssetTemplate.ExternalPutMessageURL}}{{.AssetTemplate.ExternalPutMessageURL}}{{else}}-{{end}}</strong></div>
    <div><span>租户编码</span><strong>{{if .AssetTemplate.TenantCode}}{{.AssetTemplate.TenantCode}}{{else}}-{{end}}</strong></div>
    <div class="full">
      <span>描述</span>
      {{if .AssetTemplate.ReadOnly}}
      <strong>{{if .AssetTemplate.Description}}{{.AssetTemplate.Description}}{{else}}-{{end}}</strong>
      {{else}}
      <div class="editable-line">
        <strong class="js-inline-edit-display">{{if .AssetTemplate.Description}}{{.AssetTemplate.Description}}{{else}}-{{end}}</strong>
        <button type="button" class="btn ghost icon-only js-inline-edit-toggle" data-target="template-description-edit" aria-label="修改描述" title="修改描述">{{icon "edit"}}</button>
      </div>
      <form method="post" action="/ui/assets/templates/{{.AssetTemplate.Name}}/rename" id="template-description-edit" class="inline-edit-form" hidden>
        <input type="hidden" name="name" value="{{.AssetTemplate.Name}}" />
        <input name="description" value="{{.AssetTemplate.Description}}" />
        <button type="submit" class="btn secondary icon-only" aria-label="保存描述" title="保存描述">{{icon "apply"}}</button>
        <button type="button" class="btn ghost icon-only js-inline-edit-cancel" data-target="template-description-edit" aria-label="取消" title="取消">{{icon "close"}}</button>
      </form>
      {{end}}
    </div>
    <div class="full"><span>路径</span><strong class="mono">{{.AssetTemplate.Path}}</strong></div>
  </div>
</div>

{{if .AssetTemplate.ReadOnly}}
<div class="card">
  <div class="form-hint">标准模板保留在模板目录中，作为只读基线使用。需要调整流程时，请先复制为用户模板，再进入可视化编辑保存。</div>
</div>
{{end}}

{{if .AssetTemplate.AdvancedParams}}
<details class="card collapsible">
  <summary class="title-with-icon">{{icon "tech"}}<span>高级设置</span></summary>
  <pre>{{json .AssetTemplate.AdvancedParams}}</pre>
</details>
{{end}}

<details class="card collapsible">
  <summary class="title-with-icon">{{icon "tech"}}<span>原始 JSON</span></summary>
  <pre>{{json .AssetTemplate.Raw}}</pre>
</details>
{{end}}
{{if .Error}}<div class="error">{{.Error}}</div>{{end}}
{{template "asset_tabs_end" .}}
{{end}}