yintai-company-home/src/pages/Others/SiteMap.tsx

70 lines
3.2 KiB
TypeScript

import Banner, { type BannerConfig } from "@/components/Banner";
import Section from "@/components/layout/Section";
import styles from "./SiteMap.module.css";
import { Link } from "react-router-dom";
import { useStore } from "@/store";
export default function SiteMap() {
const appConfig = useStore((s) => s.appConfig);
const data = appConfig?.others?.siteMap;
if (!data) return null;
const banner = data.banner;
const section1Data = data.section1Data;
const items = section1Data?.items ?? [];
const title = section1Data?.title ?? "网站地图";
return (
<div>
<Banner
title={banner?.title ?? ""}
content={(banner as BannerConfig)?.content}
titleSize={(banner as BannerConfig)?.titleSize ?? "large"}
showBreadcrumb={banner?.showBreadcrumb ?? false}
backgroundImage={banner?.backgroundImage ?? "/images/bg-overview.png"}
/>
<Section background="" maskBackground="#fff">
<div className={styles.siteMap}>
<div className={styles.siteMapTitle}>{title}</div>
<div className={styles.siteMapItems}>
{items.map((item) => (
<div className={styles.siteMapItem} key={item.label}>
<div className={styles.siteMapItemLabel}>{item.label}</div>
<div className={styles.siteMapItemChildren}>
{item.children?.map((child: { path: string; label: string; children?: { path: string; label: string }[] }) => (
<div
className={styles.siteMapItemChild}
key={child.label}
>
<Link
to={child.path}
className={styles.siteMapItemChildLabel}
>
{child.label}
</Link>
<div className={styles.siteMapItemChildChildren}>
{child.children?.map((childChild) => (
<Link
to={childChild.path}
className={styles.siteMapItemChildChild}
key={childChild.label}
>
{childChild.label}
</Link>
))}
</div>
</div>
))}
</div>
</div>
))}
</div>
</div>
</Section>
</div>
);
}