From e2b63404466e1d6d8788158342516d1d90c22845 Mon Sep 17 00:00:00 2001
From: Julian Freeman <freemanjulian372@gmail.com>
Date: Sun, 5 Apr 2026 11:53:43 -0400
Subject: [PATCH] add chat sys prompts to settings

---
 src/components/ConversationView.vue |  10 ++-
 src/components/SettingsView.vue     | 103 +++++++++++++++++++++++++++-
 src/stores/settings.ts              |  18 +++--
 3 files changed, 118 insertions(+), 13 deletions(-)

diff --git a/src/components/ConversationView.vue b/src/components/ConversationView.vue
index e02ceaa..ad9e8f4 100644
--- a/src/components/ConversationView.vue
+++ b/src/components/ConversationView.vue
@@ -11,9 +11,6 @@ import {
   LANGUAGES, 
   SPEAKER_IDENTITY_OPTIONS, 
   TONE_REGISTER_OPTIONS, 
-  CONVERSATION_SYSTEM_PROMPT_TEMPLATE, 
-  CONVERSATION_EVALUATION_PROMPT_TEMPLATE,
-  CONVERSATION_REFINEMENT_PROMPT_TEMPLATE,
   type Participant 
 } from '../stores/settings';
 import { cn } from '../lib/utils';
