diff --git a/pages/course/chapterDetail.vue b/pages/course/chapterDetail.vue index 7bfc3c6..fdf3c7f 100644 --- a/pages/course/chapterDetail.vue +++ b/pages/course/chapterDetail.vue @@ -323,7 +323,7 @@ export default { plus.screen.lockOrientation("default"); this.options = options; - this.getCourseDescriptionData(); + // this.getUserInfo() // this.getCateList() }, @@ -333,10 +333,12 @@ export default { }, onShow() { this.screenLoading=false - this.currentCateIndex = 0; + + this.currentCateIndex = this.options.videoIndex?this.options.videoIndex:0; // #ifdef APP-PLUS plus.screen.unlockOrientation(); //解除锁定屏幕方向 plus.screen.lockOrientation("portrait-primary"); + this.getCourseDescriptionData(); // #endif }, computed: { @@ -496,7 +498,7 @@ export default { that.curriculumData = res.data.detail; that.videoArray = res.data.videos; if (that.videoArray.length > 0) { - this.currentVideo = that.videoArray[0]; + this.currentVideo = that.videoArray[that.currentCateIndex]; this.initVideo(); } // if (res.obj.correlatedList && res.obj.correlatedList.length > 0) { diff --git a/pages/course/courseDetail.vue b/pages/course/courseDetail.vue index 48dedae..9f04574 100644 --- a/pages/course/courseDetail.vue +++ b/pages/course/courseDetail.vue @@ -87,7 +87,7 @@ v-html="course.content" > - {{ isHideCourseInfo ? "展开" : "收起" }} - + --> @@ -106,48 +106,65 @@ - - + + + 精彩试听 + + + {{ v.title }} - - + + {{ v.title }} + + + + + + + + + 未购买 - + 有效期至{{ v.endTime }} - - - - - 有效期至{{ v.endTime }}2024:06:25 00:00:00 + + + + + + + + + + + + - - + + + {{ item.title }} - + /> --> 【共{{ item.videoList.length }}课时】 + + + + + + 【{{ video.type == "2" ? "音频" : "视频" }}】{{ getNumber(videoIndex + 1) }} + + 暂无文章 - + + @@ -665,7 +693,7 @@ export default { } }, //课程详情 - async gotoDetail(v, video, index) { + async gotoDetail(v, videoIndex) { console.log("v at line 668:", v); // if ( // this.cateList[this.currentCateIndex].isBuy == 1 || @@ -674,7 +702,7 @@ export default { // ) { uni.navigateTo({ // url: '../bookShop/commodityDetail?id=' + item.id - url: `/pages/course/chapterDetail?navTitle=${this.pageTitle}&title=${v.title}&id=${v.id}&conditions=${v.conditions}&videoId=${video.id}`, + url: `/pages/course/chapterDetail?navTitle=${this.pageTitle}&title=${v.title}&id=${v.id}&conditions=${v.conditions}&videoIndex=${videoIndex}`, }); // } else { // this.$commonJS.showToast("请先购买课程"); @@ -2046,7 +2074,7 @@ export default { // background-image: linear-gradient(108deg, #cae9f9 0%, #e1f6fc8c 50%); // background-image: linear-gradient(180deg, #cfe0ff 0%, #fff 50%); - padding: 0 20rpx; + // padding: 0 20rpx; font-size: 40rpx; @@ -2169,15 +2197,47 @@ export default { .chapter_title { + width: 100%; font-size: 28rpx; display: flex; align-items: center; + position: relative; - justify-content: space-between; + // justify-content: space-between; + .top{ + width: 100%; + display: flex; + align-items: center; + .left{ + display: flex; + align-items: center; + } + .right{ + // float: right; + position: absolute; + right: 0; + } + } .not_purchased { - color: #636262; + position: relative; +.spot{ + width: 8rpx; + height: 8rpx; + position: absolute; + right: -4rpx; + border-radius: 8rpx; + background-color: #33435D; + bottom: -4rpx; +} + color: #33435D; margin-left: 20rpx; font-size: 24rpx; + padding:0 20rpx; + border-bottom: 2rpx dotted #33435D; + text{ + margin: 0 10rpx; + letter-spacing: 1rpx; + } } } .course_title { @@ -2273,8 +2333,7 @@ export default { justify-content: space-between; } .commonDetailPage { - background: linear-gradient(108deg, #D2E7FC 0%, #EAEDF8 50%) !important; -} + } .course_info_box { margin-bottom:10rpx; @@ -2290,25 +2349,93 @@ margin-bottom:10rpx; .catalogue_title{ - background-image: linear-gradient(108deg, #8BBDFE 0%, #0261ffd6 50%); - border:4rpx solid #1FB2F8; - box-shadow: 0 2px 12px 0 rgba(255,255,255,.1); - border-radius:40rpx; - color:#fff; - width:200rpx; - height:70rpx; - display:inline-block; - padding:10rpx 20rpx; + background: linear-gradient(130deg,#162A4F 0%, #1E4C7D 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + font-size: 42rpx; + font-weight: bold; + letter-spacing: 4rpx; + + // border:4rpx solid #1FB2F8; + // box-shadow: 0 2px 12px 0 rgba(255,255,255,.1); + // border-radius:40rpx; + // color:#fff; + // width:200rpx; + // height:70rpx; + // display:inline-block; + // padding:10rpx 20rpx; } .chapter_content { padding: 20rpx; - padding-top:60rpx; - margin-top:-40rpx; + // padding-top:60rpx; + margin-top:40rpx; border:4rpx solid #FFFFFC; + background-image: linear-gradient(52deg, #E8F6FF 0%, #E3F2FE 50%); // background-image: linear-gradient(-180deg, #8BBDFE 0%, #B4DCFF 100%); - background:rgba(255, 255, 255, 0.85); - box-shadow: 0px 0px 3px 0px rgba(0, 82, 79, 0.2) !important; - border-radius:20rpx; + // background:rgba(255, 255, 255, 0.85); + // background:rgba(255, 255, 255, 0.85); + box-shadow: 0px 0px 10px 0px #89C8E9 !important; + border-top-right-radius:40rpx; + border-bottom-left-radius:40rpx; + .videoList{ + // padding:0 20rpx; + display: flex; + align-items: center; + // justify-content: space-between; + .video_item{ + width: 24%; + font-size: 22rpx; + margin: 10rpx 0; + background:rgba(255, 255, 255, 0.85); + box-shadow: 0 2px 12px 0 rgba(255,255,255,.1); + border-radius: 10rpx; + padding: 10rpx 20rpx; + margin-right: 1%; + + color: #333; + letter-spacing: 2rpx; + + } + } +} + +.line{ + width: 16rpx; + height: 50rpx; + border-top-right-radius:12rpx ; + border-bottom-right-radius:12rpx ; + margin-right: 20rpx; + background-image: linear-gradient(108deg, #2786EB 0%, #35A6FF 100%); +} + +.containerBg2{ + padding-top: 40rpx; + // margin-top: 100rpx; + background: linear-gradient(108deg, #C3E7FF 0%, #59BAFE 100%) !important; + + .shiting{ + line-height: 100rpx; + background: linear-gradient(130deg, #4FA1FD 0%, #12F3FF 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + margin-bottom: 20rpx; + // background-image: linear-gradient(108deg, #4FA1FD 100%, #4FA1FD 0%); + // border:4rpx solid #1FB2F8; + // box-shadow: 0 2px 12px 0 rgba(255,255,255,.1); + // border-radius:40rpx; + color:#fff; + // width:200rpx; + // height:70rpx; + // display:inline-block; + // padding:10rpx 20rpx; + font-size: 72rpx; + text-align: center; + } + .shiting_content{ + padding:20rpx; + + } + }