From f272d753159190faf5f419f7061ae559bf261436 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?cls=5F=E5=AE=81=E6=B3=A2=E6=9C=AC=E6=9C=BA?=
 <908705107@qq.com>
Date: Wed, 10 Jun 2026 17:16:22 +0800
Subject: [PATCH] Remove workflow code editor dependency

---
 web/apps/web-ele/package.json                 |   9 -
 .../web-ele/src/adapter/component/index.ts    |  12 +-
 .../zq-form/code-editor/code-editor.vue       | 406 ------------------
 .../components/zq-form/code-editor/index.ts   |   3 -
 .../zq-form/code-editor/languages.ts          |  43 --
 .../components/zq-form/code-editor/types.ts   |  64 ---
 .../editor/components/NodeResultCard.vue      |  43 +-
 .../editor/components/SchemaConfigDialog.vue  |  22 +-
 .../workflow/editor/panels/CodePanel.vue      |  43 +-
 .../workflow/editor/panels/DbSqlPanel.vue     |  45 +-
 .../workflow/editor/panels/HttpPanel.vue      |  20 +-
 web/pnpm-lock.yaml                            | 174 --------
 12 files changed, 103 insertions(+), 781 deletions(-)
 delete mode 100644 web/apps/web-ele/src/components/zq-form/code-editor/code-editor.vue
 delete mode 100644 web/apps/web-ele/src/components/zq-form/code-editor/index.ts
 delete mode 100644 web/apps/web-ele/src/components/zq-form/code-editor/languages.ts
 delete mode 100644 web/apps/web-ele/src/components/zq-form/code-editor/types.ts

diff --git a/web/apps/web-ele/package.json b/web/apps/web-ele/package.json
index 64747a6..9d813ae 100644
--- a/web/apps/web-ele/package.json
+++ b/web/apps/web-ele/package.json
@@ -26,15 +26,6 @@
     "#/*": "./src/*"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "^6.20.0",
-    "@codemirror/commands": "^6.10.0",
-    "@codemirror/lang-json": "^6.0.2",
-    "@codemirror/lang-python": "^6.2.1",
-    "@codemirror/lang-sql": "^6.10.0",
-    "@codemirror/language": "^6.11.3",
-    "@codemirror/state": "^6.5.2",
-    "@codemirror/theme-one-dark": "^6.1.3",
-    "@codemirror/view": "^6.39.4",
     "@element-plus/icons-vue": "^2.3.2",
     "@tanstack/vue-virtual": "^3.13.18",
     "@vben-core/menu-ui": "workspace:*",
diff --git a/web/apps/web-ele/src/adapter/component/index.ts b/web/apps/web-ele/src/adapter/component/index.ts
index 73feeda..f316747 100644
--- a/web/apps/web-ele/src/adapter/component/index.ts
+++ b/web/apps/web-ele/src/adapter/component/index.ts
@@ -130,11 +130,6 @@ const ZqIconPicker = defineAsyncComponent(() =>
     (res) => res.default,
   ),
 );
