完善课程列表、收藏课程、课程详情页

api/edu.js

@@ -66,4 +66,27 @@ export function payCourse(data) {
 		'method': 'post',
 		data: data
 	})
+}
+
+// 收藏课程
+export function courseFavi(data) {
+	return request({
+		'url': '/course/favi',
+		headers: {
+			isToken: true
+		},
+		'method': 'post',
+		data: data
+	})
+}
+// 取消收藏课程
+export function courseCancelFavi(data) {
+	return request({
+		'url': '/course/cancelFavi',
+		headers: {
+			isToken: true
+		},
+		'method': 'post',
+		data: data
+	})
 }

pages/goOnEdu/course/courseDetail/component/courseDesc/courseDesc.vue

@@ -1,5 +1,8 @@
 <template>
 	<view class="tabs-content" :style="{ paddingBottom : `${props.paddingBottom || 0}rpx` }">
+		<view v-if="!isMember && payType!=='1'" class="pay-member" >
+			<text>个人会员或单位会员免费，点击现在入会></text>
+		</view>
 		<image :src="content" v-if="showType === 'image'" style="width: 100%" mode="widthFix"></image>
 		<u-parse :html="content" :selectable="true" v-else></u-parse>
 		<!-- 课程简介-测试用，看能不能看到底部 -->
@@ -11,6 +14,12 @@
 		ref,
 		defineProps 
 	} from 'vue'
+	import { useAuthStore } from '@/store/authStore.js';
+	import {
+		onLoad,
+	} from '@dcloudio/uni-app'
+	const authStore = useAuthStore();
+	const isMember = ref(false)
 	const props = defineProps({
 	  paddingBottom: {
 	    type: Number,
@@ -26,10 +35,18 @@
 		  type: String,
 		  required: true,
 		  default: ""
+	  },
+	  payType: {
+		  type: String,
+		  required: true,
+		  default: "1"
 	  }
 	});
 	// const content = ref("<p>20名协会成员于10月15adhjshajdhsadsajdakshdjahjkd，骄傲的噶说的话吗，计划的哈手机号，很多看啥看，撒海空军的卡号是，按开机动画就撒开，安达市快点哈尽快，打火机客户打款，收获颇丰。此次活动增进了大家对科技前沿的认识。</p><img src='/static/notice/ditu.jpg' /><img src='/static/notice/ditu.jpg' /><img src='/static/notice/ditu.jpg' /><img src='/static/notice/ditu.jpg' />")
-	
+	onLoad(() => {
+		isMember.value = authStore.userInfo.isMember == '0'? false : true;
+		// initUser()
+	})
 </script>
 
 <style lang="scss" scoped>
@@ -38,4 +55,10 @@
 		height: inherit;
 		position: relative;
 	}
+	.pay-member{
+		color: red;
+		// text-align: center;
+		margin-bottom: 5rpx;
+		font-size: 32rpx;
+	}
 </style>

pages/goOnEdu/course/courseDetail/courseDetail.vue

@@ -14,7 +14,7 @@
 			</view>
 			<view class="content">
 				<courseDesc v-if="currentTab === 0" :paddingBottom="100" showType="image"
-					:content="courseDetail.imgUrl?courseDetail.imgUrl:''"></courseDesc>
+					:content="courseDetail.imgUrl?courseDetail.imgUrl:''" :payType="courseDetail.payType"></courseDesc>
 				<courseCredits v-if="currentTab === 1" :credit="courseDetail.courseCredits"></courseCredits>
 				<courseComment v-if="currentTab === 2" :paddingBottom="100" :commentList="commentList"></courseComment>
 			</view>
@@ -46,6 +46,9 @@
 	import {
 		onLoad
 	} from '@dcloudio/uni-app'
+	
+	
+	
 	const courseDetail = ref({});
 	const courseId = ref(null);
 	const items = ref(['课程简介', '课程学分', '观看评论']);

pages/goOnEdu/course/courseHome/courseHome.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="container">
 		<!-- 搜索 -->
-		<u-search @search="search" :show-action="false" shape="round" placeholder="搜索您想要的内容"
+		<u-search @search="toSearch" :show-action="false" shape="round" placeholder="搜索您想要的内容"
 			v-model="searchForm.keyword"></u-search>
 		<!-- tabs -->
 		<view style="padding-top: 20rpx;display: flex;">
