完成上传下载连接,公告管理与详情页面,求种区页面,轮播图折扣显示,修改部分bug

Change-Id: I86fc294e32911cb3426a8b16f90aca371f975c11
diff --git a/src/components/Administer.jsx b/src/components/Administer.jsx
index 35ae428..0f915e3 100644
--- a/src/components/Administer.jsx
+++ b/src/components/Administer.jsx
@@ -10,6 +10,7 @@
   addDiscount,
   deleteDiscount
 } from '../api/administer';
+import {postAnnouncement, getAnnouncements} from '../api/announcement'; 
 import DatePicker from 'react-datepicker';
 import 'react-datepicker/dist/react-datepicker.css';
 
@@ -22,13 +23,18 @@
   const [searchKey, setSearchKey] = useState('');
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState(null);
+  const [announcements, setAnnouncements] = useState([]); // 存储公告列表
+  const [newAnnouncement, setNewAnnouncement] = useState({
+    title: '',
+    content: ''
+  });
   const [newDiscount, setNewDiscount] = useState({
     name: '',
     discountType: 'FREE'
   });
   const [startDate, setStartDate] = useState(new Date());
   const [endDate, setEndDate] = useState(new Date());
-  const [activeTab, setActiveTab] = useState('users'); // 'users' 或 'discounts'
+  const [activeTab, setActiveTab] = useState('users'); // 'users' 或 'discounts','announcements'
 
 const fetchAllUsers = async () => {
   setLoading(true);
@@ -208,15 +214,7 @@
     }
   };
 
-  // 初始化加载数据
-  useEffect(() => {
-    if (activeTab === 'users') {
-      fetchAllUsers();
-    } else {
-      fetchAllDiscounts();
-      fetchCurrentDiscount();
-    }
-  }, [activeTab]);
+  
 
   // 格式化分享率为百分比
   const formatShareRate = (rate) => {
@@ -244,6 +242,54 @@
     }
   };
 
