fix: 设计原则审查修复 — DIP/ISP, LoD, DRY, OCP, URL, 301缓存

- P0 DIP+ISP: 全链路注入接口，消除零接口紧耦合
- P0 URL: auth 301→302，修复登出后浏览器缓存陷阱
- P1 DRY: JWT 认证逻辑收敛至 TokenService+中间件
- P2 DRY: 前后端角色/状态映射统一为 model 常量
- P2 LoD: 新增 SettingsController，router 不再跨层调 repo
- P2 URL: settings ?tab= → /settings/:tab 伪静态
- P3 OCP: 角色权限 map 化，告别硬编码 switch

templates/admin/html/layout/base.html

@@ -16,14 +16,14 @@
         <a href="/admin" class="admin-logo">MetaLab <span>管理面板</span></a>
         <div class="admin-header-right">
             <span class="admin-user">{{.Username}}</span>
-            <a href="/" class="admin-back-btn">← 返回前台</a>
+            <a href="/" class="admin-back-btn"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14" style="vertical-align:-2px;margin-right:3px;"><path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>返回前台</a>
         </div>
     </div>
 </header>
 <div class="admin-container">
     <aside class="admin-sidebar">
         <nav>
-            <a href="/admin" class="sidebar-item {{if eq .CurrentPath "/admin"}}active{{end}}">
+            <a href="/admin" class="sidebar-item {{if eq .CurrentPath "/admin/"}}active{{end}}">
                 <span class="sidebar-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/></svg></span>
                 管理首页
             </a>

templates/admin/html/layout/footer.html

@@ -1,5 +1,6 @@
     </main>
 </div>
+<script src="/shared/static/js/utils.js"></script>
 <script src="/admin/static/js/common.js"></script>
 {{if .ExtraJS}}
 <script src="{{.ExtraJS}}"></script>

templates/admin/html/users/index.html

@@ -9,17 +9,15 @@
             <input type="text" id="searchInput" class="filter-input" placeholder="搜索邮箱或用户名..." autocomplete="off">
             <select id="roleFilter" class="filter-select">
                 <option value="">全部角色</option>
-                <option value="user">普通用户</option>
-                <option value="moderator">版主</option>
-                <option value="admin">管理员</option>
-                <option value="owner">站长</option>
+                {{range $val, $label := .RoleNames}}
+                <option value="{{$val}}">{{$label}}</option>
+                {{end}}
             </select>
             <select id="statusFilter" class="filter-select">
                 <option value="">全部状态</option>
-                <option value="active">正常</option>
-                <option value="banned">已封禁</option>
-                <option value="deleted">已注销</option>
-                <option value="locked">已锁定</option>
+                {{range $val, $label := .StatusNames}}
+                <option value="{{$val}}">{{$label}}</option>
+                {{end}}
             </select>
             <button id="searchBtn" class="btn btn-primary">搜索</button>
         </div>
@@ -46,5 +44,17 @@
 
         <!-- 分页 -->
         <div class="pagination-bar" id="paginationBar"></div>
-<script>window.__currentUid = {{.UID}}; window.__isOwner = {{if .IsOwner}}true{{else}}false{{end}};</script>
+<script>
+window.__currentUid = {{.UID}};
+window.__isOwner = {{if .IsOwner}}true{{else}}false{{end}};
+// 由服务端 model.RoleDisplayNames / StatusDisplayNames 作为唯一数据源注入
+window.__ROLE_NAMES = {
+    {{range $val, $label := .RoleNames}}"{{$val}}": "{{$label}}",
+    {{end}}
+};
+window.__STATUS_NAMES = {
+    {{range $val, $label := .StatusNames}}"{{$val}}": "{{$label}}",
+    {{end}}
+};
+</script>
 {{template "admin/layout/footer.html" .}}

templates/admin/static/css/users.css

@@ -3,10 +3,10 @@
    单一职责：仅用户管理页面特有样式
    ===================================================== */
 
-.data-table .col-uid { width: 60px; }
-.data-table .col-username { width: 120px; }
-.data-table .col-email { min-width: 180px; }
-.data-table .col-role { width: 90px; }
-.data-table .col-status { width: 90px; }
-.data-table .col-time { width: 140px; }
-.data-table .col-actions { width: 160px; }
+.data-table .col-uid { width: 60px; white-space: nowrap; }
+.data-table .col-username { width: 120px; white-space: nowrap; }
+.data-table .col-email { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.data-table .col-role { width: 100px; white-space: nowrap; }
+.data-table .col-status { width: 90px; white-space: nowrap; }
+.data-table .col-time { width: 140px; white-space: nowrap; }
+.data-table .col-actions { width: 180px; white-space: nowrap; }

templates/admin/static/js/common.js

@@ -5,6 +5,7 @@
    ===================================================== */
 
 // --- AJAX 封装 ---
+// 注意：getCSRFToken() 由共享 utils.js 提供
 const api = {
     async get(url) {
         const res = await fetch(url, {
@@ -36,11 +37,6 @@ const api = {
     }
 };
 
-function getCSRFToken() {
-    const meta = document.querySelector('meta[name="csrf-token"]');
-    return meta ? meta.getAttribute('content') : '';
-}
-
 // --- Toast 通知 ---
 function showToast(message, type) {
     const container = document.querySelector('.toast-container') || createToastContainer();
@@ -110,13 +106,15 @@ function formatTime(isoStr) {
 }
 
 // --- 角色标签 ---
+// 数据源由服务端 model.RoleDisplayNames 注入为 window.__ROLE_NAMES
 function roleLabel(role) {
-    const map = { user: '普通用户', moderator: '版主', admin: '管理员', owner: '站长' };
-    return `<span class="role-tag role-${role}">${map[role] || role}</span>`;
+    var map = window.__ROLE_NAMES || { user: '普通用户', moderator: '版主', admin: '管理员', owner: '站长' };
+    return '<span class="role-tag role-' + role + '">' + (map[role] || role) + '</span>';
 }
 
 // --- 状态标签 ---
+// 数据源由服务端 model.StatusDisplayNames 注入为 window.__STATUS_NAMES
 function statusLabel(status) {
-    const map = { active: '正常', banned: '已封禁', deleted: '已注销', locked: '已锁定' };
-    return `<span class="badge badge-${status}">${map[status] || status}</span>`;
+    var map = window.__STATUS_NAMES || { active: '正常', banned: '已封禁', deleted: '已注销', locked: '已锁定' };
+    return '<span class="badge badge-' + status + '">' + (map[status] || status) + '</span>';
 }