优化

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

@@ -0,0 +1,187 @@
+<script setup>
+import { ref, watchEffect, computed } from 'vue'
+import { message } from 'ant-design-vue'
+import { UserPromptApi } from '@/api/userPrompt'
+import { useUserStore } from '@/stores/user'
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    default: false,
+  },
+  // 编辑模式：传入完整的 prompt 对象 { id, name, content, category }
+  prompt: {
+    type: Object,
+    default: null,
+  },
+  // 新建模式：只传入内容字符串
+  promptContent: {
+    type: String,
+    default: '',
+  },
+})
+
+const emit = defineEmits(['update:visible', 'success'])
+
+const userStore = useUserStore()
+const savingPrompt = ref(false)
+const savePromptForm = ref({
+  id: null,
+  name: '',
+  category: '',
+  content: '',
+})
+
+// 是否为编辑模式
+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,
+      }
+    }
+  }
+})
+
+async function handleSave() {
+  if (!savePromptForm.value.name.trim()) {
+    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 {
+    const content = savePromptForm.value.content?.trim() || ''
+    if (!content) {
+      message.error('提示词内容不能为空')
+      return
+    }
+
+    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)
+    }
+
+    if (response && (response.code === 0 || response.code === 200)) {
+      message.success(isEditMode.value ? '提示词更新成功' : '提示词保存成功')
+      emit('update:visible', false)
+      emit('success')
+      // 重置表单
+      savePromptForm.value = {
+        id: null,
+        name: '',
+        category: '',
+        content: '',
+      }
+    } else {
+      throw new Error(response?.msg || response?.message || '保存失败')
+    }
+  } catch (error) {
+    console.error('保存提示词失败:', error)
+    message.error(error?.message || '保存失败，请稍后重试')
+  } finally {
+    savingPrompt.value = false
+  }
+}
+
+function handleCancel() {
+  emit('update:visible', false)
+}
+</script>
+
+<template>
+  <a-modal
+    :open="visible"
+    :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"
+          placeholder="请输入提示词名称"
+          :maxlength="50"
+          show-count />
+      </a-form-item>
+      <a-form-item label="分类/标签">
+        <a-input
+          v-model:value="savePromptForm.category"
+          placeholder="可选：输入分类或标签"
+          :maxlength="20" />
+      </a-form-item>
+      <a-form-item label="提示词内容">
+        <a-textarea
+          v-model:value="savePromptForm.content"
+          :rows="8"
+          placeholder="提示词内容" />
+      </a-form-item>
+    </a-form>
+
+    <template #footer>
+      <a-space>
+        <a-button @click="handleCancel">取消</a-button>
+        <a-button
+          type="primary"
+          :loading="savingPrompt"
+          :disabled="!savePromptForm.name.trim()"
+          @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({