34 lines
1.0 KiB
TypeScript
34 lines
1.0 KiB
TypeScript
"use client";
|
|
|
|
import { ASSET_STATS } from "@/app/data/vip.mock";
|
|
import styles from "../vip.module.css";
|
|
|
|
const STAT_ITEMS = [
|
|
{ key: "topics", label: "已解锁模块" },
|
|
{ key: "ebooks", label: "电子书" },
|
|
{ key: "videos", label: "视频" },
|
|
{ key: "templates", label: "模板" },
|
|
] as const;
|
|
|
|
export function UnlockedStats() {
|
|
return (
|
|
<section className={styles.section}>
|
|
<h2 className={styles.sectionTitle}>已解锁</h2>
|
|
<div
|
|
className={`${styles.statsGrid4} animate__animated animate__fadeInUp`}
|
|
style={{ animationDelay: "0.2s", animationFillMode: "both" }}
|
|
>
|
|
{STAT_ITEMS.map(({ key, label }) => {
|
|
const value = String(ASSET_STATS[key as keyof typeof ASSET_STATS]);
|
|
return (
|
|
<div key={key} className={styles.card} style={{ textAlign: "center" }}>
|
|
<div className={styles.bigNumber}>{value}</div>
|
|
<div className={styles.bigNumberLabel}>{label}</div>
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|