@@ -540,6 +548,7 @@ import { courseType, getType, toScore, formatDate, formatUserNumber, formatDateB
import { deepClone, param } from "../../../utils";
import apiSearchterm from "@/api/modules/searchterm.js";
import apiPlace from "@/api/phase2/place.js"
+import apiCourseTag from '@/api/modules/courseTag.js'
export default {
name: "index",
components: {
@@ -574,6 +583,11 @@ export default {
list.push(item);
}
});
+ this.hotTagsList.forEach(item => {
+ if (item.checked) {
+ list.push(item);
+ }
+ });
this.oneList.forEach(one => {
var twoChildChecked = false;//是否有下级
one.children.forEach(two => {
@@ -640,6 +654,18 @@ export default {
},
data() {
return {
+ hotTagsList: [ //热点标签
+ {id:1,name:"数据库", checked: false },
+ {id:2,name:"Python", checked: false },
+ {id:3,name:"Java", checked: false },
+ {id:4,name:"Vue3.0", checked: false },
+ {id:5,name:"大数据", checked: false },
+ {id:6,name:"Bootstrap", checked: false },
+ {id:7,name:"营销学", checked: false },
+ {id:8,name:"芯片", checked: false },
+ {id:9,name:"火箭", checked: false },
+ {id:10,name:"感悟", checked: false }
+ ],
newData: false,//线上品牌系列隐藏
navTitle: [],
// 设置高亮
@@ -715,6 +741,14 @@ export default {
console.log(rs.message);
}
})
+ //初始化:获取最新前10个热点标签
+ apiCourseTag.getHotTagList(null).then(rs => {
+ if (rs.status == 200) {
+ this.hotTagsList = rs.result;
+ } else {
+ console.log(rs.message);
+ }
+ })
},
mounted() {
let screenWidth = window.screen.availWidth;
@@ -945,6 +979,9 @@ export default {
this.ctypeList.forEach(item => {
item.checked = false;
});
+ this.hotTagsList.forEach(item => {
+ item.checked = false;
+ });
this.oneList.forEach(one => {
one.checked = false;
one.children.forEach(two => {
@@ -972,6 +1009,11 @@ export default {
this.searchData();
},
+ //点击标签
+ handleTagClick(item, list) {
+ item.checked = !item.checked;
+ this.searchData();
+ },
//三级分类
handleOptionClick(item, level, list) {
// 线上品牌展示效果
@@ -1377,12 +1419,18 @@ export default {
},
getAllChecked() { //获取全部选中的标签
let list = [];
-
+ //获取选中的课程类型
this.ctypeList.forEach(item => {
if (item.checked) {
list.push(item);
}
});
+ //获取选中的热点标签
+ this.hotTagsList.forEach(item => {
+ if (item.checked) {
+ list.push(item);
+ }
+ });
this.oneList.forEach(one => {
one.children.forEach(two => {
two.children.forEach(three => {
@@ -1487,7 +1535,7 @@ export default {
item.name = item.name;
}
});
-console.log(res.result.list,'data')
+ console.log(res.result.list,'data')
this.courseList = res?.result?.list ?? []
console.log(this.courseList);
if (this.newData) {
@@ -2518,4 +2566,46 @@ console.log(res.result.list,'data')
padding: 0 !important;
}
/* ---end--- */
+/* ---标签管理 added by zhengsongbo on 2025-08-01--- */
+.search-div.nav {
+ display: block;
+ width: 100%;
+ clear: both;
+}
+.option-item {
+ margin: 0px 5px;
+}
+/* 热点标签：自定义按钮样式 */
+a.custom {
+ /* 基础样式 */
+ display: inline-block; /* 使内边距生效 */
+ padding: 1px; /* 按钮内边距 */
+ margin: 1px 5px;
+ background-color: #F2F2F2; /* 淡灰色背景 */
+ color: #333; /* 文字颜色 */
+ text-decoration: none; /* 去除下划线 */
+ border-radius: 3px; /* 圆角设计 */
+ font-family: Arial, sans-serif; /* 字体 */
+ font-size: 14px; /* 文字大小 */
+ height: 24px;
+ line-height: 20px;
+ /* 过渡效果，使颜色变化更平滑 */
+ transition: background-color 0.2s ease;
+}
+
+/* 鼠标悬停效果 */
+a.custom:hover {
+ background-color: #DDEDFF; /* 浅蓝色背景 */
+}
+
+/* 可选：点击时效果 */
+a.custom:active {
+ background-color: #757575; /* 点击时更深的灰色 */
+}
+
+/* 鼠标悬停效果 */
+a.custom2 {
+ background-color: #DDEDFF; /* 浅蓝色背景 */
+}
+/* ---end--- */
diff --git a/src/views/tag/TagManageList.vue b/src/views/tag/TagManageList.vue
new file mode 100644
index 00000000..788ccabe
--- /dev/null
+++ b/src/views/tag/TagManageList.vue
@@ -0,0 +1,372 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 查询
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ scope.$index + 1 }}
+
+
+
+
+
+
+
+
+
+
+ 解绑
+
+
+
+
+
+
+
+
+
+
+
+