diff --git a/src/common/components/CommentComponent/CommentComponent.tsx b/src/common/components/CommentComponent/CommentComponent.tsx index ed2e5f8..03ce967 100644 --- a/src/common/components/CommentComponent/CommentComponent.tsx +++ b/src/common/components/CommentComponent/CommentComponent.tsx @@ -72,7 +72,7 @@ const CommentComponent: React.FC = ({ comments, onCommentClick }) }; void fetchAllReplies(); - }, [allComments]); + }, []); const ctimeToString = (ctime: number) => { const ctimeDate = new Date(ctime); diff --git a/src/common/components/star/star.tsx b/src/common/components/star/star.tsx index 69f26ee..153efa1 100644 --- a/src/common/components/star/star.tsx +++ b/src/common/components/star/star.tsx @@ -5,7 +5,12 @@ import { useState } from 'react'; import './star.scss'; -export default function Star() { +interface Props { + onStarClick: (index: number) => void; + // ...其他属性... +} + +const Star: React.FC = ({ onStarClick }) => { const star0 = 'https://s2.loli.net/2023/08/29/NRLD54kzG9nEOHW.png'; const star1 = 'https://s2.loli.net/2023/08/29/rENVFz7xU9n2bd6.png'; @@ -17,6 +22,7 @@ export default function Star() { newStars[i] = star1; } setStars(newStars); + onStarClick(index); // 安全调用 }; return ( @@ -34,4 +40,6 @@ export default function Star() { })} ); -} +}; + +export default Star; diff --git a/src/pages/evaluate/evaluate.tsx b/src/pages/evaluate/evaluate.tsx index f84d926..76a5cfa 100644 --- a/src/pages/evaluate/evaluate.tsx +++ b/src/pages/evaluate/evaluate.tsx @@ -4,108 +4,212 @@ /* eslint-disable @typescript-eslint/no-unsafe-assignment */ /* eslint-disable react-hooks/rules-of-hooks */ /* eslint-disable import/first */ -import { - Button, - Form, - Radio, - RadioGroup, - Text, - Textarea, - View, -} from '@tarojs/components'; -import { useState } from 'react'; +import { Button, Form, Radio, Text, Textarea, View } from '@tarojs/components'; +import Taro from '@tarojs/taro'; +import { useEffect, useState } from 'react'; import './evaluate.scss'; import Label3 from '@/common/components/label3/label3'; import Star from '@/common/components/star/star'; +import { post } from '@/common/utils/fetch'; export default function evaluate() { - function generateUniqueID() { - const timestamp = Date.now().toString(36); // 时间戳转换为36进制 - const randomString = Math.random().toString(36).substr(2, 5); // 随机数转换为36进制并截取部分字符 + // function generateUniqueID() { + // const timestamp = Date.now().toString(36); // 时间戳转换为36进制 + // const randomString = Math.random().toString(36).substr(2, 5); // 随机数转换为36进制并截取部分字符 - const uniqueID = timestamp + randomString; - return uniqueID; - } + // const uniqueID = timestamp + randomString; + // return uniqueID; + // } // 示例用法 //const uniqueID = generateUniqueID(); - const [testways] = useState([ - { value: '开卷考试', text: '开卷考试', checked: false }, - { value: '闭卷考试', text: '闭卷考试', checked: false }, - { value: '论文考核', text: '论文考核', checked: false }, - { value: '小组汇报', text: '小组汇报', checked: false }, - { value: '无考核', text: '无考核', checked: false }, - ]); - - const [myclass] = useState([{ content: '只能评价自己学过的课程哦' }]); - - const [features, setFeatures] = useState([ - { id: generateUniqueID(), content: '老师风趣幽默', checked: false }, - { id: generateUniqueID(), content: '课程干货满满', checked: false }, - { id: generateUniqueID(), content: '老师严谨负责', checked: false }, - { id: generateUniqueID(), content: '课程很有挑战', checked: false }, - { id: generateUniqueID(), content: '课程简单易学', checked: false }, - { id: generateUniqueID(), content: '老师温柔随和', checked: false }, - { id: generateUniqueID(), content: '平时作业少', checked: false }, - { id: generateUniqueID(), content: '期末划重点', checked: false }, - { id: generateUniqueID(), content: '云课堂资料全', checked: false }, - ]); + // 初始化状态,存储所有选中的 Radio 项的值 + const [selectedValues, setSelectedValues] = useState([]); - const [textLength, setLength] = useState(0); + // 处理 Radio 变化的函数 + const handleRadioChange = (value: string) => { + const currentIndex = selectedValues.indexOf(value); + console.log(currentIndex); + if (currentIndex > -1) { + // 如果值已选中,移除它 + const newSelectedValues = selectedValues.filter((v, i) => i !== currentIndex); + setSelectedValues(newSelectedValues); + } else { + // 否则,添加这个值 + setSelectedValues([...selectedValues, value]); + } + }; + + // 测试方式的数据 + const testways = [ + { value: 'OpenBookExamination', text: '开卷考试' }, + { value: 'ClosedBookExamination', text: '闭卷考试' }, + { value: 'ThesisExamination', text: '论文考核' }, + { value: 'GroupReporting', text: '小组汇报' }, + { value: 'NoAssessment', text: '无考核' }, + ]; + + // const [checkedClass,setCheckedClass] = useState([{ content: '只能评价自己学过的课程哦' }]); + + // enum FeatureTag { + // EasyToLearn = '课程简单易学', + // RichInContent = '课程干货满满', + // Challenging = '课程很有挑战', + // RigorousAndResponsible = '老师严谨负责', + // KindAndEasygoing = '老师温柔随和', + // Humorous = '老师风趣幽默', + // LessHomework = '平时作业少', + // KeyPointsForFinal = '期末划重点', + // ComprehensiveOnlineMaterials = '云课堂资料全', + // } + + const features = [ + { value: 'EasyToLearn', content: '课程简单易学' }, + { value: 'RichInContent', content: '课程干货满满' }, + { value: 'Challenging', content: '课程很有挑战' }, + { value: 'RigorousAndResponsible', content: '老师严谨负责' }, + { value: 'KindAndEasygoing', content: '老师温柔随和' }, + { value: 'Humorous', content: '老师风趣幽默' }, + { value: 'LessHomework', content: '平时作业少' }, + { value: 'KeyPointsForFinal', content: '期末划重点' }, + { value: 'ComprehensiveOnlineMaterials', content: '云课堂资料全' }, + ]; - const handleChecked = (id) => { - const newFeatures = features.map((e) => { - if (e.id === id) return { ...e, checked: !e.checked }; - else return e; - }); - setFeatures(newFeatures); + const [selectedFeatureValues, setSelectedFeatureValues] = useState([]); + + const handleFeaturesChecked = (value: string) => { + const currentIndex = selectedFeatureValues.indexOf(value); + if (currentIndex > -1) { + // 如果 id 已选中,移除它 + const newSelectedFeatureValues = selectedFeatureValues.filter( + (v, i) => i !== currentIndex + ); + setSelectedFeatureValues(newSelectedFeatureValues); + } else { + // 否则,添加这个 id + setSelectedFeatureValues([...selectedFeatureValues, value]); + } }; + const [textLength, setLength] = useState(0); + const [comment, setComment] = useState(''); + const countContent = (e) => { const { value } = e.detail; + setComment(value); // 更新状态为当前输入框的值 const length = value.length; setLength(length); }; + // const course_id = 1; //暂时先指定一个courseId来测试使用 + + // 更新 id 状态为 number 类型 + const [courseId, setId] = useState(null); + const [courseName, setName] = useState('只能评价自己学过的课程哦'); + + useEffect(() => { + const getParams = () => { + const instance = Taro.getCurrentInstance(); + // 使用可选链操作符安全访问 router 和 params + const params = instance?.router?.params || {}; + + // 确保 id 是 number 类型 + setId(params.id ? Number(params.id) : null); + // 解码 name 参数 + setName(params.name ? decodeURIComponent(params.name) : '只能评价自己学过的课程哦'); + + console.log(params.id); + }; + + getParams(); + }, []); // 这个 effect 仅在组件挂载时运行一次 + + const postEvaluation = () => { + const evaluationobj = { + star_rating: selectedStarIndex, + content: comment, + course_id: courseId, + assessments: selectedValues, + features: selectedFeatureValues, + id: 0, + status: 'Public', + }; + console.log(evaluationobj); + post(`/evaluations/save`, evaluationobj) + .then((res) => { + if (res.code === 0) { + // 打印成功信息,但最好使用其他日志记录方式,而不是 console.log + // 例如:this.setState({ message: '发布课评成功' }); + // 或者使用 Taro 的日志记录方式:Taro.showToast({ title: '发布课评成功', icon: 'success' }); + // console.log('发布课评成功'); + // 使用 redirectTo 跳转 + void Taro.redirectTo({ + url: '/pages/main/index', // 页面路径 + }); + } else { + // 处理其他响应代码,可能需要给用户一些反馈 + // 例如:Taro.showToast({ title: '发布课评失败', icon: 'none' }); + } + }) + .catch((error) => { + // 处理可能出现的错误情况 + // 例如:Taro.showToast({ title: '发布失败,请稍后重试', icon: 'none' }); + console.error('发布课评请求失败:', error); + }); + }; + + //星级部分的代码 + const [selectedStarIndex, setSelectedStarIndex] = useState(-1); + + const onStarClick = (index) => { + console.log('选中的星级索引:', index); + setSelectedStarIndex(index + 1); + // 执行其他需要的逻辑 + }; + return (
选择课程 : - {myclass.map((each) => { - return ; - })} + 评价星级 : - + 考核方式 : - - {testways.map((item) => { - return ( - - {item.text} - - ); - })} - + {testways.map((item) => ( + handleRadioChange(item.value)} + > + {item.text} + + ))} - 评价星级 : + 课程特点 {features.map((item) => { - return ; + return ( + handleFeaturesChecked(item.value)} // 传递 handleChecked 函数 + /> + ); })} @@ -117,7 +221,7 @@ export default function evaluate() { className="myComment" > 字数限制{textLength}/450 - +
); } diff --git a/src/pages/myclass/myclass.tsx b/src/pages/myclass/myclass.tsx index 5458275..10eccfc 100644 --- a/src/pages/myclass/myclass.tsx +++ b/src/pages/myclass/myclass.tsx @@ -3,6 +3,7 @@ /* eslint-disable @typescript-eslint/no-unsafe-assignment */ import { Picker, Text, View } from '@tarojs/components'; +import Taro from '@tarojs/taro'; import { useEffect, useState } from 'react'; import './myclass.scss'; @@ -59,6 +60,15 @@ export default function Myclass() { void fetchClasses(); }, [year, sem]); + const handleClassClick = (id: number, name: string) => { + // 拼接查询字符串参数 + const query = `?id=${encodeURIComponent(id)}&name=${encodeURIComponent(name)}`; + // 使用 navigateTo 跳转到 evaluate 页面,并传递参数 + void Taro.navigateTo({ + url: `/pages/evaluate/evaluate${query}`, + }); + }; + return ( @@ -78,7 +88,11 @@ export default function Myclass() { {myclasses.map((each, index) => ( - + handleClassClick(each.id, each.name)} + > {each.name} {each.teacher} {each.evaluated ? '已评课' : '未评课'}