模型黑名单与密钥模型白名单界面、分组填入、删除弹窗排版

src/components/ai/GroupChips.vue

@@ -0,0 +1,20 @@
+<script setup lang="ts">
+// 现有分组提示行:点击 chip 将分组名填入外部输入框;无分组时整行不渲染
+defineProps<{ groups: string[] }>()
+defineEmits<{ pick: [group: string] }>()
+</script>
+
+<template>
+  <div v-if="groups.length" class="mt-1.5 flex flex-wrap items-center gap-1.5">
+    <span class="text-xs text-ink-3">现有分组:</span>
+    <button
+      v-for="g in groups"
+      :key="g"
+      type="button"
+      class="cursor-pointer rounded-[5px] border border-line bg-card px-2 py-0.5 text-xs text-ink-2 hover:border-accent hover:text-accent"
+      @click="$emit('pick', g)"
+    >
+      {{ g }}
+    </button>
+  </div>
+</template>