diff --git a/src/pages/course/index.vue b/src/pages/course/index.vue index 5e0ad9f4..a9740701 100644 --- a/src/pages/course/index.vue +++ b/src/pages/course/index.vue @@ -1,754 +1,733 @@ - \ No newline at end of file +.course-center { + position: relative; + display: flex; + flex-direction: column; + .top-bg { + background: linear-gradient(16deg, rgba(234, 246, 255, 0) 0%, #c3e6ff 100%); + height: 480rpx; + width: 750rpx; + } + .bot-bg { + // background-color: #F6F8FF; + background: linear-gradient(136deg, rgba(234, 246, 255, 0) 0%, #c3e6ff 100%); + width: 750rpx; + flex: 1; + } + .course-center-body { + position: absolute; + overflow: hidden; + left: 0; + top: 0; + height: 100%; + width: 100%; + padding: 0 15rpx; + box-sizing: border-box; + display: flex; + flex-direction: column; + padding-top: v-bind(pageTopPadding); + // padding-top: var(--status-bar-height); + .body-title { + height: 90rpx; + // background-color: red; + text-align: center; + font-size: 33rpx; + padding-top: 10rpx; + line-height: 46rpx; + box-sizing: border-box; + font-weight: 500; + color: #000; + position: relative; + // margin-bottom: 23rpx; + .arrow-icon { + position: absolute; + left: 36rpx; + top: 20rpx; + color: #000; + } + } + .input-view { + } + .tabs-view { + background: #ffffff; + margin-top: 23rpx; + border-radius: 23rpx; + padding: 6rpx 10rpx 12rpx; + margin-bottom: 15rpx; + } + .list-view { + flex: 1; + overflow: hidden; + margin-bottom: 15rpx; + background: #ffffff; + border-radius: 23rpx; + display: flex; + flex-direction: column; + position: relative; + .filter-list { + position: absolute; + top: 84rpx; + left: 0; + width: 100%; + height: 588rpx; + padding-bottom: 80rpx; + overflow-y: hidden; + z-index: 15; + background-color: #f9f9f9; + box-shadow: 0rpx 12rpx 20rpx rgba(160, 160, 160, 0.25); + border-radius: 0 0 0rpx 0rpx; + box-sizing: border-box; + position: relative; + .scroll-box-tags { + height: 508rpx; + padding: 0rpx 25rpx; + box-sizing: border-box; + } + .filter-type { + padding: 10rpx 0; + box-sizing: border-box; + .filter-type-title { + font-size: 29rpx; + line-height: 40rpx; + margin-bottom: 15rpx; + color: #000; + } + .filter-type-list { + overflow: hidden; + .filter-type-item { + // width: calc(25% - 18rpx); + display: inline-block; + font-size: 29rpx; + box-sizing: border-box; + padding: 0 20rpx; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + text-align: center; + float: left; + margin-right: 24rpx; + height: 65rpx; + line-height: 65rpx; + background-color: #f1f3f8; + border-radius: 6rpx; + margin-bottom: 20rpx; + &:nth-child(4n) { + margin-right: 24rpx; + } + &.is-active { + color: #06f; + } + } + } + & + .filter-type { + margin-top: 20rpx; + } + } + .btns-box { + height: 80rpx; + position: absolute; + background-color: #fff; + bottom: 0; + left: 0; + width: 100%; + text-align: center; + padding-top: 10rpx; + .btn-sub { + display: inline-block; + text-align: center; + background-color: #06f; + height: 60rpx; + line-height: 58rpx; + border: 1rpx solid #06f; + padding: 0 40rpx; + color: #fff; + border-radius: 8rpx; + &.cencle-btn { + background-color: #fff; + color: #06f; + margin-right: 40rpx; + } + } + } + } + .model-filter-list { + position: fixed; + width: calc(100vw - 33rpx); + height: 80vh; + overflow: hidden; + top: 500rpx; + left: 17rpx; + z-index: 1; + background-color: rgba(0, 0, 0, 0.2); + } + .filter-list, + .model-filter-list { + display: none; + &.show { + display: block; + } + } + .filter-btn { + position: absolute; + right: 0; + top: 0; + height: 83rpx; + width: 120rpx; + line-height: 83rpx; + font-size: 26rpx; + background: #fff; + z-index: 2; + text-align: center; + box-shadow: -4rpx 0 6rpx rgba(0, 0, 0, 0.05); + white-space: nowrap; + padding-right: 30rpx; + box-sizing: border-box; + .filter-icon { + // display: inline-block; + font-size: 26rpx; + position: absolute; + right: 15rpx; + top: 50%; + transform: translateY(-50%); + } + } + .tags-view { + height: 84rpx; + display: block; + padding: 15rpx 120rpx 15rpx 20rpx; + box-sizing: border-box; + white-space: nowrap; + border-bottom: 2rpx solid #eee; + .tags-item { + margin-right: 30rpx; + display: inline-block; + &.active-tags-item { + position: relative; + overflow: hidden; + border-radius: 4rpx; + overflow: hidden; + &::before { + content: ''; + display: block; + width: 40rpx; + height: 40rpx; + position: absolute; + right: -20rpx; + bottom: -20rpx; + transform: rotateZ(-45deg); + background-color: #06f; + overflow: hidden; + z-index: 10; + } + &::after { + content: ''; + display: block; + width: 8rpx; + height: 4rpx; + position: absolute; + right: 3rpx; + bottom: 8rpx; + transform: rotateZ(-45deg); + border-left: 1px solid #fff; + border-bottom: 1px solid #fff; + z-index: 11; + } + } + ::v-deep .uv-tags { + padding: 0 20rpx; + .uv-tags__text { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + max-width: 200rpx; + } + } + } + } + .course-list { + display: flex; + flex: 1; + overflow: hidden; + .left-type-list { + width: 152rpx; + border-right: 2rpx solid #eee; + overflow-y: auto; + .type-item { + min-height: 90rpx; + line-height: 40rpx; + font-size: 22rpx; + box-sizing: border-box; + padding: 25rpx 18rpx; + overflow: hidden; + // text-overflow: ellipsis; + word-break: break-all; + text-align: center; + white-space: pre-wrap; + &.is-active { + background-color: rgba(44, 142, 242, 0.1); + color: #06f; + } + } + } + .right-course-list { + flex: 1; + overflow-y: auto; + .type-list { + .type-title { + font-size: 33rpx; + line-height: 43rpx; + margin: 20rpx 15rpx 5rpx; + min-height: 43rpx; + // overflow: hidden; + // text-overflow: ellipsis; + // white-space: nowrap; + word-break: break-all; + font-weight: 600; + .left-color { + width: 8rpx; + height: 33rpx; + margin-top: 5rpx; + float: left; + overflow: hidden; + background-color: #06f; + margin-right: 8rpx; + } + } + } + } + } + } + .loading-box { + width: 100%; + height: 100rpx; + position: relative; + .loading-val { + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + } + } + } +} + diff --git a/src/pages/course/study.vue b/src/pages/course/study.vue index 29dbb772..06dc8751 100644 --- a/src/pages/course/study.vue +++ b/src/pages/course/study.vue @@ -82,7 +82,7 @@ :canAnswer="testAnswer" :adjustPosition="true" :canAnswerText="canAnswerText" - :isDisabled="(lastTalkingInfo.type || 0) !== 4 || ['SN','MU','JD'].includes(lastTalkingInfo.qnsTyp)"/> + :isDisabled="(lastTalkingInfo.type || 0) !== 4 || ['SN', 'MU', 'JD'].includes(lastTalkingInfo.qnsTyp)" /> @@ -166,7 +166,7 @@ const pageTopPadding = computed(() => statusBarHeight + 'px') const isContinue = ref('N') // 初始化数据 const getData = async flag => { - isContinue.value = "N" + isContinue.value = 'N' try { const { body } = await getCourseStudyInfoApi({ crsId: crsId.value @@ -179,11 +179,11 @@ const getData = async flag => { if (isPreview.value) { resStartStudyNow(body.teacheList) } else { - if(body.isStdyFinish === 'Y'){ - // 重新学习 - resStartStudyNow(body.teacheList) - return - } + if (body.isStdyFinish === 'Y') { + // 重新学习 + resStartStudyNow(body.teacheList) + return + } if (body.stdyProgressFlag === 'N') { step.value = 1 } else { @@ -207,7 +207,7 @@ const getData = async flag => { // 继续学习 ， 获取学习历史接口 // 滚动到最下面 scrollToBottomNow() - isContinue.value = "Y" + isContinue.value = 'Y' sendMessage({ commond: 'STDY', body: { @@ -342,7 +342,7 @@ const nextStep = () => { crsId: crsId.value, teacherNo: choiceTeacher.value, studyType: isPreview.value ? 'P' : 'S', - isContinue: isContinue.value + isContinue: isContinue.value } }) step.value = 2 @@ -369,7 +369,7 @@ const answerOnlyVoice = computed(() => { }) const canAnswerText = computed(() => { - return '每个问题最多连续发送五次答案！' + return '每个问题最多连续发送五次答案！' }) const oldStdyId = ref('') @@ -380,8 +380,8 @@ const getGraphInfoUnStudy = (flag = 0) => { crsId: crsId.value, stdyId: unref(stdyId), stdyBatch: unref(stdyBatch), - oldStdyId: unref(oldStdyId), - isContinue: isContinue.value + oldStdyId: unref(oldStdyId), + isContinue: isContinue.value } if (flag === 1 && !!startPgrphId.value) { _data.pgrphId = startPgrphId.value @@ -400,7 +400,7 @@ const getGraphInfoUnStudy = (flag = 0) => { common .show('提示', '您已学完全部知识点', false) .then(res => { - common.navigateBack() + common.navigateBack() // common.redirectTo(`/pages/courseDetail/index?crsId=${crsId.value}&crsNum=${crsNum.value}&from=study&isPreview=true`) }) .finally(() => {}) @@ -413,7 +413,7 @@ const getGraphInfoUnStudy = (flag = 0) => { common.redirectTo(`/pages/courseDetail/submit?crsId=${crsId.value}&crsNum=${crsNum.value}&from=study&imgId=${imageId.value}`) } else { // 取消 - common.navigateBack() + common.navigateBack() // common.redirectTo(`/pages/courseDetail/index?crsId=${crsId.value}&crsNum=${crsNum.value}&from=study`) } }) @@ -525,8 +525,8 @@ const nextQuestionSuccess = (info, type = 'next') => { stdyId: unref(stdyId), pgrphId: info?.pgrphId, logId: info?.logId, - oldStdyId: unref(oldStdyId), - isContinue: isContinue.value + oldStdyId: unref(oldStdyId), + isContinue: isContinue.value }) }).then(res => { talkingList.value.push({ @@ -562,9 +562,9 @@ const nextQuestionSuccess = (info, type = 'next') => { processType: 'NEW-ANSER', //NEW-KNOW requestBody: JSON.stringify({ stdyId: unref(stdyId), - stdyPgrphId: info.stdyPgrphId, - qnsId: info.qnsId - }) + stdyPgrphId: info.stdyPgrphId, + qnsId: info.qnsId + }) }).then(res => { let _body = res.body || {} if (!_body.chatBody) { @@ -603,7 +603,7 @@ const nextQuestionSuccess = (info, type = 'next') => { requestBody: JSON.stringify({ logId: unref(logId), pgrphId: info.pgrphId, - stdyId: unref(stdyId) + stdyId: unref(stdyId) }) }).then(res => { let _body = res.body || {} @@ -664,7 +664,7 @@ const initsocketTask = () => { if (commond === 'STDYBTH' && !stdyId.value) { stdyId.value = body.stdyId || '' stdyBatch.value = body.stdyBatch || '' - oldStdyId.value = body.oldStdyId || '' + oldStdyId.value = body.oldStdyId || '' logId.value = body.logId || '' getGraphInfoUnStudy(1) step.value = 2 @@ -722,13 +722,11 @@ const changeAppHeightBottom = height => { // #endif } onHide(() => { - console.log('onHide') + changePlayItemId('') + socketStore.closeSocket() //#ifdef APP-PLUS uni.offKeyboardHeightChange(setHeight) // #endif - // if (watchFlag.value === 1) return - changePlayItemId('') - socketStore.closeSocket() // common.show('提示信息', '检测到您已离开，即将退出学习页面。',false, '','确认').then((res) => { // common.redirectTo(`/pages/courseDetail/index?crsId=${crsId.value}&crsNum=${crsNum.value}&from=study`) // }).finally(() => {}) @@ -747,11 +745,11 @@ onUnload(() => { console.log('onUnload') socketStore.closeSocket() changePlayItemId('') - console.log(typeof teacherVoiceObj); - try{ - teacherVoiceObj?.stop() - teacherVoiceObj.src = '' - // 0910杨航叫我这么改的 + console.log(typeof teacherVoiceObj) + try { + teacherVoiceObj?.stop() + teacherVoiceObj.src = '' + // 0910杨航叫我这么改的 } catch {} }) const testAnswer = computed(() => { @@ -810,7 +808,7 @@ const uploadRecordNow = voicePath => { id: _id }) scrollToBottomNow() - let _path = isPreview.value ? '/trastudy/traStdychat/previewVoiceChart' : '/trastudy/traStdychat/voiceChart' + let _path = isPreview.value ? '/trastudy/traStdychat/previewVoiceChart' : '/trastudy/traStdychat/voiceChart' commonUploadVoiceFile(voicePath, _path, { processType: 'ANSER-VOICE', requestBody: JSON.stringify(_data) @@ -933,7 +931,7 @@ const withdrawNow = data => { const loadingExecLogId = ref('') const answerQuestionNow = data => { let _data = { - stdyId: unref(stdyId), + stdyId: unref(stdyId), qnsId: data.qnsId, // 问题ID 必输项:true 类型:String pgrphId: data.pgrphId, // 段落ID 必输项:true 类型:String crsId: crsId.value, // 课程ID 必输项:true 类型:String