From 4a0db185c0eae27bf580eee2f2685eac33c51965 Mon Sep 17 00:00:00 2001 From: Syngnat Date: Wed, 4 Feb 2026 10:13:02 +0800 Subject: [PATCH 1/4] =?UTF-8?q?=E2=9C=A8=20feat(db-ui):=20=E4=BF=AE?= =?UTF-8?q?=E5=A4=8D=E9=87=91=E4=BB=93=E6=89=93=E5=BC=80=E8=A1=A8=E6=8A=A5?= =?UTF-8?q?=E9=94=99=E5=B9=B6=E5=A2=9E=E5=BC=BA=E7=BB=93=E6=9E=9C=E9=A1=B5?= =?UTF-8?q?=E7=BC=96=E8=BE=91=E4=BD=93=E9=AA=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - postgres/kingbase 查询前自动清洗 ""ident"" 形式的非法标识符 - 结果表支持单元格弹窗编辑，提升 JSON/长文本可编辑性 - 修复查询结果表头与数据列宽度不对齐问题 --- frontend/src/components/DataGrid.tsx | 132 +++++++++++++++- internal/app/methods_db.go | 2 + internal/app/sql_sanitize.go | 219 +++++++++++++++++++++++++++ internal/app/sql_sanitize_test.go | 37 +++++ 4 files changed, 383 insertions(+), 7 deletions(-) create mode 100644 internal/app/sql_sanitize.go create mode 100644 internal/app/sql_sanitize_test.go diff --git a/frontend/src/components/DataGrid.tsx b/frontend/src/components/DataGrid.tsx index 8601b35..36e6907 100644 --- a/frontend/src/components/DataGrid.tsx +++ b/frontend/src/components/DataGrid.tsx @@ -2,6 +2,7 @@ import React, { useState, useEffect, useRef, useContext, useMemo, useCallback } import { Table, message, Input, Button, Dropdown, MenuProps, Form, Pagination, Select, Modal } from 'antd'; import type { SortOrder } from 'antd/es/table/interface'; import { ReloadOutlined, ImportOutlined, ExportOutlined, DownOutlined, PlusOutlined, DeleteOutlined, SaveOutlined, UndoOutlined, FilterOutlined, CloseOutlined, ConsoleSqlOutlined, FileTextOutlined, CopyOutlined, ClearOutlined } from '@ant-design/icons'; +import Editor from '@monaco-editor/react'; import { ImportData, ExportTable, ExportData, ApplyChanges } from '../../wailsjs/go/app/App'; import { useStore } from '../store'; import { v4 as uuidv4 } from 'uuid'; @@ -27,11 +28,38 @@ const formatCellValue = (val: any) => { return String(val); }; +const toEditableText = (val: any): string => { + if (val === null || val === undefined) return ''; + if (typeof val === 'string') return val; + try { + return JSON.stringify(val, null, 2); + } catch { + return String(val); + } +}; + +const looksLikeJsonText = (text: string): boolean => { + const raw = (text || '').trim(); + if (!raw) return false; + const first = raw[0]; + const last = raw[raw.length - 1]; + return (first === '{' && last === '}') || (first === '[' && last === ']'); +}; + +const shouldUseModalEditorForValue = (val: any): boolean => { + if (val === null || val === undefined) return false; + if (typeof val === 'object') return true; + const s = toEditableText(val); + if (s.includes('\n') || s.includes('\r')) return true; + if (s.length >= 160) return true; + return looksLikeJsonText(s); +}; + // --- Resizable Header (Native Implementation) --- const ResizableTitle = (props: any) => { const { onResizeStart, width, ...restProps } = props; - if (!width) { + if (!width || typeof onResizeStart !== 'function') { return ; } @@ -85,6 +113,7 @@ interface EditableCellProps { dataIndex: string; record: Item; handleSave: (record: Item) => void; + openEditor?: (record: Item, dataIndex: string, title: React.ReactNode) => void; [key: string]: any; } @@ -95,6 +124,7 @@ const EditableCell: React.FC = React.memo(({ dataIndex, record, handleSave, + openEditor, ...restProps }) => { const [editing, setEditing] = useState(false); @@ -139,7 +169,16 @@ const EditableCell: React.FC = React.memo(({ ); } - return {childNode}; + const handleDoubleClick = () => { + if (!editable) return; + if (openEditor && shouldUseModalEditorForValue(record?.[dataIndex])) { + openEditor(record, dataIndex, title); + return; + } + toggleEdit(); + }; + + return {childNode}; }); const ContextMenuRow = React.memo(({ children, record, ...props }: any) => { @@ -221,9 +260,15 @@ const DataGrid: React.FC = ({ }) => { const { connections } = useStore(); const addSqlLog = useStore(state => state.addSqlLog); + const darkMode = useStore(state => state.darkMode); + const selectionColumnWidth = 46; const [form] = Form.useForm(); const [modal, contextHolder] = Modal.useModal(); const gridId = useMemo(() => `grid-${uuidv4()}`, []); + const [cellEditorOpen, setCellEditorOpen] = useState(false); + const [cellEditorValue, setCellEditorValue] = useState(''); + const [cellEditorIsJson, setCellEditorIsJson] = useState(false); + const [cellEditorMeta, setCellEditorMeta] = useState<{ record: Item; dataIndex: string; title: string } | null>(null); // Helper to export specific data const exportData = async (rows: any[], format: string) => { @@ -237,6 +282,26 @@ const DataGrid: React.FC = ({ const [sortInfo, setSortInfo] = useState<{ columnKey: string, order: string } | null>(null); const [columnWidths, setColumnWidths] = useState>({}); + + const closeCellEditor = useCallback(() => { + setCellEditorOpen(false); + setCellEditorMeta(null); + setCellEditorValue(''); + setCellEditorIsJson(false); + }, []); + + const openCellEditor = useCallback((record: Item, dataIndex: string, title: React.ReactNode) => { + if (!record || !dataIndex) return; + const raw = record?.[dataIndex]; + const text = toEditableText(raw); + const isJson = looksLikeJsonText(text); + const titleText = typeof title === 'string' ? title : (typeof title === 'number' ? String(title) : String(dataIndex)); + + setCellEditorMeta({ record, dataIndex, title: titleText }); + setCellEditorValue(text); + setCellEditorIsJson(isJson); + setCellEditorOpen(true); + }, []); // Dynamic Height const [tableHeight, setTableHeight] = useState(500); @@ -452,6 +517,23 @@ const DataGrid: React.FC = ({ } }, [addedRows]); + const handleCellEditorSave = useCallback(() => { + if (!cellEditorMeta) return; + const nextRow: any = { ...cellEditorMeta.record, [cellEditorMeta.dataIndex]: cellEditorValue }; + handleCellSave(nextRow); + closeCellEditor(); + }, [cellEditorMeta, cellEditorValue, handleCellSave, closeCellEditor]); + + const handleFormatJsonInEditor = useCallback(() => { + if (!cellEditorIsJson) return; + try { + const obj = JSON.parse(cellEditorValue); + setCellEditorValue(JSON.stringify(obj, null, 2)); + } catch (e: any) { + message.error("JSON 格式无效：" + (e?.message || String(e))); + } + }, [cellEditorIsJson, cellEditorValue]); + // Merge Data for Display // 'displayData' already merges addedRows. // We need to merge modifiedRows into it for rendering. @@ -493,9 +575,10 @@ const DataGrid: React.FC = ({ dataIndex: col.dataIndex, title: col.title, handleSave: handleCellSave, + openEditor: openCellEditor, }), }; - }), [columns, handleCellSave]); + }), [columns, handleCellSave, openCellEditor]); const handleAddRow = () => { const newKey = `new-${Date.now()}`; @@ -735,7 +818,7 @@ const DataGrid: React.FC = ({ header: { cell: ResizableTitle } }), []); - const totalWidth = columns.reduce((sum, col) => sum + (col.width as number || 200), 0); + const totalWidth = columns.reduce((sum, col) => sum + (Number(col.width) || 200), 0) + selectionColumnWidth; const enableVirtual = mergedDisplayData.length >= 200; return ( @@ -803,6 +886,42 @@ const DataGrid: React.FC = ({
{contextHolder} + + 格式化 JSON + , + , + , + ]} + > +
+ {cellEditorMeta ? `${tableName || ''}${tableName ? '.' : ''}${cellEditorMeta.dataIndex}` : ''} +
+ {cellEditorOpen && ( + setCellEditorValue(val || '')} + options={{ + minimap: { enabled: false }, + scrollBeyondLastLine: false, + wordWrap: "on", + fontSize: 14, + tabSize: 2, + automaticLayout: true, + }} + /> + )} +
@@ -811,6 +930,7 @@ const DataGrid: React.FC = ({ dataSource={mergedDisplayData} columns={mergedColumns} size="small" + tableLayout="fixed" scroll={{ x: Math.max(totalWidth, 1000), y: tableHeight }} virtual={enableVirtual} loading={loading} @@ -821,6 +941,7 @@ const DataGrid: React.FC = ({ rowSelection={{ selectedRowKeys, onChange: setSelectedRowKeys, + columnWidth: selectionColumnWidth, }} rowClassName={(record) => { const k = record?.[GONAVI_ROW_KEY]; @@ -857,9 +978,6 @@ const DataGrid: React.FC = ({ {/* Ghost Resize Line for Columns */} diff --git a/internal/app/methods_db.go b/internal/app/methods_db.go index fa010be..f47f790 100644 --- a/internal/app/methods_db.go +++ b/internal/app/methods_db.go @@ -91,6 +91,8 @@ func (a *App) DBQuery(config connection.ConnectionConfig, dbName string, query s return connection.QueryResult{Success: false, Message: err.Error()} } + query = sanitizeSQLForPgLike(runConfig.Type, query) + lowerQuery := strings.TrimSpace(strings.ToLower(query)) if strings.HasPrefix(lowerQuery, "select") || strings.HasPrefix(lowerQuery, "show") || strings.HasPrefix(lowerQuery, "describe") || strings.HasPrefix(lowerQuery, "explain") { data, columns, err := dbInst.Query(query) diff --git a/internal/app/sql_sanitize.go b/internal/app/sql_sanitize.go new file mode 100644 index 0000000..9ba89e3 --- /dev/null +++ b/internal/app/sql_sanitize.go @@ -0,0 +1,219 @@ +package app + +import ( + "strings" + "unicode" +) + +func sanitizeSQLForPgLike(dbType string, query string) string { + switch strings.ToLower(strings.TrimSpace(dbType)) { + case "postgres", "kingbase": + return fixBrokenDoubleDoubleQuotedIdent(query) + default: + return query + } +} + +// fixBrokenDoubleDoubleQuotedIdent fixes accidental identifiers like: +// SELECT * FROM ""schema"".""table"" +// which can be produced when a quoted identifier gets wrapped by quotes again. +// +// It is intentionally conservative: +// - only runs outside strings/comments/dollar-quoted blocks +// - does not touch valid escaped-quote sequences inside quoted identifiers (e.g. "a""b") +func fixBrokenDoubleDoubleQuotedIdent(query string) string { + if !strings.Contains(query, `""`) { + return query + } + + var b strings.Builder + b.Grow(len(query)) + + inSingle := false + inDoubleIdent := false + inLineComment := false + inBlockComment := false + dollarTag := "" + + for i := 0; i < len(query); i++ { + ch := query[i] + next := byte(0) + if i+1 < len(query) { + next = query[i+1] + } + + if inLineComment { + b.WriteByte(ch) + if ch == '\n' { + inLineComment = false + } + continue + } + if inBlockComment { + b.WriteByte(ch) + if ch == '*' && next == '/' { + b.WriteByte('/') + i++ + inBlockComment = false + } + continue + } + if dollarTag != "" { + if strings.HasPrefix(query[i:], dollarTag) { + b.WriteString(dollarTag) + i += len(dollarTag) - 1 + dollarTag = "" + continue + } + b.WriteByte(ch) + continue + } + if inSingle { + b.WriteByte(ch) + if ch == '\'' { + // escaped single quote + if next == '\'' { + b.WriteByte('\'') + i++ + continue + } + inSingle = false + } + continue + } + if inDoubleIdent { + b.WriteByte(ch) + if ch == '"' { + // escaped quote inside identifier + if next == '"' { + b.WriteByte('"') + i++ + continue + } + inDoubleIdent = false + } + continue + } + + // --- Outside of all string/comment blocks --- + if ch == '-' && next == '-' { + b.WriteByte(ch) + b.WriteByte('-') + i++ + inLineComment = true + continue + } + if ch == '/' && next == '*' { + b.WriteByte(ch) + b.WriteByte('*') + i++ + inBlockComment = true + continue + } + if ch == '\'' { + b.WriteByte(ch) + inSingle = true + continue + } + if ch == '$' { + if tag := parseDollarTag(query[i:]); tag != "" { + b.WriteString(tag) + i += len(tag) - 1 + dollarTag = tag + continue + } + } + + // Fix: ""ident"" -> "ident" (only when it looks like a plain identifier) + if ch == '"' && next == '"' { + prevIsQuote := i > 0 && query[i-1] == '"' + nextIsQuote := i+2 < len(query) && query[i+2] == '"' + if !prevIsQuote && !nextIsQuote { + if replacement, advance, ok := tryFixDoubleDoubleQuotedIdent(query, i); ok { + b.WriteString(replacement) + i = advance - 1 + continue + } + } + } + + if ch == '"' { + b.WriteByte(ch) + inDoubleIdent = true + continue + } + + b.WriteByte(ch) + } + + return b.String() +} + +func tryFixDoubleDoubleQuotedIdent(query string, start int) (replacement string, advance int, ok bool) { + // start points at the first quote of `""...""` + if start < 0 || start+1 >= len(query) { + return "", 0, false + } + if query[start] != '"' || query[start+1] != '"' { + return "", 0, false + } + if start > 0 && query[start-1] == '"' { + return "", 0, false + } + if start+2 < len(query) && query[start+2] == '"' { + return "", 0, false + } + + contentStart := start + 2 + j := contentStart + for j+1 < len(query) { + if query[j] == '"' && query[j+1] == '"' { + // ensure closing pair is not part of a triple quote + if j+2 < len(query) && query[j+2] == '"' { + j++ + continue + } + content := strings.TrimSpace(query[contentStart:j]) + if looksLikeIdentifierContent(content) { + return `"` + content + `"`, j + 2, true + } + return "", 0, false + } + // Fast abort: identifier-like content should not span lines. + if query[j] == '\n' || query[j] == '\r' { + break + } + j++ + } + return "", 0, false +} + +func looksLikeIdentifierContent(s string) bool { + if strings.TrimSpace(s) == "" { + return false + } + for _, r := range s { + if r == '_' || r == '$' || r == '-' || unicode.IsLetter(r) || unicode.IsDigit(r) { + continue + } + return false + } + return true +} + +func parseDollarTag(s string) string { + // Match: $tag$ where tag is [A-Za-z0-9_]* (can be empty => $$) + if len(s) < 2 || s[0] != '$' { + return "" + } + for i := 1; i < len(s); i++ { + c := s[i] + if c == '$' { + return s[:i+1] + } + if !((c >= 'a' && c <= 'z') || (c >= 'A' && c <= 'Z') || (c >= '0' && c <= '9') || c == '_') { + return "" + } + } + return "" +} diff --git a/internal/app/sql_sanitize_test.go b/internal/app/sql_sanitize_test.go new file mode 100644 index 0000000..fbee1f6 --- /dev/null +++ b/internal/app/sql_sanitize_test.go @@ -0,0 +1,37 @@ +package app + +import "testing" + +func TestSanitizeSQLForPgLike_FixesBrokenDoubleDoubleQuotes(t *testing.T) { + in := `SELECT * FROM ""ldf_server"".""t_user"" LIMIT 1` + out := sanitizeSQLForPgLike("kingbase", in) + want := `SELECT * FROM "ldf_server"."t_user" LIMIT 1` + if out != want { + t.Fatalf("unexpected sanitize output:\nIN: %s\nOUT: %s\nWANT: %s", in, out, want) + } +} + +func TestSanitizeSQLForPgLike_DoesNotTouchEscapedQuotesInsideIdentifier(t *testing.T) { + in := `SELECT "a""b" FROM "t""x"` + out := sanitizeSQLForPgLike("postgres", in) + if out != in { + t.Fatalf("should keep valid escaped quotes inside identifier:\nIN: %s\nOUT: %s", in, out) + } +} + +func TestSanitizeSQLForPgLike_DoesNotTouchDollarQuotedStrings(t *testing.T) { + in := "SELECT $$\"\"ldf_server\"\"$$, \"\"ldf_server\"\"" + out := sanitizeSQLForPgLike("postgres", in) + want := "SELECT $$\"\"ldf_server\"\"$$, \"ldf_server\"" + if out != want { + t.Fatalf("unexpected sanitize output for dollar quoted string:\nIN: %s\nOUT: %s\nWANT: %s", in, out, want) + } +} + +func TestSanitizeSQLForPgLike_DoesNotModifyOtherDBTypes(t *testing.T) { + in := `SELECT * FROM ""ldf_server""` + out := sanitizeSQLForPgLike("mysql", in) + if out != in { + t.Fatalf("non-PG-like db should not be sanitized:\nIN: %s\nOUT: %s", in, out) + } +} From 8dbc97e46617e13a50fc9ffe35a7344d23e9e776 Mon Sep 17 00:00:00 2001 From: Syngnat Date: Wed, 4 Feb 2026 11:01:28 +0800 Subject: [PATCH 2/4] =?UTF-8?q?=E2=9A=A1=EF=B8=8F=20perf(table):=20?= =?UTF-8?q?=E8=A1=A8=E6=95=B0=E6=8D=AE=E6=89=93=E5=BC=80=E5=8A=A0=E9=80=9F?= =?UTF-8?q?=EF=BC=8C=E4=B8=BB=E9=94=AE/=E7=BB=9F=E8=AE=A1=E7=AD=89?= =?UTF-8?q?=E8=80=97=E6=97=B6=E6=93=8D=E4=BD=9C=E5=BC=82=E6=AD=A5=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - DataViewer 主键列元数据异步拉取，首屏数据优先渲染 - 查询页增加结果集最大行数限制，减少大表全量返回 - DBQuery 引入 Context 超时，降低长查询对 UI 的阻塞风险 - 查询行数设置持久化保存 Closes #48 Closes #49 --- frontend/src/components/DataViewer.tsx | 36 +- frontend/src/components/QueryEditor.tsx | 420 ++++++++++++++++++++++-- frontend/src/store.ts | 6 +- internal/app/methods_db.go | 28 +- internal/db/custom_impl.go | 26 ++ internal/db/dameng_impl.go | 26 ++ internal/db/kingbase_impl.go | 26 ++ internal/db/mysql_impl.go | 26 ++ internal/db/oracle_impl.go | 26 ++ internal/db/postgres_impl.go | 26 ++ internal/db/scan_rows.go | 36 ++ internal/db/sqlite_impl.go | 26 ++ 12 files changed, 676 insertions(+), 32 deletions(-) create mode 100644 internal/db/scan_rows.go diff --git a/frontend/src/components/DataViewer.tsx b/frontend/src/components/DataViewer.tsx index 5473ab1..33a5a56 100644 --- a/frontend/src/components/DataViewer.tsx +++ b/frontend/src/components/DataViewer.tsx @@ -14,6 +14,8 @@ const DataViewer: React.FC<{ tab: TabData }> = ({ tab }) => { const fetchSeqRef = useRef(0); const countSeqRef = useRef(0); const countKeyRef = useRef(''); + const pkSeqRef = useRef(0); + const pkKeyRef = useRef(''); const [pagination, setPagination] = useState({ current: 1, @@ -27,6 +29,13 @@ const DataViewer: React.FC<{ tab: TabData }> = ({ tab }) => { const [showFilter, setShowFilter] = useState(false); const [filterConditions, setFilterConditions] = useState([]); + useEffect(() => { + setPkColumns([]); + pkKeyRef.current = ''; + countKeyRef.current = ''; + setPagination(prev => ({ ...prev, current: 1, total: 0, totalKnown: false })); + }, [tab.connectionId, tab.dbName, tab.tableName]); + const fetchData = useCallback(async (page = pagination.current, size = pagination.pageSize) => { const seq = ++fetchSeqRef.current; setLoading(true); @@ -103,11 +112,6 @@ const DataViewer: React.FC<{ tab: TabData }> = ({ tab }) => { try { const pData = DBQuery(config as any, dbName, sql); - let pCols: Promise | null = null; - if (pkColumns.length === 0) { - pCols = DBGetColumns(config as any, dbName, tableName); - } - const resData = await pData; const duration = Date.now() - startTime; @@ -123,11 +127,23 @@ const DataViewer: React.FC<{ tab: TabData }> = ({ tab }) => { dbName }); - if (pCols) { - const resCols = await pCols; - if (resCols.success) { - const pks = (resCols.data as ColumnDefinition[]).filter(c => c.key === 'PRI').map(c => c.name); - setPkColumns(pks); + if (pkColumns.length === 0) { + const pkKey = `${tab.connectionId}|${dbName}|${tableName}`; + if (pkKeyRef.current !== pkKey) { + pkKeyRef.current = pkKey; + const pkSeq = ++pkSeqRef.current; + DBGetColumns(config as any, dbName, tableName) + .then((resCols: any) => { + if (pkSeqRef.current !== pkSeq) return; + if (pkKeyRef.current !== pkKey) return; + if (!resCols?.success) return; + const pks = (resCols.data as ColumnDefinition[]).filter((c: any) => c.key === 'PRI').map((c: any) => c.name); + setPkColumns(pks); + }) + .catch(() => { + if (pkSeqRef.current !== pkSeq) return; + if (pkKeyRef.current !== pkKey) return; + }); } } diff --git a/frontend/src/components/QueryEditor.tsx b/frontend/src/components/QueryEditor.tsx index 5e7e1b0..4c7ec9f 100644 --- a/frontend/src/components/QueryEditor.tsx +++ b/frontend/src/components/QueryEditor.tsx @@ -19,6 +19,8 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { tableName?: string; pkColumns: string[]; readOnly: boolean; + truncated?: boolean; + pkLoading?: boolean; }; // Result Sets @@ -26,6 +28,7 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { const [activeResultKey, setActiveResultKey] = useState(''); const [loading, setLoading] = useState(false); + const runSeqRef = useRef(0); const [isSaveModalOpen, setIsSaveModalOpen] = useState(false); const [saveForm] = Form.useForm(); @@ -47,6 +50,13 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { const darkMode = useStore(state => state.darkMode); const sqlFormatOptions = useStore(state => state.sqlFormatOptions); const setSqlFormatOptions = useStore(state => state.setSqlFormatOptions); + const queryOptions = useStore(state => state.queryOptions); + const setQueryOptions = useStore(state => state.setQueryOptions); + + const currentDbRef = useRef(currentDb); + useEffect(() => { + currentDbRef.current = currentDb; + }, [currentDb]); // If opening a saved query, load its SQL useEffect(() => { @@ -72,7 +82,7 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { if (res.success && Array.isArray(res.data)) { const dbs = res.data.map((row: any) => row.Database || row.database); setDbList(dbs); - if (!currentDb) { + if (!currentDbRef.current) { if (conn.config.database) setCurrentDb(conn.config.database); else if (dbs.length > 0 && dbs[0] !== 'information_schema') setCurrentDb(dbs[0]); } @@ -81,7 +91,7 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { } }; fetchDbs(); - }, [currentConnectionId, connections, currentDb]); + }, [currentConnectionId, connections]); // Fetch Metadata for Autocomplete useEffect(() => { @@ -343,6 +353,327 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { return statements; }; + const getLeadingKeyword = (sql: string): string => { + const text = (sql || '').replace(/\r\n/g, '\n'); + const isWS = (ch: string) => ch === ' ' || ch === '\t' || ch === '\n' || ch === '\r'; + const isWord = (ch: string) => /[A-Za-z0-9_]/.test(ch); + + let inSingle = false; + let inDouble = false; + let inBacktick = false; + let escaped = false; + let inLineComment = false; + let inBlockComment = false; + let dollarTag: string | null = null; + + for (let i = 0; i < text.length; i++) { + const ch = text[i]; + const next = i + 1 < text.length ? text[i + 1] : ''; + const prev = i > 0 ? text[i - 1] : ''; + const next2 = i + 2 < text.length ? text[i + 2] : ''; + + if (!inSingle && !inDouble && !inBacktick) { + if (inLineComment) { + if (ch === '\n') inLineComment = false; + continue; + } + if (inBlockComment) { + if (ch === '*' && next === '/') { + i++; + inBlockComment = false; + } + continue; + } + + if (ch === '/' && next === '*') { + i++; + inBlockComment = true; + continue; + } + if (ch === '#') { + inLineComment = true; + continue; + } + if (ch === '-' && next === '-' && (i === 0 || isWS(prev)) && (next2 === '' || isWS(next2))) { + i++; + inLineComment = true; + continue; + } + + if (dollarTag) { + if (text.startsWith(dollarTag, i)) { + i += dollarTag.length - 1; + dollarTag = null; + } + continue; + } + if (ch === '$') { + const m = text.slice(i).match(/^\$[A-Za-z0-9_]*\$/); + if (m && m[0]) { + dollarTag = m[0]; + i += dollarTag.length - 1; + continue; + } + } + } + + if (escaped) { + escaped = false; + continue; + } + if ((inSingle || inDouble) && ch === '\\') { + escaped = true; + continue; + } + + if (!inDouble && !inBacktick && ch === '\'') { + inSingle = !inSingle; + continue; + } + if (!inSingle && !inBacktick && ch === '"') { + inDouble = !inDouble; + continue; + } + if (!inSingle && !inDouble && ch === '`') { + inBacktick = !inBacktick; + continue; + } + + if (inSingle || inDouble || inBacktick || dollarTag) continue; + if (isWS(ch)) continue; + + if (isWord(ch)) { + let j = i; + while (j < text.length && isWord(text[j])) j++; + return text.slice(i, j).toLowerCase(); + } + return ''; + } + return ''; + }; + + const splitSqlTail = (sql: string): { main: string; tail: string } => { + const text = (sql || '').replace(/\r\n/g, '\n'); + const isWS = (ch: string) => ch === ' ' || ch === '\t' || ch === '\n' || ch === '\r'; + + let inSingle = false; + let inDouble = false; + let inBacktick = false; + let escaped = false; + let inLineComment = false; + let inBlockComment = false; + let dollarTag: string | null = null; + let lastMeaningful = -1; + + for (let i = 0; i < text.length; i++) { + const ch = text[i]; + const next = i + 1 < text.length ? text[i + 1] : ''; + const prev = i > 0 ? text[i - 1] : ''; + const next2 = i + 2 < text.length ? text[i + 2] : ''; + + if (!inSingle && !inDouble && !inBacktick) { + if (dollarTag) { + if (text.startsWith(dollarTag, i)) { + lastMeaningful = i + dollarTag.length - 1; + i += dollarTag.length - 1; + dollarTag = null; + } else if (!isWS(ch)) { + lastMeaningful = i; + } + continue; + } + if (inLineComment) { + if (ch === '\n') inLineComment = false; + continue; + } + if (inBlockComment) { + if (ch === '*' && next === '/') { + i++; + inBlockComment = false; + } + continue; + } + + // Start comments + if (ch === '/' && next === '*') { + i++; + inBlockComment = true; + continue; + } + if (ch === '#') { + inLineComment = true; + continue; + } + if (ch === '-' && next === '-' && (i === 0 || isWS(prev)) && (next2 === '' || isWS(next2))) { + i++; + inLineComment = true; + continue; + } + + if (ch === '$') { + const m = text.slice(i).match(/^\$[A-Za-z0-9_]*\$/); + if (m && m[0]) { + dollarTag = m[0]; + lastMeaningful = i + dollarTag.length - 1; + i += dollarTag.length - 1; + continue; + } + } + } + + if (escaped) { + escaped = false; + } else if ((inSingle || inDouble) && ch === '\\') { + escaped = true; + } else { + if (!inDouble && !inBacktick && ch === '\'') inSingle = !inSingle; + else if (!inSingle && !inBacktick && ch === '"') inDouble = !inDouble; + else if (!inSingle && !inDouble && ch === '`') inBacktick = !inBacktick; + } + + if (!inLineComment && !inBlockComment && !isWS(ch)) { + lastMeaningful = i; + } + } + + if (lastMeaningful < 0) return { main: '', tail: text }; + return { main: text.slice(0, lastMeaningful + 1), tail: text.slice(lastMeaningful + 1) }; + }; + + const findTopLevelKeyword = (sql: string, keyword: string): number => { + const text = sql; + const kw = keyword.toLowerCase(); + const isWS = (ch: string) => ch === ' ' || ch === '\t' || ch === '\n' || ch === '\r'; + const isWord = (ch: string) => /[A-Za-z0-9_]/.test(ch); + + let inSingle = false; + let inDouble = false; + let inBacktick = false; + let escaped = false; + let inLineComment = false; + let inBlockComment = false; + let dollarTag: string | null = null; + let parenDepth = 0; + + for (let i = 0; i < text.length; i++) { + const ch = text[i]; + const next = i + 1 < text.length ? text[i + 1] : ''; + const prev = i > 0 ? text[i - 1] : ''; + const next2 = i + 2 < text.length ? text[i + 2] : ''; + + if (!inSingle && !inDouble && !inBacktick) { + if (inLineComment) { + if (ch === '\n') inLineComment = false; + continue; + } + if (inBlockComment) { + if (ch === '*' && next === '/') { + i++; + inBlockComment = false; + } + continue; + } + + if (ch === '/' && next === '*') { + i++; + inBlockComment = true; + continue; + } + if (ch === '#') { + inLineComment = true; + continue; + } + if (ch === '-' && next === '-' && (i === 0 || isWS(prev)) && (next2 === '' || isWS(next2))) { + i++; + inLineComment = true; + continue; + } + + if (dollarTag) { + if (text.startsWith(dollarTag, i)) { + i += dollarTag.length - 1; + dollarTag = null; + } + continue; + } + if (ch === '$') { + const m = text.slice(i).match(/^\$[A-Za-z0-9_]*\$/); + if (m && m[0]) { + dollarTag = m[0]; + i += dollarTag.length - 1; + continue; + } + } + } + + if (escaped) { + escaped = false; + continue; + } + if ((inSingle || inDouble) && ch === '\\') { + escaped = true; + continue; + } + + if (!inDouble && !inBacktick && ch === '\'') { + inSingle = !inSingle; + continue; + } + if (!inSingle && !inBacktick && ch === '"') { + inDouble = !inDouble; + continue; + } + if (!inSingle && !inDouble && ch === '`') { + inBacktick = !inBacktick; + continue; + } + + if (inSingle || inDouble || inBacktick || dollarTag) continue; + + if (ch === '(') { parenDepth++; continue; } + if (ch === ')') { if (parenDepth > 0) parenDepth--; continue; } + if (parenDepth !== 0) continue; + + if (!isWord(ch)) continue; + + if (text.slice(i, i + kw.length).toLowerCase() !== kw) continue; + const before = i - 1 >= 0 ? text[i - 1] : ''; + const after = i + kw.length < text.length ? text[i + kw.length] : ''; + if ((before && isWord(before)) || (after && isWord(after))) continue; + return i; + } + return -1; + }; + + const applyAutoLimit = (sql: string, dbType: string, maxRows: number): { sql: string; applied: boolean; maxRows: number } => { + const normalizedType = (dbType || 'mysql').toLowerCase(); + const supportsLimit = normalizedType === 'mysql' || normalizedType === 'postgres' || normalizedType === 'kingbase' || normalizedType === 'sqlite' || normalizedType === ''; + if (!supportsLimit) return { sql, applied: false, maxRows }; + if (!Number.isFinite(maxRows) || maxRows <= 0) return { sql, applied: false, maxRows }; + + const { main, tail } = splitSqlTail(sql); + if (!main.trim()) return { sql, applied: false, maxRows }; + + const fromPos = findTopLevelKeyword(main, 'from'); + const limitPos = findTopLevelKeyword(main, 'limit'); + if (limitPos >= 0 && (fromPos < 0 || limitPos > fromPos)) return { sql, applied: false, maxRows }; + const fetchPos = findTopLevelKeyword(main, 'fetch'); + if (fetchPos >= 0 && (fromPos < 0 || fetchPos > fromPos)) return { sql, applied: false, maxRows }; + + const offsetPos = findTopLevelKeyword(main, 'offset'); + const forPos = findTopLevelKeyword(main, 'for'); + const lockPos = findTopLevelKeyword(main, 'lock'); + + const candidates = [offsetPos, forPos, lockPos] + .filter(pos => pos >= 0 && (fromPos < 0 || pos > fromPos)); + + const insertAt = candidates.length > 0 ? Math.min(...candidates) : main.length; + const before = main.slice(0, insertAt).trimEnd(); + const after = main.slice(insertAt).trimStart(); + const nextMain = [before, `LIMIT ${maxRows}`, after].filter(Boolean).join(' ').trim(); + return { sql: nextMain + tail, applied: true, maxRows }; + }; + const getSelectedSQL = (): string => { const editor = editorRef.current; if (!editor) return ''; @@ -362,12 +693,13 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { message.error("请先选择数据库"); return; } + const runSeq = ++runSeqRef.current; setLoading(true); const runStartTime = Date.now(); const conn = connections.find(c => c.id === currentConnectionId); if (!conn) { message.error("Connection not found"); - setLoading(false); + if (runSeqRef.current === runSeq) setLoading(false); return; } @@ -391,17 +723,29 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { } const nextResultSets: ResultSet[] = []; + const maxRows = Number(queryOptions?.maxRows) || 0; + const dbType = String((config as any).type || 'mysql'); + const wantsLimitProbe = Number.isFinite(maxRows) && maxRows > 0; + const probeLimit = wantsLimitProbe ? (maxRows + 1) : 0; + let anyTruncated = false; + const pendingPk: Array<{ resultKey: string; tableName: string }> = []; for (let idx = 0; idx < statements.length; idx++) { - const sql = statements[idx]; + const rawStatement = statements[idx]; + const leadingKeyword = getLeadingKeyword(rawStatement); + const shouldAutoLimit = leadingKeyword === 'select' || leadingKeyword === 'with'; + + const limitApplied = shouldAutoLimit && wantsLimitProbe; + const limited = limitApplied ? applyAutoLimit(rawStatement, dbType, probeLimit) : { sql: rawStatement, applied: false, maxRows: probeLimit }; + const executedSql = limited.sql; const startTime = Date.now(); - const res = await DBQuery(config as any, currentDb, sql); + const res = await DBQuery(config as any, currentDb, executedSql); const duration = Date.now() - startTime; addSqlLog({ id: `log-${Date.now()}-query-${idx + 1}`, timestamp: Date.now(), - sql, + sql: executedSql, status: res.success ? 'success' : 'error', duration, message: res.success ? '' : res.message, @@ -418,7 +762,13 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { } if (Array.isArray(res.data)) { - const rows = (res.data as any[]) || []; + let rows = (res.data as any[]) || []; + let truncated = false; + if (limited.applied && Number.isFinite(maxRows) && maxRows > 0 && rows.length > maxRows) { + truncated = true; + anyTruncated = true; + rows = rows.slice(0, maxRows); + } const cols = (res.fields && res.fields.length > 0) ? (res.fields as string[]) : (rows.length > 0 ? Object.keys(rows[0]) : []); @@ -428,24 +778,22 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { }); let simpleTableName: string | undefined = undefined; - let primaryKeys: string[] = []; - const tableMatch = sql.match(/^\s*SELECT\s+\*\s+FROM\s+[`"]?(\w+)[`"]?\s*(?:WHERE.*)?(?:ORDER BY.*)?(?:LIMIT.*)?$/i); + const tableMatch = rawStatement.match(/^\s*SELECT\s+\*\s+FROM\s+[`"]?(\w+)[`"]?\s*(?:WHERE.*)?(?:ORDER BY.*)?(?:LIMIT.*)?$/i); if (tableMatch) { simpleTableName = tableMatch[1]; - const resCols = await DBGetColumns(config as any, currentDb, simpleTableName); - if (resCols.success) { - primaryKeys = (resCols.data as ColumnDefinition[]).filter(c => c.key === 'PRI').map(c => c.name); - } + pendingPk.push({ resultKey: `result-${idx + 1}`, tableName: simpleTableName }); } nextResultSets.push({ key: `result-${idx + 1}`, - sql, + sql: rawStatement, rows, columns: cols, tableName: simpleTableName, - pkColumns: primaryKeys, - readOnly: !simpleTableName + pkColumns: [], + readOnly: true, + pkLoading: !!simpleTableName, + truncated }); } else { const affected = Number((res.data as any)?.affectedRows); @@ -454,7 +802,7 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { (row as any)[GONAVI_ROW_KEY] = 0; nextResultSets.push({ key: `result-${idx + 1}`, - sql, + sql: rawStatement, rows: [row], columns: ['affectedRows'], pkColumns: [], @@ -467,11 +815,31 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { setResultSets(nextResultSets); setActiveResultKey(nextResultSets[0]?.key || ''); + pendingPk.forEach(({ resultKey, tableName }) => { + DBGetColumns(config as any, currentDb, tableName) + .then((resCols: any) => { + if (runSeqRef.current !== runSeq) return; + if (!resCols?.success) { + setResultSets(prev => prev.map(rs => rs.key === resultKey ? { ...rs, pkLoading: false, readOnly: false } : rs)); + return; + } + const primaryKeys = (resCols.data as ColumnDefinition[]).filter(c => c.key === 'PRI').map(c => c.name); + setResultSets(prev => prev.map(rs => rs.key === resultKey ? { ...rs, pkColumns: primaryKeys, pkLoading: false, readOnly: false } : rs)); + }) + .catch(() => { + if (runSeqRef.current !== runSeq) return; + setResultSets(prev => prev.map(rs => rs.key === resultKey ? { ...rs, pkLoading: false, readOnly: false } : rs)); + }); + }); + if (statements.length > 1) { message.success(`已执行 ${statements.length} 条语句，生成 ${nextResultSets.length} 个结果集。`); } else if (nextResultSets.length === 0) { message.success('执行成功。'); } + if (anyTruncated && maxRows > 0) { + message.warning(`结果集已自动限制为最多 ${maxRows} 行（可在工具栏调整）。`); + } } catch (e: any) { message.error("Error executing query: " + e.message); addSqlLog({ @@ -486,7 +854,7 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { setResultSets([]); setActiveResultKey(''); } finally { - setLoading(false); + if (runSeqRef.current === runSeq) setLoading(false); } }; @@ -587,6 +955,20 @@ const QueryEditor: React.FC<{ tab: TabData }> = ({ tab }) => { options={dbList.map(db => ({ label: db, value: db }))} showSearch /> + + + )} + + +
+ + ); + })} + + + + = ({ )} - + {/* Ghost Resize Line for Columns */}
Date: Wed, 4 Feb 2026 12:23:41 +0800 Subject: [PATCH 4/4] =?UTF-8?q?=20=F0=9F=90=9B=20fix(table):=20=E4=BF=AE?= =?UTF-8?q?=E5=A4=8D=E8=99=9A=E6=8B=9F=E8=A1=A8=E5=85=A8=E9=80=89=E4=B8=A2?= =?UTF-8?q?=E5=A4=B1=E5=B9=B6=E5=AE=8C=E5=96=84=E5=AF=BC=E5=87=BA/?= =?UTF-8?q?=E7=AD=9B=E9=80=89=E8=83=BD=E5=8A=9B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 表头自定义组件保留 width，virtual 模式下选择列正常显示 - 新增后端 ExportQuery，导出当前页/选中行避免长字段 IPC 截断 - 筛选支持更多操作符并统一 WHERE 生成逻辑 Close #57 Close #56 --- frontend/src/components/DataGrid.tsx | 247 +++++++++++++++++++++++-- frontend/src/components/DataViewer.tsx | 47 +---- frontend/src/utils/sql.ts | 173 +++++++++++++++++ frontend/wailsjs/go/app/App.d.ts | 2 + frontend/wailsjs/go/app/App.js | 4 + internal/app/methods_file.go | 192 ++++++++++--------- 6 files changed, 518 insertions(+), 147 deletions(-) create mode 100644 frontend/src/utils/sql.ts diff --git a/frontend/src/components/DataGrid.tsx b/frontend/src/components/DataGrid.tsx index 7fff8e7..04b1f37 100644 --- a/frontend/src/components/DataGrid.tsx +++ b/frontend/src/components/DataGrid.tsx @@ -3,10 +3,11 @@ import { Table, message, Input, Button, Dropdown, MenuProps, Form, Pagination, S import type { SortOrder } from 'antd/es/table/interface'; import { ReloadOutlined, ImportOutlined, ExportOutlined, DownOutlined, PlusOutlined, DeleteOutlined, SaveOutlined, UndoOutlined, FilterOutlined, CloseOutlined, ConsoleSqlOutlined, FileTextOutlined, CopyOutlined, ClearOutlined, EditOutlined } from '@ant-design/icons'; import Editor from '@monaco-editor/react'; -import { ImportData, ExportTable, ExportData, ApplyChanges } from '../../wailsjs/go/app/App'; +import { ImportData, ExportTable, ExportData, ExportQuery, ApplyChanges } from '../../wailsjs/go/app/App'; import { useStore } from '../store'; import { v4 as uuidv4 } from 'uuid'; import 'react-resizable/css/styles.css'; +import { buildWhereSQL, escapeLiteral, quoteIdentPart, quoteQualifiedIdent } from '../utils/sql'; // 内部行标识字段：避免与真实业务字段（如 `key` 列）冲突。 export const GONAVI_ROW_KEY = '__gonavi_row_key__'; @@ -56,12 +57,19 @@ const looksLikeJsonText = (text: string): boolean => { const ResizableTitle = (props: any) => { const { onResizeStart, width, ...restProps } = props; + const nextStyle = { ...(restProps.style || {}) } as React.CSSProperties; + if (width) { + nextStyle.width = width; + } + + // 注意：virtual table 模式下，rc-table 会依赖 header cell 的 width 样式来渲染选择列。 + // 若这里丢失 width，可能导致左上角“全选”checkbox 不显示。 if (!width || typeof onResizeStart !== 'function') { - return ; + return ; } return ( - + {restProps.children} = ({ const [deletedRowKeys, setDeletedRowKeys] = useState>(new Set()); // Filter State - const [filterConditions, setFilterConditions] = useState<{ id: number, column: string, op: string, value: string }[]>([]); + const [filterConditions, setFilterConditions] = useState<{ id: number, column: string, op: string, value: string, value2?: string }[]>([]); const [nextFilterId, setNextFilterId] = useState(1); const selectedRowKeysRef = useRef(selectedRowKeys); @@ -866,11 +874,98 @@ const DataGrid: React.FC = ({ copyToClipboard(lines.join('\n')); }, [getTargets, copyToClipboard]); + const buildConnConfig = useCallback(() => { + if (!connectionId) return null; + const conn = connections.find(c => c.id === connectionId); + if (!conn) return null; + return { + ...conn.config, + port: Number(conn.config.port), + password: conn.config.password || "", + database: conn.config.database || "", + useSSH: conn.config.useSSH || false, + ssh: conn.config.ssh || { host: "", port: 22, user: "", password: "", keyPath: "" } + }; + }, [connections, connectionId]); + + const exportByQuery = useCallback(async (sql: string, format: string, defaultName: string) => { + const config = buildConnConfig(); + if (!config) return; + const hide = message.loading(`正在导出...`, 0); + const res = await ExportQuery(config as any, dbName || '', sql, defaultName || 'export', format); + hide(); + if (res.success) { + message.success("导出成功"); + } else if (res.message !== "Cancelled") { + message.error("导出失败: " + res.message); + } + }, [buildConnConfig, dbName]); + + const buildPkWhereSql = useCallback((rows: any[], dbType: string) => { + if (!tableName || pkColumns.length === 0) return ''; + const targets = (rows || []).filter(Boolean); + if (targets.length === 0) return ''; + + const clauses: string[] = []; + for (const r of targets) { + const andParts: string[] = []; + for (const pk of pkColumns) { + const col = quoteIdentPart(dbType, pk); + const v = r?.[pk]; + if (v === null || v === undefined) return ''; + andParts.push(`${col} = '${escapeLiteral(String(v))}'`); + } + if (andParts.length === pkColumns.length) { + clauses.push(`(${andParts.join(' AND ')})`); + } + } + if (clauses.length === 0) return ''; + return clauses.join(' OR '); + }, [pkColumns, tableName]); + + const buildCurrentPageSql = useCallback((dbType: string) => { + if (!tableName || !pagination) return ''; + const whereSQL = buildWhereSQL(dbType, filterConditions); + let sql = `SELECT * FROM ${quoteQualifiedIdent(dbType, tableName)} ${whereSQL}`; + if (sortInfo && sortInfo.order) { + sql += ` ORDER BY ${quoteIdentPart(dbType, sortInfo.columnKey)} ${sortInfo.order === 'ascend' ? 'ASC' : 'DESC'}`; + } + const offset = (pagination.current - 1) * pagination.pageSize; + sql += ` LIMIT ${pagination.pageSize} OFFSET ${offset}`; + return sql; + }, [tableName, pagination, filterConditions, sortInfo]); + // Context Menu Export const handleExportSelected = useCallback(async (format: string, record: any) => { const records = getTargets(record); - await exportData(records, format); - }, [getTargets]); + if (!connectionId || !tableName) { + await exportData(records, format); + return; + } + + // 有未提交修改时，优先按界面数据导出，避免与数据库不一致。 + if (hasChanges) { + message.warning("当前存在未提交修改，导出将按界面数据生成；如需完整长字段建议先提交后再导出。"); + await exportData(records, format); + return; + } + + const config = buildConnConfig(); + if (!config) { + await exportData(records, format); + return; + } + + const dbType = config.type || ''; + const pkWhere = buildPkWhereSql(records, dbType); + if (!pkWhere) { + await exportData(records, format); + return; + } + + const sql = `SELECT * FROM ${quoteQualifiedIdent(dbType, tableName)} WHERE ${pkWhere}`; + await exportByQuery(sql, format, tableName || 'export'); + }, [getTargets, connectionId, tableName, hasChanges, exportData, buildConnConfig, buildPkWhereSql, exportByQuery]); // Export const handleExport = async (format: string) => { @@ -879,7 +974,7 @@ const DataGrid: React.FC = ({ // 1. Export Selected if (selectedRowKeys.length > 0) { const selectedRows = displayData.filter(d => selectedRowKeys.includes(d?.[GONAVI_ROW_KEY])); - await exportData(selectedRows, format); + await handleExportSelected(format, selectedRows[0]); return; } @@ -888,9 +983,8 @@ const DataGrid: React.FC = ({ let instance: any; const handleAll = async () => { instance.destroy(); - const conn = connections.find(c => c.id === connectionId); - if (!conn) return; - const config = { ...conn.config, port: Number(conn.config.port), password: conn.config.password || "", database: conn.config.database || "", useSSH: conn.config.useSSH || false, ssh: conn.config.ssh || { host: "", port: 22, user: "", password: "", keyPath: "" } }; + const config = buildConnConfig(); + if (!config) return; const hide = message.loading(`正在导出全部数据...`, 0); const res = await ExportTable(config as any, dbName || '', tableName, format); hide(); @@ -898,7 +992,25 @@ const DataGrid: React.FC = ({ }; const handlePage = async () => { instance.destroy(); - await exportData(displayData, format); + if (hasChanges) { + message.warning("当前存在未提交修改，导出将按界面数据生成；如需完整长字段建议先提交后再导出。"); + await exportData(displayData, format); + return; + } + + const config = buildConnConfig(); + if (!config) { + await exportData(displayData, format); + return; + } + + const sql = buildCurrentPageSql(config.type || ''); + if (!sql) { + await exportData(displayData, format); + return; + } + + await exportByQuery(sql, format, tableName || 'export'); }; instance = modal.info({ @@ -921,21 +1033,64 @@ const DataGrid: React.FC = ({ const handleImport = async () => { if (!connectionId || !tableName) return; - const conn = connections.find(c => c.id === connectionId); - if (!conn) return; - const config = { ...conn.config, port: Number(conn.config.port), password: conn.config.password || "", database: conn.config.database || "", useSSH: conn.config.useSSH || false, ssh: conn.config.ssh || { host: "", port: 22, user: "", password: "", keyPath: "" } }; + const config = buildConnConfig(); + if (!config) return; const res = await ImportData(config as any, dbName || '', tableName); if (res.success) { message.success(res.message); if (onReload) onReload(); } else if (res.message !== "Cancelled") { message.error("Import Failed: " + res.message); } }; // Filters + const filterOpOptions = useMemo(() => ([ + { value: '=', label: '=' }, + { value: '!=', label: '!=' }, + { value: '<', label: '<' }, + { value: '<=', label: '<=' }, + { value: '>', label: '>' }, + { value: '>=', label: '>=' }, + { value: 'CONTAINS', label: '包含' }, + { value: 'NOT_CONTAINS', label: '不包含' }, + { value: 'STARTS_WITH', label: '开始以' }, + { value: 'NOT_STARTS_WITH', label: '不是开始于' }, + { value: 'ENDS_WITH', label: '结束以' }, + { value: 'NOT_ENDS_WITH', label: '不是结束于' }, + { value: 'IS_NULL', label: '是 null' }, + { value: 'IS_NOT_NULL', label: '不是 null' }, + { value: 'IS_EMPTY', label: '是空的' }, + { value: 'IS_NOT_EMPTY', label: '不是空的' }, + { value: 'BETWEEN', label: '介于' }, + { value: 'NOT_BETWEEN', label: '不介于' }, + { value: 'IN', label: '在列表' }, + { value: 'NOT_IN', label: '不在列表' }, + { value: 'CUSTOM', label: '[自定义]' }, + ]), []); + + const isNoValueOp = useCallback((op: string) => ( + op === 'IS_NULL' || op === 'IS_NOT_NULL' || op === 'IS_EMPTY' || op === 'IS_NOT_EMPTY' + ), []); + const isBetweenOp = useCallback((op: string) => op === 'BETWEEN' || op === 'NOT_BETWEEN', []); + const isListOp = useCallback((op: string) => op === 'IN' || op === 'NOT_IN', []); + const addFilter = () => { - setFilterConditions([...filterConditions, { id: nextFilterId, column: columnNames[0] || '', op: '=', value: '' }]); + setFilterConditions([...filterConditions, { id: nextFilterId, column: columnNames[0] || '', op: '=', value: '', value2: '' }]); setNextFilterId(nextFilterId + 1); }; const updateFilter = (id: number, field: string, val: string) => { - setFilterConditions(prev => prev.map(c => c.id === id ? { ...c, [field]: val } : c)); + setFilterConditions(prev => prev.map(c => { + if (c.id !== id) return c; + const next: any = { ...c, [field]: val }; + if (field === 'op') { + if (isNoValueOp(val)) { + next.value = ''; + next.value2 = ''; + } else if (isBetweenOp(val)) { + if (typeof next.value2 !== 'string') next.value2 = ''; + } else { + next.value2 = ''; + } + } + return next; + })); }; const removeFilter = (id: number) => { setFilterConditions(prev => prev.filter(c => c.id !== id)); @@ -1012,10 +1167,62 @@ const DataGrid: React.FC = ({ {showFilter && (
{filterConditions.map(cond => ( -
- updateFilter(cond.id, 'op', v)} options={[{ value: '=', label: '=' }, { value: 'LIKE', label: '包含' }]} /> - updateFilter(cond.id, 'value', e.target.value)} /> +
+ updateFilter(cond.id, 'op', v)} + options={filterOpOptions as any} + /> + + {cond.op === 'CUSTOM' ? ( + updateFilter(cond.id, 'value', e.target.value)} + placeholder="输入自定义 WHERE 表达式（不需要再写 WHERE），例如：status IN ('A','B')" + /> + ) : isListOp(cond.op) ? ( + updateFilter(cond.id, 'value', e.target.value)} + placeholder="多个值用逗号或换行分隔" + /> + ) : isBetweenOp(cond.op) ? ( + <> + updateFilter(cond.id, 'value', e.target.value)} + placeholder="开始值" + /> + updateFilter(cond.id, 'value2', e.target.value)} + placeholder="结束值" + /> + + ) : isNoValueOp(cond.op) ? ( + + ) : ( + updateFilter(cond.id, 'value', e.target.value)} + /> + )} +
))} diff --git a/frontend/src/components/DataViewer.tsx b/frontend/src/components/DataViewer.tsx index 33a5a56..41601ab 100644 --- a/frontend/src/components/DataViewer.tsx +++ b/frontend/src/components/DataViewer.tsx @@ -4,6 +4,7 @@ import { TabData, ColumnDefinition } from '../types'; import { useStore } from '../store'; import { DBQuery, DBGetColumns } from '../../wailsjs/go/app/App'; import DataGrid, { GONAVI_ROW_KEY } from './DataGrid'; +import { buildWhereSQL, quoteIdentPart, quoteQualifiedIdent } from '../utils/sql'; const DataViewer: React.FC<{ tab: TabData }> = ({ tab }) => { const [data, setData] = useState([]); @@ -55,54 +56,18 @@ const DataViewer: React.FC<{ tab: TabData }> = ({ tab }) => { ssh: conn.config.ssh || { host: "", port: 22, user: "", password: "", keyPath: "" } }; - const normalizeIdentPart = (ident: string) => { - let raw = (ident || '').trim(); - if (!raw) return raw; - const first = raw[0]; - const last = raw[raw.length - 1]; - if ((first === '"' && last === '"') || (first === '`' && last === '`')) { - raw = raw.slice(1, -1).trim(); - } - // 防御：如果传入已包含引号（例如 `"schema"."table"` 的拆分结果），移除残留引号再重新安全转义。 - raw = raw.replace(/["`]/g, '').trim(); - return raw; - }; - - const quoteIdentPart = (ident: string) => { - const raw = normalizeIdentPart(ident); - if (!raw) return raw; - if (config.type === 'mysql') return `\`${raw.replace(/`/g, '``')}\``; - return `"${raw.replace(/"/g, '""')}"`; - }; - const quoteQualifiedIdent = (ident: string) => { - const raw = (ident || '').trim(); - if (!raw) return raw; - const parts = raw.split('.').map(normalizeIdentPart).filter(Boolean); - if (parts.length <= 1) return quoteIdentPart(raw); - return parts.map(quoteIdentPart).join('.'); - }; - const escapeLiteral = (val: string) => val.replace(/'/g, "''"); + const dbType = config.type || ''; const dbName = tab.dbName || ''; const tableName = tab.tableName || ''; - const whereParts: string[] = []; - filterConditions.forEach(cond => { - if (cond.column && cond.value) { - if (cond.op === 'LIKE') { - whereParts.push(`${quoteIdentPart(cond.column)} LIKE '%${escapeLiteral(cond.value)}%'`); - } else { - whereParts.push(`${quoteIdentPart(cond.column)} ${cond.op} '${escapeLiteral(cond.value)}'`); - } - } - }); - const whereSQL = whereParts.length > 0 ? `WHERE ${whereParts.join(' AND ')}` : ""; + const whereSQL = buildWhereSQL(dbType, filterConditions); - const countSql = `SELECT COUNT(*) as total FROM ${quoteQualifiedIdent(tableName)} ${whereSQL}`; + const countSql = `SELECT COUNT(*) as total FROM ${quoteQualifiedIdent(dbType, tableName)} ${whereSQL}`; - let sql = `SELECT * FROM ${quoteQualifiedIdent(tableName)} ${whereSQL}`; + let sql = `SELECT * FROM ${quoteQualifiedIdent(dbType, tableName)} ${whereSQL}`; if (sortInfo && sortInfo.order) { - sql += ` ORDER BY ${quoteIdentPart(sortInfo.columnKey)} ${sortInfo.order === 'ascend' ? 'ASC' : 'DESC'}`; + sql += ` ORDER BY ${quoteIdentPart(dbType, sortInfo.columnKey)} ${sortInfo.order === 'ascend' ? 'ASC' : 'DESC'}`; } const offset = (page - 1) * size; // 大表性能：打开表不阻塞在 COUNT(*)，先通过多取 1 条判断是否还有下一页；总数在后台统计并异步回填。 diff --git a/frontend/src/utils/sql.ts b/frontend/src/utils/sql.ts new file mode 100644 index 0000000..fc458dd --- /dev/null +++ b/frontend/src/utils/sql.ts @@ -0,0 +1,173 @@ +export type FilterCondition = { + id?: number; + column?: string; + op?: string; + value?: string; + value2?: string; +}; + +const normalizeIdentPart = (ident: string) => { + let raw = (ident || '').trim(); + if (!raw) return raw; + const first = raw[0]; + const last = raw[raw.length - 1]; + if ((first === '"' && last === '"') || (first === '`' && last === '`')) { + raw = raw.slice(1, -1).trim(); + } + raw = raw.replace(/["`]/g, '').trim(); + return raw; +}; + +export const quoteIdentPart = (dbType: string, ident: string) => { + const raw = normalizeIdentPart(ident); + if (!raw) return raw; + if ((dbType || '').toLowerCase() === 'mysql') return `\`${raw.replace(/`/g, '``')}\``; + return `"${raw.replace(/"/g, '""')}"`; +}; + +export const quoteQualifiedIdent = (dbType: string, ident: string) => { + const raw = (ident || '').trim(); + if (!raw) return raw; + const parts = raw.split('.').map(normalizeIdentPart).filter(Boolean); + if (parts.length <= 1) return quoteIdentPart(dbType, raw); + return parts.map(p => quoteIdentPart(dbType, p)).join('.'); +}; + +export const escapeLiteral = (val: string) => (val || '').replace(/'/g, "''"); + +export const parseListValues = (val: string) => { + const raw = (val || '').trim(); + if (!raw) return []; + return raw + .split(/[\n,，]+/) + .map(s => s.trim()) + .filter(Boolean); +}; + +export const buildWhereSQL = (dbType: string, conditions: FilterCondition[]) => { + const whereParts: string[] = []; + + (conditions || []).forEach((cond) => { + const op = (cond?.op || '').trim(); + const column = (cond?.column || '').trim(); + const value = (cond?.value ?? '').toString(); + const value2 = (cond?.value2 ?? '').toString(); + + if (op === 'CUSTOM') { + const expr = value.trim(); + if (expr) whereParts.push(`(${expr})`); + return; + } + + if (!column) return; + + const col = quoteIdentPart(dbType, column); + + switch (op) { + case 'IS_NULL': + whereParts.push(`${col} IS NULL`); + return; + case 'IS_NOT_NULL': + whereParts.push(`${col} IS NOT NULL`); + return; + case 'IS_EMPTY': + // 兼容：空值通常理解为 NULL 或空字符串 + whereParts.push(`(${col} IS NULL OR ${col} = '')`); + return; + case 'IS_NOT_EMPTY': + whereParts.push(`(${col} IS NOT NULL AND ${col} <> '')`); + return; + case 'BETWEEN': { + const v1 = value.trim(); + const v2 = value2.trim(); + if (!v1 || !v2) return; + whereParts.push(`${col} BETWEEN '${escapeLiteral(v1)}' AND '${escapeLiteral(v2)}'`); + return; + } + case 'NOT_BETWEEN': { + const v1 = value.trim(); + const v2 = value2.trim(); + if (!v1 || !v2) return; + whereParts.push(`${col} NOT BETWEEN '${escapeLiteral(v1)}' AND '${escapeLiteral(v2)}'`); + return; + } + case 'IN': { + const items = parseListValues(value); + if (items.length === 0) return; + const list = items.map(v => `'${escapeLiteral(v)}'`).join(', '); + whereParts.push(`${col} IN (${list})`); + return; + } + case 'NOT_IN': { + const items = parseListValues(value); + if (items.length === 0) return; + const list = items.map(v => `'${escapeLiteral(v)}'`).join(', '); + whereParts.push(`${col} NOT IN (${list})`); + return; + } + case 'CONTAINS': { + const v = value.trim(); + if (!v) return; + whereParts.push(`${col} LIKE '%${escapeLiteral(v)}%'`); + return; + } + case 'NOT_CONTAINS': { + const v = value.trim(); + if (!v) return; + whereParts.push(`${col} NOT LIKE '%${escapeLiteral(v)}%'`); + return; + } + case 'STARTS_WITH': { + const v = value.trim(); + if (!v) return; + whereParts.push(`${col} LIKE '${escapeLiteral(v)}%'`); + return; + } + case 'NOT_STARTS_WITH': { + const v = value.trim(); + if (!v) return; + whereParts.push(`${col} NOT LIKE '${escapeLiteral(v)}%'`); + return; + } + case 'ENDS_WITH': { + const v = value.trim(); + if (!v) return; + whereParts.push(`${col} LIKE '%${escapeLiteral(v)}'`); + return; + } + case 'NOT_ENDS_WITH': { + const v = value.trim(); + if (!v) return; + whereParts.push(`${col} NOT LIKE '%${escapeLiteral(v)}'`); + return; + } + case '=': + case '!=': + case '<': + case '<=': + case '>': + case '>=': { + const v = value.trim(); + if (!v) return; + whereParts.push(`${col} ${op} '${escapeLiteral(v)}'`); + return; + } + default: { + // 兼容旧值：LIKE + if (op.toUpperCase() === 'LIKE') { + const v = value.trim(); + if (!v) return; + whereParts.push(`${col} LIKE '%${escapeLiteral(v)}%'`); + return; + } + + const v = value.trim(); + if (!v) return; + whereParts.push(`${col} ${op} '${escapeLiteral(v)}'`); + } + } + }); + + return whereParts.length > 0 ? `WHERE ${whereParts.join(' AND ')}` : ''; +}; + diff --git a/frontend/wailsjs/go/app/App.d.ts b/frontend/wailsjs/go/app/App.d.ts index 9d91802..5b59389 100755 --- a/frontend/wailsjs/go/app/App.d.ts +++ b/frontend/wailsjs/go/app/App.d.ts @@ -37,6 +37,8 @@ export function ExportData(arg1:Array>,arg2:Array,ar export function ExportDatabaseSQL(arg1:connection.ConnectionConfig,arg2:string,arg3:boolean):Promise; +export function ExportQuery(arg1:connection.ConnectionConfig,arg2:string,arg3:string,arg4:string,arg5:string):Promise; + export function ExportTable(arg1:connection.ConnectionConfig,arg2:string,arg3:string,arg4:string):Promise; export function ExportTablesSQL(arg1:connection.ConnectionConfig,arg2:string,arg3:Array,arg4:boolean):Promise; diff --git a/frontend/wailsjs/go/app/App.js b/frontend/wailsjs/go/app/App.js index cf0859b..2151c65 100755 --- a/frontend/wailsjs/go/app/App.js +++ b/frontend/wailsjs/go/app/App.js @@ -70,6 +70,10 @@ export function ExportDatabaseSQL(arg1, arg2, arg3) { return window['go']['app']['App']['ExportDatabaseSQL'](arg1, arg2, arg3); } +export function ExportQuery(arg1, arg2, arg3, arg4, arg5) { + return window['go']['app']['App']['ExportQuery'](arg1, arg2, arg3, arg4, arg5); +} + export function ExportTable(arg1, arg2, arg3, arg4) { return window['go']['app']['App']['ExportTable'](arg1, arg2, arg3, arg4); } diff --git a/internal/app/methods_file.go b/internal/app/methods_file.go index 7654799..4dadb54 100644 --- a/internal/app/methods_file.go +++ b/internal/app/methods_file.go @@ -260,70 +260,8 @@ data, columns, err := dbInst.Query(query) return connection.QueryResult{Success: false, Message: err.Error()} } defer f.Close() - - var csvWriter *csv.Writer - var jsonEncoder *json.Encoder - var isJsonFirstRow = true - - switch format { - case "csv", "xlsx": - f.Write([]byte{0xEF, 0xBB, 0xBF}) - csvWriter = csv.NewWriter(f) - defer csvWriter.Flush() - if err := csvWriter.Write(columns); err != nil { - return connection.QueryResult{Success: false, Message: err.Error()} - } - case "json": - f.WriteString("[\n") - jsonEncoder = json.NewEncoder(f) - jsonEncoder.SetIndent(" ", " ") - case "md": - fmt.Fprintf(f, "| %s |\n", strings.Join(columns, " | ")) - seps := make([]string, len(columns)) - for i := range seps { - seps[i] = "---" - } - fmt.Fprintf(f, "| %s |\n", strings.Join(seps, " | ")) - default: - return connection.QueryResult{Success: false, Message: "Unsupported format: " + format} - } - - for _, rowMap := range data { - record := make([]string, len(columns)) - for i, col := range columns { - val := rowMap[col] - if val == nil { - record[i] = "NULL" - } else { - s := fmt.Sprintf("%v", val) - if format == "md" { - s = strings.ReplaceAll(s, "|", "\\|") - s = strings.ReplaceAll(s, "\n", "
") - } - record[i] = s - } - } - - switch format { - case "csv", "xlsx": - if err := csvWriter.Write(record); err != nil { - return connection.QueryResult{Success: false, Message: "Write error: " + err.Error()} - } - case "json": - if !isJsonFirstRow { - f.WriteString(",\n") - } - if err := jsonEncoder.Encode(rowMap); err != nil { - return connection.QueryResult{Success: false, Message: "Write error: " + err.Error()} - } - isJsonFirstRow = false - case "md": - fmt.Fprintf(f, "| %s |\n", strings.Join(record, " | ")) - } - } - - if format == "json" { - f.WriteString("\n]") + if err := writeRowsToFile(f, data, columns, format); err != nil { + return connection.QueryResult{Success: false, Message: "Write error: " + err.Error()} } return connection.QueryResult{Success: true, Message: "Export successful"} @@ -675,33 +613,101 @@ func (a *App) ExportData(data []map[string]interface{}, columns []string, defaul return connection.QueryResult{Success: false, Message: err.Error()} } defer f.Close() + if err := writeRowsToFile(f, data, columns, format); err != nil { + return connection.QueryResult{Success: false, Message: "Write error: " + err.Error()} + } + + return connection.QueryResult{Success: true, Message: "Export successful"} +} + +// ExportQuery exports by executing the provided SELECT query on backend side. +// This avoids frontend IPC payload limits when exporting very large/long-text columns (e.g. base64). +func (a *App) ExportQuery(config connection.ConnectionConfig, dbName string, query string, defaultName string, format string) connection.QueryResult { + query = strings.TrimSpace(query) + if query == "" { + return connection.QueryResult{Success: false, Message: "query required"} + } + + if defaultName == "" { + defaultName = "export" + } + + filename, err := runtime.SaveFileDialog(a.ctx, runtime.SaveDialogOptions{ + Title: "Export Query Result", + DefaultFilename: fmt.Sprintf("%s.%s", defaultName, strings.ToLower(format)), + }) + if err != nil || filename == "" { + return connection.QueryResult{Success: false, Message: "Cancelled"} + } + + runConfig := normalizeRunConfig(config, dbName) + dbInst, err := a.getDatabase(runConfig) + if err != nil { + return connection.QueryResult{Success: false, Message: err.Error()} + } + + query = sanitizeSQLForPgLike(runConfig.Type, query) + lowerQuery := strings.ToLower(strings.TrimSpace(query)) + if !(strings.HasPrefix(lowerQuery, "select") || strings.HasPrefix(lowerQuery, "with")) { + return connection.QueryResult{Success: false, Message: "Only SELECT/WITH queries are supported"} + } + + data, columns, err := dbInst.Query(query) + if err != nil { + return connection.QueryResult{Success: false, Message: err.Error()} + } + + f, err := os.Create(filename) + if err != nil { + return connection.QueryResult{Success: false, Message: err.Error()} + } + defer f.Close() + + if err := writeRowsToFile(f, data, columns, format); err != nil { + return connection.QueryResult{Success: false, Message: "Write error: " + err.Error()} + } + + return connection.QueryResult{Success: true, Message: "Export successful"} +} + +func writeRowsToFile(f *os.File, data []map[string]interface{}, columns []string, format string) error { + format = strings.ToLower(strings.TrimSpace(format)) + if f == nil { + return fmt.Errorf("file required") + } - format = strings.ToLower(format) var csvWriter *csv.Writer var jsonEncoder *json.Encoder - var isJsonFirstRow = true + isJsonFirstRow := true switch format { case "csv", "xlsx": - f.Write([]byte{0xEF, 0xBB, 0xBF}) + if _, err := f.Write([]byte{0xEF, 0xBB, 0xBF}); err != nil { + return err + } csvWriter = csv.NewWriter(f) - defer csvWriter.Flush() if err := csvWriter.Write(columns); err != nil { - return connection.QueryResult{Success: false, Message: err.Error()} + return err } case "json": - f.WriteString("[\n") + if _, err := f.WriteString("[\n"); err != nil { + return err + } jsonEncoder = json.NewEncoder(f) jsonEncoder.SetIndent(" ", " ") case "md": - fmt.Fprintf(f, "| %s |\n", strings.Join(columns, " | ")) + if _, err := fmt.Fprintf(f, "| %s |\n", strings.Join(columns, " | ")); err != nil { + return err + } seps := make([]string, len(columns)) for i := range seps { seps[i] = "---" } - fmt.Fprintf(f, "| %s |\n", strings.Join(seps, " | ")) + if _, err := fmt.Fprintf(f, "| %s |\n", strings.Join(seps, " | ")); err != nil { + return err + } default: - return connection.QueryResult{Success: false, Message: "Unsupported format: " + format} + return fmt.Errorf("unsupported format: %s", format) } for _, rowMap := range data { @@ -710,37 +716,51 @@ func (a *App) ExportData(data []map[string]interface{}, columns []string, defaul val := rowMap[col] if val == nil { record[i] = "NULL" - } else { - s := fmt.Sprintf("%v", val) - if format == "md" { - s = strings.ReplaceAll(s, "|", "\\|") - s = strings.ReplaceAll(s, "\n", "
") - } - record[i] = s + continue } + + s := fmt.Sprintf("%v", val) + if format == "md" { + s = strings.ReplaceAll(s, "|", "\\|") + s = strings.ReplaceAll(s, "\n", "
") + } + record[i] = s } switch format { case "csv", "xlsx": if err := csvWriter.Write(record); err != nil { - return connection.QueryResult{Success: false, Message: "Write error: " + err.Error()} + return err } case "json": if !isJsonFirstRow { - f.WriteString(",\n") + if _, err := f.WriteString(",\n"); err != nil { + return err + } } if err := jsonEncoder.Encode(rowMap); err != nil { - return connection.QueryResult{Success: false, Message: "Write error: " + err.Error()} + return err } isJsonFirstRow = false case "md": - fmt.Fprintf(f, "| %s |\n", strings.Join(record, " | ")) + if _, err := fmt.Fprintf(f, "| %s |\n", strings.Join(record, " | ")); err != nil { + return err + } + } + } + + if format == "csv" || format == "xlsx" { + csvWriter.Flush() + if err := csvWriter.Error(); err != nil { + return err } } if format == "json" { - f.WriteString("\n]") + if _, err := f.WriteString("\n]"); err != nil { + return err + } } - return connection.QueryResult{Success: true, Message: "Export successful"} + return nil }