{{define "admin_post_form"}}
  <link rel="stylesheet" href="/static/css/blog.css?v={{assetVer}}">
  {{if .Data.Error}}<div class="alert alert-err">{{.Data.Error}}</div>{{end}}
  <form method="post" action="{{if eq .Data.Mode "create"}}/admin/posts/create{{else}}/admin/posts/{{.Data.Post.ID}}/update{{end}}">
    <input type="hidden" name="csrf" value="{{.CSRF}}">
    <div class="panel">
      <h2>标题与摘要</h2>
      <div class="form-row">
        <label>标题</label>
        <input type="text" name="title" value="{{.Data.Post.Title}}" required>
      </div>
      <div class="form-row">
        <label>链接别名（Slug）</label>
        <input type="text" name="slug" value="{{.Data.Post.Slug}}">
        <div class="hint">留空则根据标题自动生成；用于 /post/别名 访问</div>
      </div>
      <div class="form-row">
        <label>摘要</label>
        <textarea name="summary" class="small">{{.Data.Post.Summary}}</textarea>
        <div class="hint">列表页展示的简短描述；留空则自动截取正文</div>
      </div>
      <div class="form-row">
        <label>封面图</label>
        <div class="blog-cover">
          <img class="blog-cover-img" id="apCoverImg" alt="封面预览" src="{{.Data.Post.Cover}}" {{if not .Data.Post.Cover}}hidden{{end}}>
          <div class="blog-cover-actions">
            <label class="btn btn-ghost btn-sm blog-nowrap">🖼 选择封面<input id="apCoverFile" type="file" accept="image/*" hidden></label>
            <button class="btn btn-ghost btn-sm blog-nowrap" type="button" id="apCoverClear" {{if not .Data.Post.Cover}}hidden{{end}}>移除封面</button>
          </div>
        </div>
        <div class="hint">留空也能发布；图片会自动压缩后再保存。</div>
        <input type="hidden" name="cover" id="apCoverPath" value="{{.Data.Post.Cover}}">
      </div>
    </div>
    <div class="panel">
      <h2>正文（Markdown）</h2>
      <div class="form-row">
        <div class="blog-toolbar">
          <label class="btn btn-ghost btn-sm blog-nowrap">🖼 插入图片<input id="apImgFile" type="file" accept="image/*" hidden></label>
          <span class="blog-toolbar-tip" id="apImgTip">图片上传后会插入到光标所在的位置</span>
        </div>
        <textarea id="apContent" name="content" class="editor" placeholder="# 开始写作…">{{.Data.Post.Content}}</textarea>
      </div>
    </div>
    <div class="panel">
      <h2>属性</h2>
      <div class="form-row">
        <label>分类</label>
        <select name="category_id">
          <option value="0">未分类</option>
          {{range .Data.Categories}}
          <option value="{{.ID}}" {{if eq $.Data.Post.CategoryID .ID}}selected{{end}}>{{.Name}}</option>
          {{end}}
        </select>
      </div>
      <div class="form-row">
        <label>标签</label>
        <input type="text" name="tags" value="{{.Data.Tags}}" placeholder="用逗号或顿号分隔，例如：Go, 建站, 教程">
      </div>
      {{if .Data.CoauthorEnabled}}
      <div class="form-row blog-coauthor-box">
        <label>点名共创</label>
        <input type="text" name="coauthors" value="{{.Data.CoauthorNames}}" placeholder="填写站内用户名，多个用逗号或顿号分隔">
        <div class="hint">被点名的人会在消息中心收到邀请，等他确认同意之后，才会与作者一起出现在文章署名里；把名字去掉再保存即可取消点名。</div>
      </div>
      {{end}}
      <div class="form-row">
        <label>状态</label>
        <select name="status" id="postStatus">
          <option value="published" {{if eq .Data.Post.Status "published"}}selected{{end}}>发布 · 立刻公开</option>
          <option value="draft" {{if or (eq .Data.Post.Status "draft") (eq .Data.Post.Status "")}}selected{{end}}>草稿 · 只有自己看得见</option>
          <option value="scheduled" {{if eq .Data.Post.Status "scheduled"}}selected{{end}}>定时 · 到点自动公开</option>
        </select>
      </div>
      <div class="form-row" id="postScheduleRow">
        <label>上线时间</label>
        <input type="datetime-local" name="publish_at" value="{{localInput .Data.Post.PublishAt}}">
        <div class="hint">按站点时区填写，到点后自动公开并推送收录；时间要晚于现在。</div>
      </div>
    </div>
    <div style="display:flex;gap:10px;">
      <button class="btn btn-primary" type="submit">{{if eq .Data.Mode "create"}}创建文章{{else}}保存修改{{end}}</button>
      <a class="btn btn-ghost" href="/admin/posts/all">取消</a>
    </div>
  </form>
  <script>
    (function () {
      var sel = document.getElementById('postStatus');
      var row = document.getElementById('postScheduleRow');
      if (sel && row) {
        var sync = function () { row.style.display = sel.value === 'scheduled' ? '' : 'none'; };
        sel.addEventListener('change', sync);
        sync();
      }
      var csrfBox = document.querySelector('form input[name="csrf"]');
      var csrf = csrfBox ? csrfBox.value : '';
      // 上传一张图，成功后把 /uploads/... 交给 done
      function upload(file, tip, done) {
        var fd = new FormData();
        fd.append('file', file);
        fd.append('csrf', csrf);
        if (tip) tip.textContent = '上传中…';
        fetch('/blog/upload', { method: 'POST', body: fd })
          .then(function (r) { return r.json(); })
          .then(function (res) {
            if (res && res.path) { done(res.path); return; }
            if (tip) tip.textContent = (res && res.error) || '图片上传失败，请重试';
          })
          .catch(function () { if (tip) tip.textContent = '图片上传失败，请重试'; });
      }
      // 正文插图：上传成功后把 Markdown 图片语法插到光标处
      var editor = document.getElementById('apContent');
      var imgFile = document.getElementById('apImgFile');
      var imgTip = document.getElementById('apImgTip');
      if (editor && imgFile) {
        imgFile.addEventListener('change', function () {
          var file = imgFile.files && imgFile.files[0];
          if (!file) return;
          upload(file, imgTip, function (path) {
            var mark = '![图片](' + path + ')';
            var start = editor.selectionStart || 0;
            var end = editor.selectionEnd || 0;
            editor.value = editor.value.slice(0, start) + mark + editor.value.slice(end);
            editor.selectionStart = editor.selectionEnd = start + mark.length;
            editor.focus();
            if (imgTip) imgTip.textContent = '图片已插入到正文';
          });
          imgFile.value = '';
        });
      }
      // 封面：选图 → 上传 → 预览，可更换、可移除
      var coverFile = document.getElementById('apCoverFile');
      var coverPath = document.getElementById('apCoverPath');
      var coverImg = document.getElementById('apCoverImg');
      var coverClear = document.getElementById('apCoverClear');
      if (coverFile && coverPath && coverImg) {
        coverFile.addEventListener('change', function () {
          var file = coverFile.files && coverFile.files[0];
          if (!file) return;
          upload(file, null, function (path) {
            coverPath.value = path;
            coverImg.src = path;
            coverImg.hidden = false;
            if (coverClear) coverClear.hidden = false;
          });
          coverFile.value = '';
        });
      }
      if (coverClear) {
        coverClear.addEventListener('click', function () {
          coverPath.value = '';
          coverImg.removeAttribute('src');
          coverImg.hidden = true;
          coverClear.hidden = true;
        });
      }
    })();
  </script>
{{end}}