新增种子收藏和种子促销,首页推荐显示
Change-Id: Ia8632b7909845230a0becf1616dc647e0c7e292b
diff --git a/front/src/TorrentDetailPage.js b/front/src/TorrentDetailPage.js
index cc2dd24..ab34d98 100644
--- a/front/src/TorrentDetailPage.js
+++ b/front/src/TorrentDetailPage.js
@@ -10,12 +10,13 @@
const [error, setError] = React.useState(null);
// 假设你从某个地方获取了 userId(例如登录状态、localStorage 等)
const [userId] = React.useState('user1550e8400-e29b-41d4-a716-44665544000023'); // 替换为实际的用户 ID
+ const [isFavorite, setIsFavorite] = React.useState(false); // 收藏状态
const handleClick = () => {
// 构造下载 URL,包含 userId 和 torrentId 参数
console.log(torrentId)
const downloadUrl = `${API_BASE_URL}/api/get-torrent?userId=${encodeURIComponent(userId)}&torrentId=${encodeURIComponent(torrentId)}`;
-
+
// 发起 GET 请求下载文件
fetch(downloadUrl)
.then(response => {
@@ -41,6 +42,11 @@
});
};
+ // 收藏按钮示例逻辑(仅前端切换)
+ const handleFavorite = () => {
+ setIsFavorite(fav => !fav);
+ };
+
React.useEffect(() => {
setLoading(true);
setError(null);
@@ -64,24 +70,65 @@
if (!detail) return <div className="container"><h1>未找到详情</h1></div>;
return (
- <div className="container">
- <h1>种子详情页</h1>
- <h2 style={{ fontSize: 'inherit', fontWeight: 'normal', textAlign: 'left' }}>标题: {detail.title || `种子${torrentId}`}</h2>
- <p style={{ fontSize: 'inherit', textAlign: 'left' }}>简介: {detail.description || `这是种子${torrentId}的详细信息。`}</p>
- <div style={{ textAlign: 'center', marginTop: '20px' }}>
- <button
- style={{
- padding: '10px 20px',
- fontSize: '16px',
- cursor: 'pointer',
- backgroundColor: '#d3f0ff',
- border: 'none',
- borderRadius: '4px'
- }}
- onClick={handleClick}
- >
- 下载
- </button>
+ <div className="container" style={{ display: "flex", justifyContent: "center", alignItems: "center", minHeight: "100vh" }}>
+ <div
+ style={{
+ background: "#fff",
+ borderRadius: 16,
+ boxShadow: "0 4px 24px #e0e7ff",
+ padding: "36px 48px",
+ maxWidth: 540,
+ width: "100%",
+ marginTop: 48,
+ }}
+ >
+ <h1 style={{ color: "#1976d2", fontWeight: 700, marginBottom: 24, fontSize: 28, letterSpacing: 1 }}>种子详情页</h1>
+ <div style={{ marginBottom: 18 }}>
+ <div style={{ fontSize: 20, fontWeight: 600, marginBottom: 8, color: "#222" }}>
+ 标题:{detail.title || `种子${torrentId}`}
+ </div>
+ <div style={{ fontSize: 16, color: "#555", marginBottom: 8 }}>
+ 简介:{detail.description || `这是种子${torrentId}的详细信息。`}
+ </div>
+ </div>
+ <div style={{ display: "flex", gap: 24, marginTop: 32, justifyContent: "center" }}>
+ <button
+ style={{
+ padding: "10px 32px",
+ fontSize: "16px",
+ cursor: "pointer",
+ background: "linear-gradient(90deg, #42a5f5 0%, #1976d2 100%)",
+ color: "#fff",
+ border: "none",
+ borderRadius: "8px",
+ fontWeight: 600,
+ boxShadow: "0 2px 8px #b2d8ea",
+ transition: "background 0.2s",
+ }}
+ onClick={handleClick}
+ >
+ 下载
+ </button>
+ <button
+ style={{
+ padding: "10px 32px",
+ fontSize: "16px",
+ cursor: "pointer",
+ background: isFavorite
+ ? "linear-gradient(90deg, #ffb74d 0%, #ff9800 100%)"
+ : "linear-gradient(90deg, #f0f0f0 0%, #bdbdbd 100%)",
+ color: isFavorite ? "#fff" : "#333",
+ border: "none",
+ borderRadius: "8px",
+ fontWeight: 600,
+ boxShadow: isFavorite ? "0 2px 8px #ffe0b2" : "0 2px 8px #e0e7ff",
+ transition: "background 0.2s",
+ }}
+ onClick={handleFavorite}
+ >
+ {isFavorite ? "已收藏" : "收藏"}
+ </button>
+ </div>
</div>
</div>
);