兴趣小组、好友动态
Change-Id: I7aa713600dea31eb2cd5b32ecc4e257b2bbd8be1
diff --git a/src/pages/InterestGroup/CommentForm.jsx b/src/pages/InterestGroup/CommentForm.jsx
new file mode 100644
index 0000000..1d85a0c
--- /dev/null
+++ b/src/pages/InterestGroup/CommentForm.jsx
@@ -0,0 +1,53 @@
+import React, { useState } from 'react';
+import './CommentForm.css';
+
+const CommentForm = ({ onSubmit, onCancel }) => {
+ const [content, setContent] = useState('');
+ const [isFocused, setIsFocused] = useState(false);
+
+ const handleSubmit = (e) => {
+ e.preventDefault();
+ if (content.trim()) {
+ onSubmit(content);
+ setContent('');
+ }
+ };
+
+ return (
+ <div className="comment-form-container">
+ <form className="comment-form" onSubmit={handleSubmit}>
+ <div className={`form-group ${isFocused ? 'focused' : ''}`}>
+ <textarea
+ className="comment-input"
+ placeholder="分享你的想法..."
+ value={content}
+ onChange={(e) => setContent(e.target.value)}
+ onFocus={() => setIsFocused(true)}
+ onBlur={() => setIsFocused(false)}
+ required
+ />
+ <div className="floating-label">添加评论</div>
+ </div>
+
+ <div className="form-actions">
+ <button
+ type="button"
+ className="cancel-button"
+ onClick={onCancel}
+ >
+ 取消
+ </button>
+ <button
+ type="submit"
+ className="submit-button"
+ disabled={!content.trim()}
+ >
+ 发布评论
+ </button>
+ </div>
+ </form>
+ </div>
+ );
+};
+
+export default CommentForm;
\ No newline at end of file