{{define "content"}}
{{template "adminnav" (dict "Tab" "ai")}}
<div class="pagehead">
  <h1>AI 接入</h1>
  <p class="muted">接入任意 OpenAI 兼容接口（OpenAI、DeepSeek、通义、本地 Ollama 等），成员每次推送后自动生成「What's New」更新说明。</p>
</div>

<div class="split">
  <div class="col-main">
    <div class="card">
      <form method="post" action="/admin/ai" autocomplete="off">
        <input type="hidden" name="csrf" value="{{.CSRF}}">
        <label class="check"><input type="checkbox" name="ai_enabled" {{if .Data.Enabled}}checked{{end}}><span>启用 AI 自动更新说明<em>关闭后仍会显示根据提交信息生成的简要说明</em></span></label>
        <label class="field">
          <span>接口地址（Base URL）</span>
          <input type="text" name="ai_base_url" value="{{.Data.BaseURL}}" placeholder="https://api.openai.com/v1">
          <em class="field-hint">可填到 /v1 为止，例如 https://api.deepseek.com/v1；也可直接填写完整的 /chat/completions 地址。</em>
        </label>
        <div class="grid-2">
          <label class="field"><span>模型名称</span><input type="text" name="ai_model" value="{{.Data.Model}}" placeholder="gpt-4o-mini / deepseek-chat"></label>
          <label class="field">
            <span>说明语言</span>
            <select name="ai_language">
              <option value="zh" {{if ne .Data.Language "en"}}selected{{end}}>简体中文</option>
              <option value="en" {{if eq .Data.Language "en"}}selected{{end}}>English</option>
            </select>
          </label>
        </div>
        <label class="field">
          <span>API Key</span>
          <input type="password" name="ai_api_key" placeholder="{{if .Data.HasKey}}已保存，留空则保持不变{{else}}sk-...{{end}}" autocomplete="new-password">
          {{if .Data.HasKey}}<em class="field-hint">当前已配置密钥。</em>{{end}}
        </label>
        {{if .Data.HasKey}}<label class="check"><input type="checkbox" name="clear_key"><span>清除已保存的密钥</span></label>{{end}}
        <div class="row-actions">
          <button class="btn btn-primary" type="submit">保存设置</button>
          <button class="btn btn-ghost" type="submit" name="action" value="test">保存并测试连接</button>
        </div>
      </form>
    </div>
  </div>

  <aside class="col-side">
    <div class="card tip-card">
      <h3>它是如何工作的</h3>
      <ol class="steps">
        <li><span class="step">1</span><div>成员 <code class="csha">git push</code> 到 gitcat。</div></li>
        <li><span class="step">2</span><div>服务端记录本次推送的提交与变更统计。</div></li>
        <li><span class="step">3</span><div>调用你在上面配置的模型，生成 1-3 条面向访客的更新说明。</div></li>
        <li><span class="step">4</span><div>说明展示在项目主页与「动态」页面，并标注是 AI 生成。</div></li>
      </ol>
      <p class="hint">若接口不可用，gitcat 会自动降级为基于提交信息的简要说明，不影响推送。</p>
    </div>
    <div class="card about">
      <h3>常见服务示例</h3>
      <ul class="kv">
        <li><span>OpenAI</span><code class="csha">https://api.openai.com/v1</code></li>
        <li><span>DeepSeek</span><code class="csha">https://api.deepseek.com/v1</code></li>
        <li><span>Ollama 本地</span><code class="csha">http://127.0.0.1:11434/v1</code></li>
      </ul>
    </div>
  </aside>
</div>
{{end}}