优化

frontend/app/web-gold/src/components/SavePromptModal.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, watch } from 'vue'
+import { ref, watchEffect, computed } from 'vue'
 import { message } from 'ant-design-vue'
 import { UserPromptApi } from '@/api/userPrompt'
 import { useUserStore } from '@/stores/user'
@@ -9,6 +9,12 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  // 编辑模式：传入完整的 prompt 对象 { id, name, content, category }
+  prompt: {
+    type: Object,
+    default: null,
+  },
+  // 新建模式：只传入内容字符串
   promptContent: {
     type: String,
     default: '',
@@ -20,17 +26,40 @@ const emit = defineEmits(['update:visible', 'success'])
 const userStore = useUserStore()
 const savingPrompt = ref(false)
 const savePromptForm = ref({
+  id: null,
   name: '',
   category: '',
   content: '',
 })
 
-watch(() => props.visible, (newVal) => {
-  if (newVal) {
-    savePromptForm.value = {
-      name: '',
-      category: '',
-      content: props.promptContent,
+// 是否为编辑模式
+const isEditMode = computed(() => !!props.prompt?.id)
+
+// 弹窗标题
+const modalTitle = computed(() => isEditMode.value ? '编辑提示词' : '保存提示词')
+
+// 使用 watchEffect 自动追踪依赖
+watchEffect(() => {
+  if (props.visible) {
+    // 编辑模式：从 prompt 对象获取数据
+    if (props.prompt) {
+      console.log('[SavePromptModal] edit mode, prompt:', props.prompt)
+      savePromptForm.value = {
+        id: props.prompt.id || null,
+        name: props.prompt.name || '',
+        category: props.prompt.category || '',
+        content: props.prompt.content || '',
+      }
+    }
+    // 新建模式：从 promptContent 字符串获取数据
+    else if (props.promptContent) {
+      console.log('[SavePromptModal] create mode, promptContent:', props.promptContent?.substring(0, 100))
+      savePromptForm.value = {
+        id: null,
+        name: savePromptForm.value.name || '',
+        category: savePromptForm.value.category || '',
+        content: props.promptContent,
+      }
     }
   }
 })
@@ -40,49 +69,61 @@ async function handleSave() {
     message.warning('请输入提示词名称')
     return
   }
-  
+
   if (!savePromptForm.value.content.trim()) {
     message.warning('提示词内容不能为空')
     return
   }
-  
+
   const userId = Number(userStore.userId)
   if (!userId) {
     message.error('无法获取用户ID，请先登录')
     return
   }
-  
+
   savingPrompt.value = true
   try {
-    // 确保 content 字段有值
     const content = savePromptForm.value.content?.trim() || ''
     if (!content) {
       message.error('提示词内容不能为空')
-      savingPrompt.value = false
       return
     }
-    
-    const payload = {
-      userId: userId,
-      name: savePromptForm.value.name.trim(),
-      content: content, // 确保 content 有值
-      category: savePromptForm.value.category?.trim() || null,
-      isPublic: false,
-      sort: 0,
-      useCount: 0,
-      status: 1,
+
+    let response
+    if (isEditMode.value) {
+      // 编辑模式：调用更新接口
+      const payload = {
+        id: savePromptForm.value.id,
+        userId: userId,
+        name: savePromptForm.value.name.trim(),
+        content: content,
+        category: savePromptForm.value.category?.trim() || null,
+      }
+      console.log('[SavePromptModal] 更新请求参数:', payload)
+      response = await UserPromptApi.updateUserPrompt(payload)
+    } else {
+      // 新建模式：调用创建接口
+      const payload = {
+        userId: userId,
+        name: savePromptForm.value.name.trim(),
+        content: content,
+        category: savePromptForm.value.category?.trim() || null,
+        isPublic: false,
+        sort: 0,
+        useCount: 0,
+        status: 1,
+      }
+      console.log('[SavePromptModal] 创建请求参数:', payload)
+      response = await UserPromptApi.createUserPrompt(payload)
     }
-    
-    console.log('[SavePromptModal] 发送请求参数:', payload)
-    
-    const response = await UserPromptApi.createUserPrompt(payload)
-    
+
     if (response && (response.code === 0 || response.code === 200)) {
-      message.success('提示词保存成功')
+      message.success(isEditMode.value ? '提示词更新成功' : '提示词保存成功')
       emit('update:visible', false)
       emit('success')
       // 重置表单
       savePromptForm.value = {
+        id: null,
         name: '',
         category: '',
         content: '',
@@ -106,21 +147,21 @@ function handleCancel() {
 <template>
   <a-modal
     :open="visible"
-    title="保存提示词"
+    :title="modalTitle"
     :width="600"
     :maskClosable="false"
     @cancel="handleCancel">
     <a-form :model="savePromptForm" layout="vertical">
       <a-form-item label="提示词名称" required>
-        <a-input 
-          v-model:value="savePromptForm.name" 
+        <a-input
+          v-model:value="savePromptForm.name"
           placeholder="请输入提示词名称"
           :maxlength="50"
           show-count />
       </a-form-item>
       <a-form-item label="分类/标签">
-        <a-input 
-          v-model:value="savePromptForm.category" 
+        <a-input
+          v-model:value="savePromptForm.category"
           placeholder="可选：输入分类或标签"
           :maxlength="20" />
       </a-form-item>
@@ -131,17 +172,16 @@ function handleCancel() {
           placeholder="提示词内容" />
       </a-form-item>
     </a-form>
-    
+
     <template #footer>
       <a-space>
         <a-button @click="handleCancel">取消</a-button>
-        <a-button 
-          type="primary" 
+        <a-button
+          type="primary"
           :loading="savingPrompt"
           :disabled="!savePromptForm.name.trim()"
-          @click="handleSave">保存</a-button>
+          @click="handleSave">{{ isEditMode ? '更新' : '保存' }}</a-button>
       </a-space>
     </template>
   </a-modal>
 </template>
-

frontend/app/web-gold/src/components/agents/MyFavoritesModal.vue

@@ -10,7 +10,7 @@ import {
 } from '@ant-design/icons-vue'
 import { UserPromptApi } from '@/api/userPrompt'
 
-import SavePromptModal from '@/views/content-style/components/SavePromptModal.vue'
+import SavePromptModal from '@/components/SavePromptModal.vue'
 
 // Props
 const props = defineProps({

frontend/app/web-gold/src/views/content-style/Benchmark.vue

@@ -14,7 +14,7 @@ import { copyToClipboard } from '@/utils/clipboard'
 import BenchmarkForm from './components/BenchmarkForm.vue'
 import BenchmarkTable from './components/BenchmarkTable.vue'
 import BatchAnalyzeModal from './components/BatchAnalyzeModal.vue'
-import SavePromptModal from './components/SavePromptModal.vue'
+import SavePromptModal from '@/components/SavePromptModal.vue'
 
 const router = useRouter()
 const promptStore = usePromptStore()