-const CodeEditor = defineAsyncComponent(() =>
-  import('#/components/zq-form/code-editor/code-editor.vue').then(
-    (res) => res.default,
-  ),
-);
 
 const withDefaultPlaceholder = <T extends Component>(
   component: T,
@@ -275,7 +270,10 @@ function initComponentAdapter() {
     ImageSelector: withDefaultPlaceholder(ImageSelector, 'select'),
     Input: withDefaultPlaceholder(ElInput, 'input'),
     Textarea: withDefaultPlaceholder(ElInput, 'input', { type: 'textarea' }),
-    CodeEditor,
+    CodeEditor: withDefaultPlaceholder(ElInput, 'input', {
+      autosize: { minRows: 8 },
+      type: 'textarea',
+    }),
     InputNumber: withDefaultPlaceholder(ElInputNumber, 'input'),
     RadioGroup: (props, { attrs, slots }) => {
       let defaultSlot;
@@ -355,7 +353,7 @@ function initComponentAdapter() {
   // 定义全局共享状态中的消息提示
   globalShareState.defineMessage({
     // 复制成功消息提示
-    copyPreferencesSuccess: (title, content) => {
+    copyPreferencesSuccess: (title: string, content: string) => {
       void import('element-plus/es/components/notification/index').then(
         ({ ElNotification }) => {
           ElNotification({
diff --git a/web/apps/web-ele/src/components/zq-form/code-editor/code-editor.vue b/web/apps/web-ele/src/components/zq-form/code-editor/code-editor.vue
deleted file mode 100644
index 11893d5..0000000
--- a/web/apps/web-ele/src/components/zq-form/code-editor/code-editor.vue
+++ /dev/null
@@ -1,406 +0,0 @@
-<script setup lang="ts">
-import type { Extension } from '@codemirror/state';
-
-import type {
-  CodeEditorEmits,
-  CodeEditorExpose,
-  CodeEditorProps,
-} from './types';
-
-import {
-  computed,
-  onBeforeUnmount,
-  onMounted,
-  ref,
-  shallowRef,
-  watch,
-} from 'vue';
-
-import { usePreferences } from '@vben/preferences';
-
-import { autocompletion } from '@codemirror/autocomplete';
-import {
-  defaultKeymap,
-  history,
-  historyKeymap,
-  indentWithTab,
-} from '@codemirror/commands';
-import {
-  bracketMatching,
-  defaultHighlightStyle,
-  foldGutter,
-  indentOnInput,
-  syntaxHighlighting,
-} from '@codemirror/language';
-import { Compartment, EditorState } from '@codemirror/state';
-import { oneDark } from '@codemirror/theme-one-dark';
-import {
-  crosshairCursor,
-  drawSelection,
-  dropCursor,
-  EditorView,
-  highlightActiveLine,
-  highlightActiveLineGutter,
-  highlightSpecialChars,
-  keymap,
-  lineNumbers,
-  placeholder as placeholderExt,
-  rectangularSelection,
-} from '@codemirror/view';
-
-import { getLanguageExtension } from './languages';
-
-const props = withDefaults(defineProps<CodeEditorProps>(), {
-  modelValue: '',
-  language: 'javascript',
-  theme: 'auto',
-  readonly: false,
-  disabled: false,
-  height: 'auto',
-  minHeight: '100px',
-  tabSize: 2,
-  lineNumbers: true,
-  lineWrapping: false,
-  foldGutter: true,
-  highlightActiveLine: true,
-  bracketMatching: true,
-  autocompletion: true,
-  indentGuide: true,
-});
-
-const emit = defineEmits<CodeEditorEmits>();
-
-const editorRef = ref<HTMLDivElement>();
-const view = shallowRef<EditorView | null>(null);
-
-// 主题跟随系统
-const { isDark } = usePreferences();
-
-// Compartments 用于动态更新配置
-const languageCompartment = new Compartment();
-const themeCompartment = new Compartment();
-const readonlyCompartment = new Compartment();
-const lineNumbersCompartment = new Compartment();
-const lineWrappingCompartment = new Compartment();
-const foldGutterCompartment = new Compartment();
-const highlightActiveLineCompartment = new Compartment();
-const bracketMatchingCompartment = new Compartment();
-const autocompletionCompartment = new Compartment();
-const placeholderCompartment = new Compartment();
-
-// 计算当前主题
-const currentTheme = computed(() => {
-  if (props.theme === 'auto') {
-    return isDark.value ? 'dark' : 'light';
-  }
-  return props.theme;
-});
-
-// 计算样式
-const editorStyle = computed(() => {
-  const style: Record<string, string> = {};
-
-  if (props.height !== 'auto') {
-    style.height =
-      typeof props.height === 'number' ? `${props.height}px` : props.height;
-  }
-
-  if (props.minHeight) {
-    style.minHeight =
-      typeof props.minHeight === 'number'
-        ? `${props.minHeight}px`
-        : props.minHeight;
-  }
-
-  if (props.maxHeight) {
-    style.maxHeight =
-      typeof props.maxHeight === 'number'
-        ? `${props.maxHeight}px`
-        : props.maxHeight;
-  }
-
-  return style;
-});
-
-// 获取主题扩展
-function getThemeExtension(): Extension {
-  return currentTheme.value === 'dark' ? oneDark : [];
-}
-
-// 创建基础扩展
-function createBaseExtensions(): Extension[] {
-  return [
-    highlightSpecialChars(),
-    history(),
-    drawSelection(),
-    dropCursor(),
-    crosshairCursor(),
-    rectangularSelection(),
-    indentOnInput(),
-    syntaxHighlighting(defaultHighlightStyle, { fallback: true }),
-    keymap.of([...defaultKeymap, ...historyKeymap, indentWithTab]),
-    EditorState.tabSize.of(props.tabSize),
-    EditorView.updateListener.of((update) => {
-      if (update.docChanged) {
-        const value = update.state.doc.toString();
-        emit('update:modelValue', value);
-        emit('change', value);
-      }
-      if (update.focusChanged) {
-        if (update.view.hasFocus) {
-          emit('focus');
-        } else {
-          emit('blur');
-        }
-      }
-    }),
-  ];
-}
-
-// 初始化编辑器
-async function initEditor() {
-  if (!editorRef.value) return;
-
-  const languageExt = await getLanguageExtension(props.language);
-
-  const extensions: Extension[] = [
-    ...createBaseExtensions(),
-    languageCompartment.of(languageExt || []),
-    themeCompartment.of(getThemeExtension()),
-    readonlyCompartment.of(
-      EditorState.readOnly.of(props.readonly || props.disabled),
-    ),
-    lineNumbersCompartment.of(
-      props.lineNumbers ? [lineNumbers(), highlightActiveLineGutter()] : [],
-    ),
-    lineWrappingCompartment.of(
-      props.lineWrapping ? EditorView.lineWrapping : [],
-    ),
-    foldGutterCompartment.of(props.foldGutter ? foldGutter() : []),
-    highlightActiveLineCompartment.of(
-      props.highlightActiveLine ? highlightActiveLine() : [],
-    ),
-    bracketMatchingCompartment.of(
-      props.bracketMatching ? bracketMatching() : [],
-    ),
-    autocompletionCompartment.of(props.autocompletion ? autocompletion() : []),
-    placeholderCompartment.of(
-      props.placeholder ? placeholderExt(props.placeholder) : [],
-    ),
-  ];
-
-  const state = EditorState.create({
-    doc: props.modelValue,
-    extensions,
-  });
-
-  view.value = new EditorView({
-    state,
-    parent: editorRef.value,
-  });
-
-  emit('ready', view.value);
-}
-
-// 更新编辑器内容
-function updateContent(value: string) {
-  if (!view.value) return;
-  const currentValue = view.value.state.doc.toString();
-  if (currentValue !== value) {
-    view.value.dispatch({
-      changes: {
-        from: 0,
-        to: currentValue.length,
-        insert: value,
-      },
-    });
-  }
-}
-
-// 监听 modelValue 变化
-watch(
-  () => props.modelValue,
-  (value) => {
-    updateContent(value);
-  },
-);
-
-// 监听语言变化
-watch(
-  () => props.language,
-  async (language) => {
-    if (!view.value) return;
-    const languageExt = await getLanguageExtension(language);
-    view.value.dispatch({
-      effects: languageCompartment.reconfigure(languageExt || []),
-    });
-  },
-);
-
-// 监听主题变化
-watch(currentTheme, () => {
-  if (!view.value) return;
-  view.value.dispatch({
-    effects: themeCompartment.reconfigure(getThemeExtension()),
-  });
-});
-
-// 监听只读状态变化
-watch(
-  () => [props.readonly, props.disabled],
-  ([readonly, disabled]) => {
-    if (!view.value) return;
-    view.value.dispatch({
-      effects: readonlyCompartment.reconfigure(
-        EditorState.readOnly.of(Boolean(readonly || disabled)),
-      ),
-    });
-  },
-);
-
-// 监听行号显示变化
-watch(
-  () => props.lineNumbers,
-  (show) => {
-    if (!view.value) return;
-    view.value.dispatch({
-      effects: lineNumbersCompartment.reconfigure(
-        show ? [lineNumbers(), highlightActiveLineGutter()] : [],
-      ),
-    });
-  },
-);
-
-// 监听自动换行变化
-watch(
-  () => props.lineWrapping,
-  (wrap) => {
-    if (!view.value) return;
-    view.value.dispatch({
-      effects: lineWrappingCompartment.reconfigure(
-        wrap ? EditorView.lineWrapping : [],
-      ),
-    });
-  },
-);
-
-// 监听占位符变化
-watch(
-  () => props.placeholder,
-  (text) => {
-    if (!view.value) return;
-    view.value.dispatch({
-      effects: placeholderCompartment.reconfigure(
-        text ? placeholderExt(text) : [],
-      ),
-    });
-  },
-);
-
-// 暴露方法
-const expose: CodeEditorExpose = {
-  getView: () => view.value,
-  focus: () => view.value?.focus(),
-  getValue: () => view.value?.state.doc.toString() || '',
-  setValue: (value: string) => updateContent(value),
-  format: () => {
-    if (!view.value || props.language !== 'json') return;
-    try {
-      const content = view.value.state.doc.toString();
-      const formatted = JSON.stringify(
-        JSON.parse(content),
-        null,
-        props.tabSize,
-      );
-      updateContent(formatted);
-    } catch {
-      // JSON 解析失败，忽略
-    }
-  },
-};
-
-defineExpose(expose);
-
-onMounted(() => {
-  initEditor();
-});
-
-onBeforeUnmount(() => {
-  view.value?.destroy();
-  view.value = null;
-});
-</script>
-
-<template>
-  <div
-    ref="editorRef"
-    class="code-editor"
-    :class="{
-      'code-editor--disabled': disabled,
-      'code-editor--readonly': readonly,
-      'code-editor--dark': currentTheme === 'dark',
-    }"
-    :style="editorStyle"
-  ></div>
-</template>
-
-<style scoped>
-.code-editor {
-  width: 100%;
-  overflow: auto;
-  background-color: var(--el-bg-color);
-  border: 1px solid var(--el-border-color);
-  border-radius: var(--el-border-radius-base);
-}
-
-.code-editor :deep(.cm-editor) {
-  width: 100%;
-  height: 100%;
-  outline: none;
-}
-
-.code-editor :deep(.cm-content) {
-  width: 99%;
-}
-
-.code-editor :deep(.cm-scroller) {
-  font-family: 'Fira Code', Monaco, Menlo, 'Ubuntu Mono', Consolas, monospace;
-  font-size: 14px;
-  line-height: 1.5;
-}
-
-.code-editor :deep(.cm-focused) {
-  outline: none;
-}
-
-.code-editor:focus-within {
-  border-color: var(--el-color-primary);
-}
-
-.code-editor--disabled {
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-
-.code-editor--disabled :deep(.cm-editor) {
-  pointer-events: none;
-}
-
-.code-editor :deep(.cm-gutters) {
-  background-color: var(--el-fill-color-light);
-  border-right: 1px solid var(--el-border-color-lighter);
-}
-
-.code-editor--dark :deep(.cm-gutters) {
-  background-color: var(--el-fill-color-darker);
-  border-right-color: var(--el-border-color-darker);
-}
-
-.code-editor :deep(.cm-activeLineGutter) {
-  background-color: var(--el-fill-color);
-}
-
-.code-editor :deep(.cm-placeholder) {
-  color: var(--el-text-color-placeholder);
-}
-</style>
diff --git a/web/apps/web-ele/src/components/zq-form/code-editor/index.ts b/web/apps/web-ele/src/components/zq-form/code-editor/index.ts
deleted file mode 100644
index e3d772e..0000000
--- a/web/apps/web-ele/src/components/zq-form/code-editor/index.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export { default as CodeEditor } from './code-editor.vue';
-export { supportedLanguages } from './languages';
-export * from './types';
diff --git a/web/apps/web-ele/src/components/zq-form/code-editor/languages.ts b/web/apps/web-ele/src/components/zq-form/code-editor/languages.ts
deleted file mode 100644
index a5eb50f..0000000
--- a/web/apps/web-ele/src/components/zq-form/code-editor/languages.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-import type { Extension } from '@codemirror/state';
-
-import type { CodeLanguage } from './types';
-
-// 语言扩展懒加载映射
-const languageLoaders: Record<CodeLanguage, () => Promise<Extension>> = {
-  python: async () => {
-    const { python } = await import('@codemirror/lang-python');
-    return python();
-  },
-  sql: async () => {
-    const { sql } = await import('@codemirror/lang-sql');
-    return sql();
-  },
-  json: async () => {
-    const { json } = await import('@codemirror/lang-json');
-    return json();
-  },
-};
-
-/**
- * 获取语言扩展
- * @param language 语言类型
- * @returns 语言扩展
- */
-export async function getLanguageExtension(
-  language: CodeLanguage | string,
-): Promise<Extension | null> {
-  const loader = languageLoaders[language as CodeLanguage];
-  if (loader) {
-    return await loader();
-  }
-  return null;
-}
-
-/**
- * 支持的语言列表
- */
-export const supportedLanguages: CodeLanguage[] = [
-  'python',
-  'sql',
-  'json',
-];
diff --git a/web/apps/web-ele/src/components/zq-form/code-editor/types.ts b/web/apps/web-ele/src/components/zq-form/code-editor/types.ts
deleted file mode 100644
index 164b1db..0000000
--- a/web/apps/web-ele/src/components/zq-form/code-editor/types.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import type { EditorView } from '@codemirror/view';
-
-export type CodeLanguage =
-  | 'json'
-  | 'python'
-  | 'sql';
-
-export interface CodeEditorProps {
-  /** 代码内容 */
-  modelValue?: string;
-  /** 语言类型 */
-  language?: CodeLanguage | string;
-  /** 主题: light/dark/auto(跟随系统) */
-  theme?: 'auto' | 'dark' | 'light';
-  /** 是否只读 */
-  readonly?: boolean;
-  /** 是否禁用 */
-  disabled?: boolean;
-  /** 高度 */
-  height?: number | string;
-  /** 最小高度 */
-  minHeight?: number | string;
-  /** 最大高度 */
-  maxHeight?: number | string;
-  /** 占位符 */
-  placeholder?: string;
-  /** Tab 大小 */
-  tabSize?: number;
-  /** 是否显示行号 */
-  lineNumbers?: boolean;
-  /** 是否自动换行 */
-  lineWrapping?: boolean;
-  /** 是否显示代码折叠 */
-  foldGutter?: boolean;
-  /** 是否高亮当前行 */
-  highlightActiveLine?: boolean;
-  /** 是否显示括号匹配 */
-  bracketMatching?: boolean;
-  /** 是否启用自动补全 */
-  autocompletion?: boolean;
-  /** 是否显示缩进指南 */
-  indentGuide?: boolean;
-}
-
-export interface CodeEditorEmits {
-  (e: 'update:modelValue', value: string): void;
-  (e: 'change', value: string): void;
-  (e: 'focus'): void;
-  (e: 'blur'): void;
-  (e: 'ready', view: EditorView): void;
-}
-
-export interface CodeEditorExpose {
-  /** 获取 EditorView 实例 */
-  getView: () => EditorView | null;
-  /** 聚焦编辑器 */
-  focus: () => void;
-  /** 获取代码内容 */
-  getValue: () => string;
-  /** 设置代码内容 */
-  setValue: (value: string) => void;
-  /** 格式化代码(仅支持 JSON) */
-  format: () => void;
-}
diff --git a/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/NodeResultCard.vue b/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/NodeResultCard.vue
index 0259b51..d8f1512 100644
--- a/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/NodeResultCard.vue
+++ b/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/NodeResultCard.vue
@@ -17,7 +17,6 @@ import {
 } from '@vben/icons';
 import { $t } from '@vben/locales';
 
-import { CodeEditor } from '#/components/zq-form/code-editor';
 import { ZqDialog } from '#/components/zq-dialog';
 
 export interface IterationResult {
@@ -254,15 +253,8 @@ const formattedInputs = computed(() => {
           <div class="text-foreground mb-2 text-sm font-medium">
             {{ $t('ai-platform.workflow.editor.nodeResultCard.input') }}
           </div>
-          <div class="min-h-0 flex-1 overflow-hidden rounded border">
-            <CodeEditor
-              :model-value="formattedInputs"
-              language="json"
-              height="100%"
-              :readonly="true"
-              :line-numbers="true"
-              :fold-gutter="true"
-            />
+          <div class="result-json-view min-h-0 flex-1 overflow-auto rounded border">
+            <pre>{{ formattedInputs }}</pre>
           </div>
         </div>
 
@@ -270,15 +262,8 @@ const formattedInputs = computed(() => {
           <div class="text-foreground mb-2 text-sm font-medium">
             {{ $t('ai-platform.workflow.editor.nodeResultCard.output') }}
           </div>
-          <div class="min-h-0 flex-1 overflow-hidden rounded border">
-            <CodeEditor
-              :model-value="formattedOutput"
-              language="json"
-              height="100%"
-              :readonly="true"
-              :line-numbers="true"
-              :fold-gutter="true"
-            />
+          <div class="result-json-view min-h-0 flex-1 overflow-auto rounded border">
+            <pre>{{ formattedOutput }}</pre>
           </div>
         </div>
       </div>
@@ -477,3 +462,23 @@ const formattedInputs = computed(() => {
     </div>
   </div>
 </template>
+
+<style scoped>
+.result-json-view {
+  background: hsl(var(--muted) / 35%);
+  padding: 12px;
+}
+
+.result-json-view pre {
+  min-height: 100%;
+  margin: 0;
+  color: hsl(var(--muted-foreground));
+  font-family:
+    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
+    'Courier New', monospace;
+  font-size: 12px;
+  line-height: 1.6;
+  overflow-wrap: anywhere;
+  white-space: pre-wrap;
+}
+</style>
diff --git a/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/SchemaConfigDialog.vue b/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/SchemaConfigDialog.vue
index a94a9ec..c2f0cbd 100644
--- a/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/SchemaConfigDialog.vue
+++ b/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/SchemaConfigDialog.vue
@@ -13,7 +13,6 @@ import {
   ElSwitch,
 } from 'element-plus';
 
-import { CodeEditor } from '#/components/zq-form/code-editor';
 import { ZqDialog } from '#/components/zq-dialog';
 
 interface SchemaField {
@@ -464,11 +463,11 @@ const previewSchema = computed(() => {
 
         <!-- JSON 编辑模式 -->
         <div v-if="editMode === 'json'" class="flex h-full flex-col">
-          <CodeEditor
+          <ElInput
             v-model="jsonContent"
-            language="json"
-            height="100%"
-            :line-wrapping="true"
+            type="textarea"
+            resize="none"
+            class="schema-json-textarea"
           />
           <div v-if="jsonError" class="mt-2 text-xs text-red-500">
             {{ jsonError }}
@@ -1136,4 +1135,17 @@ const previewSchema = computed(() => {
   border-radius: 4px;
   overflow: hidden;
 }
+
+:deep(.schema-json-textarea),
+:deep(.schema-json-textarea textarea) {
+  height: 100%;
+}
+
+:deep(.schema-json-textarea textarea) {
+  font-family:
+    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
+    'Courier New', monospace;
+  font-size: 12px;
+  line-height: 1.6;
+}
 </style>
diff --git a/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/CodePanel.vue b/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/CodePanel.vue
index f37467b..164b54d 100644
--- a/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/CodePanel.vue
+++ b/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/CodePanel.vue
@@ -13,7 +13,6 @@ import {
   ElTooltip,
 } from 'element-plus';
 
-import { CodeEditor } from '#/components/zq-form/code-editor';
 import { ZqDialog } from '#/components/zq-dialog';
 
 import SmartInput from '../components/SmartInput.vue';
@@ -186,15 +185,13 @@ const codeEditorVisible = ref(false);
           </ElButton>
         </ElTooltip>
       </div>
-      <CodeEditor
+      <ElInput
         v-model="form.code"
-        language="python"
-        height="280px"
+        type="textarea"
+        :rows="14"
+        resize="vertical"
+        class="workflow-code-textarea"
         :placeholder="$t('ai-platform.workflow.panels.code.codePlaceholder')"
-        :fold-gutter="true"
-        :bracket-matching="true"
-        :autocompletion="true"
-        :line-numbers="false"
       />
     </div>
   </ElForm>
@@ -207,15 +204,12 @@ const codeEditorVisible = ref(false);
     :show-footer="false"
   >
     <div class="code-editor-dialog-content">
-      <CodeEditor
+      <ElInput
         v-model="form.code"
-        language="python"
-        height="100%"
+        type="textarea"
+        resize="none"
+        class="workflow-code-textarea workflow-code-textarea--dialog"
         :placeholder="$t('ai-platform.workflow.panels.code.codePlaceholder')"
-        :fold-gutter="true"
-        :bracket-matching="true"
-        :autocompletion="true"
-        :line-numbers="true"
       />
     </div>
   </ZqDialog>
@@ -245,12 +239,6 @@ const codeEditorVisible = ref(false);
   min-height: 0;
 }
 
-.code-editor-dialog .code-editor-dialog-content .code-editor {
-  flex: 1;
-  min-height: 0;
-  height: 100% !important;
-}
-
 .code-editor-dialog.is-fullscreen .el-dialog__body {
   display: flex;
   flex: 1;
@@ -266,4 +254,17 @@ const codeEditorVisible = ref(false);
 .code-editor-dialog.is-fullscreen .zq-dialog-body .el-scrollbar {
   height: 100% !important;
 }
+
+.workflow-code-textarea textarea {
+  font-family:
+    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
+    'Courier New', monospace;
+  font-size: 12px;
+  line-height: 1.6;
+}
+
+.workflow-code-textarea--dialog,
+.workflow-code-textarea--dialog textarea {
+  height: 100%;
+}
 </style>
diff --git a/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/DbSqlPanel.vue b/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/DbSqlPanel.vue
index 13cb863..c78e87f 100644
--- a/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/DbSqlPanel.vue
+++ b/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/DbSqlPanel.vue
@@ -17,7 +17,6 @@ import {
   ElTooltip,
 } from 'element-plus';
 
-import { CodeEditor } from '#/components/zq-form/code-editor';
 import { ZqDialog } from '#/components/zq-dialog';
 import { getParamTypeOptions } from '#/views/_core/data-source/data';
 
@@ -171,16 +170,13 @@ function handleConnectionChange(payload: { dbName: string; dbType: string }) {
           </ElButton>
         </ElTooltip>
       </div>
-      <CodeEditor
+      <ElInput
         v-model="form.sql"
-        language="sql"
-        height="280px"
+        type="textarea"
+        :rows="12"
+        resize="vertical"
         :placeholder="$t('ai-platform.workflow.panels.dbSql.sqlPlaceholder')"
-        :fold-gutter="true"
-        :bracket-matching="true"
-        :autocompletion="true"
-        :line-numbers="false"
-        class="font-mono"
+        class="workflow-code-textarea"
       />
       <div class="mt-2 flex flex-wrap items-center gap-1">
         <span class="text-muted-foreground mr-2 text-xs">
@@ -290,16 +286,12 @@ function handleConnectionChange(payload: { dbName: string; dbType: string }) {
     :show-footer="false"
   >
     <div class="code-editor-dialog-content">
-      <CodeEditor
+      <ElInput
         v-model="form.sql"
-        language="sql"
-        height="100%"
+        type="textarea"
+        resize="none"
         :placeholder="$t('ai-platform.workflow.panels.dbSql.sqlPlaceholder')"
-        :fold-gutter="true"
-        :bracket-matching="true"
-        :autocompletion="true"
-        :line-numbers="true"
-        class="font-mono"
+        class="workflow-code-textarea workflow-code-textarea--dialog"
       />
     </div>
   </ZqDialog>
@@ -314,6 +306,14 @@ function handleConnectionChange(payload: { dbName: string; dbType: string }) {
   width: 100%;
   min-width: 0;
 }
+
+:deep(.workflow-code-textarea textarea) {
+  font-family:
+    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
+    'Courier New', monospace;
+  font-size: 12px;
+  line-height: 1.6;
+}
 </style>
 
 <style>
@@ -340,12 +340,6 @@ function handleConnectionChange(payload: { dbName: string; dbType: string }) {
   min-height: 0;
 }
 
-.code-editor-dialog .code-editor-dialog-content .code-editor {
-  flex: 1;
-  min-height: 0;
-  height: 100% !important;
-}
-
 .code-editor-dialog.is-fullscreen .el-dialog__body {
   display: flex;
   flex: 1;
@@ -361,4 +355,9 @@ function handleConnectionChange(payload: { dbName: string; dbType: string }) {
 .code-editor-dialog.is-fullscreen .zq-dialog-body .el-scrollbar {
   height: 100% !important;
 }
+
+.workflow-code-textarea--dialog,
+.workflow-code-textarea--dialog textarea {
+  height: 100%;
+}
 </style>
diff --git a/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/HttpPanel.vue b/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/HttpPanel.vue
index e61457d..e74d362 100644
--- a/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/HttpPanel.vue
+++ b/web/apps/web-ele/src/views/ai-platform/workflow/editor/panels/HttpPanel.vue
@@ -16,8 +16,6 @@ import {
   ElTabs,
 } from 'element-plus';
 
-import { CodeEditor } from '#/components/zq-form/code-editor';
-
 import SmartInput from '../components/SmartInput.vue';
 
 const props = defineProps<{ data: any; nodeId: string }>();
@@ -175,13 +173,13 @@ const removeParam = (index: number) => {
       </ElTabPane>
 
       <ElTabPane label="Body">
-        <CodeEditor
+        <ElInput
           v-model="form.body"
-          language="json"
-          height="200px"
+          type="textarea"
+          :rows="10"
+          resize="vertical"
+          class="workflow-code-textarea"
           placeholder='{"key": "value"}'
-          :fold-gutter="true"
-          :bracket-matching="true"
         />
         <div class="text-muted-foreground mt-1 text-xs">
           {{ $t('ai-platform.workflow.panels.http.bodyHint') }}
@@ -206,4 +204,12 @@ const removeParam = (index: number) => {
 :deep(.http-tabs .el-tabs__content) {
   padding: 12px;
 }
+
+:deep(.workflow-code-textarea textarea) {
+  font-family:
+    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
+    'Courier New', monospace;
+  font-size: 12px;
+  line-height: 1.6;
+}
 </style>
diff --git a/web/pnpm-lock.yaml b/web/pnpm-lock.yaml
index 2c4a3c7..1a0a42f 100644
--- a/web/pnpm-lock.yaml
+++ b/web/pnpm-lock.yaml
@@ -644,33 +644,6 @@ importers:
 
   apps/web-ele:
     dependencies:
-      '@codemirror/autocomplete':
-        specifier: ^6.20.0
-        version: 6.20.0
-      '@codemirror/commands':
-        specifier: ^6.10.0
-        version: 6.10.0
-      '@codemirror/lang-json':
-        specifier: ^6.0.2
-        version: 6.0.2
-      '@codemirror/lang-python':
-        specifier: ^6.2.1
-        version: 6.2.1
-      '@codemirror/lang-sql':
-        specifier: ^6.10.0
-        version: 6.10.0
-      '@codemirror/language':
-        specifier: ^6.11.3
-        version: 6.11.3
-      '@codemirror/state':
-        specifier: ^6.5.2
-        version: 6.5.2
-      '@codemirror/theme-one-dark':
-        specifier: ^6.1.3
-        version: 6.1.3
-      '@codemirror/view':
-        specifier: ^6.39.4
-        version: 6.39.4
       '@element-plus/icons-vue':
         specifier: ^2.3.2
         version: 2.3.2(vue@3.5.25(typescript@5.9.3))
@@ -2634,33 +2607,6 @@ packages:
     resolution: {integrity: sha512-Nu8ahitGFFJztxUml9oD/DLb7Z28C8cd8F46IVQ7y5Btz575pvMY8AqZsXkX7Gds29eCKdMgIHjIvzskHgPSFg==}
     engines: {node: '>=18.0.0'}
 
-  '@codemirror/autocomplete@6.20.0':
-    resolution: {integrity: sha512-bOwvTOIJcG5FVo5gUUupiwYh8MioPLQ4UcqbcRf7UQ98X90tCa9E1kZ3Z7tqwpZxYyOvh1YTYbmZE9RTfTp5hg==}
-
-  '@codemirror/commands@6.10.0':
-    resolution: {integrity: sha512-2xUIc5mHXQzT16JnyOFkh8PvfeXuIut3pslWGfsGOhxP/lpgRm9HOl/mpzLErgt5mXDovqA0d11P21gofRLb9w==}
-
-  '@codemirror/lang-json@6.0.2':
-    resolution: {integrity: sha512-x2OtO+AvwEHrEwR0FyyPtfDUiloG3rnVTSZV1W8UteaLL8/MajQd8DpvUb2YVzC+/T18aSDv0H9mu+xw0EStoQ==}
-
-  '@codemirror/lang-python@6.2.1':
-    resolution: {integrity: sha512-IRjC8RUBhn9mGR9ywecNhB51yePWCGgvHfY1lWN/Mrp3cKuHr0isDKia+9HnvhiWNnMpbGhWrkhuWOc09exRyw==}
-
-  '@codemirror/lang-sql@6.10.0':
-    resolution: {integrity: sha512-6ayPkEd/yRw0XKBx5uAiToSgGECo/GY2NoJIHXIIQh1EVwLuKoU8BP/qK0qH5NLXAbtJRLuT73hx7P9X34iO4w==}
-
-  '@codemirror/language@6.11.3':
-    resolution: {integrity: sha512-9HBM2XnwDj7fnu0551HkGdrUrrqmYq/WC5iv6nbY2WdicXdGbhR/gfbZOH73Aqj4351alY1+aoG9rCNfiwS1RA==}
-
-  '@codemirror/state@6.5.2':
-    resolution: {integrity: sha512-FVqsPqtPWKVVL3dPSxy8wEF/ymIEuVzF1PK3VbUgrxXpJUSHQWWZz4JMToquRxnkw+36LTamCZG2iua2Ptq0fA==}
-
-  '@codemirror/theme-one-dark@6.1.3':
-    resolution: {integrity: sha512-NzBdIvEJmx6fjeremiGp3t/okrLPYT0d9orIc7AFun8oZcRk58aejkqhv6spnz4MLAevrKNPMQYXEWMg4s+sKA==}
-
-  '@codemirror/view@6.39.4':
-    resolution: {integrity: sha512-xMF6OfEAUVY5Waega4juo1QGACfNkNF+aJLqpd8oUJz96ms2zbfQ9Gh35/tI3y8akEV31FruKfj7hBnIU/nkqA==}
-
   '@commitlint/cli@19.8.1':
     resolution: {integrity: sha512-LXUdNIkspyxrlV6VDHWBmCZRtkEVRpBKxi2Gtw3J54cGWhLCTouVD/Q6ZSaSvd2YaDObWK8mDjrz3TIKtaQMAA==}
     engines: {node: '>=v18'}
@@ -3681,21 +3627,6 @@ packages:
   '@keyv/serialize@1.1.1':
     resolution: {integrity: sha512-dXn3FZhPv0US+7dtJsIi2R+c7qWYiReoEh5zUntWCf4oSpMNib8FDhSoed6m3QyZdx5hK7iLFkYk3rNxwt8vTA==}
 
-  '@lezer/common@1.4.0':
-    resolution: {integrity: sha512-DVeMRoGrgn/k45oQNu189BoW4SZwgZFzJ1+1TV5j2NJ/KFC83oa/enRqZSGshyeMk5cPWMhsKs9nx+8o0unwGg==}
-
-  '@lezer/highlight@1.2.3':
-    resolution: {integrity: sha512-qXdH7UqTvGfdVBINrgKhDsVTJTxactNNxLk7+UMwZhU13lMHaOBlJe9Vqp907ya56Y3+ed2tlqzys7jDkTmW0g==}
-
-  '@lezer/json@1.0.3':
-    resolution: {integrity: sha512-BP9KzdF9Y35PDpv04r0VeSTKDeox5vVr3efE7eBbx3r4s3oNLfunchejZhjArmeieBH+nVOpgIiBJpEAv8ilqQ==}
-
-  '@lezer/lr@1.4.5':
-    resolution: {integrity: sha512-/YTRKP5yPPSo1xImYQk7AZZMAgap0kegzqCSYHjAL9x1AZ0ZQW+IpcEzMKagCsbTsLnVeWkxYrCNeXG8xEPrjg==}
-
-  '@lezer/python@1.1.18':
-    resolution: {integrity: sha512-31FiUrU7z9+d/ElGQLJFXl+dKOdx0jALlP3KEOsGTex8mvj+SoE1FgItcHWK/axkxCHGUSpqIHt6JAWfWu9Rhg==}
-
   '@manypkg/find-root@1.1.0':
     resolution: {integrity: sha512-mki5uBvhHzO8kYYix/WRy2WX8S3B5wdVSc9D6KcU5lQNglP2yt58/VfLuAK49glRXChosY8ap2oJ1qgma3GUVA==}
 
@@ -3719,9 +3650,6 @@ packages:
     engines: {node: '>=18'}
     hasBin: true
 
-  '@marijn/find-cluster-break@1.0.2':
-    resolution: {integrity: sha512-l0h88YhZFyKdXIFNfSWpyjStDjGHwZ/U7iobcK1cQQD8sejsONdQtTVU+1wVN1PBw40PiiHB1vA5S7VTfQiP9g==}
-
   '@microsoft/api-extractor-model@7.32.1':
     resolution: {integrity: sha512-u4yJytMYiUAnhcNQcZDTh/tVtlrzKlyKrQnLOV+4Qr/5gV+cpufWzCYAB1Q23URFqD6z2RoL2UYncM9xJVGNKA==}
 
@@ -5693,9 +5621,6 @@ packages:
     resolution: {integrity: sha512-piICUB6ei4IlTv1+653yq5+KoqfBYmj9bw6LqXoOneTMDXk5nM1qt12mFW1caG3LlJXEKW1Bp0WggEmIfQB34g==}
     engines: {node: '>= 14'}
 
-  crelt@1.0.6:
-    resolution: {integrity: sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==}
-
   cron-parser@4.9.0:
     resolution: {integrity: sha512-p0SaNjrHOnQeR8/VnfGbmg9te2kfyYSQ7Sc/j/6DtPL3JQvKxmjO9TSjNFpujqV3vEYYBvNNvXSxzyksBWAx1Q==}
     engines: {node: '>=12.0.0'}
@@ -9691,9 +9616,6 @@ packages:
   stubborn-utils@1.0.2:
     resolution: {integrity: sha512-zOh9jPYI+xrNOyisSelgym4tolKTJCQd5GBhK0+0xJvcYDcwlOoxF/rnFKQ2KRZknXSG9jWAp66fwP6AxN9STg==}
 
-  style-mod@4.1.3:
-    resolution: {integrity: sha512-i/n8VsZydrugj3Iuzll8+x/00GH2vnYsk1eomD8QiRrSAeW6ItbCQDtfXCeJHd0iwiNagqjQkvpvREEPtW3IoQ==}
-
   style-search@0.1.0:
     resolution: {integrity: sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg==}
 
@@ -10597,9 +10519,6 @@ packages:
   vxe-table@4.17.22:
     resolution: {integrity: sha512-eqZtGtoE7hjU/7COEth175/5UFGRhBpXoUzCgbkUzg6ChIqeow/RyBsBFnYlsi2t7alUhxE9FDFp2ku5Gkon8Q==}
 
-  w3c-keyname@2.2.8:
-    resolution: {integrity: sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==}
-
   w3c-xmlserializer@5.0.0:
     resolution: {integrity: sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==}
     engines: {node: '>=18'}
@@ -12082,69 +12001,6 @@ snapshots:
     dependencies:
       mime: 3.0.0
 
-  '@codemirror/autocomplete@6.20.0':
-    dependencies:
-      '@codemirror/language': 6.11.3
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.39.4
-      '@lezer/common': 1.4.0
-
-  '@codemirror/commands@6.10.0':
-    dependencies:
-      '@codemirror/language': 6.11.3
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.39.4
-      '@lezer/common': 1.4.0
-
-  '@codemirror/lang-json@6.0.2':
-    dependencies:
-      '@codemirror/language': 6.11.3
-      '@lezer/json': 1.0.3
-
-  '@codemirror/lang-python@6.2.1':
-    dependencies:
-      '@codemirror/autocomplete': 6.20.0
-      '@codemirror/language': 6.11.3
-      '@codemirror/state': 6.5.2
-      '@lezer/common': 1.4.0
-      '@lezer/python': 1.1.18
-
-  '@codemirror/lang-sql@6.10.0':
-    dependencies:
-      '@codemirror/autocomplete': 6.20.0
-      '@codemirror/language': 6.11.3
-      '@codemirror/state': 6.5.2
-      '@lezer/common': 1.4.0
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.5
-
-  '@codemirror/language@6.11.3':
-    dependencies:
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.39.4
-      '@lezer/common': 1.4.0
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.5
-      style-mod: 4.1.3
-
-  '@codemirror/state@6.5.2':
-    dependencies:
-      '@marijn/find-cluster-break': 1.0.2
-
-  '@codemirror/theme-one-dark@6.1.3':
-    dependencies:
-      '@codemirror/language': 6.11.3
-      '@codemirror/state': 6.5.2
-      '@codemirror/view': 6.39.4
-      '@lezer/highlight': 1.2.3
-
-  '@codemirror/view@6.39.4':
-    dependencies:
-      '@codemirror/state': 6.5.2
-      crelt: 1.0.6
-      style-mod: 4.1.3
-      w3c-keyname: 2.2.8
-
   '@commitlint/cli@19.8.1(@types/node@24.10.1)(typescript@5.9.3)':
     dependencies:
       '@commitlint/format': 19.8.1
@@ -13187,28 +13043,6 @@ snapshots:
 
   '@keyv/serialize@1.1.1': {}
 
-  '@lezer/common@1.4.0': {}
-
-  '@lezer/highlight@1.2.3':
-    dependencies:
-      '@lezer/common': 1.4.0
-
-  '@lezer/json@1.0.3':
-    dependencies:
-      '@lezer/common': 1.4.0
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.5
-
-  '@lezer/lr@1.4.5':
-    dependencies:
-      '@lezer/common': 1.4.0
-
-  '@lezer/python@1.1.18':
-    dependencies:
-      '@lezer/common': 1.4.0
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.5
-
   '@manypkg/find-root@1.1.0':
     dependencies:
       '@babel/runtime': 7.28.4
@@ -13253,8 +13087,6 @@ snapshots:
       - encoding
       - supports-color
 
-  '@marijn/find-cluster-break@1.0.2': {}
-
   '@microsoft/api-extractor-model@7.32.1(@types/node@24.10.1)':
     dependencies:
       '@microsoft/tsdoc': 0.16.0
@@ -15415,8 +15247,6 @@ snapshots:
       crc-32: 1.2.2
       readable-stream: 4.7.0
 
-  crelt@1.0.6: {}
-
   cron-parser@4.9.0:
     dependencies:
       luxon: 3.7.2
@@ -19686,8 +19516,6 @@ snapshots:
 
   stubborn-utils@1.0.2: {}
 
-  style-mod@4.1.3: {}
-
   style-search@0.1.0: {}
 
   style-value-types@5.1.2:
@@ -20876,8 +20704,6 @@ snapshots:
     transitivePeerDependencies:
       - vue
 
-  w3c-keyname@2.2.8: {}
-
   w3c-xmlserializer@5.0.0:
     dependencies:
       xml-name-validator: 5.0.0