diff --git a/course/courseDetail/courseDetail.vue b/course/courseDetail/courseDetail.vue index 60fc79b..5ca7062 100644 --- a/course/courseDetail/courseDetail.vue +++ b/course/courseDetail/courseDetail.vue @@ -2,20 +2,25 @@ - + - + - {{ item.name }} @@ -33,6 +38,9 @@ + + + @@ -41,7 +49,6 @@ - @@ -51,9 +58,9 @@ - + {{ item.name }} - + @@ -347,13 +354,19 @@ // 判断文件是图片/视频/pdf等 handleFileType(row) { const type = row.fileType - if (this.$util.exts.video.includes(type)) { - row.isVideo = true - } else if (this.$util.exts.img.includes(type)) { - row.isPic = true - } else if (this.$util.exts.doc.includes(type)) { + if (type === 'pptx' || type === 'ppt') { + row.isPpt = true row.isDoc = true - if (type === 'pptx' || type === 'ppt') row.fileUrl = 'https://view.officeapps.live.com/op/view.aspx?src=' + row.fileUrl + row.viewUrl = 'https://view.officeapps.live.com/op/view.aspx?src=' + row.fileUrl + } else { + if (this.$util.exts.video.includes(type)) { + row.isVideo = true + } else if (this.$util.exts.img.includes(type)) { + row.isPic = true + } else if (this.$util.exts.doc.includes(type)) { + row.isDoc = true + } + row.viewUrl = row.fileUrl } this.curRow = row }, @@ -375,8 +388,13 @@ this.playListVisible = !this.playListVisible }, hidePlayList() { + console.log('close clicked') this.playListVisible = false - } + }, + // 关闭预览状态 + closePreview() { + this.curRow = {} + }, } } @@ -403,35 +421,80 @@ .select-epi { z-index: 1000; position: fixed; - top: 30px; + top: 40px; right: -5px; - padding: 8px; + padding: 5px 12px; background-color: rgba(0, 0, 0, .6); + border-radius: 0; border-top-left-radius: 10px; border-bottom-left-radius: 10px; + // border-top-right-radius: 0; + // border-bottom-right-radius: 0; .icon { - width: 20px; + width: 24px; } } + .webview-wrap { + height: 90vh; + overflow: hidden; + } + .webview-mask { + z-index: 9; + position: fixed; + top: 0; + left: 0; + display: flex; + justify-content: flex-end; + align-items: center; + width: 100%; + height: 50rpx; + padding: 0 20rpx; + background-color: #fff; + box-sizing: border-box; + .icon { + width: 44rpx; + height: 44rpx; + } + } + .webview-close { + z-index: 10; + position: fixed; + top: 20rpx; + right: 30rpx; + width: 44rpx; + height: 44rpx; + } +} +.webview { + position: absolute; + top: -80rpx; } .chapters-full { - z-index: 2; + z-index: 100; position: fixed; top: 0; right: 0; - width: 70vw; + width: 100vw; height: 100vh; padding: 15px; margin-bottom: 20px; color: #fff; - background-color: rgba(0, 0, 0, .6); + background-color: rgba(0, 0, 0, .7); box-sizing: border-box; - .close { + .close-wrap { + z-index: 100; position: absolute; top: 10px; right: 10px; - width: 24px; - height: 24px; + display: flex; + justify-content: center; + align-items: center; + width: 80rpx; + height: 80rpx; + } + .close { + width: 22px; + height: 22px; } .chapters-scroll { height: 95vh; @@ -450,8 +513,8 @@ .sectionName { display: flex; align-items: center; - padding: 0 6px; - margin: 8px 0; + padding: 10rpx 6px; + margin: 6px 0; font-size: 12px; &.active { @@ -459,12 +522,11 @@ } } .ext { - width: 18px; - // height: 18px; + width: 14px; margin-right: 12px; } .text { - max-width: 95%; + max-width: 75vw; text-overflow: ellipsis; } } diff --git a/course/practiceDetail/practiceDetail.vue b/course/practiceDetail/practiceDetail.vue index e9e3ee9..a4329d0 100644 --- a/course/practiceDetail/practiceDetail.vue +++ b/course/practiceDetail/practiceDetail.vue @@ -118,8 +118,10 @@ diff --git a/user/selectAccount/selectAccount.vue b/user/selectAccount/selectAccount.vue index c4bd35b..7ab4bb6 100644 --- a/user/selectAccount/selectAccount.vue +++ b/user/selectAccount/selectAccount.vue @@ -1,6 +1,6 @@