+  // 获取所有公告
+  const fetchAllAnnouncements = async () => {
+  setLoading(true);
+  setError(null);
+  try {
+    const announcements = await getAnnouncements();
+    // 确保总是设置为数组
+    setAnnouncements(Array.isArray(announcements) ? announcements : []);
+  } catch (err) {
+    setError('获取公告列表失败: ' + err.message);
+    console.error(err);
+  } finally {
+    setLoading(false);
+  }
+};
+
+  // 发布新公告
+  const handlePostAnnouncement = async () => {
+    if (!newAnnouncement.title || !newAnnouncement.content) {
+      setError('请填写公告标题和内容');
+      return;
+    }
+
+    try {
+      await postAnnouncement(newAnnouncement);
+      setNewAnnouncement({ title: '', content: '' });
+      fetchAllAnnouncements();
+      setError(null);
+    } catch (err) {
+      setError('发布公告失败: ' + err.message);
+      console.error(err);
+    }
+  };
+
+  // 初始化加载数据
+  useEffect(() => {
+    if (activeTab === 'users') {
+      fetchAllUsers();
+    } else if (activeTab === 'discounts') {
+      fetchAllDiscounts();
+      fetchCurrentDiscount();
+    } else if (activeTab === 'announcements') {
+      fetchAllAnnouncements();
+    }
+  }, [activeTab]);
+
+  
+
 
   return (
     <div className="administer-container">
@@ -263,6 +309,12 @@
         >
           折扣管理
         </button>
+        <button 
+          className={`tab-button ${activeTab === 'announcements' ? 'active' : ''}`}
+          onClick={() => setActiveTab('announcements')}
+        >
+          公告管理
+        </button>
       </div>
 
       {activeTab === 'users' ? (
@@ -335,116 +387,174 @@
                 </table>
             </div>
         </>
-    ) : (
-        /* 新增的折扣管理部分 */
-        <>
-          {/* 当前活动折扣 */}
-          <div className="current-discount-section">
-            <h3>当前活动折扣</h3>
-            {currentDiscount ? (
-              <div className="current-discount-card">
-                <p><strong>名称:</strong> {currentDiscount.name}</p>
-                <p><strong>类型:</strong> {translateDiscountType(currentDiscount.discountType)}</p>
-                <p><strong>时间:</strong> {formatDateTime(currentDiscount.startTime)} 至 {formatDateTime(currentDiscount.endTime)}</p>
-                <p><strong>状态:</strong> {currentDiscount.status}</p>
-              </div>
-            ) : (
-              <p>当前没有进行中的折扣</p>
-            )}
-          </div>
+      ) : activeTab === 'discounts' ? (
+          /* 新增的折扣管理部分 */
+          <>
+            {/* 当前活动折扣 */}
+            <div className="current-discount-section">
+              <h3>当前活动折扣</h3>
+              {currentDiscount ? (
+                <div className="current-discount-card">
+                  <p><strong>名称:</strong> {currentDiscount.name}</p>
+                  <p><strong>类型:</strong> {translateDiscountType(currentDiscount.discountType)}</p>
+                  <p><strong>时间:</strong> {formatDateTime(currentDiscount.startTime)} 至 {formatDateTime(currentDiscount.endTime)}</p>
+                  <p><strong>状态:</strong> {currentDiscount.status}</p>
+                </div>
+              ) : (
+                <p>当前没有进行中的折扣</p>
+              )}
+            </div>
 
-          {/* 添加新折扣表单 */}
-          <div className="add-discount-form">
-            <h3>添加新折扣</h3>
-            <div className="form-group">
-              <label>折扣名称:</label>
-              <input
-                type="text"
-                value={newDiscount.name}
-                onChange={(e) => setNewDiscount({...newDiscount, name: e.target.value})}
-              />
-            </div>
-            <div className="form-group">
-                <label>开始时间:</label>
-                <DatePicker
-                  selected={startDate}
-                  onChange={(date) => setStartDate(date)}
-                  showTimeSelect
-                  timeFormat="HH:mm"
-                  timeIntervals={1} // 1分钟间隔
-                  dateFormat="yyyy-MM-dd HH:mm"
-                  minDate={new Date()}
-                  placeholderText="选择开始日期和时间"
+            {/* 添加新折扣表单 */}
+            <div className="add-discount-form">
+              <h3>添加新折扣</h3>
+              <div className="form-group">
+                <label>折扣名称:</label>
+                <input
+                  type="text"
+                  value={newDiscount.name}
+                  onChange={(e) => setNewDiscount({...newDiscount, name: e.target.value})}
                 />
-            </div>
-            <div className="form-group">
-                  <label>结束时间:</label>
+              </div>
+              <div className="form-group">
+                  <label>开始时间:</label>
                   <DatePicker
-                    selected={endDate}
-                    onChange={(date) => setEndDate(date)}
+                    selected={startDate}
+                    onChange={(date) => setStartDate(date)}
                     showTimeSelect
                     timeFormat="HH:mm"
                     timeIntervals={1} // 1分钟间隔
                     dateFormat="yyyy-MM-dd HH:mm"
-                    minDate={startDate}
-                    placeholderText="选择结束日期和时间"
+                    minDate={new Date()}
+                    placeholderText="选择开始日期和时间"
                   />
+              </div>
+              <div className="form-group">
+                    <label>结束时间:</label>
+                    <DatePicker
+                      selected={endDate}
+                      onChange={(date) => setEndDate(date)}
+                      showTimeSelect
+                      timeFormat="HH:mm"
+                      timeIntervals={1} // 1分钟间隔
+                      dateFormat="yyyy-MM-dd HH:mm"
+                      minDate={startDate}
+                      placeholderText="选择结束日期和时间"
+                    />
+              </div>
+              <div className="form-group">
+                <label>折扣类型:</label>
+                <select
+                  value={newDiscount.discountType}
+                  onChange={(e) => setNewDiscount({...newDiscount, discountType: e.target.value})}
+                >
+                  <option value="FREE">全部免费</option>
+                  <option value="HALF">半价下载</option>
+                  <option value="DOUBLE">双倍上传</option>
+                </select>
+              </div>
+              <button 
+                  onClick={(e) => {
+                      e.preventDefault(); // 确保没有阻止默认行为
+                      handleAddDiscount();
+                  }}
+                  >
+                  添加折扣
+              </button>
+            </div>
+
+            {/* 所有折扣列表 */}
+            <div className="discount-list-container">
+              <h3>所有折扣计划</h3>
+              <table className="discount-table">
+                <thead>
+                  <tr>
+                    <th>ID</th>
+                    <th>名称</th>
+                    <th>开始时间</th>
+                    <th>结束时间</th>
+                    <th>类型</th>
+                    <th>创建时间</th>
+                    <th>状态</th>
+                    <th>操作</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {discounts.map(discount => (
+                    <tr key={discount.id}>
+                      <td>{discount.id}</td>
+                      <td>{discount.name}</td>
+                      <td>{formatDateTime(discount.startTime)}</td>
+                      <td>{formatDateTime(discount.endTime)}</td>
+                      <td>{translateDiscountType(discount.discountType)}</td>
+                      <td>{formatDateTime(discount.createTime)}</td>
+                      <td>{discount.status || '未知'}</td>
+                      <td>
+                        <button 
+                          onClick={() => handleDeleteDiscount(discount.id)}
+                          className="delete-button"
+                        >
+                          删除
+                        </button>
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          </>
+        ) : (
+        /* 新增的公告管理部分 */
+        <>
+          {/* 发布新公告表单 */}
+          <div className="announcement-form">
+            <h3>发布新公告</h3>
+            <div className="form-group">
+              <label>公告标题:</label>
+              <input
+                type="text"
+                value={newAnnouncement.title}
+                onChange={(e) => setNewAnnouncement({
+                  ...newAnnouncement,
+                  title: e.target.value
+                })}
+                placeholder="输入公告标题"
+              />
             </div>
             <div className="form-group">
-              <label>折扣类型:</label>
-              <select
-                value={newDiscount.discountType}
-                onChange={(e) => setNewDiscount({...newDiscount, discountType: e.target.value})}
-              >
-                <option value="FREE">全部免费</option>
-                <option value="HALF">半价下载</option>
-                <option value="DOUBLE">双倍上传</option>
-              </select>
+              <label>公告内容:</label>
+              <textarea
+                value={newAnnouncement.content}
+                onChange={(e) => setNewAnnouncement({
+                  ...newAnnouncement,
+                  content: e.target.value
+                })}
+                rows="5"
+                placeholder="输入公告内容"
+              />
             </div>
-            <button 
-                onClick={(e) => {
-                    e.preventDefault(); // 确保没有阻止默认行为
-                    handleAddDiscount();
-                }}
-                >
-                添加折扣
+            <button onClick={handlePostAnnouncement}>
+              发布公告
             </button>
           </div>
 
-          {/* 所有折扣列表 */}
-          <div className="discount-list-container">
-            <h3>所有折扣计划</h3>
-            <table className="discount-table">
+          {/* 所有公告列表 */}
+          <div className="announcement-list-container">
+            <h3>所有公告</h3>
+            <table className="announcement-table">
               <thead>
                 <tr>
-                  <th>ID</th>
-                  <th>名称</th>
-                  <th>开始时间</th>
-                  <th>结束时间</th>
-                  <th>类型</th>
-                  <th>创建时间</th>
-                  <th>状态</th>
-                  <th>操作</th>
+                  <th>标题</th>
+                  <th>内容</th>
+                  <th>发布时间</th>
                 </tr>
               </thead>
               <tbody>
-                {discounts.map(discount => (
-                  <tr key={discount.id}>
-                    <td>{discount.id}</td>
-                    <td>{discount.name}</td>
-                    <td>{formatDateTime(discount.startTime)}</td>
-                    <td>{formatDateTime(discount.endTime)}</td>
-                    <td>{translateDiscountType(discount.discountType)}</td>
-                    <td>{formatDateTime(discount.createTime)}</td>
-                    <td>{discount.status || '未知'}</td>
-                    <td>
-                      <button 
-                        onClick={() => handleDeleteDiscount(discount.id)}
-                        className="delete-button"
-                      >
-                        删除
-                      </button>
-                    </td>
+                {announcements.map(announcement => (
+                  <tr key={announcement.id}>
+                    <td>{announcement.title}</td>
+                    <td>{announcement.content}</td>
+                    <td>{formatDateTime(announcement.createTime)}</td>
                   </tr>
                 ))}
               </tbody>