|
30 | 30 | <button |
31 | 31 | class="tab" |
32 | 32 | :class="{'tab-active': selectedCategory === ''}" |
33 | | - @click="selectedCategory = ''" |
| 33 | + @click="selectCategory('')" |
34 | 34 | > |
35 | 35 | 全部 |
36 | 36 | </button> |
|
41 | 41 | :key="category" |
42 | 42 | class="tab" |
43 | 43 | :class="{'tab-active': selectedCategory === category}" |
44 | | - @click="selectedCategory = category" |
| 44 | + @click="selectCategory(category)" |
45 | 45 | > |
46 | 46 | {{ category }} |
47 | 47 | </button> |
@@ -122,6 +122,12 @@ export default defineComponent({ |
122 | 122 | promptLibrary.value = newData; |
123 | 123 | }, { deep: true, immediate: true }); |
124 | 124 | |
| 125 | + // 监听一级分类变化,当一级分类变化时重置二级分类选择 |
| 126 | + watch(selectedCategory, () => { |
| 127 | + // 重置二级分类 |
| 128 | + selectedSubCategory.value = ''; |
| 129 | + }); |
| 130 | + |
125 | 131 | // 一级分类列表 |
126 | 132 | const categories = computed(() => { |
127 | 133 | const categorySet = new Set(promptLibrary.value.map(item => item.category)); |
@@ -161,6 +167,17 @@ export default defineComponent({ |
161 | 167 | emit('select-prompt', prompt); |
162 | 168 | }; |
163 | 169 | |
| 170 | + // 选择一级分类 |
| 171 | + const selectCategory = (category: string) => { |
| 172 | + // 如果选择相同的分类,不做处理 |
| 173 | + if (selectedCategory.value === category) return; |
| 174 | + |
| 175 | + // 更新选择的一级分类 |
| 176 | + selectedCategory.value = category; |
| 177 | + // 重置二级分类选择 |
| 178 | + selectedSubCategory.value = ''; |
| 179 | + }; |
| 180 | + |
164 | 181 | // 加载提示词库 |
165 | 182 | const loadPromptLibrary = async () => { |
166 | 183 | try { |
@@ -192,6 +209,7 @@ export default defineComponent({ |
192 | 209 | categories, |
193 | 210 | subCategories, |
194 | 211 | selectPrompt, |
| 212 | + selectCategory, |
195 | 213 | isLoading, |
196 | 214 | errorMessage, |
197 | 215 | }; |
|
0 commit comments