组织表单提交造成的页面刷新 | 解决页面恢复的概率性崩溃

renderer/src/components/main-panel/index.vue

@@ -39,7 +39,7 @@
 <script setup lang="ts">
 import { defineComponent } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
-import { addNewTab, tabs, setActiveTab, closeTab } from './panel';
+import { addNewTab, tabs, closeTab } from './panel';
 
 defineComponent({ name: 'main-panel' });
 
@@ -51,7 +51,17 @@ function pageAddNewTab() {
 
 	// 如果当前不在 debug 路由，则切换到 debug 路由
 	if (route.name !== 'debug') {
-		router.push('/debug');
+		router.replace('/debug');
+	}
+}
+
+function setActiveTab(index: number) {
+	if (index >= 0 && index < tabs.content.length) {
+		tabs.activeIndex = index;
+		// 如果不在 debug 路由，则进入
+		if (route.name !== 'debug') {
+			router.replace('/debug');
+		}
 	}
 }
 

renderer/src/components/main-panel/panel.ts

@@ -34,14 +34,7 @@ export const tabs = reactive<{
 	],
 	activeIndex: 0,
 	get activeTab() {
-		return this.content[this.activeIndex] || {
+		return this.content[this.activeIndex];
-			name: 'blank',
-			icon: 'icon-blank',
-			type: 'blank',
-			component: undefined,
-			componentIndex: -1,
-			storage: {},
-		};
 	}
 });
 
@@ -84,11 +77,6 @@ export function addNewTab() {
 	tabs.activeIndex = tabs.content.length - 1;
 }
 
-export function setActiveTab(index: number) {
-	if (index >= 0 && index < tabs.content.length) {
-		tabs.activeIndex = index;
-	}
-}
 
 export function closeTab(index: number) {
 	if (tabs.content.length <= 1) return; // 至少保留一个标签页

renderer/src/components/main-panel/prompt/prompt-reader.vue

@@ -7,10 +7,14 @@
             <el-form-item v-for="param in currentPrompt?.params" :key="param.name"
                 :label="param.name" :prop="param.name">
                 <el-input v-if="param.type === 'string'" v-model="formData[param.name]"
-                    :placeholder="param.placeholder || `请输入${param.name}`" />
+                    :placeholder="param.placeholder || `请输入${param.name}`"
+                    @keydown.enter.prevent="handleSubmit"
+                    />
 
                 <el-input-number v-else-if="param.type === 'number'" v-model="formData[param.name]"
-                    :placeholder="param.placeholder || `请输入${param.name}`" />
+                    :placeholder="param.placeholder || `请输入${param.name}`"
+                    @keydown.enter.prevent="handleSubmit"
+                    />
 
                 <el-switch v-else-if="param.type === 'boolean'" v-model="formData[param.name]" />
             </el-form-item>
@@ -51,6 +55,7 @@ const tab = tabs.content[props.tabId];
 const tabStorage = tab.storage as PromptStorage;
 
 const formRef = ref<FormInstance>();
+// TODO: 将 formData 装入 tabStorage
 const formData = ref<Record<string, any>>({});
 const loading = ref(false);
 const responseData = ref<PromptsGetResponse>();

renderer/src/components/main-panel/resource/resouce-reader.vue

@@ -8,10 +8,12 @@
                 :label="param.name" :prop="param.name">
                 <!-- 根据不同类型渲染不同输入组件 -->
                 <el-input v-if="param.type === 'string'" v-model="formData[param.name]"
-                    :placeholder="param.placeholder || `请输入${param.name}`" />
+                    :placeholder="param.placeholder || `请输入${param.name}`"
+                    @keydown.enter.prevent="handleSubmit" />
 
                 <el-input-number v-else-if="param.type === 'number'" v-model="formData[param.name]"
-                    :placeholder="param.placeholder || `请输入${param.name}`" />
+                    :placeholder="param.placeholder || `请输入${param.name}`"
+                    @keydown.enter.prevent="handleSubmit" />
                     
                 <el-switch v-else-if="param.type === 'boolean'" v-model="formData[param.name]" />
             </el-form-item>

renderer/src/components/main-panel/tool/tool-executor.vue

@@ -17,6 +17,7 @@
                             v-if="property.type === 'string'" 
                             v-model="formData[name]"
                             :placeholder="t('enter') + ' ' + (property.title || name)"
+                            @keydown.enter.prevent="handleExecute" 
                         />
 
                         <el-input-number 
@@ -24,6 +25,7 @@
                             v-model="formData[name]"
                             controls-position="right"
                             :placeholder="t('enter') + ' ' + (property.title || name)"
+                            @keydown.enter.prevent="handleExecute" 
                         />
 
                         <el-switch 

renderer/src/hook/panel.ts

@@ -3,7 +3,7 @@ import { llmManager, llms } from "@/views/setting/llm";
 import { pinkLog } from "@/views/setting/util";
 import I18n from '@/i18n/index';
 import { debugModes, tabs } from "@/components/main-panel/panel";
-import { markRaw } from "vue";
+import { markRaw, ref } from "vue";
 
 interface SaveTabItem {
 	name: string;
@@ -18,6 +18,8 @@ interface SaveTab {
 	currentIndex: number
 }
 
+export const panelLoaded = ref(false);
+
 export function loadPanels() {
     const bridge = useMessageBridge();
     
@@ -53,6 +55,7 @@ export function loadPanels() {
 			tabs.activeIndex = persistTab.currentIndex;
 		}
 
+		panelLoaded.value = true;
     }, { once: true });
 
     bridge.postMessage({

renderer/src/views/debug/index.vue

@@ -1,9 +1,9 @@
 <template>
 	<div style="height: 100%;">
-		<Welcome v-show="!tabs.activeTab.component"></Welcome>
+		<Welcome v-show="!haveActiveTab"></Welcome>
 		
 		<!-- 如果存在激活标签页，则根据标签页进行渲染 -->
-		<div v-show="tabs.activeTab.component" style="height: 100%;">
+		<div v-show="haveActiveTab" style="height: 100%;">
 			<component
                 v-show="tab === tabs.activeTab"
                 v-for="(tab, index) of tabs.content"
@@ -22,6 +22,15 @@ import Welcome from './welcome.vue';
 import { tabs } from '@/components/main-panel/panel';
 
 defineComponent({ name: 'debug' });
+
+const haveActiveTab = computed(() => {
+	const activeTab = tabs.activeTab;
+	if (activeTab) {
+		return true;
+	}
+	return false;
+});
+
 </script>
 
 <style>

service/tabs.json

@@ -1,5 +1,5 @@
 {
-  "currentIndex": 1,
+  "currentIndex": 0,
   "tabs": [
     {
       "name": "工具",
@@ -11,12 +11,12 @@
       }
     },
     {
-      "name": "工具",
+      "name": "资源",
-      "icon": "icon-tool",
+      "icon": "icon-file",
       "type": "blank",
-      "componentIndex": 2,
+      "componentIndex": 0,
       "storage": {
-        "currentToolName": "add"
+        "currentResourceName": "greeting"
       }
     }
   ]