yggdrasil/components/post/
post_meta.rs

1//! 文章元信息组件
2//!
3//! 展示文章发布日期、阅读时长与字数统计。
4
5use dioxus::prelude::*;
6
7use crate::models::post::Post;
8
9/// 文章元信息组件。
10///
11/// Props：
12/// - `post`：文章数据模型
13///
14/// 日期优先使用发布时间，否则回退到创建时间；每项在窄屏下整体换行。
15#[component]
16pub fn PostMeta(post: Post) -> Element {
17    let date = post.formatted_date();
18
19    rsx! {
20        div { class: "post-meta", role: "group", aria_label: "文章元信息",
21            span { class: "post-meta-item",
22                svg { view_box: "0 0 24 24", fill: "none", stroke: "currentColor", stroke_width: "1.6", stroke_linecap: "round", stroke_linejoin: "round", "aria-hidden": "true",
23                    rect { x: "3", y: "5", width: "18", height: "16", rx: "2" }
24                    path { d: "M16 3v4M8 3v4M3 11h18" }
25                }
26                time { datetime: date.clone(), "{date}" }
27            }
28            span { class: "post-meta-item",
29                svg { view_box: "0 0 24 24", fill: "none", stroke: "currentColor", stroke_width: "1.6", stroke_linecap: "round", stroke_linejoin: "round", "aria-hidden": "true",
30                    circle { cx: "12", cy: "12", r: "9" }
31                    path { d: "M12 7v5l3 2" }
32                }
33                span { strong { "{post.reading_time}" } " 分钟阅读" }
34            }
35            span { class: "post-meta-item",
36                svg { view_box: "0 0 24 24", fill: "none", stroke: "currentColor", stroke_width: "1.6", stroke_linecap: "round", stroke_linejoin: "round", "aria-hidden": "true",
37                    path { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8ZM14 2v6h6M8 13h8M8 17h5" }
38                }
39                span { strong { "{post.word_count}" } " 字" }
40            }
41        }
42    }
43}
yggdrasil/components/post/post_meta.rs

yggdrasil/components/post/
post_meta.rs
