From 8625dd543a75596638617ca2bb8162d14515fb44 Mon Sep 17 00:00:00 2001
From: CaptainB <bin@fit2cloud.com>
Date: Wed, 9 Jul 2025 11:49:26 +0800
Subject: [PATCH] refactor: implement debounced async linting in
 CodemirrorEditor
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

--bug=1057664 --user=刘瑞斌 【工具】创建工具，工具内容输入特定的内容页面会崩溃 https://www.tapd.cn/62980211/s/1726594
---
 ui/src/components/codemirror-editor/index.vue | 41 +++++++++++--------
 1 file changed, 23 insertions(+), 18 deletions(-)

diff --git a/ui/src/components/codemirror-editor/index.vue b/ui/src/components/codemirror-editor/index.vue
index 4286c6906..ae5e40f52 100644
--- a/ui/src/components/codemirror-editor/index.vue
+++ b/ui/src/components/codemirror-editor/index.vue
@@ -46,6 +46,7 @@ import { python } from '@codemirror/lang-python'
 import { oneDark } from '@codemirror/theme-one-dark'
 import { linter, type Diagnostic } from '@codemirror/lint'
 import { loadSharedApi } from '@/utils/dynamics-api/shared-api'
+import debounce from 'lodash/debounce'
 
 defineOptions({ name: 'CodemirrorEditor' })
 
@@ -86,27 +87,31 @@ function getRangeFromLineAndColumn(state: any, line: number, column: number, end
   }
 }
 
+const asyncLint = debounce(async (doc: string) => {
+  const res = await loadSharedApi({ type: 'tool', systemType: apiType.value }).postPylint(doc)
+  return res.data
+}, 500)
+
 const regexpLinter = linter(async (view) => {
   const diagnostics: Diagnostic[] = []
-  await loadSharedApi({ type: 'tool', systemType: apiType.value })
-    .postPylint(view.state.doc.toString())
-    .then((ok: any) => {
-      ok.data.forEach((element: any) => {
-        const range = getRangeFromLineAndColumn(
-          view.state,
-          element.line,
-          element.column,
-          element.endColumn,
-        )
-
-        diagnostics.push({
-          from: range.form,
-          to: range.to,
-          severity: element.type,
-          message: element.message,
-        })
-      })
+  const lintResults = await asyncLint(view.state.doc.toString())
+  if (!lintResults || lintResults.length === 0) {
+    return diagnostics
+  }
+  lintResults.forEach((element: any) => {
+    const range = getRangeFromLineAndColumn(
+      view.state,
+      element.line,
+      element.column,
+      element.endColumn,
+    )
+    diagnostics.push({
+      from: range.form,
+      to: range.to,
+      severity: element.type,
+      message: element.message,
     })
+  })
   return diagnostics
 })
 const extensions = [python(), regexpLinter, oneDark]