修改等级、新手指南
Change-Id: If60f5e1164f16fdabc8a5648a78c40fdd93c83a8
diff --git a/src/pages/NewUserGuide/NewUserGuide.jsx b/src/pages/NewUserGuide/NewUserGuide.jsx
index 7a3dad1..e677db7 100644
--- a/src/pages/NewUserGuide/NewUserGuide.jsx
+++ b/src/pages/NewUserGuide/NewUserGuide.jsx
@@ -69,7 +69,7 @@
className={activeTab === 'tasks' ? 'active' : ''}
onClick={() => setActiveTab('tasks')}
>
- 成长任务
+ 用户等级
</button>
</div>
<div className="guide-main">
diff --git a/src/pages/NewUserGuide/NewbieTasks.css b/src/pages/NewUserGuide/NewbieTasks.css
index 4d64389..cd6d4b6 100644
--- a/src/pages/NewUserGuide/NewbieTasks.css
+++ b/src/pages/NewUserGuide/NewbieTasks.css
@@ -1,4 +1,4 @@
-.newbie-tasks {
+/* .newbie-tasks {
font-size: 16px;
line-height: 1.6;
}
@@ -61,4 +61,29 @@
margin-bottom: 20px;
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
border: 1px solid #eee;
+} */
+
+.newbie-tasks-container {
+ padding: 20px;
+}
+
+.page-title {
+ text-align: center;
+ margin-bottom: 20px;
+}
+
+.tasks-table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+.tasks-table th,
+.tasks-table td {
+ border: 1px solid #ccc;
+ padding: 10px;
+ text-align: left;
+}
+
+.tasks-table th {
+ background-color: #f4f4f4;
}
diff --git a/src/pages/NewUserGuide/NewbieTasks.jsx b/src/pages/NewUserGuide/NewbieTasks.jsx
index 5ff6a9c..5fbd5ea 100644
--- a/src/pages/NewUserGuide/NewbieTasks.jsx
+++ b/src/pages/NewUserGuide/NewbieTasks.jsx
@@ -1,154 +1,208 @@
+// // export default NewbieTasks;
+// import React, { useEffect, useState } from 'react';
+// import axios from 'axios';
+
+// const NewbieTasks = () => {
+// const [tasks, setTasks] = useState([]);
+// const [experience, setExperience] = useState({});
+// const [currentStep, setCurrentStep] = useState({});
+// const [loading, setLoading] = useState(true);
+
+// const baseURL = '/echo/task/tutorial';
+// const userId = 1;
+
+// const fetchTasks = async () => {
+// try {
+// const response = await axios.get(`${baseURL}/getAllTasks`, {
+// params: { user_id: userId },
+// });
+// setTasks(response.data.tasks || []);
+// } catch (error) {
+// console.error('获取任务失败:', error);
+// }
+// };
+
+// const fetchExperience = async () => {
+// try {
+// const response = await axios.get(`${baseURL}/getAllTasks`, {
+// params: { user_id: userId },
+// });
+// setExperience(response.data || {});
+// } catch (error) {
+// console.error('获取经验失败:', error);
+// }
+// };
+
+// const fetchCurrentStep = async () => {
+// try {
+// const response = await axios.get(`${baseURL}/getNewStep`, {
+// params: { user_id: userId },
+// });
+// setCurrentStep(response.data || {});
+// } catch (error) {
+// console.error('获取引导步骤失败:', error);
+// }
+// };
+
+// const updateStatus = async (taskId) => {
+// try {
+// await axios.post(`${baseURL}/updateStatus`, {
+// user_id: userId,
+// task_id: taskId,
+// });
+// await fetchTasks();
+// await fetchExperience();
+// } catch (error) {
+// console.error('更新状态失败:', error);
+// }
+// };
+
+// const updateProgress = async (taskId, progress) => {
+// try {
+// await axios.post(`${baseURL}/updateProgress`, {
+// user_id: userId,
+// task_id: taskId,
+// progress,
+// });
+// await fetchTasks();
+// } catch (error) {
+// console.error('更新进度失败:', error);
+// }
+// };
+
+// const claimReward = async (taskId) => {
+// try {
+// await axios.post(`${baseURL}/rewardClaim`, {
+// user_id: userId,
+// task_id: taskId,
+// });
+// await fetchTasks();
+// await fetchExperience();
+// } catch (error) {
+// console.error('领取奖励失败:', error);
+// }
+// };
+
+// const checkRewardStatus = async (taskId) => {
+// try {
+// const response = await axios.post(`${baseURL}/rewardReview`, {
+// user_id: userId,
+// task_id: taskId,
+// });
+// alert(response.data.message || '已完成');
+// } catch (error) {
+// console.error('查看失败:', error);
+// }
+// };
+
+// useEffect(() => {
+// const init = async () => {
+// await fetchTasks();
+// await fetchExperience();
+// await fetchCurrentStep();
+// setLoading(false);
+// };
+// init();
+// }, []);
+
+// if (loading) return <p className="loading">加载中...</p>;
+
+// return (
+// <div className="common-card right-content">
+// <div className="profile-header">
+// <h1>🎯 用户等级</h1>
+// </div>
+
+// <div className="profile-details">
+// <p><strong>当前经验：</strong>{experience.current_experience}</p>
+// <p><strong>等级：</strong>{experience.level}</p>
+// <p><strong>奖励经验：</strong>{experience.reward?.experience || 0}</p>
+// <p><strong>奖励积分：</strong>{experience.reward?.points || 0}</p>
+// </div>
+
+// <div className="profile-details">
+// <p><strong>🧭 当前引导步骤：</strong>{currentStep.current_step}</p>
+// <p>{currentStep.step_description}</p>
+// </div>
+
+// <div className="profile-details">
+// <h2>任务列表</h2>
+// <ul>
+// {tasks.map(task => (
+// <li key={task.task_id} style={{ marginBottom: '20px', borderBottom: '1px solid #eee', paddingBottom: '10px' }}>
+// <p><strong>任务：</strong>{task.title}</p>
+// <p><strong>描述：</strong>{task.description}</p>
+// <p><strong>进度：</strong>{task.progress}%</p>
+// <p><strong>状态：</strong>{task.status}</p>
+// <p><strong>奖励：</strong>经验 {task.reward.experience}，积分 {task.reward.points}</p>
+
+// <div className="task-btn-group">
+// <button className="task-btn" onClick={() => updateStatus(task.task_id)}>更新状态</button>
+// <button className="task-btn" onClick={() => updateProgress(task.task_id, 100)}>提交进度</button>
+// <button className="task-btn" onClick={() => claimReward(task.task_id)}>领取奖励</button>
+// <button className="task-btn" onClick={() => checkRewardStatus(task.task_id)}>查看奖励状态</button>
+// </div>
+// </li>
+// ))}
+// </ul>
+// </div>
+// </div>
+// );
+// };
+
// export default NewbieTasks;
-import React, { useEffect, useState } from 'react';
-import axios from 'axios';
+
+
+import React from'react';
+import './NewbieTasks.css';
const NewbieTasks = () => {
- const [tasks, setTasks] = useState([]);
- const [experience, setExperience] = useState({});
- const [currentStep, setCurrentStep] = useState({});
- const [loading, setLoading] = useState(true);
-
- const baseURL = '/echo/task/tutorial';
- const userId = 1;
-
- const fetchTasks = async () => {
- try {
- const response = await axios.get(`${baseURL}/getAllTasks`, {
- params: { user_id: userId },
- });
- setTasks(response.data.tasks || []);
- } catch (error) {
- console.error('获取任务失败:', error);
- }
- };
-
- const fetchExperience = async () => {
- try {
- const response = await axios.get(`${baseURL}/getAllTasks`, {
- params: { user_id: userId },
- });
- setExperience(response.data || {});
- } catch (error) {
- console.error('获取经验失败:', error);
- }
- };
-
- const fetchCurrentStep = async () => {
- try {
- const response = await axios.get(`${baseURL}/getNewStep`, {
- params: { user_id: userId },
- });
- setCurrentStep(response.data || {});
- } catch (error) {
- console.error('获取引导步骤失败:', error);
- }
- };
-
- const updateStatus = async (taskId) => {
- try {
- await axios.post(`${baseURL}/updateStatus`, {
- user_id: userId,
- task_id: taskId,
- });
- await fetchTasks();
- await fetchExperience();
- } catch (error) {
- console.error('更新状态失败:', error);
- }
- };
-
- const updateProgress = async (taskId, progress) => {
- try {
- await axios.post(`${baseURL}/updateProgress`, {
- user_id: userId,
- task_id: taskId,
- progress,
- });
- await fetchTasks();
- } catch (error) {
- console.error('更新进度失败:', error);
- }
- };
-
- const claimReward = async (taskId) => {
- try {
- await axios.post(`${baseURL}/rewardClaim`, {
- user_id: userId,
- task_id: taskId,
- });
- await fetchTasks();
- await fetchExperience();
- } catch (error) {
- console.error('领取奖励失败:', error);
- }
- };
-
- const checkRewardStatus = async (taskId) => {
- try {
- const response = await axios.post(`${baseURL}/rewardReview`, {
- user_id: userId,
- task_id: taskId,
- });
- alert(response.data.message || '已完成');
- } catch (error) {
- console.error('查看失败:', error);
- }
- };
-
- useEffect(() => {
- const init = async () => {
- await fetchTasks();
- await fetchExperience();
- await fetchCurrentStep();
- setLoading(false);
- };
- init();
- }, []);
-
- if (loading) return <p className="loading">加载中...</p>;
-
- return (
- <div className="common-card right-content">
- <div className="profile-header">
- <h1>🎯 成长任务</h1>
- </div>
-
- <div className="profile-details">
- <p><strong>当前经验：</strong>{experience.current_experience}</p>
- <p><strong>等级：</strong>{experience.level}</p>
- <p><strong>奖励经验：</strong>{experience.reward?.experience || 0}</p>
- <p><strong>奖励积分：</strong>{experience.reward?.points || 0}</p>
- </div>
-
- <div className="profile-details">
- <p><strong>🧭 当前引导步骤：</strong>{currentStep.current_step}</p>
- <p>{currentStep.step_description}</p>
- </div>
-
- <div className="profile-details">
- <h2>任务列表</h2>
- <ul>
- {tasks.map(task => (
- <li key={task.task_id} style={{ marginBottom: '20px', borderBottom: '1px solid #eee', paddingBottom: '10px' }}>
- <p><strong>任务：</strong>{task.title}</p>
- <p><strong>描述：</strong>{task.description}</p>
- <p><strong>进度：</strong>{task.progress}%</p>
- <p><strong>状态：</strong>{task.status}</p>
- <p><strong>奖励：</strong>经验 {task.reward.experience}，积分 {task.reward.points}</p>
-
- <div className="task-btn-group">
- <button className="task-btn" onClick={() => updateStatus(task.task_id)}>更新状态</button>
- <button className="task-btn" onClick={() => updateProgress(task.task_id, 100)}>提交进度</button>
- <button className="task-btn" onClick={() => claimReward(task.task_id)}>领取奖励</button>
- <button className="task-btn" onClick={() => checkRewardStatus(task.task_id)}>查看奖励状态</button>
- </div>
- </li>
- ))}
- </ul>
- </div>
- </div>
- );
+ const tableData = [
+ {
+ level: 'lv0【糖果】',
+ newPermissions: '查看种子分类和评论，查看其他用户主页',
+ upgradeConditions: '无'
+ },
+ {
+ level: 'lv1【曲奇】',
+ newPermissions: '上传免费种子，下载免费种子，发布评论，私信/关注其他用户，收藏种子',
+ upgradeConditions: '经验≥50，分享率≥0.5，上传量≥10G，做种时长≥72h'
+ },
+ {
+ level: 'lv2【巧克力】',
+ newPermissions: '下载付费种子，成立和加入兴趣小组',
+ upgradeConditions: '经验≥200，分享率≥0.75，上传量≥50G，做种时长≥240h'
+ },
+ {
+ level: 'lv3【冰激凌】',
+ newPermissions: '上传付费种子',
+ upgradeConditions: '经验≥500，分享率≥1，上传量≥100G，做种时长≥600h'
+ }
+ ];
+ return (
+ <div className="newbie-tasks-container">
+ <h2 className="page-title">🎯 用户等级</h2>
+ <p>各个等级的权限在下面啦~ 经验值可以通过上传种子获得哦！</p>
+ <table className="tasks-table">
+ <thead>
+ <tr>
+ <th>用户等级</th>
+ <th>新增权限</th>
+ <th>升级条件</th>
+ </tr>
+ </thead>
+ <tbody>
+ {tableData.map((item, index) => (
+ <tr key={index}>
+ <td>{item.level}</td>
+ <td>{item.newPermissions}</td>
+ <td>{item.upgradeConditions}</td>
+ </tr>
+ ))}
+ </tbody>
+ </table>
+ </div>
+ );
};
export default NewbieTasks;
-