xfy/yggdrasil
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: admin pages use client-only fetching; fix theme cookie parsing; restore custom skeletons

Browse Source
This commit is contained in:
xfy 2026-06-03 14:55:50 +08:00
parent 6cfe664085
commit ccffab851a
5 changed files with 548 additions and 152 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

119
src/pages/admin/dashboard.rs
View File

@ -1,16 +1,37 @@
use dioxus::prelude::*; use dioxus::prelude::*;
use crate::api::posts::{get_post_stats, list_posts, PostListResponse, PostStatsResponse}; use crate::api::posts::{get_post_stats, list_posts, PostListResponse, PostStatsResponse};
use crate::components::suspense_wrapper::SuspenseWrapper; use crate::hooks::delayed_loading::use_delayed_loading;
use crate::models::post::Post; use crate::models::post::Post;
#[component] #[component]
pub fn Admin() -> Element { pub fn Admin() -> Element {
let stats_res = use_resource(get_post_stats);
let posts_res = use_resource(list_posts);
let show_stats_skeleton = use_delayed_loading(move || stats_res.read().is_none());
let show_posts_skeleton = use_delayed_loading(move || posts_res.read().is_none());
rsx! { rsx! {
div { class: "space-y-8", div { class: "space-y-8",
div { class: "grid grid-cols-1 md:grid-cols-3 gap-6", div { class: "grid grid-cols-1 md:grid-cols-3 gap-6",
SuspenseWrapper { match &*stats_res.read() {
StatsSection {} Some(Ok(PostStatsResponse { stats })) => {
rsx! {
StatCard { value: stats.total.to_string(), label: "文章总数" }
StatCard { value: stats.drafts.to_string(), label: "草稿数" }
StatCard { value: stats.published.to_string(), label: "已发布" }
}
}
_ => {
rsx! {
for _ in 0..3 {
div { class: if show_stats_skeleton() { "rounded-xl bg-white dark:bg-[#2e2e33] border border-gray-200 dark:border-[#333] p-6 text-center space-y-3 animate-pulse" } else { "rounded-xl bg-white dark:bg-[#2e2e33] border border-gray-200 dark:border-[#333] p-6 text-center space-y-3 opacity-0" },
div { class: "h-9 w-16 mx-auto bg-gray-200 dark:bg-[#2a2a2a] rounded" }
div { class: "h-4 w-20 mx-auto bg-gray-200 dark:bg-[#2a2a2a] rounded" }
}
}
}
}
} }
} }
@ -35,78 +56,28 @@ pub fn Admin() -> Element {
h2 { class: "text-xl font-bold text-gray-900 dark:text-[#dadadb] mb-4", h2 { class: "text-xl font-bold text-gray-900 dark:text-[#dadadb] mb-4",
"最近文章" "最近文章"
} }
SuspenseWrapper { match &*posts_res.read() {
RecentPostsSection {} Some(Ok(PostListResponse { posts })) => {
} rsx! {
} div { class: "space-y-0",
} for post in posts.iter().take(5) {
} RecentPostItem { post: post.clone() }
} }
}
#[component] }
fn StatsSection() -> Element { }
let stats_res = use_server_future(get_post_stats)?; _ => {
rsx! {
let stats_data = stats_res.read().as_ref().map(|r| match r { div { class: if show_posts_skeleton() { "space-y-4 animate-pulse" } else { "space-y-4 opacity-0" },
Ok(PostStatsResponse { stats }) => Ok(stats.clone()), for _ in 0..5 {
Err(_) => Err(()), div { class: "flex justify-between items-center py-3 border-b border-gray-100 dark:border-[#333]",
}); div { class: "h-4 w-[45%] bg-gray-200 dark:bg-[#2a2a2a] rounded" }
div { class: "h-3 w-20 bg-gray-200 dark:bg-[#2a2a2a] rounded" }
match stats_data { }
Some(Ok(stats)) => { }
rsx! { }
StatCard { value: stats.total.to_string(), label: "文章总数" } }
StatCard { value: stats.drafts.to_string(), label: "草稿数" }
StatCard { value: stats.published.to_string(), label: "已发布" }
}
}
Some(Err(_)) => {
rsx! {
div { class: "col-span-3 text-center text-red-500 dark:text-red-400 py-6",
"加载统计失败"
}
}
}
_ => {
rsx! {
div { class: "col-span-3 text-center text-gray-500 dark:text-[#9b9c9d] py-6",
"加载中..."
}
}
}
}
}
#[component]
fn RecentPostsSection() -> Element {
let posts_res = use_server_future(list_posts)?;
let posts_data = posts_res.read().as_ref().map(|r| match r {
Ok(PostListResponse { posts }) => Ok(posts.clone()),
Err(_) => Err(()),
});
match posts_data {
Some(Ok(posts)) => {
rsx! {
div { class: "space-y-0",
for post in posts.iter().take(5) {
RecentPostItem { post: post.clone() }
} }
}
}
}
Some(Err(_)) => {
rsx! {
div { class: "text-center text-red-500 dark:text-red-400 py-6",
"加载文章列表失败"
}
}
}
_ => {
rsx! {
div { class: "text-center text-gray-500 dark:text-[#9b9c9d] py-6",
"加载中..."
} }
} }
} }

139
src/pages/admin/posts.rs
View File

@ -1,11 +1,15 @@
use dioxus::prelude::*; use dioxus::prelude::*;
use crate::api::posts::{delete_post, list_posts, CreatePostResponse, PostListResponse}; use crate::api::posts::{delete_post, list_posts, CreatePostResponse, PostListResponse};
use crate::components::suspense_wrapper::SuspenseWrapper; use crate::hooks::delayed_loading::use_delayed_loading;
use crate::models::post::{Post, PostStatus}; use crate::models::post::{Post, PostStatus};
#[component] #[component]
pub fn Posts() -> Element { pub fn Posts() -> Element {
let mut posts_res = use_resource(list_posts);
let mut deleting = use_signal(|| None::<i32>);
let show_skeleton = use_delayed_loading(move || posts_res.read().is_none());
rsx! { rsx! {
div { class: "space-y-6", div { class: "space-y-6",
div { class: "flex items-center justify-between", div { class: "flex items-center justify-between",
@ -20,70 +24,52 @@ pub fn Posts() -> Element {
"+ 写文章" "+ 写文章"
} }
} }
SuspenseWrapper {
PostsTable {}
}
}
}
}
#[component] match &*posts_res.read() {
fn PostsTable() -> Element { Some(Ok(PostListResponse { posts })) => {
let mut refresh = use_signal(|| 0); if posts.is_empty() {
let mut deleting = use_signal(|| None::<i32>); rsx! {
let posts_res = use_server_future(move || { div { class: "text-center py-20 text-gray-500 dark:text-[#9b9c9d]",
let _ = refresh(); "暂无文章"
list_posts()
})?;
let posts_data = posts_res.read().as_ref().map(|r| match r {
Ok(PostListResponse { posts }) => Ok(posts.clone()),
Err(e) => Err(e.to_string()),
});
match posts_data {
Some(Ok(posts)) => {
if posts.is_empty() {
rsx! {
div { class: "text-center py-20 text-gray-500 dark:text-[#9b9c9d]",
"暂无文章"
}
}
} else {
rsx! {
div { class: "bg-white dark:bg-[#2e2e33] rounded-xl border border-gray-200 dark:border-[#333] overflow-hidden",
table { class: "w-full text-sm",
thead {
tr { class: "border-b border-gray-200 dark:border-[#333] text-left text-gray-500 dark:text-[#9b9c9d]",
th { class: "px-4 py-3 font-medium", "标题" }
th { class: "px-4 py-3 font-medium w-24 text-center", "状态" }
th { class: "px-4 py-3 font-medium w-32", "日期" }
th { class: "px-4 py-3 font-medium w-24 text-right", "操作" }
}
} }
tbody { }
for post in posts.iter() { } else {
PostRow { rsx! {
post: post.clone(), div { class: "bg-white dark:bg-[#2e2e33] rounded-xl border border-gray-200 dark:border-[#333] overflow-hidden",
deleting: deleting() == Some(post.id), table { class: "w-full text-sm",
on_delete: move |id| { thead {
deleting.set(Some(id)); tr { class: "border-b border-gray-200 dark:border-[#333] text-left text-gray-500 dark:text-[#9b9c9d]",
spawn(async move { th { class: "px-4 py-3 font-medium", "标题" }
match delete_post(id).await { th { class: "px-4 py-3 font-medium w-24 text-center", "状态" }
Ok(CreatePostResponse { success: true, .. }) => { th { class: "px-4 py-3 font-medium w-32", "日期" }
refresh.set(refresh() + 1); th { class: "px-4 py-3 font-medium w-24 text-right", "操作" }
} }
Ok(CreatePostResponse { success: false, message, .. }) => { }
#[cfg(target_arch = "wasm32")] tbody {
web_sys::window().map(|w| w.alert_with_message(&message).ok()); for post in posts.iter() {
} PostRow {
Err(e) => { post: post.clone(),
#[cfg(target_arch = "wasm32")] deleting: deleting() == Some(post.id),
web_sys::window().map(|w| w.alert_with_message(&format!("删除失败: {}", e)).ok()); on_delete: move |id| {
} deleting.set(Some(id));
spawn(async move {
match delete_post(id).await {
Ok(CreatePostResponse { success: true, .. }) => {
posts_res.restart();
}
Ok(CreatePostResponse { success: false, message, .. }) => {
#[cfg(target_arch = "wasm32")]
web_sys::window().map(|w| w.alert_with_message(&message).ok());
}
Err(_e) => {
#[cfg(target_arch = "wasm32")]
web_sys::window().map(|w| w.alert_with_message("删除失败").ok());
}
}
deleting.set(None);
});
} }
deleting.set(None); }
});
} }
} }
} }
@ -91,19 +77,24 @@ fn PostsTable() -> Element {
} }
} }
} }
} Some(Err(_e)) => {
} rsx! {
Some(Err(e)) => { div { class: "text-center text-red-500 dark:text-red-400 py-20",
rsx! { "加载失败"
div { class: "text-center text-red-500 dark:text-red-400 py-20", }
"加载失败: {e}" }
} }
} None => {
} rsx! {
_ => { div { class: if show_skeleton() { "bg-white dark:bg-[#2e2e33] rounded-xl border border-gray-200 dark:border-[#333] animate-pulse" } else { "bg-white dark:bg-[#2e2e33] rounded-xl border border-gray-200 dark:border-[#333] opacity-0" },
rsx! { for _ in 0..5 {
div { class: "text-center text-gray-500 dark:text-[#9b9c9d] py-20", div { class: "flex items-center px-4 py-3 border-b border-gray-100 dark:border-[#333] last:border-0",
"加载中..." div { class: "h-4 w-1/3 bg-gray-200 dark:bg-[#2a2a2a] rounded" }
div { class: "ml-auto h-4 w-16 bg-gray-200 dark:bg-[#2a2a2a] rounded" }
}
}
}
}
} }
} }
} }

13
src/theme.rs
View File

@ -46,11 +46,16 @@ fn detect_initial_theme() -> Theme {
#[cfg(feature = "server")] #[cfg(feature = "server")]
{ {
if let Some(ctx) = dioxus::fullstack::FullstackContext::current() { if let Some(ctx) = dioxus::fullstack::FullstackContext::current() {
let parts = ctx.parts_mut(); if let Some(cookie) = ctx.parts_mut().headers.get("cookie") {
if let Some(cookie) = parts.headers.get("cookie") {
if let Ok(cookie_str) = cookie.to_str() { if let Ok(cookie_str) = cookie.to_str() {
if cookie_str.contains("theme=dark") { // Parse cookies properly: split by ';' then by '='
return Theme::Dark; for cookie_pair in cookie_str.split(';') {
let mut parts = cookie_pair.trim().splitn(2, '=');
if let (Some(name), Some(value)) = (parts.next(), parts.next()) {
if name == "theme" && value == "dark" {
return Theme::Dark;
}
}
} }
} }
} }

208
static/index/6a1fccc1.html Normal file
View File

File diff suppressed because one or more lines are too long

221
static/post/test-papermod/index/6a1fcf68.html Normal file
View File

File diff suppressed because one or more lines are too long