完成培训课程详情页面，完成培训课程-我的页面，完成我的-我的收藏页面，完成我的-观看记录页面，完成我的-学分明细页面

pages.json

@@ -340,6 +340,61 @@
 					"titleNView": false
 				}
 			}
+		},
+		{
+			"path" : "pages/goOnEdu/course/courseMine/mineRecord/mineRecord",
+			"style" : {
+				"navigationBarBackgroundColor": "#FFFFFF",
+				"navigationBarTitleText": "观看记录",
+				"enablePullDownRefresh": false,
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		{
+			"path" : "pages/goOnEdu/course/courseMine/mineCredits/mineCredits",
+			"style" : {
+				"navigationBarBackgroundColor": "#FFFFFF",
+				"navigationBarTitleText": "学分明细",
+				"enablePullDownRefresh": false,
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		{
+			"path" : "pages/goOnEdu/course/courseMine/mineFavi/mineFavi",
+			"style" : {
+				"navigationBarBackgroundColor": "#FFFFFF",
+				"navigationBarTitleText": "我的收藏",
+				"enablePullDownRefresh": false,
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		{
+			"path" : "pages/goOnEdu/course/courseDetail/courseOrder",
+			"style" : {
+				"navigationBarBackgroundColor": "#f7f7f7",
+				"navigationBarTitleText": "填写订单",
+				"enablePullDownRefresh": false,
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		{
+			"path" : "pages/goOnEdu/course/courseDetail/coursePay",
+			"style" : {
+				"navigationBarBackgroundColor": "#ffffff",
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false,
+				"app-plus": {
+					"titleNView": false
+				}
+			}
 		}
 	],
 	"globalStyle": {

pages/goOnEdu/course/component/courseHome/courseHome.vue

@@ -46,11 +46,12 @@
 
 <script setup>
 	import {
-		ref
+		ref,onMounted,watch
 	} from 'vue';
 	import {
-		onLoad
 	} from '@dcloudio/uni-app'
+	import { useCourseStore } from "@/store/courseStore.js"
+	const courseStore = useCourseStore();
 	const searchWord = ref("")
 	const isMember = ref(false);
 	const tabsList = ref([{
@@ -62,7 +63,7 @@
 	}, {
 		name: '合规专训营'
 	}]);
-	const currentTab = ref(0)
+	const currentTab = ref(courseStore.currentTab); 
 	// 展示的课程
 	const filterCourses = ref([]);
 	const courses = ref([{
@@ -205,6 +206,8 @@
 
 	// 切换搜索框下面的tab
 	function changeTab(index) {
+		currentTab.value = index;
+		courseStore.setCurrentTab(index)
 		if (index === 0) {
 			filterCourses.value = courses.value
 			return
@@ -233,12 +236,14 @@
 			url: `/pages/goOnEdu/course/courseDetail/courseDetail?id=${course.id}&name=${course.keChengMingCheng}`
 		});
 	}
-
-	onLoad(() => {
+	onMounted(() => {
 		const userInfo = uni.getStorageSync("userinfo");
 		isMember.value = userInfo.isMember
-		init()
-	})
+	    init();
+	    watch(currentTab, (newValue) => {
+	        courseStore.setCurrentTab(newValue); // 如果需要在切换时更新 Pinia 状态
+	    });
+	});
 </script>
 
 <style lang="scss" scoped>
@@ -287,7 +292,7 @@
 			.course-teacher,
 			.course-date,
 			.course-price {
-				font-size: 24rpx;
+				font-size: 30rpx;
 				color: #000;
 			}
 

pages/goOnEdu/course/component/courseMine/courseMine.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="container">
-		<view class="btn-list-item" v-for="(btn,index) in btnList" :key="index">
+		<view class="btn-list-item" v-for="(btn,index) in btnList" :key="index" @click="toPage(btn.path)">
 			<text>{{btn.name}}</text>
 			<u-icon name="arrow-right" size="20"></u-icon>
 		</view>
@@ -16,20 +16,25 @@
 	} from '@dcloudio/uni-app'
 	const btnList = ref([{
 			id: "1",
-			path: "",
+			path: "/pages/goOnEdu/course/courseMine/mineRecord/mineRecord",
 			name: "观看记录"
 		},
 		{
 			id: "2",
-			path: "",
+			path: "/pages/goOnEdu/course/courseMine/mineCredits/mineCredits",
 			name: "学分明细"
 		},
 		{
 			id: "3",
-			path: "",
+			path: "/pages/goOnEdu/course/courseMine/mineFavi/mineFavi",
 			name: "我的收藏"
 		},
 	]);
+	const toPage = (url) => {
+		uni.navigateTo({
+			url:url
+		})
+	}
 	onLoad(() => {
 		console.log('课程-我的页面')
 	})

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

@@ -35,17 +35,17 @@
 	});
 	
 	function formatDate(dateStr) {
-		return dateStr.replace(" ", "T"); // Replace space with 'T' to make it ISO format
+		return dateStr.replace(" ", "T");
 	}
 	
 	function formatTime(timeString) {
 	    const commentDate = new Date(formatDate(timeString));
 	    const now = new Date();
-	    const diff = now - commentDate; // Difference in milliseconds
+	    const diff = now - commentDate;
 	
-	    const minutes = Math.floor(diff / 60000); // Convert milliseconds to minutes
-	    const hours = Math.floor(diff / 3600000); // Convert milliseconds to hours
-	    const days = Math.floor(diff / 86400000); // Convert milliseconds to days
+	    const minutes = Math.floor(diff / 60000); 
+	    const hours = Math.floor(diff / 3600000); 
+	    const days = Math.floor(diff / 86400000);
 	
 	    if (minutes < 1) { // 修改这里以处理0分钟
 	        return "刚刚";
@@ -54,7 +54,7 @@
 	    } else if (hours < 24) {
 	        return `${hours}小时前`;
 	    } else {
-	        return commentDate.toISOString().split('T')[0]; // Return date in yyyy-MM-dd format
+	        return commentDate.toISOString().split('T')[0];
 	    }
 	}
 
@@ -73,7 +73,7 @@
 	.comment-list-item {
 		display: flex;
 		padding: 20rpx 0;
-		font-size: 24rpx;
+		font-size: 28rpx;
 		.comment-list-left{
 			flex: 0 0 auto;
 			padding-right: 20rpx;

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

@@ -1,23 +1,26 @@
 <template>
-	<view class="tabs-content" :style="{ paddingBottom : `${props.paddingBottom || 0}rpx` }">
-		课程学分不知道页面是什么！！
-		<!-- <view v-for="(data,index) in dataList" :key="index">{{
-			data
-		}}</view> -->
+	<view class="tabs-content" :style="{ paddingBottom : `${props.paddingBottom || 0}rpx`,display: 'flex', fontSize: '30rpx' }">
+		<view>学分：</view>
+		<view>{{ credit }}分</view>
 	</view>
 </template>
 
 <script setup>
 	import {
 		ref,
-		defineProps 
+		defineProps
 	} from 'vue'
 	const props = defineProps({
-	  paddingBottom: {
-	    type: Number,
-	    required: false,
-		default: 10
-	  }
+		paddingBottom: {
+			type: Number,
+			required: false,
+			default: 10
+		},
+		credit: {
+			type: Number,
+			required: true,
+			default: 0
+		}
 	});
 	const dataList = ref([{
 			name: "11212213213213123",
@@ -79,7 +82,8 @@
 </script>
 
 <style lang="scss" scoped>
-	.tabs-content{
+	.tabs-content {
 		padding-top: 10rpx;
+		letter-spacing: 5rpx;
 	}
 </style>

pages/goOnEdu/course/courseDetail/courseDetail.vue

@@ -15,7 +15,7 @@
 			<view class="content">
 				<courseDesc v-if="currentTab === 0" :paddingBottom="100" showType="image"
 					:content="courseDetail.keChengTuPian?courseDetail.keChengTuPian:''"></courseDesc>
-				<courseCredits v-if="currentTab === 1"></courseCredits>
+				<courseCredits v-if="currentTab === 1" :credit="courseDetail.keChengXueFen"></courseCredits>
 				<courseComment v-if="currentTab === 2" :paddingBottom="100" :commentList="commentList"></courseComment>
 			</view>
 
@@ -134,17 +134,21 @@
 			keChengLeXing: "领袖锻造营",
 			shouKeZhe: "李老师11",
 			shouKeShiJian: "2023-09-15",
-			keChengTuPian: "https://sns-webpic-qc.xhscdn.com/202501171040/4a481ca146d6c00d8dc1324efc4bbf2e/1040g2sg31clvciqk0m4g5pidgnm0u8pljld93q0!nd_dft_wlteh_webp_3",
+			keChengTuPian: "https://tse4-mm.cn.bing.net/th/id/OIP-C.X_J8jL0bSPQ_jgOrdIbsgQHaEK?rs=1&pid=ImgDetMain",
 			jiaGe: 199.00,
 			isGouMai: true,
 			isShouCang: false,
-			fuFeiLeiXing: "会员免费"
+			fuFeiLeiXing: "会员免费",
+			keChengXueFen: 2,
 		}
 		// console.log(courseDetail.value)
 	}
 	// 购买课程
 	function toBuy() {
-		console.log("购买该课程", courseDetail.value.id)
+		uni.navigateTo({
+			url: "/pages/goOnEdu/course/courseDetail/courseOrder?id=" + courseDetail.value.id
+		})
+		// console.log("购买该课程", courseDetail.value.id)
 	}
 	
 	function toSend() {

pages/goOnEdu/course/courseDetail/courseOrder.vue

@@ -0,0 +1,323 @@
+<template>
+	<view class="container">
+		<view class="course-item">
+			<view class="course-item-image">
+				<image class="course-image" :src="course.keChengTuPian" mode="aspectFill"></image>
+			</view>
+			<view class="course-item-content">
+				<view class="course-title">
+					<text>{{ course.keChengMingCheng }}</text>
+					<image style="width: 25rpx;height: 25rpx;padding-left: 20rpx;"
+						:src="course.isShouCang ? '/static/edu-icon/favi-icon.png' : '/static/edu-icon/no-favi-icon.png'">
+					</image>
+				</view>
+				<view class="course-type">{{ course.keChengLeXing }}</view>
+				<view class="course-teacher">
+					<u-icon name="account" size="28"></u-icon>
+					{{ course.shouKeZhe }}
+				</view>
+				<view class="course-date">
+					<u-icon name="clock" size="28"></u-icon>
+					{{ getDateWeek(course.shouKeRiQi) }}
+				</view>
+				<view class="course-price">￥{{ course.jiaGe }}元</view>
+			</view>
+		</view>
+		<view class="course-form" style="margin-top: 20rpx;">
+			<view class="course-form-item">
+				<view class="course-label">
+					开课时间
+				</view>
+				<view class="course-value">
+					{{ course.shouKeRiQi }}{{ course.shouKeShiJian }}开课
+				</view>
+			</view>
+			<view class="course-form-item">
+				<view class="course-label">
+					支付方式
+				</view>
+				<view class="course-value" @click="show = true">
+					{{ activePayType }}<i class="iconfont icon-sangedian-copy"></i>
+				</view>
+			</view>
+		</view>
+		<view class="course-form" style="margin-top: 20rpx;">
+			<view class="course-form-item">
+				<view class="course-label">
+					课程金额
+				</view>
+				<view class="course-value">
+					￥{{ course.jiaGe }}
+				</view>
+			</view>
+			<view class="course-form-item">
+				<view class="course-label">
+					积分抵扣
+				</view>
+				<view class="course-value">
+					无
+				</view>
+			</view>
+			<view class="course-form-item">
+				<view class="course-label">
+					合计金额
+				</view>
+				<view class="course-value">
+					￥{{ price }}
+				</view>
+			</view>
+		</view>
+		<view class="course-form" style="margin-top: 20rpx;">
+			<view class="course-form-item">
+				<view class="course-label">
+					课程有效期：<text class="text-red">{{ course.keChengYouXiaoQi }}</text>
+				</view>
+			</view>
+		</view>
+		<view class="course-form" style="background: none;">
+			<view class="course-form-item">
+				<text class="text-red" style="font-weight: bold;">个人会员或单位会员免费，点击现在入会></text>
+			</view>
+		</view>
+		<view class="pay">
+			<view class="pay-price">
+				￥:{{price}}
+			</view>
+			<view>
+				<button class="pay-btn" @click="toBuy">立即购买</button>
+			</view>
+		</view>
+		<u-action-sheet :list="list" v-model="show" @click="clickAction" safe-area-inset-bottom></u-action-sheet>
+	</view>
+</template>
+
+<script setup>
+	import {
+		ref
+	} from 'vue'
+	import {
+		onLoad
+	} from '@dcloudio/uni-app'
+	const courseId = ref("");
+	const course = ref({})
+	const price = ref(0)
+	const activePayType = ref("微信支付")
+	const list = ref([{
+		text: '微信支付'
+	}, {
+		text: '支付宝支付'
+	}])
+	const show = ref(false)
+	const toBuy = () => {
+		uni.redirectTo({
+			url: "/pages/goOnEdu/course/courseDetail/coursePay?id=" + courseId.value
+		})
+	}
+
+	const clickAction = (i) =>{
+		// console.log(i)
+		activePayType.value = list.value[i].text
+		show.value = false
+	}
+	// 加载数据
+	const init = (id) => {
+		// 加载数据
+		courseId.value = id
+		course.value = {
+			id: id,
+			keChengMingCheng: "11Vue.js 从入门到精通",
+			keChengLeXing: "领袖锻造营",
+			shouKeZhe: "李老师11",
+			shouKeRiQi: "2023-09-15",
+			shouKeShiJian: "18:00",
+			keChengTuPian: "https://tse4-mm.cn.bing.net/th/id/OIP-C.X_J8jL0bSPQ_jgOrdIbsgQHaEK?rs=1&pid=ImgDetMain",
+			jiaGe: 199.00,
+			isGouMai: true,
+			isShouCang: false,
+			fuFeiLeiXing: "会员免费",
+			keChengYouXiaoQi: "用户注销前有效"
+		}
+		price.value = course.value.jiaGe
+	}
+	// 日期格式：xxxx年xx月xx日（星期x）
+	function getDateWeek(val) {
+		const date = new Date(val);
+		const daysOfWeek = ['日', '一', '二', '三', '四', '五', '六'];
+		const year = date.getFullYear();
+		const month = date.getMonth() + 1; // 注意：月份从0开始
+		const day = date.getDate();
+		const dayOfWeek = daysOfWeek[date.getUTCDay()];
+		// const result = `${year}年${month}月${day}日（星期${dayOfWeek}）`
+		return `${year}年${month}月${day}日（星期${dayOfWeek}）`
+	}
+	onLoad((option) => {
+		const {
+			id
+		} = option;
+		init(id);
+		console.log('onLoad', id)
+	})
+</script>
+
+<style lang="scss" scoped>
+	.container {
+		height: 100vh;
+		width: 100vw;
+		background-color: $uni-bg-color;
+		// padding: 0 20rpx;
+	}
+
+	.course-item {
+		padding: 20rpx;
+		background-color: #fff;
+		display: flex;
+		overflow: hidden;
+		margin: 0 20rpx;
+		border-radius: 10rpx;
+
+		.course-item-image {
+			width: 200rpx;
+			height: 280rpx;
+			flex: 0 0 auto;
+			margin-right: 20rpx;
+
+			.course-image {
+				width: 100%;
+				height: 100%;
+			}
+
+		}
+
+		.course-item-content {
+			flex: 1;
+			position: relative;
+
+			view {
+				margin-bottom: 22rpx;
+			}
+
+			.course-title {
+				font-weight: bold;
+				margin-right: 10px;
+				font-size: 28rpx;
+				color: #000;
+			}
+
+			.course-type,
+			.course-teacher,
+			.course-date,
+			.course-price {
+				font-size: 30rpx;
+				color: #000;
+			}
+
+			.course-price {
+				color: #fe0000;
+				letter-spacing: 2rpx;
+			}
+
+			.button::after {
+				content: none;
+				/* 移除内容 */
+			}
+
+			.button {
+				position: absolute;
+				right: 0;
+				bottom: 0;
+				min-width: 80px;
+				padding: 0 40rpx;
+				white-space: nowrap;
+				height: 45rpx;
+				line-height: 45rpx;
+				font-size: 22rpx;
+				/* padding: 0; */
+				border-radius: 50rpx;
+				color: white;
+				border: none;
+			}
+
+			.free {
+				background-color: #006af4;
+			}
+
+			.purchase {
+				background-color: #fe0000;
+			}
+
+			.member-free {
+				background-color: transparent;
+				background-image: url('~@/static/images/bg-label.png');
+				background-size: cover;
+				background-repeat: no-repeat;
+				color: #000;
+				height: initial;
+				padding: 6rpx 0 3rpx;
+				border-radius: 0;
+			}
+
+			.replay {
+				background-color: #006af4;
+			}
+
+			.purchased {
+				background-color: #006af4;
+			}
+		}
+
+
+	}
+
+	.course-form {
+		padding: 20rpx;
+		background-color: #fff;
+		display: flex;
+		overflow: hidden;
+		border-radius: 10rpx;
+		flex-direction: column;
+		font-size: 30rpx;
+		margin: 0 20rpx;
+
+		.course-form-item {
+			display: flex;
+			justify-content: space-between;
+			width: 100%;
+			margin: 20rpx 0;
+
+			.iconfont {
+				display: inline-block;
+				font-size: 24rpx;
+			}
+		}
+	}
+
+	.pay {
+		position: fixed;
+		bottom: 0;
+		width: 100%;
+		display: flex;
+		justify-content: space-between;
+		padding: 40rpx 20rpx env(safe-area-inset-bottom, 0);
+		background-color: #fff;
+		align-items: center;
+
+		.pay-price {
+			font-size: 60rpx;
+			color: red;
+			font-weight: bold;
+		}
+
+		.pay-btn {
+			width: 200rpx;
+			height: 70rpx;
+			line-height: 70rpx;
+			background-color: red;
+			color: #fff;
+			border-radius: 40rpx;
+		}
+	}
+
+	.text-red {
+		color: red;
+	}
+</style>

pages/goOnEdu/course/courseDetail/coursePay.vue

@@ -0,0 +1,69 @@
+<template>
+	<view class="container">
+		<view class="pay-content">
+			<image src="/static/edu-icon/pay.png" class="pay-img"></image>
+			<text class="pay-text">支付成功</text>
+			<button class="play-btn" @click="toWatch">点击观看</button>
+		</view>
+		<view class="pay-member">
+			<text>个人会员或单位会员免费，点击现在入会></text>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { ref } from 'vue'
+	import { onLoad } from '@dcloudio/uni-app'
+	const courseId = ref("");
+	const toWatch = () => {
+		// uni.redirectTo({
+		// 	url:"/pages/goOnEdu/course/courseDetail/courseDetail?id=" + courseId.value
+		// })
+		uni.navigateBack({
+			delta: 1
+		});
+	}
+	onLoad((option) => {
+		const { id } = option
+		courseId.value = id
+		console.log('onLoad')
+	})
+</script>
+
+<style lang="scss" scoped>
+	.container {
+		height: 100vh;
+		width: 100vw;
+		// padding: 0 20rpx;
+	}
+	.pay-content{
+		height: 70%;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		.pay-img{
+			width: 180rpx;
+			height: 180rpx;
+			margin-bottom: 20rpx;
+		}
+		.pay-text{
+			font-size: 70rpx;
+		}
+		.play-btn{
+			margin-top: 100rpx;
+			width: 200rpx;
+			height: 70rpx;
+			line-height: 70rpx;
+			background-color: #0069f6;
+			color: #fff;
+			border-radius: 40rpx;
+		}
+		
+	}
+	.pay-member{
+		color: red;
+		text-align: center;
+		font-size: 32rpx;
+	}
+</style>

pages/goOnEdu/course/courseMine/mineCredits/mineCredits.vue

@@ -0,0 +1,148 @@
+<template>
+	<view class="container">
+		<view class="list-box">
+			<view class="list-item-box">
+				<view class="list-item">
+					学习年度
+				</view>
+				<view class="list-item">
+					会员网络教育<br/>完成学分情况
+				</view>
+				<view class="list-item">
+					年检情况
+				</view>
+				<view class="list-item">
+					是否完成观看
+				</view>
+			</view>
+			<view class="list-item-box" v-for="item in list" :key="item.id">
+				<view class="list-item">
+					{{item.date}}
+				</view>
+				<view class="list-item">
+					{{item.score}}/{{item.targetScore}}
+				</view>
+				<view class="list-item" v-html="item.status ? '完成学分' : '学分未达标,<br/>不能申请年检'"></view>
+				<view class="list-item">
+					<view class="button" :class="[item.isWatched ? 'primary' : 'error']" @click="onJiaoFei(item)">
+						{{item.isWatched ? '已完成观看' : '未完成'}}
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { ref } from 'vue'
+	import { onLoad } from '@dcloudio/uni-app'
+	const list = ref([])
+	const initList = () => {
+		list.value = [{
+			id: '01',
+			date: '2024（2024.5-2024.30）',
+			score: '24',
+			targetScore: '24',
+			status: 1,
+			isWatched: 1
+		},
+		{
+			id: '02',
+			date: '2023（2023.5-2023.30）',
+			score: '0',
+			targetScore: '24',
+			status: 0,
+			isWatched: 0
+		},
+		{
+			id: '03',
+			date: '2022（2022.5-2022.30）',
+			score: '0',
+			targetScore: '24',
+			status: 0,
+			isWatched: 0
+		},
+		{
+			id: '04',
+			date: '2021（2021.5-2021.30）',
+			score: '0',
+			targetScore: '24',
+			status: 0,
+			isWatched: 0
+		},
+		{
+			id: '02',
+			date: '2020（2020.5-2020.30）',
+			score: '0',
+			targetScore: '24',
+			status: 0,
+			isWatched: 0
+		}]
+	}
+	onLoad(() => {
+		initList()
+		console.log('onLoad')
+	})
+</script>
+
+<style lang="scss">
+	page{
+		background-color: $uni-bg-color;
+	}
+	.container {
+		// height: 100vh;
+		width: 100vw;
+		// background-color: #fff;
+		padding: 0 20rpx env(safe-area-inset-bottom, 0);
+	}
+	.list-box {
+		margin: 20rpx 20rpx;
+		background-color: $uni-bg-color-grey;
+		border-radius: $uni-card-border-radius;
+		padding: 20rpx 15rpx;
+		// margin-bottom: 30rpx;
+		.list-item-box {
+			&:first-child {
+				border-bottom: 5rpx solid #E6E6E6;
+				font-size: $uni-font-size-1;
+				font-weight: bold;
+				.list-item {
+					width: 25%;
+					text-align: center;
+					&:last-child {
+						color: #303133;
+						font-weight: bold;
+					}
+				}
+			}
+			padding: 15rpx 0;
+			text-align: center;
+			font-size: $uni-font-size-3;
+			font-weight: bold;
+			display: flex;
+			align-items: center;
+			.list-item {
+				width: 25%;
+				text-align: center;
+				&:last-child {
+					color: $uni-text-color-inverse;
+					font-weight: normal;
+				}
+			}
+			
+			.button {
+				width: fit-content;
+				border-radius: $uni-card-border-radius;
+				margin: 0 auto;
+			}
+			.primary {
+				padding: 5rpx 25rpx;
+				background-color: $uni-color-primary;
+			}
+			.error {
+				padding: 5rpx 15rpx;
+				background-color: $uni-color-error;
+			}
+		}
+	}
+</style>

pages/goOnEdu/course/courseMine/mineFavi/mineFavi.vue

@@ -0,0 +1,245 @@
+<template>
+	<view class="container">
+		<view class="course-list">
+			<view v-for="(course,index) in courses" :key="course.id">
+				<view class="course-item">
+					<view class="course-item-image">
+						<image class="course-image" :src="course.keChengTuPian" mode="aspectFill"></image>
+					</view>
+					<view class="course-item-content">
+						<view class="course-title">
+							<text>{{ course.keChengMingCheng }}</text>
+							<!-- <image style="width: 25rpx;height: 25rpx;padding-left: 20rpx;"
+								:src="course.isShouCang ? '/static/edu-icon/favi-icon.png' : '/static/edu-icon/no-favi-icon.png'">
+							</image> -->
+						</view>
+						<view class="course-type">{{ course.keChengLeXing }}</view>
+						<view class="course-teacher">
+							<u-icon name="account" size="28"></u-icon>
+							{{ course.shouKeZhe }}
+						</view>
+						<view class="course-date">
+							<u-icon name="clock" size="28"></u-icon>
+							{{ getDateWeek(course.shouKeShiJian) }}
+						</view>
+						<!-- <view class="course-price">￥{{ course.jiaGe }}元</view> -->
+						<!-- <button :class="['button', getButtonClass(course)]">{{ getButtonText(course) }}</button> -->
+					</view>
+				</view>
+				<u-line />
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { ref } from 'vue'
+	import { onLoad } from '@dcloudio/uni-app'
+	// 日期格式：xxxx年xx月xx日（星期x）
+	function getDateWeek(val) {
+		const date = new Date(val);
+		const daysOfWeek = ['日', '一', '二', '三', '四', '五', '六'];
+		const year = date.getFullYear();
+		const month = date.getMonth() + 1; // 注意：月份从0开始
+		const day = date.getDate();
+		const dayOfWeek = daysOfWeek[date.getUTCDay()];
+		// const result = `${year}年${month}月${day}日（星期${dayOfWeek}）`
+		return `${year}年${month}月${day}日（星期${dayOfWeek}）`
+	}
+	
+	const courses = ref([]);
+	const initCourse = () =>{
+		// 获取列表
+		courses.value = [{
+			id: 1,
+			keChengMingCheng: "前端开发基础前端开发基础前端开发基础",
+			keChengLeXing: "精英训练营",
+			shouKeZhe: "张老师",
+			shouKeShiJian: "2023-10-01",
+			keChengTuPian: "https://tse3-mm.cn.bing.net/th/id/OIP-C.YKoZzgmubNBxQ8j-mmoTKAHaEK?rs=1&pid=ImgDetMain",
+			jiaGe: 99.00,
+			isGouMai: false,
+			isShouCang: true,
+			fuFeiLeiXing: "免费" // 新增字段，标识课程的付费类型
+		},
+		{
+			id: 2,
+			keChengMingCheng: "Vue.js 从入门到精通",
+			keChengLeXing: "领袖锻造营",
+			shouKeZhe: "李老师",
+			shouKeShiJian: "2023-09-15",
+			keChengTuPian: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
+			jiaGe: 199.00,
+			isGouMai: false,
+			isShouCang: false,
+			fuFeiLeiXing: "会员免费"
+		},
+		{
+			id: 3,
+			keChengMingCheng: "React 开发实战",
+			keChengLeXing: "领袖锻造营",
+			shouKeZhe: "王老师",
+			shouKeShiJian: "2023-11-05",
+			keChengTuPian: "https://desk-fd.zol-img.com.cn/t_s960x600c5/g4/M03/00/0C/Cg-4zFS8bC-Ie9zBADCvovJAqiEAATJ8wDX__cAMK-6184.jpg",
+			jiaGe: 149.00,
+			isGouMai: false,
+			isShouCang: false,
+			fuFeiLeiXing: "付费"
+		},
+		{
+			id: 4,
+			keChengMingCheng: "Node.js 全栈开发",
+			keChengLeXing: "合规专训营",
+			shouKeZhe: "赵老师",
+			shouKeShiJian: "2023-08-20",
+			keChengTuPian: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
+			jiaGe: 299.00,
+			isGouMai: true,
+			isShouCang: false,
+			fuFeiLeiXing: "付费"
+		},
+		{
+			id: 5,
+			keChengMingCheng: "移动端开发技巧",
+			keChengLeXing: "精英训练营",
+			shouKeZhe: "钱老师",
+			shouKeShiJian: "2025-07-18",
+			keChengTuPian: "https://desk-fd.zol-img.com.cn/t_s960x600c5/g4/M03/00/0C/Cg-4zFS8bC-Ie9zBADCvovJAqiEAATJ8wDX__cAMK-6184.jpg",
+			jiaGe: 89.00,
+			isGouMai: true,
+			isShouCang: false,
+			fuFeiLeiXing: "付费"
+		},
+		{
+			id: 6,
+			keChengMingCheng: "11Vue.js 从入门到精通",
+			keChengLeXing: "领袖锻造营",
+			shouKeZhe: "李老师11",
+			shouKeShiJian: "2023-09-15",
+			keChengTuPian: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
+			jiaGe: 199.00,
+			isGouMai: true,
+			isShouCang: false,
+			fuFeiLeiXing: "会员免费"
+		},
+		{
+			id: 7,
+			keChengMingCheng: "113Vue.js 从入门到精通",
+			keChengLeXing: "领袖锻造营",
+			shouKeZhe: "李老师11",
+			shouKeShiJian: "2025-09-15",
+			keChengTuPian: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
+			jiaGe: 199.00,
+			isGouMai: true,
+			isShouCang: false,
+			fuFeiLeiXing: "会员免费"
+		}]
+	}
+	onLoad(() => {
+		initCourse();
+		console.log('onLoad')
+	})
+</script>
+
+<style lang="scss" scoped>
+	.container {
+		// height: 100vh;
+		width: 100vw;
+		background-color: #fff;
+		padding: 0 20rpx env(safe-area-inset-bottom, 0);
+	}
+	.course-item {
+		margin: 20rpx 0;
+		display: flex;
+		overflow: hidden;
+	
+		.course-item-image {
+			width: 200rpx;
+			height: 260rpx;
+			flex: 0 0 auto;
+			margin-right: 20rpx;
+	
+			.course-image {
+				width: 100%;
+			}
+	
+		}
+	
+		.course-item-content {
+			flex: 1;
+			position: relative;
+	
+			view {
+				margin-bottom: 15rpx;
+			}
+	
+			.course-title {
+				font-weight: bold;
+				margin-right: 10px;
+				font-size: 28rpx;
+				color: #000;
+			}
+	
+			.course-type,
+			.course-teacher,
+			.course-date,
+			.course-price {
+				font-size: 30rpx;
+				color: #000;
+			}
+	
+			.course-price {
+				color: #fe0000;
+				letter-spacing: 2rpx;
+			}
+	
+			.button::after {
+				content: none;
+				/* 移除内容 */
+			}
+	
+			.button {
+				position: absolute;
+				right: 0;
+				bottom: 0;
+				min-width: 80px;
+				padding: 0 40rpx;
+				white-space: nowrap;
+				height: 45rpx;
+				line-height: 45rpx;
+				font-size: 22rpx;
+				/* padding: 0; */
+				border-radius: 50rpx;
+				color: white;
+				border: none;
+			}
+	
+			.free {
+				background-color: #006af4;
+			}
+	
+			.purchase {
+				background-color: #fe0000;
+			}
+	
+			.member-free {
+				background-color: transparent;
+				background-image: url('~@/static/images/bg-label.png');
+				background-size: cover;
+				background-repeat: no-repeat;
+				color: #000;
+				height: initial;
+				padding: 6rpx 0 3rpx;
+				border-radius: 0;
+			}
+	
+			.replay {
+				background-color: #006af4;
+			}
+	
+			.purchased {
+				background-color: #006af4;
+			}
+		}
+	}
+</style>

pages/goOnEdu/course/courseMine/mineRecord/mineRecord.vue

@@ -0,0 +1,245 @@
+<template>
+	<view class="container">
+		<view class="course-list">
+			<view v-for="(course,index) in courses" :key="course.id">
+				<view class="course-item">
+					<view class="course-item-image">
+						<image class="course-image" :src="course.keChengTuPian" mode="aspectFill"></image>
+					</view>
+					<view class="course-item-content">
+						<view class="course-title">
+							<text>{{ course.keChengMingCheng }}</text>
+							<!-- <image style="width: 25rpx;height: 25rpx;padding-left: 20rpx;"
+								:src="course.isShouCang ? '/static/edu-icon/favi-icon.png' : '/static/edu-icon/no-favi-icon.png'">
+							</image> -->
+						</view>
+						<view class="course-type">{{ course.keChengLeXing }}</view>
+						<view class="course-teacher">
+							<u-icon name="account" size="28"></u-icon>
+							{{ course.shouKeZhe }}
+						</view>
+						<view class="course-date">
+							<u-icon name="clock" size="28"></u-icon>
+							{{ getDateWeek(course.shouKeShiJian) }}
+						</view>
+						<!-- <view class="course-price">￥{{ course.jiaGe }}元</view> -->
+						<!-- <button :class="['button', getButtonClass(course)]">{{ getButtonText(course) }}</button> -->
+					</view>
+				</view>
+				<u-line />
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { ref } from 'vue'
+	import { onLoad } from '@dcloudio/uni-app'
+	// 日期格式：xxxx年xx月xx日（星期x）
+	function getDateWeek(val) {
+		const date = new Date(val);
+		const daysOfWeek = ['日', '一', '二', '三', '四', '五', '六'];
+		const year = date.getFullYear();
+		const month = date.getMonth() + 1; // 注意：月份从0开始
+		const day = date.getDate();
+		const dayOfWeek = daysOfWeek[date.getUTCDay()];
+		// const result = `${year}年${month}月${day}日（星期${dayOfWeek}）`
+		return `${year}年${month}月${day}日（星期${dayOfWeek}）`
+	}
+	
+	const courses = ref([]);
+	const initCourse = () =>{
+		// 获取列表
+		courses.value = [{
+			id: 1,
+			keChengMingCheng: "前端开发基础前端开发基础前端开发基础",
+			keChengLeXing: "精英训练营",
+			shouKeZhe: "张老师",
+			shouKeShiJian: "2023-10-01",
+			keChengTuPian: "https://tse3-mm.cn.bing.net/th/id/OIP-C.YKoZzgmubNBxQ8j-mmoTKAHaEK?rs=1&pid=ImgDetMain",
+			jiaGe: 99.00,
+			isGouMai: false,
+			isShouCang: true,
+			fuFeiLeiXing: "免费" // 新增字段，标识课程的付费类型
+		},
+		{
+			id: 2,
+			keChengMingCheng: "Vue.js 从入门到精通",
+			keChengLeXing: "领袖锻造营",
+			shouKeZhe: "李老师",
+			shouKeShiJian: "2023-09-15",
+			keChengTuPian: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
+			jiaGe: 199.00,
+			isGouMai: false,
+			isShouCang: false,
+			fuFeiLeiXing: "会员免费"
+		},
+		{
+			id: 3,
+			keChengMingCheng: "React 开发实战",
+			keChengLeXing: "领袖锻造营",
+			shouKeZhe: "王老师",
+			shouKeShiJian: "2023-11-05",
+			keChengTuPian: "https://desk-fd.zol-img.com.cn/t_s960x600c5/g4/M03/00/0C/Cg-4zFS8bC-Ie9zBADCvovJAqiEAATJ8wDX__cAMK-6184.jpg",
+			jiaGe: 149.00,
+			isGouMai: false,
+			isShouCang: false,
+			fuFeiLeiXing: "付费"
+		},
+		{
+			id: 4,
+			keChengMingCheng: "Node.js 全栈开发",
+			keChengLeXing: "合规专训营",
+			shouKeZhe: "赵老师",
+			shouKeShiJian: "2023-08-20",
+			keChengTuPian: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
+			jiaGe: 299.00,
+			isGouMai: true,
+			isShouCang: false,
+			fuFeiLeiXing: "付费"
+		},
+		{
+			id: 5,
+			keChengMingCheng: "移动端开发技巧",
+			keChengLeXing: "精英训练营",
+			shouKeZhe: "钱老师",
+			shouKeShiJian: "2025-07-18",
+			keChengTuPian: "https://desk-fd.zol-img.com.cn/t_s960x600c5/g4/M03/00/0C/Cg-4zFS8bC-Ie9zBADCvovJAqiEAATJ8wDX__cAMK-6184.jpg",
+			jiaGe: 89.00,
+			isGouMai: true,
+			isShouCang: false,
+			fuFeiLeiXing: "付费"
+		},
+		{
+			id: 6,
+			keChengMingCheng: "11Vue.js 从入门到精通",
+			keChengLeXing: "领袖锻造营",
+			shouKeZhe: "李老师11",
+			shouKeShiJian: "2023-09-15",
+			keChengTuPian: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
+			jiaGe: 199.00,
+			isGouMai: true,
+			isShouCang: false,
+			fuFeiLeiXing: "会员免费"
+		},
+		{
+			id: 7,
+			keChengMingCheng: "113Vue.js 从入门到精通",
+			keChengLeXing: "领袖锻造营",
+			shouKeZhe: "李老师11",
+			shouKeShiJian: "2025-09-15",
+			keChengTuPian: "https://pic3.zhimg.com/v2-e52354ffdbd94a8e0a7649eacd34a788_r.jpg?source=1940ef5c",
+			jiaGe: 199.00,
+			isGouMai: true,
+			isShouCang: false,
+			fuFeiLeiXing: "会员免费"
+		}]
+	}
+	onLoad(() => {
+		initCourse();
+		console.log('onLoad')
+	})
+</script>
+
+<style lang="scss" scoped>
+	.container {
+		// height: 100vh;
+		width: 100vw;
+		background-color: #fff;
+		padding: 0 20rpx env(safe-area-inset-bottom, 0);
+	}
+	.course-item {
+		margin: 20rpx 0;
+		display: flex;
+		overflow: hidden;
+	
+		.course-item-image {
+			width: 200rpx;
+			height: 260rpx;
+			flex: 0 0 auto;
+			margin-right: 20rpx;
+	
+			.course-image {
+				width: 100%;
+			}
+	
+		}
+	
+		.course-item-content {
+			flex: 1;
+			position: relative;
+	
+			view {
+				margin-bottom: 15rpx;
+			}
+	
+			.course-title {
+				font-weight: bold;
+				margin-right: 10px;
+				font-size: 28rpx;
+				color: #000;
+			}
+	
+			.course-type,
+			.course-teacher,
+			.course-date,
+			.course-price {
+				font-size: 30rpx;
+				color: #000;
+			}
+	
+			.course-price {
+				color: #fe0000;
+				letter-spacing: 2rpx;
+			}
+	
+			.button::after {
+				content: none;
+				/* 移除内容 */
+			}
+	
+			.button {
+				position: absolute;
+				right: 0;
+				bottom: 0;
+				min-width: 80px;
+				padding: 0 40rpx;
+				white-space: nowrap;
+				height: 45rpx;
+				line-height: 45rpx;
+				font-size: 22rpx;
+				/* padding: 0; */
+				border-radius: 50rpx;
+				color: white;
+				border: none;
+			}
+	
+			.free {
+				background-color: #006af4;
+			}
+	
+			.purchase {
+				background-color: #fe0000;
+			}
+	
+			.member-free {
+				background-color: transparent;
+				background-image: url('~@/static/images/bg-label.png');
+				background-size: cover;
+				background-repeat: no-repeat;
+				color: #000;
+				height: initial;
+				padding: 6rpx 0 3rpx;
+				border-radius: 0;
+			}
+	
+			.replay {
+				background-color: #006af4;
+			}
+	
+			.purchased {
+				background-color: #006af4;
+			}
+		}
+	}
+</style>

pages/goOnEdu/course/index.vue

@@ -9,7 +9,7 @@
 			<view  class="tab-item" :class="{ active: tabValue === 'courseHome' }" @click="selectTab('courseHome')">
 				<image src="/static/tabbar-icon/home-fill.png" v-if="tabValue === 'courseHome'"></image>
 				<image src="/static/tabbar-icon/home.png" v-else></image>
-				<text>放映厅</text>
+				<text>首页</text>
 			</view>-
 			<view  class="tab-item" :class="{ active: tabValue === 'courseMine' }" @click="selectTab('courseMine')">
 				<image src="/static/tabbar-icon/user-s.png" v-if="tabValue === 'courseMine'"></image>

pages/researchReport/reportHome/reportHome.vue

@@ -1,19 +1,23 @@
 <template>
-	<view>
-		
+	<view class="container">
+		研究报告
 	</view>
 </template>
 
-<script>
-	export default {
-		data() {
-			return {
-				
-			};
-		}
-	}
+<script setup>
+	import { ref } from 'vue'
+	import { onLoad } from '@dcloudio/uni-app'
+	
+	onLoad(() => {
+		console.log('onLoad')
+	})
 </script>
 
-<style lang="scss">
-
-</style>
+<style lang="scss" scoped>
+	.container {
+		height: 100%;
+		width: 100vw;
+		// background-color: ;
+		// padding: 0 20rpx;
+	}
+</style>

static/fonts/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 4808041 */
-  src: url('./static/fonts/iconfont.woff2?t=1736921813084') format('woff2'),
-       url('./static/fonts/iconfont.woff?t=1736921813084') format('woff'),
-       url('./static/fonts/iconfont.ttf?t=1736921813084') format('truetype');
+  src: url('iconfont.woff2?t=1738909595998') format('woff2'),
+       url('iconfont.woff?t=1738909595998') format('woff'),
+       url('iconfont.ttf?t=1738909595998') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,10 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-sangedian-copy:before {
+  content: "\e600";
+}
+
 .icon-success-filling:before {
   content: "\e68b";
 }

static/fonts/iconfont.json

@@ -6,6 +6,13 @@
   "description": "",
   "glyphs": [
     {
+      "icon_id": "11116681",
+      "name": "三个点",
+      "font_class": "sangedian-copy",
+      "unicode": "e600",
+      "unicode_decimal": 58880
+    },
+    {
       "icon_id": "15838611",
       "name": "success-filling",
       "font_class": "success-filling",

store/courseStore.js

@@ -0,0 +1,13 @@
+import {
+	defineStore
+} from 'pinia'
+export const useCourseStore = defineStore('course', {
+	state: () => ({
+		currentTab: 0,
+	}),
+	actions: {
+		setCurrentTab(index) {
+			this.currentTab = index;
+		},
+	}
+})