|
@@ -15,26 +15,26 @@
|
|
<view v-for="(course,index) in filterCourses" :key="course.id" @click="toPage(course)">
|
|
<view v-for="(course,index) in filterCourses" :key="course.id" @click="toPage(course)">
|
|
<view class="course-item">
|
|
<view class="course-item">
|
|
<view class="course-item-image">
|
|
<view class="course-item-image">
|
|
- <image class="course-image" :src="course.keChengTuPian" mode="aspectFill"></image>
|
|
|
|
|
|
+ <image class="course-image" :src="course.imgUrl" mode="aspectFill"></image>
|
|
</view>
|
|
</view>
|
|
<view class="course-item-content">
|
|
<view class="course-item-content">
|
|
<view class="course-title">
|
|
<view class="course-title">
|
|
- <text>{{ course.keChengMingCheng }}</text>
|
|
|
|
|
|
+ <text>{{ course.courseName }}</text>
|
|
<image style="width: 25rpx;height: 25rpx;padding-left: 20rpx;"
|
|
<image style="width: 25rpx;height: 25rpx;padding-left: 20rpx;"
|
|
- :src="course.isShouCang ? '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'"
|
|
|
|
|
|
+ :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)">
|
|
</image>
|
|
</image>
|
|
</view>
|
|
</view>
|
|
- <view class="course-type">{{ course.keChengLeXing }}</view>
|
|
|
|
|
|
+ <view class="course-type">{{ course.courseType }}</view>
|
|
<view class="course-teacher">
|
|
<view class="course-teacher">
|
|
<u-icon name="account" size="28"></u-icon>
|
|
<u-icon name="account" size="28"></u-icon>
|
|
- {{ course.shouKeZhe }}
|
|
|
|
|
|
+ {{ course.name }}
|
|
</view>
|
|
</view>
|
|
<view class="course-date">
|
|
<view class="course-date">
|
|
<u-icon name="clock" size="28"></u-icon>
|
|
<u-icon name="clock" size="28"></u-icon>
|
|
- {{ getDateWeek(course.shouKeShiJian) }}
|
|
|
|
|
|
+ {{ getDateWeek(course.courseDate) }}
|
|
</view>
|
|
</view>
|
|
- <view class="course-price">¥{{ course.jiaGe }}元</view>
|
|
|
|
|
|
+ <view class="course-price">¥{{ course.price }}元</view>
|
|
<button :class="['button', getButtonClass(course)]">{{ getButtonText(course) }}</button>
|
|
<button :class="['button', getButtonClass(course)]">{{ getButtonText(course) }}</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
@@ -68,108 +68,108 @@
|
|
const filterCourses = ref([]);
|
|
const filterCourses = ref([]);
|
|
const courses = ref([{
|
|
const courses = ref([{
|
|
id: 1,
|
|
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: "免费" // 新增字段,标识课程的付费类型
|
|
|
|
|
|
+ courseName: "前端开发基础前端开发基础前端开发基础",
|
|
|
|
+ courseType: "精英训练营",
|
|
|
|
+ name: "张老师",
|
|
|
|
+ courseDate: "2023-10-01",
|
|
|
|
+ imgUrl: "https://tse3-mm.cn.bing.net/th/id/OIP-C.YKoZzgmubNBxQ8j-mmoTKAHaEK?rs=1&pid=ImgDetMain",
|
|
|
|
+ price: 99.00,
|
|
|
|
+ hasBuy: false,
|
|
|
|
+ hasFavi: true,
|
|
|
|
+ payType: "免费" // 新增字段,标识课程的付费类型
|
|
},
|
|
},
|
|
{
|
|
{
|
|
id: 2,
|
|
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: "会员免费"
|
|
|
|
|
|
+ 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,
|
|
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: "付费"
|
|
|
|
|
|
+ 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,
|
|
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: "付费"
|
|
|
|
|
|
+ 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,
|
|
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: "付费"
|
|
|
|
|
|
+ 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,
|
|
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: "会员免费"
|
|
|
|
|
|
+ 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,
|
|
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: "会员免费"
|
|
|
|
|
|
+ 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: "会员免费"
|
|
},
|
|
},
|
|
]);
|
|
]);
|
|
|
|
|
|
// 按钮的文字
|
|
// 按钮的文字
|
|
function getButtonText(course) {
|
|
function getButtonText(course) {
|
|
const currentDate = new Date();
|
|
const currentDate = new Date();
|
|
- const classDate = new Date(course.shouKeShiJian);
|
|
|
|
|
|
+ const classDate = new Date(course.courseDate);
|
|
|
|
|
|
- if (course.fuFeiLeiXing === "免费") {
|
|
|
|
|
|
+ if (course.payType === "免费") {
|
|
return "免费";
|
|
return "免费";
|
|
}
|
|
}
|
|
- if (course.fuFeiLeiXing === "会员免费") {
|
|
|
|
|
|
+ if (course.payType === "会员免费") {
|
|
if (isMember.value) return "会员免费";
|
|
if (isMember.value) return "会员免费";
|
|
- if (!course.isGouMai && !isMember.value) return "会员免费";
|
|
|
|
- if (course.isGouMai) {
|
|
|
|
|
|
+ if (!course.hasBuy && !isMember.value) return "会员免费";
|
|
|
|
+ if (course.hasBuy) {
|
|
return currentDate < classDate ? "点击查看" : "点击查看回放";
|
|
return currentDate < classDate ? "点击查看" : "点击查看回放";
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
- if (course.fuFeiLeiXing === "付费") {
|
|
|
|
- if (!course.isGouMai) return "点击购买";
|
|
|
|
|
|
+ if (course.payType === "付费") {
|
|
|
|
+ if (!course.hasBuy) return "点击购买";
|
|
return currentDate < classDate ? "点击查看" : "点击查看回放";
|
|
return currentDate < classDate ? "点击查看" : "点击查看回放";
|
|
}
|
|
}
|
|
|
|
|
|
@@ -179,14 +179,14 @@
|
|
|
|
|
|
// 按钮的样式
|
|
// 按钮的样式
|
|
function getButtonClass(course) {
|
|
function getButtonClass(course) {
|
|
- if (course.fuFeiLeiXing === "免费") return 'free';
|
|
|
|
- if (course.fuFeiLeiXing === "会员免费") {
|
|
|
|
|
|
+ if (course.payType === "免费") return 'free';
|
|
|
|
+ if (course.payType === "会员免费") {
|
|
if (isMember.value) return 'member-free';
|
|
if (isMember.value) return 'member-free';
|
|
- return course.isGouMai ? (new Date() < new Date(course.shouKeShiJian) ? 'purchased' : 'replay') :
|
|
|
|
|
|
+ return course.hasBuy ? (new Date() < new Date(course.courseDate) ? 'purchased' : 'replay') :
|
|
'member-free';
|
|
'member-free';
|
|
}
|
|
}
|
|
- if (course.fuFeiLeiXing === "付费") {
|
|
|
|
- return course.isGouMai ? (new Date() < new Date(course.shouKeShiJian) ? 'purchased' : 'replay') : 'purchase';
|
|
|
|
|
|
+ if (course.payType === "付费") {
|
|
|
|
+ return course.hasBuy ? (new Date() < new Date(course.courseDate) ? 'purchased' : 'replay') : 'purchase';
|
|
}
|
|
}
|
|
return 'error';
|
|
return 'error';
|
|
}
|
|
}
|
|
@@ -212,7 +212,7 @@
|
|
filterCourses.value = courses.value
|
|
filterCourses.value = courses.value
|
|
return
|
|
return
|
|
}
|
|
}
|
|
- filterCourses.value = courses.value.filter(item => item.keChengLeXing == tabsList.value[index].name)
|
|
|
|
|
|
+ filterCourses.value = courses.value.filter(item => item.courseType == tabsList.value[index].name)
|
|
}
|
|
}
|
|
// 搜索
|
|
// 搜索
|
|
function search(e) {
|
|
function search(e) {
|
|
@@ -222,7 +222,7 @@
|
|
function collectCourse(id,index) {
|
|
function collectCourse(id,index) {
|
|
// 联调后端,
|
|
// 联调后端,
|
|
// 返回成功后
|
|
// 返回成功后
|
|
- courses.value[index].isShouCang = !courses.value[index].isShouCang
|
|
|
|
|
|
+ courses.value[index].hasFavi = !courses.value[index].hasFavi
|
|
}
|
|
}
|
|
// 初始化
|
|
// 初始化
|
|
function init() {
|
|
function init() {
|
|
@@ -233,7 +233,7 @@
|
|
|
|
|
|
function toPage(course) {
|
|
function toPage(course) {
|
|
uni.navigateTo({
|
|
uni.navigateTo({
|
|
- url: `/pages/goOnEdu/course/courseDetail/courseDetail?id=${course.id}&name=${course.keChengMingCheng}`
|
|
|
|
|
|
+ url: `/pages/goOnEdu/course/courseDetail/courseDetail?id=${course.id}&name=${course.courseName}`
|
|
});
|
|
});
|
|
}
|
|
}
|
|
onMounted(() => {
|
|
onMounted(() => {
|