feat:完善SQL编辑器

src/views/apihub/component/edit.vue

@@ -34,7 +34,7 @@
         </ul>
       </div>
       <div class="tab-content">
-        <el-form ref="formRef" :model="formData" :rules="ruleForm" label-width="100px" @keyup.enter="onSubmit">
+        <el-form ref="formRef" :model="formData" :rules="ruleForm" label-width="100px">
           <!-- 基本信息 Tab -->
           <div v-show="activeTab === 'basic'" class="basic-info-tab">
             <div class="form-section-title">基础配置</div>
@@ -153,6 +153,7 @@
                     language="sql"
                     @change="onSqlContentChange"
                     @editorDidMount="editorDidMount"
+                    @editorWillMount="editorWillMount"
                   />
                 </div>
               </div>
@@ -270,6 +271,37 @@ const monacoOptions = {
   contextmenu: true,
   cursorStyle: 'line',
   fontFamily: 'Menlo, Monaco, Consolas, "Courier New", monospace',
+  // 自动提示相关配置
+  quickSuggestions: {
+    other: true,
+    comments: true,
+    strings: true
+  },
+  suggestOnTriggerCharacters: true,
+  acceptSuggestionOnEnter: 'on',
+  tabCompletion: 'on',
+  wordBasedSuggestions: true,
+  parameterHints: {
+    enabled: true
+  },
+  suggest: {
+    showWords: true,
+    showKeywords: true,
+    showFunctions: true,
+    showClasses: true,
+    showInterfaces: true,
+    showMethods: true,
+    showProperties: true,
+    showVariables: true,
+    showModules: true,
+    showSnippets: true,
+    filterGraceful: true,
+    snippetsPreventQuickSuggestions: false
+  },
+  // 设置触发建议的字符数
+  quickSuggestionsDelay: 0, // 立即显示提示
+  // 自动触发建议的最小字符数
+  wordBasedSuggestionsOnlySameLanguage: false,
 };
 
 // SQL内容变化回调
@@ -280,6 +312,59 @@ const onSqlContentChange = (value) => {
   lineCount.value = Math.max(1, lines);
 };
 
+// 编辑器将要加载时的回调
+const editorWillMount = (monaco) => {
+  // 注册 SQL 语言的自动完成提供者
+  monaco.languages.registerCompletionItemProvider('sql', {
+    // 设置触发字符，空字符串表示在任何字符输入时都触发
+    triggerCharacters: [' ', '.', ',', '(', '=', '>', '<', '!', ';', ':', '*', '+', '-', '/', '%', '&', '|', '^', ''],
+    
+    provideCompletionItems: () => {
+      // SQL 关键字
+      const keywords = [
+        'SELECT', 'FROM', 'WHERE', 'INSERT', 'UPDATE', 'DELETE', 'CREATE', 'ALTER', 'DROP', 'TABLE',
+        'DATABASE', 'VIEW', 'INDEX', 'TRIGGER', 'PROCEDURE', 'FUNCTION', 'JOIN', 'LEFT', 'RIGHT', 'INNER',
+        'OUTER', 'FULL', 'GROUP BY', 'ORDER BY', 'HAVING', 'LIMIT', 'OFFSET', 'UNION', 'ALL', 'DISTINCT',
+        'AS', 'ON', 'BETWEEN', 'IN', 'LIKE', 'IS', 'NULL', 'NOT', 'AND', 'OR', 'EXISTS', 'CASE', 'WHEN',
+        'THEN', 'ELSE', 'END', 'DESC', 'ASC'
+      ];
+      
+      // SQL 函数
+      const functions = [
+        'COUNT', 'SUM', 'AVG', 'MIN', 'MAX', 'CONCAT', 'SUBSTRING', 'TRIM', 'LENGTH', 'UPPER', 'LOWER',
+        'DATE', 'NOW', 'CURRENT_DATE', 'CURRENT_TIME', 'CURRENT_TIMESTAMP', 'YEAR', 'MONTH', 'DAY'
+      ];
+      
+      const suggestions = [];
+      
+      // 添加关键字建议
+      keywords.forEach(keyword => {
+        suggestions.push({
+          label: keyword,
+          kind: monaco.languages.CompletionItemKind.Keyword,
+          insertText: keyword,
+          detail: 'SQL关键字',
+          sortText: '0' + keyword // 排序优先级
+        });
+      });
+      
+      // 添加函数建议
+      functions.forEach(func => {
+        suggestions.push({
+          label: func,
+          kind: monaco.languages.CompletionItemKind.Function,
+          insertText: func + '($0)',
+          insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet,
+          detail: 'SQL函数',
+          sortText: '1' + func // 排序优先级
+        });
+      });
+      
+      return { suggestions };
+    }
+  });
+};
+
 // 编辑器挂载完成回调
 const editorDidMount = (editor) => {
   // 初始化行数
@@ -290,6 +375,27 @@ const editorDidMount = (editor) => {
   if (editor) {
     // 可以在这里添加编辑器的其他配置，如键盘快捷键等
     editor.focus();
+    
+    // 添加输入监听，在用户开始输入时触发提示
+    editor.onDidChangeModelContent(() => {
+      // 触发自动提示
+      editor.trigger('keyboard', 'editor.action.triggerSuggest', {});
+    });
+    
+    // 初始化时就触发一次提示，这样用户一开始就能看到可用的关键字
+    setTimeout(() => {
+      editor.trigger('keyboard', 'editor.action.triggerSuggest', {});
+    }, 100);
+    
+    // 添加键盘事件处理，阻止回车键触发表单提交
+    editor.onKeyDown((e) => {
+      // 当用户在编辑器中按下回车键时
+      if (e.keyCode === 13 || e.code === 'Enter') {
+        // 阻止事件冒泡到表单
+        e.stopPropagation();
+        // 不需要阻止默认行为，因为我们希望编辑器中的回车还是能正常工作
+      }
+    });
   }
 };
 
@@ -600,6 +706,8 @@ const resetForm = () => {
   formRef.value && formRef.value.resetFields();
 };
 
+
+
 // 取消操作
 const cancel = () => {
   ElMessageBox.confirm(