@@ -22,7 +22,7 @@
 							<text>{{ course.courseName }}</text>
 							<image style="width: 25rpx;height: 25rpx;padding-left: 20rpx;"
 								:src="course.hasFavi ? 'https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/edu-icon/favi-icon.png' : 'https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/edu-icon/no-favi-icon.png'"
-								@click.stop="collectCourse(course.id, index)">
+								@click.stop="collectCourse(course.id, index, course.hasFavi)">
 							</image>
 						</view>
 						<view class="course-type">{{ course.courseType }}</view>
@@ -41,18 +41,24 @@
 				<u-line />
 			</view>
 		</view>
+		<view>
+			<uni-load-more :status="loadMoreStatus"></uni-load-more>
+		</view>
 	</view>
 </template>
 
 <script setup>
 	import {
-		ref,onMounted,watch
+		ref, onMounted, watch, 
 	} from 'vue';
 	import {
+		onReachBottom
 	} from '@dcloudio/uni-app'
-	import { loadCourseCate, loadCourseList } from "@/api/edu.js"
+	import { loadCourseCate, loadCourseList, courseFavi, courseCancelFavi } from "@/api/edu.js"
 	import { useCourseStore } from "@/store/courseStore.js"
+	import { useAuthStore } from '@/store/authStore.js';
 	const courseStore = useCourseStore();
+	const authStore = useAuthStore();
 	const isMember = ref(false);
 	const tabsList = ref([]);
 	const currentTab = ref(courseStore.currentTab); 
@@ -61,6 +67,11 @@
 		pageNumber: 1,
 		pageSize: 10,
 	})
+	const pageNumber = ref(1)
+	const pageSize = ref(10)
+	const total = ref(0)
+	const loadMoreStatus = ref('more')
+	
 	const courseMember = {
 		1: "免费",
 		2: "会员免费",
@@ -80,78 +91,6 @@
 			hasFavi: true,
 			payType: "免费" // 新增字段，标识课程的付费类型
 		},
-		{
-			id: 2,
-			courseName: "Vue.js 从入门到精通",
-			courseType: "领袖锻造营",
-			name: "李老师",
-			courseDate: "2023-09-15",
-			imgUrl: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
-			price: 199.00,
-			hasBuy: false,
-			hasFavi: false,
-			payType: "会员免费"
-		},
-		{
-			id: 3,
-			courseName: "React 开发实战",
-			courseType: "领袖锻造营",
-			name: "王老师",
-			courseDate: "2023-11-05",
-			imgUrl: "https://desk-fd.zol-img.com.cn/t_s960x600c5/g4/M03/00/0C/Cg-4zFS8bC-Ie9zBADCvovJAqiEAATJ8wDX__cAMK-6184.jpg",
-			price: 149.00,
-			hasBuy: false,
-			hasFavi: false,
-			payType: "付费"
-		},
-		{
-			id: 4,
-			courseName: "Node.js 全栈开发",
-			courseType: "合规专训营",
-			name: "赵老师",
-			courseDate: "2023-08-20",
-			imgUrl: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
-			price: 299.00,
-			hasBuy: true,
-			hasFavi: false,
-			payType: "付费"
-		},
-		{
-			id: 5,
-			courseName: "移动端开发技巧",
-			courseType: "精英训练营",
-			name: "钱老师",
-			courseDate: "2025-07-18",
-			imgUrl: "https://desk-fd.zol-img.com.cn/t_s960x600c5/g4/M03/00/0C/Cg-4zFS8bC-Ie9zBADCvovJAqiEAATJ8wDX__cAMK-6184.jpg",
-			price: 89.00,
-			hasBuy: true,
-			hasFavi: false,
-			payType: "付费"
-		},
-		{
-			id: 6,
-			courseName: "11Vue.js 从入门到精通",
-			courseType: "领袖锻造营",
-			name: "李老师11",
-			courseDate: "2023-09-15",
-			imgUrl: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
-			price: 199.00,
-			hasBuy: true,
-			hasFavi: false,
-			payType: "会员免费"
-		},
-		{
-			id: 7,
-			courseName: "113Vue.js 从入门到精通",
-			courseType: "领袖锻造营",
-			name: "李老师11",
-			courseDate: "2025-09-15",
-			imgUrl: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
-			price: 199.00,
-			hasBuy: true,
-			hasFavi: false,
-			payType: "会员免费"
-		},
 	]);
 
 	// 按钮的文字
@@ -159,10 +98,10 @@
 		const currentDate = new Date();
 		const classDate = new Date(course.courseDate);
 
