Skip to content

Commit 367c171

Browse files
martinwq997martinwq997
authored
dependencies page (#162)
1 parent 9c8a66d commit 367c171

File tree

9 files changed

+372
-131
lines changed

9 files changed

+372
-131
lines changed

‎app/[nsfront]/[nsbehind]/[name]/[version]/dependencies/page.tsx‎

Lines changed: 58 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"use client";
33
import React, { useEffect, useState } from "react";
44
import { useParams } from "next/navigation";
5-
5+
import Image from "next/image";
66
import DependencyTable from "@/components/DependencyTable";
77
// import DependencyGraph from "@/components/DependencyGraph"; // 假设你已经创建了 DependencyGraph 组件
88
import { dependenciesInfo } from "@/app/lib/all_interface";
@@ -17,7 +17,7 @@ const CratePage = () => {
1717
const [error, setError] = useState<string | null>(null);
1818

1919
// 新增状态：控制显示 DependencyTable 或 DependencyGraph
20-
const [showTable, setShowTable] = useState(true);
20+
// const [showTable, setShowTable] = useState(true);
2121

2222
useEffect(() => {
2323
const fetchCrateData = async () => {
@@ -44,22 +44,67 @@ const CratePage = () => {
4444
fetchCrateData(); // 调用函数来获取数据
4545
}, [params.name, params.version, params.nsfront, params.nsbehind]); // 依赖项数组，确保在 crateName 或 version 改变时重新获取数据
4646

47-
if (loading) return <div>Loading...</div>;
48-
if (error) return <div className="text-red-500">Error: {error}</div>;
47+
if (loading) return <div className="flex justify-center items-center min-h-screen">Loading...</div>;
48+
if (error) return <div className="flex justify-center items-center min-h-screen text-red-500">Error: {error}</div>;
4949

5050
return (
51-
<div className="container mx-auto p-4">
51+
<div className="min-h-screen bg-white flex flex-col">
52+
<div className="flex justify-center w-full py-8">
53+
<div className="w-[1500px] px-8">
54+
<DependencyTable data={results?.data} />
55+
</div>
56+
</div>
57+
58+
{/* 页脚 */}
59+
<footer className="bg-[#002851] text-white py-12 mt-auto">
60+
<div className="flex justify-center w-full">
61+
<div className="w-[1500px] px-8">
62+
<div className="grid grid-cols-1 md:grid-cols-4 gap-8">
63+
<div>
64+
<Image
65+
src="/images/homepage/logo-footer.png"
66+
alt="CratesPro Logo"
67+
width={180}
68+
height={60}
69+
className="mb-4"
70+
/>
71+
</div>
72+
73+
<div>
74+
<h4 className="text-lg font-semibold mb-4">Resources</h4>
75+
<ul className="space-y-2">
76+
<li><Link href="#" className="hover:text-blue-300">Documentation</Link></li>
77+
<li><Link href="#" className="hover:text-blue-300">About</Link></li>
78+
<li><Link href="#" className="hover:text-blue-300">Blog</Link></li>
79+
<li><Link href="#" className="hover:text-blue-300">FAQ</Link></li>
80+
</ul>
81+
</div>
5282

53-
{/* 切换按钮 */}
54-
<Link
55-
onClick={() => setShowTable(!showTable)} // 切换状态
56-
className="mb-4 px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600"
57-
href={`/${params.nsfront}/${params.nsbehind}/${params.name}/${params.version}/dependencies/graph`} >
58-
{showTable ? "Show Graph" : "Show Table"}
59-
</Link>
83+
<div>
84+
<h4 className="text-lg font-semibold mb-4">API</h4>
85+
<ul className="space-y-2">
86+
<li><Link href="#" className="hover:text-blue-300">API</Link></li>
87+
<li><Link href="#" className="hover:text-blue-300">BigQuery Dataset</Link></li>
88+
<li><Link href="#" className="hover:text-blue-300">GitHub</Link></li>
89+
</ul>
90+
</div>
6091

61-
<DependencyTable data={results?.data} />
92+
<div>
93+
<h4 className="text-lg font-semibold mb-4">Legal</h4>
94+
<ul className="space-y-2">
95+
<li><Link href="#" className="hover:text-blue-300">Legal</Link></li>
96+
<li><Link href="#" className="hover:text-blue-300">Privacy</Link></li>
97+
<li><Link href="#" className="hover:text-blue-300">Terms</Link></li>
98+
</ul>
99+
</div>
100+
</div>
62101

102+
<div className="border-t border-gray-700 mt-8 pt-8 text-center text-sm">
103+
<p>Copyright © 2023 jp21.com.cn All Rights Reserved(@ICPBH180237号)</p>
104+
</div>
105+
</div>
106+
</div>
107+
</footer>
63108
</div>
64109
);
65110
};

‎app/[nsfront]/[nsbehind]/[name]/[version]/page.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -272,8 +272,8 @@ const CratePage = () => {
272272
<Image
273273
src="/images/homepage/miss.png"
274274
alt="No vulnerabilities"
275-
width={192}
276-
height={192}
275+
width={140}
276+
height={140}
277277
className="mb-1"
278278
/>
279279
<p className="text-[#C9D2FF] font-['HarmonyOS_Sans_SC'] text-[14px] font-normal leading-normal capitalize">No vulnerabilities found</p>

‎components/CrateNav.tsx‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -60,9 +60,13 @@ const CrateNav: React.FC<CrateNavProps> = ({ nsfront, nsbehind, name, version })
6060

6161
return (
6262
<div>
63-
<NewHeader />
64-
<div className="flex justify-center px-4 py-6">
65-
<div className="w-[1500px] h-[120px] bg-white rounded-2xl shadow-[0_0_12px_0_rgba(43,88,221,0.09)] px-8">
63+
<div className="flex justify-center w-full">
64+
<div className="w-[1500px] px-8">
65+
<NewHeader />
66+
</div>
67+
</div>
68+
<div className="flex justify-center py-6">
69+
<div className="w-[1440px] h-[120px] bg-white rounded-2xl shadow-[0_0_12px_0_rgba(43,88,221,0.09)] px-8">
6670
<div className="flex items-center justify-between h-16">
6771
<div className="flex items-center space-x-4">
6872
<h1 className="text-2xl font-semibold" style={{ color: 'rgb(28, 63, 115)' }}>{name}</h1>

0 commit comments

Comments
 (0)