blob: b8add814a6c2048668f2fdf1751465eaa3a00972 [file] [log] [blame]
22301009237217b2025-04-20 15:15:25 +08001
22301009237217b2025-04-20 15:15:25 +08002
3// export default CreatePost;
4
Krishyae71688a2025-04-10 21:25:17 +08005import React, { useState } from 'react';
6import axios from 'axios';
22301009237217b2025-04-20 15:15:25 +08007import './CreatePost.css'; // 如果你打算加样式
Krishyae71688a2025-04-10 21:25:17 +08008
Krishya2283d882025-05-27 22:25:19 +08009
Krishya7ec1dd02025-04-19 15:29:03 +080010
Krishya57cc17b2025-05-26 16:43:34 +080011const CreatePost = ({ user_id }) => {
Krishyae71688a2025-04-10 21:25:17 +080012 const [title, setTitle] = useState('');
13 const [content, setContent] = useState('');
22301009237217b2025-04-20 15:15:25 +080014 const [imageUrl, setImageUrl] = useState('');
15 const [message, setMessage] = useState('');
16 const [error, setError] = useState('');
Krishyae71688a2025-04-10 21:25:17 +080017
18 const handleSubmit = async (e) => {
19 e.preventDefault();
22301009237217b2025-04-20 15:15:25 +080020 setMessage('');
21 setError('');
22
23 if (!title.trim() || !content.trim()) {
24 setError('标题和内容不能为空');
25 return;
26 }
Krishyae71688a2025-04-10 21:25:17 +080027
28 try {
Krishya2283d882025-05-27 22:25:19 +080029 const res = await axios.post(`/echo/forum/posts/${user_id}/createPost`, {
Krishyae71688a2025-04-10 21:25:17 +080030 title,
22301009237217b2025-04-20 15:15:25 +080031 post_content: content,
32 image_url: imageUrl
33 });
Krishyae71688a2025-04-10 21:25:17 +080034
22301009237217b2025-04-20 15:15:25 +080035 setMessage(`发帖成功,帖子ID:${res.data.post_id}`);
36 setTitle('');
37 setContent('');
38 setImageUrl('');
39 } catch (err) {
40 console.error(err);
41 setError(err.response?.data?.error || '发帖失败,请稍后重试');
42 }
Krishyae71688a2025-04-10 21:25:17 +080043 };
44
45 return (
22301009237217b2025-04-20 15:15:25 +080046 <div className="create-post-container">
47 <h2>发表新帖子</h2>
48 <form onSubmit={handleSubmit} className="create-post-form">
49 <div className="form-group">
Krishya57cc17b2025-05-26 16:43:34 +080050 {/* 这里加上htmlFor,并给input加id */}
51 <label htmlFor="title">标题:</label>
Krishyae71688a2025-04-10 21:25:17 +080052 <input
Krishya57cc17b2025-05-26 16:43:34 +080053 id="title" // 加id
Krishyae71688a2025-04-10 21:25:17 +080054 type="text"
55 value={title}
56 onChange={(e) => setTitle(e.target.value)}
22301009237217b2025-04-20 15:15:25 +080057 placeholder="输入帖子标题"
Krishyae71688a2025-04-10 21:25:17 +080058 />
59 </div>
22301009237217b2025-04-20 15:15:25 +080060 <div className="form-group">
Krishya57cc17b2025-05-26 16:43:34 +080061 {/* 同理,内容 */}
62 <label htmlFor="content">内容:</label>
Krishyae71688a2025-04-10 21:25:17 +080063 <textarea
Krishya57cc17b2025-05-26 16:43:34 +080064 id="content" // 加id
Krishyae71688a2025-04-10 21:25:17 +080065 value={content}
66 onChange={(e) => setContent(e.target.value)}
22301009237217b2025-04-20 15:15:25 +080067 placeholder="输入帖子内容"
Krishyae71688a2025-04-10 21:25:17 +080068 />
69 </div>
22301009237217b2025-04-20 15:15:25 +080070 <div className="form-group">
Krishya57cc17b2025-05-26 16:43:34 +080071 {/* 图片链接 */}
72 <label htmlFor="imageUrl">图片链接(可选):</label>
Krishyae71688a2025-04-10 21:25:17 +080073 <input
Krishya57cc17b2025-05-26 16:43:34 +080074 id="imageUrl" // 加id
Krishyae71688a2025-04-10 21:25:17 +080075 type="text"
22301009237217b2025-04-20 15:15:25 +080076 value={imageUrl}
Krishyae71688a2025-04-10 21:25:17 +080077 onChange={(e) => setImageUrl(e.target.value)}
22301009237217b2025-04-20 15:15:25 +080078 placeholder="例如:https://example.com/img.jpg"
Krishyae71688a2025-04-10 21:25:17 +080079 />
80 </div>
81 <button type="submit">发布</button>
82 </form>
22301009237217b2025-04-20 15:15:25 +080083
84 {message && <p className="success-text">{message}</p>}
85 {error && <p className="error-text">{error}</p>}
Krishyae71688a2025-04-10 21:25:17 +080086 </div>
87 );
88};
89
22301009237217b2025-04-20 15:15:25 +080090export default CreatePost;