From d5ec4c1833b3954fa11fbbe49413c1204f06e525 Mon Sep 17 00:00:00 2001 From: 670788339 <670788339@qq.com> Date: Sun, 9 Nov 2025 16:25:03 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E5=BC=80=E5=8F=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/portal/course/qualityCourse.vue | 167 +++++++++++++++------- 1 file changed, 113 insertions(+), 54 deletions(-) diff --git a/src/views/portal/course/qualityCourse.vue b/src/views/portal/course/qualityCourse.vue index 8f2d1e96..41013f36 100644 --- a/src/views/portal/course/qualityCourse.vue +++ b/src/views/portal/course/qualityCourse.vue @@ -89,6 +89,32 @@ +
+ +
+
+
+ 全部 + +
+ +
+ {{tag.tagName}} + +
+
+
+
@@ -328,25 +354,45 @@ export default { let list = []; }, - // 取消搜索条件标签展示 - stagList() { //计算出选择的内容 + stagList() { let list = []; + + // 关键词 if (this.keyword) { list.push({ type: 0, id: 'keyword', name: this.keyword, + tagName: this.keyword, checked: true - }) + }); } - // 取消 全部 内部专享 外部精选 三种的显示 - // this.ctypeList.forEach(item => { - // if (item.checked) { - // list.push(item); - // } - // }); + + // 课程类型 + this.ctypeList.forEach(item => { + if (item.checked) { + list.push({ + ...item, + tagName: item.name + }); + } + }); + + // 热点标签 - 这是关键修复 + this.hotTagsList.forEach(item => { + if (item.checked) { + list.push({ + ...item, + name: item.tagName || item.name, + tagName: item.tagName || item.name, + type: 14 + }); + } + }); + + // 三级分类 this.oneList.forEach(one => { - var twoChildChecked = false;//是否有下级 + var twoChildChecked = false; one.children.forEach(two => { if (two.checked) { twoChildChecked = true; @@ -354,34 +400,28 @@ export default { var threeChildChecked = false; two.children.forEach(three => { if (three.checked) { - list.push(three); + list.push({ + ...three, + tagName: three.name + }); threeChildChecked = true; } }); if (two.checked && !threeChildChecked) { - list.push(two); + list.push({ + ...two, + tagName: two.name + }); } }); if (one.checked && !twoChildChecked) { - list.push(one); + list.push({ + ...one, + tagName: one.name + }); } - }) - // this.oneList.forEach(item=>{ - // if(item.checked){ - // list.push(item); - // } - // }); - // this.twoList.forEach(item=>{ - // if(item.checked){ - // list.push(item); - // } - // }); - // this.threeList.forEach(item=>{ - // if(item.checked){ - // list.push(item); - // } - // }); - //console.log(list,'list'); + }); + return list; }, ctypeTagAll() { @@ -575,6 +615,37 @@ export default { // window.removeEventListener("scroll", this.handleScroll); }, methods: { + isAllHotTagsSelected() { + return !this.hotTagsList.some(tag => tag.checked); + }, + handleClearHotTags() { + // 清除所有热点标签的选中状态 + this.hotTagsList.forEach(tag => { + tag.checked = false; + }); + // 清空course.tags + this.course.tags = ''; + + // 触发搜索 + this.searchData(); + }, + handleTagClick(item, list,type) { + item.checked = !item.checked; + + // 更新course.tags + const checkedTags = this.hotTagsList.filter(tag => tag.checked); + let tagIds = checkedTags.map(tag => tag.id).join(','); + this.course.tags = tagIds; + this.$forceUpdate(); + this.searchData(type); + + // 强制触发stagList重新计算 + // this.$nextTick(() => { + // this.searchData(type); + // }); + }, + + // 改变分页 currentChange(val) { this.course.pageIndex = val @@ -2219,30 +2290,18 @@ export default { } } } - -// .course-form { -// width: 100%; -// margin: 10px 0; -// ::v-deep.el-button { -// width: 100%; -// color: #fff; -// } -// } - -// .right-box { -// .add-btn { -// width: 100%; -// padding: 15px 0; -// } -// .ranking-card { -// margin-top: 0px; -// } - -// .ranking-data { -// margin: 10px 0; -// color: #999999; -// } -// }] +.hot-tags-wrapper { + display: flex; + flex-wrap: wrap; + gap: 15px; + align-items: center; + padding-top: 2px; +} +.search-div.nav { + display: block; + width: 100%; + clear: both; +} .search-item-type { line-height: 25px; padding-right: 10px; From 1d20f1186182adb8ab4710e2f6012ca85c743c66 Mon Sep 17 00:00:00 2001 From: 670788339 <670788339@qq.com> Date: Mon, 10 Nov 2025 08:54:17 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=E7=B2=BE=E5=93=81=E7=B1=BB=E5=9E=8B?= =?UTF-8?q?=E5=8A=A0=E6=A0=87=E7=AD=BE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/portal/course/qualityCourse.vue | 476 +++++++++------------- 1 file changed, 182 insertions(+), 294 deletions(-) diff --git a/src/views/portal/course/qualityCourse.vue b/src/views/portal/course/qualityCourse.vue index 41013f36..0a58f422 100644 --- a/src/views/portal/course/qualityCourse.vue +++ b/src/views/portal/course/qualityCourse.vue @@ -2,48 +2,32 @@
+ @showClass="showClass">
-
-
精品课程
-
{{ one.name }}
+ @click.stop="handleOptionClick(twoList, 2, one.children)" + :class="{ courseTwoActive: twoList.id == twoId || twoList.checked }" @mouseleave.stop="leaveIndex" + @mouseenter.stop="changeIndex(twoList.id)"> + :disabled="!twoList.children.length" :open-delay="0" :close-delay="0" trigger="hover" + :visible-arrow="false" @hide="leaveIndex" @show="changeIndex(twoList.id)" transition="none">
{{ - twoList.name }}
+ twoList.name }}
@@ -51,8 +35,8 @@
+ :key="threeList.id" @click.stop="handleOptionClick(threeList, 3, twoList.children)" + class="course-three"> {{ threeList.name }}
@@ -70,31 +54,49 @@
-
-
-
- 全部 - + +
+
+
+
+ 全部 + +
+ +
+ 内部专享 + +
+
+ 外部精选 + +
-
- 内部专享 - -
-
- 外部精选 - +
+ 请选择年份 + + + +
+
-
-
+
+
@@ -103,7 +105,8 @@
-
- 请选择年份 - - - - -
-
@@ -138,7 +128,7 @@
搜索条件 {{ - tag.name }} + tag.name }}
清除 @@ -151,13 +141,13 @@
全部课程 + :class="{ actice: course.orderField == 'DEFAULT' }">全部课程 最热 + :class="{ actice: course.orderField == 'HOT' }">最热 最新 + :class="{ actice: course.orderField == 'NEW' }">最新 好评率 + :class="{ actice: course.orderField == 'GOOD' }">好评率 共找到{{ count }}个结果 @@ -190,7 +180,7 @@
+ :disabled="!keyword.showTitle"> @@ -198,7 +188,7 @@
- +
开课时间：{{ cinfo.startTime }}
@@ -214,7 +204,7 @@
+ :praises="false" :shares="false" :views="false">
{{ toScore(cinfo.courseScore) }}分
@@ -259,7 +249,7 @@
+ layout="total, prev, pager, next, jumper" @change-page="currentChange">
@@ -296,17 +286,6 @@
创新力专区课程版权已到期！
-
@@ -334,7 +313,7 @@ import {formatDate, formatUserNumber, toScore} from "@/utils/tools.js"; import apiSearchterm from "@/api/modules/searchterm.js"; import apiPlace from "@/api/phase2/place.js" import {qualityCourseTimeMark, qualityPageList} from "@/api/phase2" - +import apiCourseTag from '@/api/modules/courseTag.js' export default { name: "index", components: { @@ -354,6 +333,41 @@ export default { let list = []; }, + // 取消搜索条件标签展示 + /*stagList() { //计算出选择的内容 + let list = []; + if (this.keyword) { + list.push({ + type: 0, + id: 'keyword', + name: this.keyword, + checked: true + }) + } + this.oneList.forEach(one => { + var twoChildChecked = false;//是否有下级 + one.children.forEach(two => { + if (two.checked) { + twoChildChecked = true; + } + var threeChildChecked = false; + two.children.forEach(three => { + if (three.checked) { + list.push(three); + threeChildChecked = true; + } + }); + if (two.checked && !threeChildChecked) { + list.push(two); + } + }); + if (one.checked && !twoChildChecked) { + list.push(one); + } + }) + return list; + },*/ + stagList() { let list = []; @@ -430,24 +444,6 @@ export default { }); return !flag; }, - // oneTagAll() { - // let flag = this.oneList.some(item => { - // return item.checked; - // }); - // return !flag; - // }, - // twoTagAll() { - // let flag = this.twoList.some(item => { - // return item.checked; - // }); - // return !flag; - // }, - // threeTagAll() { - // let flag = this.threeList.some(item => { - // return item.checked; - // }); - // return !flag; - // } }, data() { return { @@ -515,7 +511,8 @@ export default { searchRecords: [], hotList: [], totalPages: 1, - localSessionKey: this.$xpage.constants.localCourseFiltersKey + localSessionKey: this.$xpage.constants.localCourseFiltersKey, + hotTagsList: [], }; }, // 受众需要每次刷新 @@ -535,17 +532,6 @@ export default { qualityCourseTimeMark().then(response=>{ this.years = response.data.result }) - // let screenWidth = window.screen.availWidth; - // if (screenWidth < 1280) { - // this.course.pageSize = 9; - // this.columns = 3; - // } else if (screenWidth < 1600) { - // this.course.pageSize = 12; - // this.columns = 3; - // } else if (screenWidth >= 1600) { - // this.course.pageSize = 15; - // this.columns = 3; - // } let el_top = document.querySelector("#searchbar"); let el_search = document.querySelector("#searchbar"); @@ -571,8 +557,6 @@ export default { this.loadSysTypes(); this.getScoreList(); this.getHotList(); - // this.toCourseDetail(item); - // this.orderChange(id); //查询排行榜，页面打开只查询一次 let localKey = "user_" + this.userInfo.sysId + "_gids"; if (this.audiences.length == 0) { @@ -591,30 +575,15 @@ export default { } this.search(); }) - // Promise.all([apiOldCourse.audience(this.userInfo.sysId),apiUserGroup.userGroupIds()]).then(rs=>{ - // //console.log(rs,'rs'); - // let aids=[]; - // if(rs[0].status==200){ - // aids.push(rs[0].result); - // } - // if(rs[1].status==200){ - // aids.push(rs[1].result); - // } - // this.audiences=aids; - // sessionStorage.setItem(localKey,this.audiences); - // this.search(); - // }) } } - - //this.searchterm();//搜索词已经没有了 this.couresreso();//广告位 - }, beforeDestroy() { // window.removeEventListener("scroll", this.handleScroll); }, methods: { + isAllHotTagsSelected() { return !this.hotTagsList.some(tag => tag.checked); }, @@ -630,6 +599,7 @@ export default { this.searchData(); }, handleTagClick(item, list,type) { + console.info('切换标签 item = ' + item) item.checked = !item.checked; // 更新course.tags @@ -727,15 +697,55 @@ export default { } }, //搜索条件 + // 搜索条件 stagClose(tag, tagIndex) { this.courseChosen = void 0; tag.checked = false; + if (tag.type == 0) { + // 关键词类型 this.keyword = ''; + } else if (tag.type == 1) { + // 课程类型 + this.ctypeList.forEach(item => { + if (item.id == tag.id) { + item.checked = false; + } + }); + } else if (tag.type == 14) { + // 热点标签类型 + this.hotTagsList.forEach(item => { + if (item.id == tag.id) { + item.checked = false; + } + }); + // 更新course.tags + const checkedHotTags = this.hotTagsList.filter(tag => tag.checked); + let tagIds = checkedHotTags.map(tag => tag.id).join(','); + this.course.tags = tagIds; + } else if (tag.type == 11 || tag.type == 12 || tag.type == 13) { + // 三级分类标签 + this.oneList.forEach(one => { + if (one.id == tag.id) { + one.checked = false; + } + one.children.forEach(two => { + if (two.id == tag.id) { + two.checked = false; + } + two.children.forEach(three => { + if (three.id == tag.id) { + three.checked = false; + } + }); + }); + }); } + this.navTitle = [] this.searchData(); }, + isTagMatched(tag) { // 检查stagList中是否有匹配的标签 return this.stagList.some(searchTag => @@ -779,10 +789,23 @@ export default { handleClearTags() { //清空所有的条件 this.keyword = ''; - // 取消搜索条件标签展示 - // this.ctypeList.forEach(item => { - // item.checked = false; - // }); + + // 清除课程类型 + this.ctypeList.forEach(item => { + item.checked = false; + }); + + // 清除热点标签 + this.hotTagsList.forEach(item => { + item.checked = false; + }); + // 清空course.tags + this.course.tags = ''; + + // 清除年份选择 + this.yearChosen = []; + + // 清除三级分类 this.oneList.forEach(one => { one.checked = false; one.children.forEach(two => { @@ -792,7 +815,8 @@ export default { }) }) }); - // 清除左侧被选中的内容 + + // 清除左侧被选中的内容 this.courseChosen = void 0; this.twoList = []; this.threeList = []; @@ -801,6 +825,7 @@ export default { sessionStorage.removeItem(this.localSessionKey) this.searchData(); }, + // 导航切换(录播课，线下课，学习项目) handleTypeClick(item, list) { // item.checked = !item.checked; @@ -839,57 +864,6 @@ export default { }) }) }) - - // item.checked = !item.checked; - //使用上面一行是可以多选，使用下面是单选 - // list.forEach(row => { - // row.checked = false; - // }) - // item.checked = true; - // //以下是新的规则的修改， - // if (!item.checked) { - // //清空它下面的所有的中的 - // item.children.forEach(subItem => { - // subItem.checked = false; - // if (subItem.children) { - // subItem.children.forEach(sub => { - // sub.checked = false; - // }) - // } - // }); - // if (level == 1) { - // this.twoList = []; - // this.threeList = []; - // } - // if (level == 2) { - // this.threeList = []; - // } - // this.searchData(); - // return; - // } - - // let $this = this; - // if (level == 1) { //一级的情况 - // this.twoList = []; - // this.threeList = []; - // let lastCheked = null; - // item.children.forEach(two => { - // $this.twoList.push(two); - // if (two.checked) { - // lastCheked = two; - // } - // }); - // if (lastCheked != null) { - // $this.threeList = lastCheked.children; - // item.children.forEach(three => { - // }); - // } - // } else if (level == 2) { //二级的情况 - // this.threeList = item.children; - // } else if (level == 3) { //三级的情况 - - // } - //this.handleChangeTypes(item); this.searchData(); }, // 无用 @@ -899,18 +873,6 @@ export default { this.twoList = []; this.threeList = []; let $this = this; - // this.oneList.forEach(one=>{ - // if(one.checked){ - // one.children.forEach(two=>{ - // $this.twoList.push(two); - // if(two.checked){ - // two.children.forEach(three=>{ - // $this.threeList.push(three); - // }) - // } - // }); - // } - // }) this.oneList.forEach(one => { if (one.checked) { one.children.forEach(two => { @@ -941,15 +903,6 @@ export default { checked: false } if (item.children) { - //增加死数据 - // item.children.push({ - // type: 12, - // id: item.id * (index + 200), - // name: '线上品牌系列课程', - // children: [], - // checked: false, - // newData: true - // }) item.children.forEach(subItem => { let newSubItem = { type: 12, @@ -1016,47 +969,16 @@ export default { this.keyword = val; this.searchData(); }, - - // 滚动 - // handleScroll() { - // if (this.courseList.length > 6) { - - // let innerHeight = document.querySelector("#couser-list-content").clientHeight; - // let outerHeight = document.documentElement.clientHeight; - // let scrollTop = document.documentElement.scrollTop; - // let outerWidth = document.querySelector(".xcontent2-minor").clientWidth; - // if (outerHeight + scrollTop + 350 >= innerHeight) { - // if (this.moreState == 1 && this.course.pageIndex < 4) { - // this.loadMore(); - // } - // } - // //console.log(this.course.pageIndex,'this.course.pageIndex'); - // //加此判断，是为了没有数据时的闪动问题 - // //if(this.course.pageIndex >1){ - // if (scrollTop > 1176) { - // document.querySelector("#fixd-box").style.cssText = - // "position: fixed;top: -882px;width:" + outerWidth + "px"; - // } else { - // document.querySelector("#fixd-box").style.cssText = "position: static"; - // } - // //} - // } - // }, - - toNeedCourse() {// 上传 - // 需要先切换标签 - //this.$store.dispatch('SetCurIdentity',2); - //this.$router.push('/need/course?open=new'); + toNeedCourse() { this.$refs.floatTools.toNeedCourse(); - }, - searchData() { + searchData(type) { this.course.pageIndex = 1; this.noPageList = true; //判断接口是否还有数据 this.noDataList = true; //判断接口是否还有数据 this.courseList = []; this.totalPages = 4; - this.search(); + this.search(type); }, inputOn() { this.$forceUpdate(); @@ -1216,17 +1138,12 @@ export default { return list; }, // 查询 - async search () { - // + async search (type) { if (this.searching) { this.$message.warning("正在搜索中，请待搜索完成后再重新搜索"); return; } this.searching = true; - //测试时间格式化 - // let s=1650973801; - // var d = new Date(1650973801*1000); - // console.log(formatDateByFmt(d,'yyyy-MM-dd hh:mm'),'data'); this.saveLocalFilters(); let that = this; if (this.keyword) { @@ -1237,7 +1154,6 @@ export default { this.course.audiences = this.audiences.join(","); } //console.log(this.userInfo) - //this.course.companyId=this.userInfo.companyId; this.course.type = "";//不使用单查询了 this.course.types = ""; this.course.sysType1 = ""; @@ -1260,6 +1176,20 @@ export default { that.course.sysType3 += item.id; } }); + if (!type && type !== 1){ + apiCourseTag.getHotTagList(that.course).then(rs => { + if (rs.status == 200) { + // 保留已选中标签的状态 + const currentCheckedTags = this.hotTagsList.filter(tag => tag.checked); + this.hotTagsList = rs.result.map(tag => ({ + ...tag, + checked: currentCheckedTags.some(checkedTag => checkedTag.id === tag.id) + })); + } else { + console.log(rs.message); + } + }) + } this.isFind = true; this.course.device = 1; @@ -1279,6 +1209,9 @@ export default { params.pageNum = pageIndex params.orderByType = orderField params.courseSource = this.ctypeList.findIndex(e => e.checked) + if (params.courseSource === -1) { + params.courseSource = 0 + } this.yearChosen.length && (params.years = this.yearChosen) params.courseName = this.keyword delete params.userId @@ -1291,44 +1224,8 @@ export default { console.log(res.status) if (res.status === 200) { this.totalPages = res.data.result.pages; - // res.result.list.forEach(item => { - // if (item.startTime != '') { - // item.startTime = formatDateByFmt(new Date(item.startTime * 1000), 'yyyy-MM-dd hh:mm') - // //let time = item.startTime.split('-'); - // //item.startTime = `${time[0]}年${time[1]}月${time[2]}日` - // } - // //教师转化 - // if (item.teacher) { - // item.teacher = item.teacher.split(',').filter(itemValue => itemValue !== 'BOE教师').join(','); - // // if (dotIdx > 0) { - // // item.teacher = item.teacher.substring(0, dotIdx); - // // } - // } - // if (item.teacher && item.teacher == 'BOE教师') { - // item.teacher = ''; - // } - // - // //转化标红显示 - // item.title = item.name; - // if (that.course.keyword) { - // item.name = that.brightenKeyword(item.name, that.course.keyword); - // item.keywordsActive = that.brightenKeywords(item.keywordsList, that.course.keyword) - // console.log(item.keywordsActive); - // } else { - // item.name = item.name; - // } - // }); const list = res.data.result.records ?? [] - // list.forEach(course=>{ - // const id = course.courseId - // - // apiCourse.getTeacherByCourseIDs([id]).then(res=>{ - // console.log(res, "ids res") - // course.teacher = res.result[0].names[0] - // console.log(`course.teacher`, course.teacher) - // }) - // }) this.courseList = list if (this.newData) { @@ -1389,18 +1286,7 @@ export default { this.moreState = 2; }); }, - // showInApply() { - // this.inapply.show = true; - // }, - // pushEnter(type) { - // this.type1.push(type); - // }, - // deleteOut(type) { - // this.type1 = this.type.filter(item => item != type); - // }, - // chooseShow(type) { - // return this.type1.some(item => item == type); - // }, + getAnkingData() { apiCourse.ranking().then(res => { if (res.status == 200) { @@ -2205,7 +2091,7 @@ export default { border-radius: 8px; ::v-deep .el-input { - width: 420px; + //width: 420px; height: 38px; //margin-bottom: 13px; @@ -2327,4 +2213,6 @@ export default { .option-active { color: #387DF7; -} +} + + From df3e246d25483218254339ec15a76194a9d9cf24 Mon Sep 17 00:00:00 2001 From: 670788339 <670788339@qq.com> Date: Mon, 10 Nov 2025 10:24:02 +0800 Subject: [PATCH 3/3] =?UTF-8?q?=E7=B2=BE=E5=93=81=E8=AF=BE=E6=A0=87?= =?UTF-8?q?=E7=AD=BE=E5=AF=BC=E8=88=AA=E5=8F=96=E6=B6=88=E5=8A=A0=E7=B2=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/portal/course/qualityCourse.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/views/portal/course/qualityCourse.vue b/src/views/portal/course/qualityCourse.vue index 0a58f422..aea5e904 100644 --- a/src/views/portal/course/qualityCourse.vue +++ b/src/views/portal/course/qualityCourse.vue @@ -96,7 +96,7 @@
@@ -106,7 +106,7 @@