feat(admin): add /admin/system route shell with 5 tabs
新增系统管理入口页(数据库状态/服务器状态/SQL 控制台/导出/备份恢复), 顶部 tab 切换(用 use_signal 不深链)。路由注册 + 导航加「系统」项。 tab 内容待后续 task 填充。
This commit is contained in:
parent
c74e59485d
commit
81a4196e43
@ -72,6 +72,11 @@ pub fn AdminLayout() -> Element {
|
|||||||
label: "回收站",
|
label: "回收站",
|
||||||
is_active: matches!(route, Route::Trash {}) || matches!(route, Route::TrashPage { .. }),
|
is_active: matches!(route, Route::Trash {}) || matches!(route, Route::TrashPage { .. }),
|
||||||
},
|
},
|
||||||
|
NavItemConfig {
|
||||||
|
route: Route::System {},
|
||||||
|
label: "系统",
|
||||||
|
is_active: matches!(route, Route::System {}),
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
// 右侧操作区:主题切换 + 登出按钮
|
// 右侧操作区:主题切换 + 登出按钮
|
||||||
|
|||||||
@ -8,6 +8,8 @@ pub mod comments;
|
|||||||
pub mod dashboard;
|
pub mod dashboard;
|
||||||
/// 文章管理列表页面模块。
|
/// 文章管理列表页面模块。
|
||||||
pub mod posts;
|
pub mod posts;
|
||||||
|
/// 系统管理页面模块(数据库 + 服务器状态 + SQL 控制台 + 导出 + 备份)。
|
||||||
|
pub mod system;
|
||||||
/// 回收站管理页面模块。
|
/// 回收站管理页面模块。
|
||||||
pub mod trash;
|
pub mod trash;
|
||||||
/// 文章编辑器页面模块(基于 Tiptap 富文本编辑器)。
|
/// 文章编辑器页面模块(基于 Tiptap 富文本编辑器)。
|
||||||
@ -19,6 +21,8 @@ pub use comments::{AdminComments, AdminCommentsPage};
|
|||||||
pub use dashboard::Admin;
|
pub use dashboard::Admin;
|
||||||
/// 文章管理列表组件(带默认分页)。
|
/// 文章管理列表组件(带默认分页)。
|
||||||
pub use posts::{Posts, PostsPage};
|
pub use posts::{Posts, PostsPage};
|
||||||
|
/// 系统管理入口组件。
|
||||||
|
pub use system::System;
|
||||||
/// 回收站管理组件(带默认分页)。
|
/// 回收站管理组件(带默认分页)。
|
||||||
pub use trash::{Trash, TrashPage};
|
pub use trash::{Trash, TrashPage};
|
||||||
/// 文章编辑器组件(新建与编辑模式)。
|
/// 文章编辑器组件(新建与编辑模式)。
|
||||||
|
|||||||
71
src/pages/admin/system.rs
Normal file
71
src/pages/admin/system.rs
Normal file
@ -0,0 +1,71 @@
|
|||||||
|
//! 后台系统管理页面(数据库 + 服务器状态 + SQL 控制台 + 导出 + 备份)。
|
||||||
|
//!
|
||||||
|
//! 用顶部 tab 切换 5 个功能,tab 状态用 `use_signal`(不深链 / 不走分页路由)。
|
||||||
|
//! 各 tab 的实际内容由后续 task 填充,本文件先搭好骨架与 tab 切换。
|
||||||
|
|
||||||
|
use dioxus::prelude::*;
|
||||||
|
|
||||||
|
/// 系统管理的 5 个功能 tab。
|
||||||
|
#[derive(Clone, Copy, PartialEq, Debug)]
|
||||||
|
enum SystemTab {
|
||||||
|
/// 数据库运行状态(表/连接/死元组/迁移版本)。
|
||||||
|
DbStatus,
|
||||||
|
/// 服务器状态(应用内 + 主机层 CPU/内存/磁盘)。
|
||||||
|
ServerStatus,
|
||||||
|
/// SQL 控制台(全读写 + 护栏)。
|
||||||
|
SqlConsole,
|
||||||
|
/// 数据导出(SQL/CSV 流式下载)。
|
||||||
|
Export,
|
||||||
|
/// 备份恢复(pg_dump + 任务进度)。
|
||||||
|
Backup,
|
||||||
|
}
|
||||||
|
|
||||||
|
/// 系统管理入口组件。
|
||||||
|
#[component]
|
||||||
|
pub fn System() -> Element {
|
||||||
|
// tab 状态:默认进第一个 tab(数据库状态)。用 signal 而非 URL query——
|
||||||
|
// tab 切换无需深链/书签,避免新增路由变体。
|
||||||
|
let mut active_tab = use_signal(|| SystemTab::DbStatus);
|
||||||
|
|
||||||
|
let tabs = [
|
||||||
|
("数据库状态", SystemTab::DbStatus),
|
||||||
|
("服务器状态", SystemTab::ServerStatus),
|
||||||
|
("SQL 控制台", SystemTab::SqlConsole),
|
||||||
|
("数据导出", SystemTab::Export),
|
||||||
|
("备份恢复", SystemTab::Backup),
|
||||||
|
];
|
||||||
|
|
||||||
|
rsx! {
|
||||||
|
div { class: "space-y-6",
|
||||||
|
h1 { class: "text-2xl font-bold text-paper-primary", "系统管理" }
|
||||||
|
|
||||||
|
// 顶部 tab 切换栏
|
||||||
|
div { class: "flex flex-wrap gap-1 border-b border-paper-border",
|
||||||
|
for (label, tab) in tabs {
|
||||||
|
button {
|
||||||
|
key: "{tab:?}",
|
||||||
|
class: "px-4 py-2 text-sm font-medium border-b-2 -mb-px transition-colors",
|
||||||
|
class: if active_tab() == tab {
|
||||||
|
"border-paper-accent text-paper-accent"
|
||||||
|
} else {
|
||||||
|
"border-transparent text-paper-secondary hover:text-paper-primary"
|
||||||
|
},
|
||||||
|
onclick: move |_| active_tab.set(tab),
|
||||||
|
{label}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// tab 内容(后续 task 填充)
|
||||||
|
div {
|
||||||
|
match active_tab() {
|
||||||
|
SystemTab::DbStatus => rsx! { div { "数据库状态(待实现)" } },
|
||||||
|
SystemTab::ServerStatus => rsx! { div { "服务器状态(待实现)" } },
|
||||||
|
SystemTab::SqlConsole => rsx! { div { "SQL 控制台(待实现)" } },
|
||||||
|
SystemTab::Export => rsx! { div { "数据导出(待实现)" } },
|
||||||
|
SystemTab::Backup => rsx! { div { "备份恢复(待实现)" } },
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -12,7 +12,8 @@ use crate::components::frontend_layout::FrontendLayout;
|
|||||||
use crate::context::UserContext;
|
use crate::context::UserContext;
|
||||||
use crate::pages::about::About;
|
use crate::pages::about::About;
|
||||||
use crate::pages::admin::{
|
use crate::pages::admin::{
|
||||||
Admin, AdminComments, AdminCommentsPage, Posts, PostsPage, Trash, TrashPage, Write, WriteEdit,
|
Admin, AdminComments, AdminCommentsPage, Posts, PostsPage, System, Trash, TrashPage, Write,
|
||||||
|
WriteEdit,
|
||||||
};
|
};
|
||||||
use crate::pages::archives::Archives;
|
use crate::pages::archives::Archives;
|
||||||
use crate::pages::home::{Home, HomePage};
|
use crate::pages::home::{Home, HomePage};
|
||||||
@ -90,6 +91,9 @@ pub enum Route {
|
|||||||
/// 回收站分页
|
/// 回收站分页
|
||||||
#[route("/trash/:page")]
|
#[route("/trash/:page")]
|
||||||
TrashPage { page: i32 },
|
TrashPage { page: i32 },
|
||||||
|
/// 系统管理(数据库 + 服务器状态 + SQL 控制台 + 导出 + 备份)
|
||||||
|
#[route("/system")]
|
||||||
|
System {},
|
||||||
#[end_layout]
|
#[end_layout]
|
||||||
#[end_nest]
|
#[end_nest]
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user