commit df48f961ff985acffc4d3f63b3ecbbd2660ac2b5
author 22301009 <22301009@bjtu.edu.cn> Thu Jun 05 13:40:44 2025 +0800
committer 22301009 <22301009@bjtu.edu.cn> Thu Jun 05 13:40:44 2025 +0800
tree e93401f2a8dc02fb67a55d2b4844c39c23e1da7d
parent 6401163088836f712c55616dc04fa92dd8fed037

fix-img

Change-Id: Ida77fc6aed06b28e41e2abcb6ae09d5f63d016f2

src/pages/PublishSeed/PublishSeed.jsx

diff --git a/src/pages/PublishSeed/PublishSeed.jsx b/src/pages/PublishSeed/PublishSeed.jsx
index e3be08c..f27ebc2 100644
--- a/src/pages/PublishSeed/PublishSeed.jsx
+++ b/src/pages/PublishSeed/PublishSeed.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState, useRef } from 'react';
 import axios from 'axios';
 import Header from '../../components/Header';
 import './PublishSeed.css';
@@ -9,23 +9,36 @@
   const [description, setDescription] = useState('');
   const [tags, setTags] = useState([]);
   const [category, setCategory] = useState('movie');
-  const [file, setFile] = useState(null);
   const [imageUrl, setImageUrl] = useState('');
   const [message, setMessage] = useState('');
   const [isLoading, setIsLoading] = useState(false);
+  const [fileName, setFileName] = useState('');
 
-  const { user } = useUser(); // 从上下文中获取当前登录用户信息
+  const fileInputRef = useRef(null); // ✅ 获取 input file 引用
+  const { user } = useUser();
 
   const handleTagsChange = (e) => {
     setTags(e.target.value.split(',').map(tag => tag.trim()));
   };
 
+  const handleFileButtonClick = () => {
+    fileInputRef.current?.click(); // 点击隐藏的 input
+  };
+
   const handleFileChange = (e) => {
-    setFile(e.target.files[0]);
+    const selectedFile = e.target.files[0];
+    if (selectedFile) {
+      setFileName(selectedFile.name); // 仅展示文件名
+    }
   };
 
   const handleSubmit = async (e) => {
     e.preventDefault();
+    console.log('[handleSubmit] 表单提交开始');
+
+    const currentFile = fileInputRef.current?.files[0]; // ✅ 获取文件
+    console.log('[handleSubmit] currentFile:', currentFile);
+
     setIsLoading(true);
     setMessage('');
 
@@ -35,20 +48,20 @@
       return;
     }
 
-    if (!file || !file.name.endsWith('.torrent')) {
+    if (!currentFile || !currentFile.name.toLowerCase().endsWith('.torrent')) {
       setMessage('请上传一个 .torrent 文件');
       setIsLoading(false);
       return;
     }
 
     const formData = new FormData();
-    formData.append('file', file); // 文件字段
+    formData.append('file', currentFile);
     formData.append('title', title);
     formData.append('description', description);
     formData.append('category', category);
     formData.append('imageUrl', imageUrl);
-    formData.append('tags', tags.join(',')); // 后端使用字符串或数组自行处理
-    formData.append('uploader', user.id); // 添加上传者 ID（必须字段）
+    formData.append('tags', tags.join(','));
+    formData.append('uploader', user.id);
 
     try {
       const response = await axios.post('/seeds/upload', formData, {
@@ -63,7 +76,7 @@
         setMessage(response.data.msg || '上传失败，请稍后再试');
       }
     } catch (error) {
-      console.error(error);
+      console.error('[handleSubmit] 上传失败:', error);
       setMessage('上传失败，发生了错误');
     } finally {
       setIsLoading(false);
@@ -121,16 +134,17 @@
 
           <div className="seed-file">
             <label>种子文件</label>
-            <label className="seed-file-label">
+            <div className="seed-file-label" onClick={handleFileButtonClick}>
               点击选择文件
-              <input
-                type="file"
-                accept=".torrent"
-                onChange={handleFileChange}
-                style={{ display: 'none' }}
-              />
-            </label>
-            {file && <div style={{ marginTop: '5px' }}>{file.name}</div>}
+            </div>
+            <input
+              type="file"
+              accept=".torrent"
+              ref={fileInputRef}
+              onChange={handleFileChange}
+              style={{ display: 'none' }}
+            />
+            {fileName && <div style={{ marginTop: '5px' }}>{fileName}</div>}
           </div>
 
           <div className="form-group">