improve: date formatting in frontend
This commit is contained in:
parent
328c73c209
commit
0bd1771f35
GPG Key ID:
56209E0CCD8420C6
@ -7,6 +7,7 @@ import { aidExists as idExists } from "@/lib/db/bilibili_metadata/aidExists";
|
||||
import { notFound } from "next/navigation";
|
||||
import { BiliVideoMetadataType, VideoSnapshotType } from "@cvsa/core";
|
||||
import { Metadata } from "next";
|
||||
import { DateTime } from "luxon";
|
||||
|
||||
const MetadataRow = ({ title, desc }: { title: string; desc: string | number | undefined | null }) => {
|
||||
if (!desc) return <></>;
|
||||
@ -104,18 +105,16 @@ export default async function VideoInfoPage({ params }: { params: Promise<{ id:
|
||||
title="发布时间"
|
||||
desc={
|
||||
videoInfo.published_at
|
||||
? format(new Date(videoInfo.published_at), "yyyy-MM-dd HH:mm:ss", {
|
||||
locale: zhCN
|
||||
})
|
||||
? DateTime.fromJSDate(videoInfo.published_at).toFormat(
|
||||
"yyyy-MM-dd HH:mm:ss"
|
||||
)
|
||||
: null
|
||||
}
|
||||
/>
|
||||
<MetadataRow title="时长 (秒)" desc={videoInfo.duration} />
|
||||
<MetadataRow
|
||||
title="创建时间"
|
||||
desc={format(new Date(videoInfo.created_at), "yyyy-MM-dd HH:mm:ss", {
|
||||
locale: zhCN
|
||||
})}
|
||||
desc={DateTime.fromJSDate(videoInfo.created_at).toFormat("yyyy-MM-dd HH:mm:ss")}
|
||||
/>
|
||||
<MetadataRow title="封面" desc={videoInfo?.cover_url} />
|
||||
</tbody>
|
||||
@ -142,11 +141,11 @@ export default async function VideoInfoPage({ params }: { params: Promise<{ id:
|
||||
</thead>
|
||||
<tbody>
|
||||
{snapshots.map((snapshot) => (
|
||||
<tr key={snapshot.created_at}>
|
||||
<tr key={snapshot.id}>
|
||||
<td className="border dark:border-zinc-500 px-4 py-2">
|
||||
{format(new Date(snapshot.created_at), "yyyy-MM-dd HH:mm:ss", {
|
||||
locale: zhCN
|
||||
})}
|
||||
{DateTime.fromJSDate(snapshot.created_at).toFormat(
|
||||
"yyyy-MM-dd HH:mm:ss"
|
||||
)}
|
||||
</td>
|
||||
<td className="border dark:border-zinc-500 px-4 py-2">{snapshot.views}</td>
|
||||
<td className="border dark:border-zinc-500 px-4 py-2">{snapshot.coins}</td>
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import { Suspense } from "react";
|
||||
import Link from "next/link";
|
||||
import { format } from "date-fns";
|
||||
import { notFound } from "next/navigation";
|
||||
import { Metadata } from "next";
|
||||
import type { VideoInfoData } from "@cvsa/core";
|
||||
import { DateTime } from "luxon";
|
||||
|
||||
const StatRow = ({ title, description }: { title: string; description?: number }) => {
|
||||
return (
|
||||
@ -51,7 +51,7 @@ const VideoInfo = async ({ id }: { id: string }) => {
|
||||
{data.bvid} · av{data.aid}
|
||||
</span>
|
||||
<br />
|
||||
<span>发布于 {format(new Date(data.pubdate * 1000), "yyyy-MM-dd HH:mm:ss")}</span>
|
||||
<span>发布于 {DateTime.fromSeconds(data.pubdate).toFormat("yyyy-MM-dd HH:mm:ss")}</span>
|
||||
<br />
|
||||
<span>播放：{(data.stat?.view ?? 0).toLocaleString()}</span> ·{" "}
|
||||
<span>弹幕：{(data.stat?.danmaku ?? 0).toLocaleString()}</span>
|
||||
|
||||
@ -9,6 +9,7 @@
|
||||
"@mdx-js/loader": "^3.1.0",
|
||||
"@mdx-js/react": "^3.1.0",
|
||||
"@next/mdx": "^15.3.3",
|
||||
"@types/luxon": "^3.6.2",
|
||||
"@types/mdx": "^2.0.13",
|
||||
"axios": "^1.9.0",
|
||||
"date-fns": "^4.1.0",
|
||||
@ -16,6 +17,7 @@
|
||||
"fumadocs-mdx": "^11.6.6",
|
||||
"i18next": "^25.2.1",
|
||||
"jotai": "^2.12.5",
|
||||
"luxon": "^3.6.1",
|
||||
"next": "^15.3.3",
|
||||
"next-intl": "^4.1.0",
|
||||
"raw-loader": "^4.0.2",
|
||||
@ -275,6 +277,8 @@
|
||||
|
||||
"@types/json-schema": ["@types/json-schema@7.0.15", "", {}, "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA=="],
|
||||
|
||||
"@types/luxon": ["@types/luxon@3.6.2", "", {}, "sha512-R/BdP7OxEMc44l2Ex5lSXHoIXTB2JLNa3y2QISIbr58U/YcsffyQrYW//hZSdrfxrjRZj3GcUoxMPGdO8gSYuw=="],
|
||||
|
||||
"@types/mdast": ["@types/mdast@4.0.4", "", { "dependencies": { "@types/unist": "*" } }, "sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA=="],
|
||||
|
||||
"@types/mdx": ["@types/mdx@2.0.13", "", {}, "sha512-+OWZQfAYyio6YkJb3HLxDrvnx6SWWDbC0zVPfBRzUk0/nqoDyf6dNxQi3eArPe8rJ473nobTMQ/8Zk+LxJ+Yuw=="],
|
||||
@ -763,6 +767,8 @@
|
||||
|
||||
"lru-cache": ["lru-cache@11.1.0", "", {}, "sha512-QIXZUBJUx+2zHUdQujWejBkcD9+cs94tLn0+YL8UrCh+D5sCXZ4c7LaEH48pNwRY3MLDgqUFyhlCyjJPf1WP0A=="],
|
||||
|
||||
"luxon": ["luxon@3.6.1", "", {}, "sha512-tJLxrKJhO2ukZ5z0gyjY1zPh3Rh88Ej9P7jNrZiHMUXHae1yvI2imgOZtL1TO8TW6biMMKfTtAOoEJANgtWBMQ=="],
|
||||
|
||||
"magic-string": ["magic-string@0.30.17", "", { "dependencies": { "@jridgewell/sourcemap-codec": "^1.5.0" } }, "sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA=="],
|
||||
|
||||
"markdown-extensions": ["markdown-extensions@2.0.0", "", {}, "sha512-o5vL7aDWatOTX8LzaS1WMoaoxIiLRQJuIKKe2wAw6IeULDHaqbiqiggmx+pKvZDb1Sj+pE46Sn1T7lCqfFtg1Q=="],
|
||||
|
||||
@ -15,6 +15,7 @@
|
||||
"@mdx-js/loader": "^3.1.0",
|
||||
"@mdx-js/react": "^3.1.0",
|
||||
"@next/mdx": "^15.3.3",
|
||||
"@types/luxon": "^3.6.2",
|
||||
"@types/mdx": "^2.0.13",
|
||||
"axios": "^1.9.0",
|
||||
"date-fns": "^4.1.0",
|
||||
@ -22,6 +23,7 @@
|
||||
"fumadocs-mdx": "^11.6.6",
|
||||
"i18next": "^25.2.1",
|
||||
"jotai": "^2.12.5",
|
||||
"luxon": "^3.6.1",
|
||||
"next": "^15.3.3",
|
||||
"next-intl": "^4.1.0",
|
||||
"raw-loader": "^4.0.2",
|
||||
|
||||
Loading…
Reference in New Issue
Block a user