diff --git a/src/components/Course/courseForm.vue b/src/components/Course/courseForm.vue
index 5e931716..6874dd94 100644
--- a/src/components/Course/courseForm.vue
+++ b/src/components/Course/courseForm.vue
@@ -604,6 +604,11 @@ export default {
// 处理标签变化事件
handleTagsChange(tags) {
console.log("父组件:",tags)
+ // 限制最多5个标签
+ if (tags.length > 5) {
+ this.$message.warning('最多只能选择5个标签')
+ return
+ }
let ids = "";
tags.forEach(tag=>{
console.log("父组件name : ",tag.tagName)
diff --git a/src/components/Course/courseTag.vue b/src/components/Course/courseTag.vue
index 37851b34..b02dcc98 100644
--- a/src/components/Course/courseTag.vue
+++ b/src/components/Course/courseTag.vue
@@ -25,6 +25,10 @@
:value="item"
/>
+
+
+ {{ selectedTags.length }}/5
+
@@ -46,7 +50,7 @@ export default {
},
maxTags: {
type: Number,
- default: 10
+ default: 5
},
// 添加:接收初始标签数据的props
initialTags: {
@@ -144,6 +148,8 @@ export default {
if (!this.searchResults.length && inputVal && this.selectedTags.length < this.maxTags) {
this.createNewTag(event.target.value.trim())
event.target.value = ''
+ } else if (this.selectedTags.length >= this.maxTags) {
+ this.$message.warning('最多只能添加5个标签')
}
},
@@ -165,6 +171,11 @@ export default {
this.$message.error('标签不能超过8个字')
return;
}
+ // 添加标签数量限制检查
+ if (this.selectedTags.length >= this.maxTags) {
+ this.$message.warning('最多只能添加5个标签')
+ return;
+ }
this.loading = true
try {
this.params.courseId = this.courseId;
@@ -231,4 +242,17 @@ export default {
margin-right: 6px;
margin-bottom: 6px;
}
+
+/* 添加标签计数样式 */
+.tag-count {
+ position: absolute;
+ right: 10px;
+ top: 50%;
+ transform: translateY(-50%);
+ font-size: 12px;
+ color: #999;
+ background: white;
+ padding: 0 5px;
+ pointer-events: none;
+}