From 465c631b39ce4948ad595b2019e6b8d5b25621d2 Mon Sep 17 00:00:00 2001
From: "Crane.z" <1481445951@qq.com>
Date: Fri, 17 Jul 2026 16:25:30 +0800
Subject: [PATCH] feat:add run sql to client

---
 ui/chen/api/index.ts                          | 18 +++++++
 ui/chen/components/QueryConsolePanel.vue      | 50 +++++++++++++++++--
 ui/chen/composables/useChenQueryConsole.ts    | 10 ++++
 ui/chen/composables/useChenWorkspaceTabs.ts   |  1 +
 ui/chen/types.ts                              |  1 +
 ui/chen/workspaces/DatabaseSessionSurface.vue | 22 +++++++-
 6 files changed, 96 insertions(+), 6 deletions(-)

diff --git a/ui/chen/api/index.ts b/ui/chen/api/index.ts
index 0ca5934c..12cf8628 100644
--- a/ui/chen/api/index.ts
+++ b/ui/chen/api/index.ts
@@ -50,6 +50,24 @@ export async function fetchChenProfile(chenToken: string) {
   return readJson<ChenProfile>(response);
 }
 
+export async function uploadChenSqlFile(
+  chenToken: string,
+  file: File,
+  fetchImpl: typeof fetch = fetch
+) {
+  const body = new FormData();
+  body.append("file", file);
+  const response = await fetchImpl(chenPath("/api/console/upload"), {
+    method: "POST",
+    credentials: "include",
+    headers: buildHeaders(chenToken, getWebApiMutationHeaders()),
+    body
+  });
+  const result = await readJson<{ path?: string }>(response);
+  if (!result.path?.trim()) throw new Error("Chen upload returned no SQL file path");
+  return { path: result.path };
+}
+
 export function sanitizeChenExportFileName(value: string, fallback = "chen-export") {
   const withoutControls = Array.from(value)
     .filter((character) => {
diff --git a/ui/chen/components/QueryConsolePanel.vue b/ui/chen/components/QueryConsolePanel.vue
index 138c07cd..0f8fd4c3 100644
--- a/ui/chen/components/QueryConsolePanel.vue
+++ b/ui/chen/components/QueryConsolePanel.vue
@@ -10,7 +10,6 @@ import { useChenSqlSnippets } from "~/chen/composables/useChenSqlSnippets";
 
 const props = defineProps<{
   tab: ChenQueryConsoleTab
-  contextLabel: string
   dbType: string
   canCopy: boolean
 }>();
@@ -18,6 +17,7 @@ const props = defineProps<{
 const emit = defineEmits<{
   run: [tab: ChenQueryConsoleTab, selectedSql: string]
   cancel: [tab: ChenQueryConsoleTab]
+  uploadSql: [tab: ChenQueryConsoleTab, file: File]
   dataViewAction: [tab: ChenQueryConsoleTab, result: ChenQueryResultTab, action: ChenDataViewAction, data?: ChenDataViewActionData]
   dismissMessage: [tab: ChenQueryConsoleTab]
   updateStatement: [tab: ChenQueryConsoleTab, value: string]
@@ -26,6 +26,7 @@ const emit = defineEmits<{
 }>();
 
 const sqlEditor = ref<{ selectedText: () => string } | null>(null);
+const sqlUploadInput = ref<HTMLInputElement | null>(null);
 const hasSelection = ref(false);
 const messageOpen = ref(false);
 const saveSnippetDialogOpen = ref(false);
@@ -55,6 +56,32 @@ function requestErrorMessage(cause: unknown) {
   return cause instanceof Error ? cause.message : String(cause);
 }
 
+function handleSqlFileChange(event: Event) {
+  const input = event.target as HTMLInputElement;
+  const file = input.files?.[0];
+  input.value = "";
+  if (!file) return;
+
+  if (!file.name.toLowerCase().endsWith(".sql")) {
+    toast.add({
+      title: "SQL upload failed",
+      description: "Choose a .sql file.",
+      color: "error"
+    });
+    return;
+  }
+  if (file.size === 0) {
+    toast.add({
+      title: "SQL upload failed",
+      description: "SQL file is empty.",
+      color: "error"
+    });
+    return;
+  }
+
+  emit("uploadSql", props.tab, file);
+}
+
 async function openSnippetDialog() {
   selectSnippetDialogOpen.value = true;
   try {
@@ -158,9 +185,6 @@ onBeforeUnmount(clearMessageTimer);
           :disabled="!tab.state.canCancel"
           @click="emit('cancel', tab)"
         />
-        <UBadge color="neutral" variant="subtle">
-          {{ tab.state.currentContext || contextLabel || 'Context' }}
-        </UBadge>
         <UButton
           icon="i-lucide-folder-open"
           size="sm"
@@ -181,6 +205,24 @@ onBeforeUnmount(clearMessageTimer);
         >
           Save
         </UButton>
+        <input
+          ref="sqlUploadInput"
+          type="file"
+          accept=".sql"
+          class="hidden"
+          @change="handleSqlFileChange"
+        >
+        <UButton
+          icon="i-lucide-upload"
+          size="sm"
+          color="neutral"
+          variant="soft"
+          :loading="tab.uploadingSql"
+          :disabled="queryBusy || tab.uploadingSql"
+          @click="sqlUploadInput?.click()"
+        >
+          Upload SQL
+        </UButton>
       </div>
       <div class="relative flex min-h-0 flex-1">
         <ChenSqlEditor
diff --git a/ui/chen/composables/useChenQueryConsole.ts b/ui/chen/composables/useChenQueryConsole.ts
index 333fba5b..1acb51fd 100644
--- a/ui/chen/composables/useChenQueryConsole.ts
+++ b/ui/chen/composables/useChenQueryConsole.ts
@@ -150,6 +150,15 @@ export function useChenQueryConsole(
     });
   }
 
+  function runQueryFile(tab: ChenQueryConsoleTab, path: string) {
+    if (tab.state.loading || tab.state.inQuery || !path.trim()) return;
+    dismissQueryMessage(tab);
+    sendConsoleAction(tab, "query_console_action", {
+      action: "run_sql_file",
+      data: path
+    });
+  }
+
   function runConsoleTab(tab: ChenPromptConsoleTab) {
     const sql = tab.pendingSql.trim();
     if (!sql) return;
@@ -177,6 +186,7 @@ export function useChenQueryConsole(
     handleQueryConsolePacket,
     removeQueryResult,
     runConsoleTab,
+    runQueryFile,
     runQueryTab,
     updateQueryResult
   };
diff --git a/ui/chen/composables/useChenWorkspaceTabs.ts b/ui/chen/composables/useChenWorkspaceTabs.ts
index 3209f4f8..a33c034c 100644
--- a/ui/chen/composables/useChenWorkspaceTabs.ts
+++ b/ui/chen/composables/useChenWorkspaceTabs.ts
@@ -54,6 +54,7 @@ export function useChenWorkspaceTabs() {
       kind: "query",
       nodeKey,
       statement: "",
+      uploadingSql: false,
       state: {},
       logs: [],
       message: null,
diff --git a/ui/chen/types.ts b/ui/chen/types.ts
index 78786f1e..e1e423e5 100644
--- a/ui/chen/types.ts
+++ b/ui/chen/types.ts
@@ -113,6 +113,7 @@ export interface ChenConsoleHistoryEntry {
 export interface ChenQueryConsoleTab extends ChenTabDefinition {
   kind: "query"
   statement: string
+  uploadingSql: boolean
   state: ChenConsoleState
   logs: string[]
   message: ChenConsoleMessage | null
diff --git a/ui/chen/workspaces/DatabaseSessionSurface.vue b/ui/chen/workspaces/DatabaseSessionSurface.vue
index 43b6d52d..279cc9ec 100644
--- a/ui/chen/workspaces/DatabaseSessionSurface.vue
+++ b/ui/chen/workspaces/DatabaseSessionSurface.vue
@@ -15,7 +15,7 @@ import type {
 } from "~/chen/types";
 import type { WorkspaceSessionTab } from "~/composables/useWorkspaceTabs";
 
-import { fetchChenActions, fetchChenExport } from "~/chen/api";
+import { fetchChenActions, fetchChenExport, uploadChenSqlFile } from "~/chen/api";
 import ChenSessionState from "~/chen/components/ChenSessionState.vue";
 import ConsolePanel from "~/chen/components/ConsolePanel.vue";
 import DataViewPanel from "~/chen/components/DataViewPanel.vue";
@@ -362,6 +362,24 @@ function runQueryTab(tab: ChenQueryLikeWorkspaceTab, selectedSql = "") {
   if (tab.kind === "console") queryConsole.runConsoleTab(tab);
 }
 
+async function uploadQuerySql(tab: ChenQueryConsoleTab, file: File) {
+  if (tab.uploadingSql || tab.state.loading || tab.state.inQuery) return;
+  tab.uploadingSql = true;
+  try {
+    const result = await uploadChenSqlFile(auth.chenToken.value, file);
+    queryConsole.runQueryFile(tab, result.path);
+    toast.add({ title: "SQL file uploaded", description: file.name, color: "success" });
+  } catch (cause) {
+    toast.add({
+      title: "SQL upload failed",
+      description: cause instanceof Error ? cause.message : String(cause),
+      color: "error"
+    });
+  } finally {
+    tab.uploadingSql = false;
+  }
+}
+
 function cancelQueryLikeTab(tab: ChenQueryLikeWorkspaceTab) {
   queryConsole.cancelQueryLikeTab(tab);
 }
@@ -487,11 +505,11 @@ defineExpose({ focus });
           <QueryConsolePanel
             v-if="activeQueryTab"
             :tab="activeQueryTab"
-            :context-label="currentContextLabel"
             :db-type="auth.profile.value?.dbType || ''"
             :can-copy="auth.profile.value?.canCopy === true"
             @run="runQueryTab"
             @cancel="cancelQueryLikeTab"
+            @upload-sql="uploadQuerySql"
             @data-view-action="runQueryDataViewAction"
             @dismiss-message="dismissQueryMessage"
             @update-statement="updateQueryStatement"