yarnom
f0b50d13ea
Add Go/Postgres admin APIs, Angular admin UI, manual build flow, asset uploads, markdown import/export, configurable slug generation, and the Yar reading theme. Exclude local docs and generated development artifacts from version control.
115 lines
3.9 KiB
HTML
115 lines
3.9 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Osaet Admin</title>
|
|
<link rel="stylesheet" href="/admin/assets/admin.css" />
|
|
</head>
|
|
<body>
|
|
<main class="shell">
|
|
<section id="loginView" class="login-view" hidden>
|
|
<form id="loginForm" class="login-panel">
|
|
<div>
|
|
<p class="eyebrow">Osaet Admin</p>
|
|
<h1>登录后台</h1>
|
|
</div>
|
|
<label>
|
|
用户名
|
|
<input id="loginUsername" autocomplete="username" value="yarnom" />
|
|
</label>
|
|
<label>
|
|
密码
|
|
<input id="loginPassword" type="password" autocomplete="current-password" />
|
|
</label>
|
|
<button type="submit">登录</button>
|
|
<p id="loginMessage" class="message" role="status"></p>
|
|
</form>
|
|
</section>
|
|
|
|
<section id="appView" hidden>
|
|
<header class="topbar">
|
|
<div>
|
|
<p class="eyebrow">Osaet Admin</p>
|
|
<h1>文章管理</h1>
|
|
</div>
|
|
<div class="topbar-actions">
|
|
<span id="userBadge" class="user-badge"></span>
|
|
<button id="newPostButton" type="button">新文章</button>
|
|
<button id="logoutButton" type="button" class="ghost">退出</button>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="workspace">
|
|
<aside class="post-list-panel">
|
|
<div class="panel-heading">
|
|
<h2>文章</h2>
|
|
<select id="statusFilter" aria-label="文章状态">
|
|
<option value="">全部</option>
|
|
<option value="draft">草稿</option>
|
|
<option value="published">已发布</option>
|
|
<option value="archived">归档</option>
|
|
</select>
|
|
</div>
|
|
<div id="postList" class="post-list"></div>
|
|
</aside>
|
|
|
|
<section class="editor-panel">
|
|
<form id="postForm" class="editor-form">
|
|
<div class="editor-head">
|
|
<div>
|
|
<p id="editorMode" class="eyebrow">新文章</p>
|
|
<h2 id="editorTitle">开始写作</h2>
|
|
</div>
|
|
<div class="editor-actions">
|
|
<button id="saveButton" type="submit">保存</button>
|
|
<button id="publishButton" type="button" class="publish">发布</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="fields-grid">
|
|
<label>
|
|
标题
|
|
<input id="titleInput" required />
|
|
</label>
|
|
<label>
|
|
Slug
|
|
<input id="slugInput" required />
|
|
</label>
|
|
<label>
|
|
状态
|
|
<select id="statusInput">
|
|
<option value="draft">草稿</option>
|
|
<option value="published">已发布</option>
|
|
<option value="archived">归档</option>
|
|
</select>
|
|
</label>
|
|
<label>
|
|
封面
|
|
<input id="coverInput" />
|
|
</label>
|
|
<label class="wide-field">
|
|
标签
|
|
<input id="tagsInput" placeholder="用逗号分隔，例如：生活, 技术" />
|
|
</label>
|
|
</div>
|
|
|
|
<label>
|
|
摘要
|
|
<textarea id="summaryInput" rows="3"></textarea>
|
|
</label>
|
|
|
|
<label class="body-field">
|
|
正文 Markdown
|
|
<textarea id="bodyInput" spellcheck="false"></textarea>
|
|
</label>
|
|
|
|
<p id="editorMessage" class="message" role="status"></p>
|
|
</form>
|
|
</section>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
<script src="/admin/assets/admin.js" type="module"></script>
|
|
</body>
|
|
</html>
|