Merge pull request #191 from JinFanZheng/feature/api-key-quick-add-models

feat: add quick add buttons for model restrictions in API Key editor

web/admin-spa/src/components/apikeys/EditApiKeyModal.vue

@@ -366,6 +366,27 @@
                     暂无限制的模型
                   </span>
                 </div>
+                <div class="space-y-3">
+                  <!-- 快速添加按钮 -->
+                  <div class="flex flex-wrap gap-2">
+                    <button 
+                      v-for="model in availableQuickModels" 
+                      :key="model"
+                      type="button"
+                      class="px-3 py-1 text-xs sm:text-sm bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-lg transition-colors flex-shrink-0"
+                      @click="quickAddRestrictedModel(model)"
+                    >
+                      {{ model }}
+                    </button>
+                    <span
+                      v-if="availableQuickModels.length === 0"
+                      class="text-gray-400 text-sm italic"
+                    >
+                      所有常用模型已在限制列表中
+                    </span>
+                  </div>
+                  
+                  <!-- 手动输入 -->
                   <div class="flex gap-2">
                     <input 
                       v-model="form.modelInput"
@@ -382,6 +403,7 @@
                       <i class="fas fa-plus" />
                     </button>
                   </div>
+                </div>
                 <p class="text-xs text-gray-500 mt-2">
                   设置此API Key无法访问的模型，例如：claude-opus-4-20250514
                 </p>
@@ -545,6 +567,24 @@ const removeRestrictedModel = (index) => {
   form.restrictedModels.splice(index, 1)
 }
 
+// 常用模型列表
+const commonModels = ref([
+  'claude-opus-4-20250514',
+  'claude-opus-4-1-20250805'
+])
+
+// 可用的快捷模型（过滤掉已在限制列表中的）
+const availableQuickModels = computed(() => {
+  return commonModels.value.filter(model => !form.restrictedModels.includes(model))
+})
+
+// 快速添加限制的模型
+const quickAddRestrictedModel = (model) => {
+  if (!form.restrictedModels.includes(model)) {
+    form.restrictedModels.push(model)
+  }
+}
+
 // 标签管理方法
 const addTag = () => {
   if (newTag.value && newTag.value.trim()) {