精品课

pages_course/course_review/course_review.vue

@@ -4,7 +4,7 @@
 		<view class="navbar" :style="{ paddingTop: statusBarHeight + 'px' }">
 			<view class="nav-content">
 				<view class="nav-left" @click="goBack">
-					<uni-icons type="arrowleft" size="24" color="#333"></uni-icons>
+					<uni-icons type="left" size="24" color="#333"></uni-icons>
 				</view>
 				<view class="nav-title">评价课程</view>
 				<view class="nav-right"></view>
@@ -15,22 +15,22 @@
 		<view class="page-content" :style="{ paddingTop: navBarHeight + 'px' }">
 			<!-- 星级评分区域 -->
 			<view class="rating-section">
-				<text class="rating-title">点击星星评分</text>
 				<view class="stars-container">
-					<view 
-						class="star-item" 
-						v-for="star in 5" 
-						:key="star"
-						@click="setRating(star)"
-					>
-						<uni-icons 
-							:type="star <= currentRating ? 'star-filled' : 'star'" 
-							size="48" 
-							:color="star <= currentRating ? '#FFB800' : '#E0E0E0'"
-						></uni-icons>
-					</view>
+					<uni-rate 
+						v-model="currentRating"
+						:max="5"
+						:value="currentRating"
+						:size="48"
+						:margin="16"
+						:allow-half="true"
+						:touchable="true"
+						@change="onRatingChange"
+					/>
+				</view>
+				<view class="rating-display">
+					<text class="rating-score">{{ currentRating * 2 }}分</text>
+					<text class="rating-feedback">{{ ratingFeedback }}</text>
 				</view>
-				<text class="rating-feedback">{{ ratingFeedback }}</text>
 			</view>
 
 			<!-- 评价输入区域 -->
@@ -62,6 +62,7 @@
 
 <script setup>
 import { ref, onMounted } from 'vue'
+import course_api from "@/api/course_api.js"
 
 // 响应式数据
 const statusBarHeight = ref(0)
@@ -82,22 +83,29 @@ const getSystemInfo = () => {
 	// #endif
 }
 
-const setRating = (rating) => {
-	currentRating.value = rating
+const onRatingChange = (e) => {
+	currentRating.value = e.value
 	updateRatingFeedback()
 }
 
 const updateRatingFeedback = () => {
 	const feedbacks = {
+		0.5: '很差,课程几乎没有帮助',
 		1: '差评,课程没有任何帮助',
+		1.5: '较差,课程帮助很小',
 		2: '一般,课程内容一般',
+		2.5: '一般偏上,课程有一定帮助',
 		3: '还行,课程有一定帮助',
+		3.5: '不错,课程内容较好',
 		4: '不错,课程内容很好',
+		4.5: '很好,课程内容很棒',
 		5: '很好,课程非常棒'
 	}
 	ratingFeedback.value = feedbacks[currentRating.value] || ''
 }
 
+const courseId = ref(0)
+const is_commented = ref(0)
 const submitReview = () => {
 	if (currentRating.value === 0) {
 		uni.showToast({
@@ -119,20 +127,23 @@ const submitReview = () => {
 	uni.showLoading({
 		title: '提交中...'
 	})
+	course_api.addExcellencourseComment({
+		excellentcourse_id: courseId.value,
+		comment: reviewContent.value,
+		star: currentRating.value,
+		type: is_commented.value
+	}).then(res => {
+		console.log('评价提交结果:', res)
+		if(res.code == 200){
+			uni.hideLoading()
+			uni.showToast({
+				title: '评价提交成功',
+				icon: 'success'
+			})
+		}
+		uni.navigateBack()
+	})
 	
-	// 模拟提交
-	setTimeout(() => {
-		uni.hideLoading()
-		uni.showToast({
-			title: '评价提交成功',
-			icon: 'success'
-		})
-		
-		// 延迟返回上一页
-		setTimeout(() => {
-			uni.navigateBack()
-		}, 1500)
-	}, 1000)
 }
 
 const goBack = () => {
@@ -142,6 +153,14 @@ const goBack = () => {
 // 生命周期
 onMounted(() => {
 	getSystemInfo()
+	// 获取页面参数
+	const pages = getCurrentPages()
+	const currentPage = pages[pages.length - 1]
+	const options = currentPage.options || {}
+	is_commented.value = options.is_commented
+
+	courseId.value = options.id
+	console.log('课程ID:', options.id)
 })
 </script>
 
@@ -203,19 +222,26 @@ onMounted(() => {
 	.stars-container {
 		display: flex;
 		justify-content: center;
-		gap: 16rpx;
-		margin-bottom: 24rpx;
-		
-		.star-item {
-			cursor: pointer;
-		}
+		margin: 24rpx 0;
 	}
 	
-	.rating-feedback {
-		display: block;
-		font-size: 24rpx;
-		color: #333;
-		font-weight: 500;
+	.rating-display {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		gap: 16rpx;
+		
+		.rating-score {
+			font-size: 32rpx;
+			color: #FFB800;
+			font-weight: 600;
+		}
+		
+		.rating-feedback {
+			font-size: 24rpx;
+			color: #333;
+			font-weight: 500;
+		}
 	}
 }