-		if (course.payType === "免费") {
+		if (course.payType === '1') {
 			return "免费";
 		}
-		if (course.payType === "会员免费") {
+		if (course.payType === '2') {
 			if (isMember.value) return "会员免费";
 			if (!course.hasBuy && !isMember.value) return "会员免费";
 			if (course.hasBuy) {
@@ -170,7 +109,7 @@
 			}
 		}
 
-		if (course.payType === "付费") {
+		if (course.payType === '3') {
 			if (!course.hasBuy) return "点击购买";
 			return currentDate < classDate ? "点击查看" : "点击查看回放";
 		}
@@ -181,13 +120,13 @@
 
 	// 按钮的样式
 	function getButtonClass(course) {
-		if (courseMember[course.payType] === "免费") return 'free';
-		if (courseMember[course.payType] === "会员免费") {
+		if (courseMember[course.payType] === '免费') return 'free';
+		if (courseMember[course.payType] === '会员免费') {
 			if (isMember.value) return 'member-free';
 			return course.hasBuy ? (new Date() < new Date(course.courseDate) ? 'purchased' : 'replay') :
 				'member-free';
 		}
-		if (courseMember[course.payType] === "付费") {
+		if (courseMember[course.payType] === '付费') {
 			return course.hasBuy ? (new Date() < new Date(course.courseDate) ? 'purchased' : 'replay') : 'purchase';
 		}
 		return 'error';
@@ -216,15 +155,54 @@
 		}
 		filterCourses.value = courses.value.filter(item => item.courseType == tabsList.value[index].name)
 	}
+	function toSearch(e){
+		pageNumber.value = 1
+		search(e)
+	}
 	// 搜索
 	function search(e) {
-		console.log(e, "searchForm.keyword")
+		searchForm.value.keyword = e
+		searchForm.value.pageNumber = pageNumber.value
+		searchForm.value.pageSize = pageSize.value
+		courses.value = pageNumber.value == 1? [] : courses.value
+		loadMoreStatus.value = 'loading'
+		loadCourseList(searchForm.value).then(res=>{
+			if(res?.data){
+				total.value = res.count;
+				courses.value = [...courses.value,...res.data];
+				const i = currentTab.value
+				if( i == 0){
+					filterCourses.value = [...courses.value];
+				}else{
+					filterCourses.value = courses.value.filter(item => item.courseType == tabsList.value[i].name)
+				}
+				loadMoreStatus.value = total.value === courses.value.length ? 'nomore': 'more';
+				pageNumber.value++;
+			}
+		})
 	}
 	// 收藏
-	function collectCourse(id,index) {
+	async function collectCourse(id,index,hasFavi) {
+		try{
+			let res;
+			if(hasFavi){
+				res = await courseCancelFavi({
+					id
+				})
+			}else{
+				res = await courseFavi({id})
+			}
+			if(res.code == 0){
+				courses.value[index].hasFavi = !courses.value[index].hasFavi
+			}
+		}catch(err){
+			courses.value[index].hasFavi = courses.value[index].hasFavi
+		}
+		
+		
 		// 联调后端，
 		// 返回成功后
-		courses.value[index].hasFavi = !courses.value[index].hasFavi
+		
 	}
 	// 初始化
 	function init() {
@@ -233,13 +211,8 @@
 				tabsList.value = [{ code: '', name: '全部'}, ...res.data]
 			}
 		})
-		searchForm.value.keyword = ""
-		loadCourseList(searchForm.value).then(res=>{
-			if(res?.data){
-				courses.value = res.data;
-				filterCourses.value = [...courses.value];
-			}
-		})
+		pageNumber.value = 1;
+		search("");
 		// 初始化页面，获取数据
 		// filterCourses.value = courses.value
 	}
@@ -250,13 +223,18 @@
 		});
 	}
 	onMounted(() => {
-		const userInfo = uni.getStorageSync("userinfo");
-		isMember.value = userInfo.isMember
+		isMember.value = authStore.userInfo.isMember
 	    init();
 	    watch(currentTab, (newValue) => {
 	        courseStore.setCurrentTab(newValue); // 如果需要在切换时更新 Pinia 状态
 	    });
 	});
+	onReachBottom(()=>{
+		if(courses.value.length === total.value){
+			return;
+		}
+		search(searchForm.value.keyword);
+	})
 </script>
 
 <style lang="scss" scoped>