@@ -169,7 +166,7 @@ const translateMessage = async (sender: 'me' | 'partner') => {
   const toLang = sender === 'me' ? activeSession.value.partner.language : activeSession.value.me.language;
   const myToneLabel = TONE_REGISTER_OPTIONS.find(o => o.value === activeSession.value!.me.tone)?.label || '随和';
 
-  const systemPrompt = CONVERSATION_SYSTEM_PROMPT_TEMPLATE
+  const systemPrompt = settings.chatSystemPromptTemplate
     .replace(/{ME_NAME}/g, activeSession.value.me.name)
     .replace(/{ME_GENDER}/g, activeSession.value.me.gender)
     .replace(/{ME_LANG}/g, activeSession.value.me.language.englishName)
@@ -245,7 +242,7 @@ const evaluateMessage = async (messageId: string, force = false) => {
     ? (TONE_REGISTER_OPTIONS.find(o => o.value === activeSession.value!.me.tone)?.label || '随和')
     : '自动识别 (保留原作者原始语气和情绪)';
 
-  const systemPrompt = CONVERSATION_EVALUATION_PROMPT_TEMPLATE
+  const systemPrompt = settings.chatEvaluationPromptTemplate
     .replace(/{ME_NAME}/g, activeSession.value.me.name)
     .replace(/{ME_GENDER}/g, activeSession.value.me.gender)
     .replace(/{ME_LANG}/g, activeSession.value.me.language.englishName)
@@ -337,7 +334,7 @@ const refineMessage = async (messageId: string) => {
   // 确定目标语气
   const targetTone = msg.sender === 'me' ? myToneLabel : '自动识别 (保持原作者原始语气和情绪)';
 
-  const systemPrompt = CONVERSATION_REFINEMENT_PROMPT_TEMPLATE
+  const systemPrompt = settings.chatRefinementPromptTemplate
     .replace(/{ME_NAME}/g, activeSession.value.me.name)
     .replace(/{ME_GENDER}/g, activeSession.value.me.gender)
     .replace(/{ME_LANG}/g, activeSession.value.me.language.englishName)
@@ -345,6 +342,7 @@ const refineMessage = async (messageId: string) => {
     .replace(/{PART_GENDER}/g, activeSession.value.partner.gender)
     .replace(/{PART_LANG}/g, activeSession.value.partner.language.englishName)
     .replace(/{HISTORY_BLOCK}/g, historyBlock || 'None')
+    .replace(/{ORIGINAL_TEXT}/g, msg.original)
     .replace(/{CURRENT_TRANSLATION}/g, msg.translated)
     .replace(/{SUGGESTIONS}/g, suggestionsText)
     .replace(/{TARGET_TONE}/g, targetTone);
diff --git a/src/components/SettingsView.vue b/src/components/SettingsView.vue
index 6c3811a..372ae32 100644
--- a/src/components/SettingsView.vue
+++ b/src/components/SettingsView.vue
@@ -1,11 +1,20 @@
 <script setup lang="ts">
 import { ref, computed, onMounted, onUnmounted } from 'vue';
-import { Play, Settings, Type, Save, Check, Plus, Trash2, ChevronDown, Eye, EyeOff, Pencil } from 'lucide-vue-next';
-import { useSettingsStore, DEFAULT_TEMPLATE, DEFAULT_EVALUATION_TEMPLATE, DEFAULT_REFINEMENT_TEMPLATE, type ApiProfile } from '../stores/settings';
+import { Play, Settings, Type, Save, Check, Plus, Trash2, ChevronDown, Eye, EyeOff, Pencil, MessageSquare } from 'lucide-vue-next';
+import { 
+  useSettingsStore, 
+  DEFAULT_TEMPLATE, 
+  DEFAULT_EVALUATION_TEMPLATE, 
+  DEFAULT_REFINEMENT_TEMPLATE, 
+  CONVERSATION_SYSTEM_PROMPT_TEMPLATE,
+  CONVERSATION_EVALUATION_PROMPT_TEMPLATE,
+  CONVERSATION_REFINEMENT_PROMPT_TEMPLATE,
+  type ApiProfile 
+} from '../stores/settings';
 import { cn } from '../lib/utils';
 
 const settings = useSettingsStore();
-const settingsCategory = ref<'api' | 'general' | 'prompts'>('api');
+const settingsCategory = ref<'api' | 'general' | 'prompts' | 'chat-prompts'>('api');
 const showApiKey = ref(false);
 
 const newProfileName = ref('');
@@ -129,6 +138,18 @@ onUnmounted(() => window.removeEventListener('click', handleGlobalClick));
               </div>
               提示词工程
             </button>
+            <button 
+              @click="settingsCategory = 'chat-prompts'"
+              :class="cn(
+                'w-full flex items-center gap-3 px-3 py-2.5 rounded-lg text-sm font-medium transition-colors',
+                settingsCategory === 'chat-prompts' ? 'bg-blue-50 text-blue-600 dark:bg-blue-900/30 dark:text-blue-400' : 'text-slate-600 hover:bg-slate-100 dark:text-slate-300 dark:hover:bg-slate-800/50'
+              )"
+            >
+              <div :class="cn('p-1.5 rounded-md', settingsCategory === 'chat-prompts' ? 'bg-blue-100 dark:bg-blue-900/50' : 'bg-slate-100 dark:bg-slate-800')">
+                <MessageSquare class="w-4 h-4" />
+              </div>
+              对话提示词
+            </button>
           </nav>
         </div>
 
@@ -490,6 +511,82 @@ onUnmounted(() => window.removeEventListener('click', handleGlobalClick));
               </div>
             </template>
 
+            <!-- Chat Prompt Engineering -->
+            <template v-if="settingsCategory === 'chat-prompts'">
+              <div class="mb-6 border-b dark:border-slate-800 pb-4">
+                <h1 class="text-2xl font-bold text-slate-800 dark:text-slate-100">对话提示词</h1>
+                <p class="text-sm text-slate-500 dark:text-slate-400 mt-1">专门针对“对话模式”优化的系统指令模板。</p>
+              </div>
+
+              <div class="space-y-8">
+                <!-- Chat Translation Prompt -->
+                <div class="bg-white/80 dark:bg-slate-900 rounded-2xl shadow-sm border dark:border-slate-800 overflow-hidden flex flex-col">
+                  <div class="px-5 py-3 border-b dark:border-slate-800 bg-slate-50 dark:bg-slate-950 flex items-center justify-between">
+                    <div class="flex items-center gap-2">
+                      <div class="w-2 h-2 rounded-full bg-blue-500"></div>
+                      <h3 class="text-sm font-bold text-slate-700 dark:text-slate-200">对话翻译指令</h3>
+                    </div>
+                    <button @click="settings.chatSystemPromptTemplate = CONVERSATION_SYSTEM_PROMPT_TEMPLATE" class="text-xs text-blue-600 dark:text-blue-400 hover:underline font-medium">恢复默认</button>
+                  </div>
+                  <textarea 
+                    v-model="settings.chatSystemPromptTemplate"
+                    rows="10"
+                    class="w-full p-5 bg-transparent outline-none font-mono text-xs leading-relaxed text-slate-800 dark:text-slate-300 resize-y"
+                    spellcheck="false"
+                  ></textarea>
+                  <div class="px-5 py-3 bg-slate-50 dark:bg-slate-950 border-t dark:border-slate-800">
+                    <div class="flex flex-wrap gap-1.5">
+                      <span v-for="tag in ['{ME_NAME}', '{ME_GENDER}', '{ME_LANG}', '{PART_NAME}', '{PART_GENDER}', '{PART_LANG}', '{HISTORY_BLOCK}', '{FROM_LANG}', '{TO_LANG}', '{MY_TONE}']" :key="tag" class="px-2 py-0.5 bg-white dark:bg-slate-800 text-[10px] font-mono rounded-md border dark:border-slate-700 text-slate-500 shadow-sm">{{ tag }}</span>
+                    </div>
+                  </div>
+                </div>
+
+                <!-- Chat Evaluation Prompt -->
+                <div class="bg-white/80 dark:bg-slate-900 rounded-2xl shadow-sm border dark:border-slate-800 overflow-hidden flex flex-col">
+                  <div class="px-5 py-3 border-b dark:border-slate-800 bg-slate-50 dark:bg-slate-950 flex items-center justify-between">
+                    <div class="flex items-center gap-2">
+                      <div class="w-2 h-2 rounded-full bg-amber-500"></div>
+                      <h3 class="text-sm font-bold text-slate-700 dark:text-slate-200">对话审计指令</h3>
+                    </div>
+                    <button @click="settings.chatEvaluationPromptTemplate = CONVERSATION_EVALUATION_PROMPT_TEMPLATE" class="text-xs text-blue-600 dark:text-blue-400 hover:underline font-medium">恢复默认</button>
+                  </div>
+                  <textarea 
+                    v-model="settings.chatEvaluationPromptTemplate"
+                    rows="12"
+                    class="w-full p-5 bg-transparent outline-none font-mono text-xs leading-relaxed text-slate-800 dark:text-slate-300 resize-y"
+                    spellcheck="false"
+                  ></textarea>
+                  <div class="px-5 py-3 bg-slate-50 dark:bg-slate-950 border-t dark:border-slate-800">
+                    <div class="flex flex-wrap gap-1.5">
+                      <span v-for="tag in ['{ME_NAME}', '{ME_GENDER}', '{ME_LANG}', '{PART_NAME}', '{PART_GENDER}', '{PART_LANG}', '{TARGET_TONE}', '{HISTORY_BLOCK}']" :key="tag" class="px-2 py-0.5 bg-white dark:bg-slate-800 text-[10px] font-mono rounded-md border dark:border-slate-700 text-slate-500 shadow-sm">{{ tag }}</span>
+                    </div>
+                  </div>
+                </div>
+
+                <!-- Chat Refinement Prompt -->
+                <div class="bg-white/80 dark:bg-slate-900 rounded-2xl shadow-sm border dark:border-slate-800 overflow-hidden flex flex-col">
+                  <div class="px-5 py-3 border-b dark:border-slate-800 bg-slate-50 dark:bg-slate-950 flex items-center justify-between">
+                    <div class="flex items-center gap-2">
+                      <div class="w-2 h-2 rounded-full bg-green-500"></div>
+                      <h3 class="text-sm font-bold text-slate-700 dark:text-slate-200">对话润色指令</h3>
+                    </div>
+                    <button @click="settings.chatRefinementPromptTemplate = CONVERSATION_REFINEMENT_PROMPT_TEMPLATE" class="text-xs text-blue-600 dark:text-blue-400 hover:underline font-medium">恢复默认</button>
+                  </div>
+                  <textarea 
+                    v-model="settings.chatRefinementPromptTemplate"
+                    rows="10"
+                    class="w-full p-5 bg-transparent outline-none font-mono text-xs leading-relaxed text-slate-800 dark:text-slate-300 resize-y"
+                    spellcheck="false"
+                  ></textarea>
+                  <div class="px-5 py-3 bg-slate-50 dark:bg-slate-950 border-t dark:border-slate-800">
+                    <div class="flex flex-wrap gap-1.5">
+                      <span v-for="tag in ['{ME_NAME}', '{ME_GENDER}', '{ME_LANG}', '{PART_NAME}', '{PART_GENDER}', '{PART_LANG}', '{TARGET_TONE}', '{HISTORY_BLOCK}', '{ORIGINAL_TEXT}', '{CURRENT_TRANSLATION}', '{SUGGESTIONS}']" :key="tag" class="px-2 py-0.5 bg-white dark:bg-slate-800 text-[10px] font-mono rounded-md border dark:border-slate-700 text-slate-500 shadow-sm">{{ tag }}</span>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </template>
+
           </div>
         </div>
       </div>
diff --git a/src/stores/settings.ts b/src/stores/settings.ts
index 33b52a9..ad8ccaf 100644
--- a/src/stores/settings.ts
+++ b/src/stores/settings.ts
@@ -210,7 +210,7 @@ Respond ONLY in JSON. "analysis" and "text" MUST be in Simplified Chinese:
   ]
 }`;
 
-export const CONVERSATION_REFINEMENT_PROMPT_TEMPLATE = `You are a professional conversation editor. Refine the [Current Translation] based on the [Audit Suggestions] and [Conversation History].
+export const CONVERSATION_REFINEMENT_PROMPT_TEMPLATE = `You are a professional conversation editor. Refine the [Current Translation] based on the [Original Source Text], [Audit Suggestions], and [Conversation History].
 
 # Context Info
 - Role A (Me): {ME_NAME}, Gender: {ME_GENDER}, Language: {ME_LANG}.
@@ -220,6 +220,9 @@ export const CONVERSATION_REFINEMENT_PROMPT_TEMPLATE = `You are a professional c
 [Conversation History]
 {HISTORY_BLOCK}
 
+[Original Source Text]
+{ORIGINAL_TEXT}
+
 [Current Translation]
 {CURRENT_TRANSLATION}
 
@@ -227,11 +230,11 @@ export const CONVERSATION_REFINEMENT_PROMPT_TEMPLATE = `You are a professional c
 {SUGGESTIONS}
 
 # Task
-Produce a new, refined version of the translation that addresses the suggestions while remaining naturally integrated into the conversation flow.
+Produce a new, refined version of the translation that addresses the suggestions while staying true to the original meaning and natural conversation flow.
 
 # Constraints
-1. Maintain semantic identity with the [Source Text].
-2. Strictly follow the {TARGET_TONE}.
+1. Maintain semantic identity with the [Original Source Text].
+2. Strictly follow the Target Tone.
 3. Output ONLY the refined translation text. No explanations.`;
 
 export const useSettingsStore = defineStore('settings', () => {
@@ -248,6 +251,10 @@ export const useSettingsStore = defineStore('settings', () => {
   const evaluationProfileId = useLocalStorage<string | null>('evaluation-profile-id', null);
   const refinementPromptTemplate = useLocalStorage('refinement-prompt-template', DEFAULT_REFINEMENT_TEMPLATE);
   
+  const chatSystemPromptTemplate = useLocalStorage('chat-system-prompt-template', CONVERSATION_SYSTEM_PROMPT_TEMPLATE);
+  const chatEvaluationPromptTemplate = useLocalStorage('chat-evaluation-prompt-template', CONVERSATION_EVALUATION_PROMPT_TEMPLATE);
+  const chatRefinementPromptTemplate = useLocalStorage('chat-refinement-prompt-template', CONVERSATION_REFINEMENT_PROMPT_TEMPLATE);
+
   // 存储整个对象以保持一致性
   const sourceLang = useLocalStorage<Language>('source-lang-v2', LANGUAGES[0]);
   const targetLang = useLocalStorage<Language>('target-lang-v2', LANGUAGES[4]);
@@ -391,6 +398,9 @@ export const useSettingsStore = defineStore('settings', () => {
     evaluationPromptTemplate,
     evaluationProfileId,
     refinementPromptTemplate,
+    chatSystemPromptTemplate,
+    chatEvaluationPromptTemplate,
+    chatRefinementPromptTemplate,
     sourceLang,
     targetLang,
     speakerIdentity,