新增：连接管理、数据查询等功能

2026-01-22 18:34:59 +08:00
parent 95d3a20292
commit 652f5e5d60
87 changed files with 15082 additions and 162 deletions
--- a/web/src/views/db-cli/utils/mysqlFieldUtils.ts
+++ b/web/src/views/db-cli/utils/mysqlFieldUtils.ts
@@ -0,0 +1,88 @@
+// MySQL 数据类型选项
+export const mysqlDataTypeOptions = [
+  {
+    label: '整数类型',
+    options: [
+      { label: 'TINYINT', value: 'TINYINT' },
+      { label: 'SMALLINT', value: 'SMALLINT' },
+      { label: 'MEDIUMINT', value: 'MEDIUMINT' },
+      { label: 'INT', value: 'INT' },
+      { label: 'BIGINT', value: 'BIGINT' }
+    ]
+  },
+  {
+    label: '浮点类型',
+    options: [
+      { label: 'FLOAT', value: 'FLOAT' },
+      { label: 'DOUBLE', value: 'DOUBLE' },
+      { label: 'DECIMAL', value: 'DECIMAL' }
+    ]
+  },
+  {
+    label: '字符串类型',
+    options: [
+      { label: 'CHAR', value: 'CHAR' },
+      { label: 'VARCHAR', value: 'VARCHAR' },
+      { label: 'TEXT', value: 'TEXT' },
+      { label: 'TINYTEXT', value: 'TINYTEXT' },
+      { label: 'MEDIUMTEXT', value: 'MEDIUMTEXT' },
+      { label: 'LONGTEXT', value: 'LONGTEXT' }
+    ]
+  },
+  {
+    label: '日期时间类型',
+    options: [
+      { label: 'DATE', value: 'DATE' },
+      { label: 'TIME', value: 'TIME' },
+      { label: 'DATETIME', value: 'DATETIME' },
+      { label: 'TIMESTAMP', value: 'TIMESTAMP' },
+      { label: 'YEAR', value: 'YEAR' }
+    ]
+  },
+  {
+    label: '其他类型',
+    options: [
+      { label: 'BLOB', value: 'BLOB' },
+      { label: 'JSON', value: 'JSON' },
+      { label: 'ENUM', value: 'ENUM' },
+      { label: 'SET', value: 'SET' }
+    ]
+  }
+]
+
+// 需要长度参数的类型
+export const typesNeedLength = ['VARCHAR', 'CHAR', 'DECIMAL', 'FLOAT', 'DOUBLE']
+
+// 解析类型字符串，提取基础类型和长度参数
+export const parseType = (typeStr: string): { baseType: string; length: string | null } => {
+  if (!typeStr) return { baseType: '', length: null }
+  
+  const match = typeStr.match(/^(\w+)(?:\((.+?)\))?$/i)
+  if (match) {
+    return {
+      baseType: match[1].toUpperCase(),
+      length: match[2] || null
+    }
+  }
+  return { baseType: typeStr.toUpperCase(), length: null }
+}
+
+// 格式化类型字符串
+export const formatType = (baseType: string, length: string | null): string => {
+  if (!baseType) return ''
+  if (length) {
+    return `${baseType}(${length})`
+  }
+  return baseType
+}
+
+// 获取类型的默认长度
+export const getDefaultLength = (baseType: string): string | null => {
+  const upperType = baseType.toUpperCase()
+  if (upperType === 'VARCHAR') return '255'
+  if (upperType === 'CHAR') return '10'
+  if (upperType === 'DECIMAL') return '10,2'
+  if (upperType === 'FLOAT') return ''
+  if (upperType === 'DOUBLE') return ''
+  return null
+}
--- a/web/src/views/db-cli/utils/resize.ts
+++ b/web/src/views/db-cli/utils/resize.ts
@@ -0,0 +1,35 @@
+export interface ResizeOptions {
+  minPercent?: number
+  maxPercent?: number
+  minPixels?: number
+  onResize?: (percentage: number) => void
+}
+
+export function createResizeHandler(
+  container: HTMLElement | null,
+  getInitialPercentage: () => number,
+  options: ResizeOptions = {}
+): (e: MouseEvent) => void {
+  const { minPercent = 20, maxPercent = 80, minPixels = 150, onResize } = options
+
+  return (e: MouseEvent) => {
+    if (!container) return
+
+    const handleMouseMove = (moveEvent: MouseEvent) => {
+      if (!container) return
+      const rect = container.getBoundingClientRect()
+      const percentage = ((moveEvent.clientY - rect.top) / rect.height) * 100
+      const minPercentFromPixels = (minPixels / rect.height) * 100
+      const clamped = Math.max(Math.max(minPercent, minPercentFromPixels), Math.min(maxPercent, percentage))
+      onResize?.(clamped)
+    }
+
+    const handleMouseUp = () => {
+      document.removeEventListener('mousemove', handleMouseMove)
+      document.removeEventListener('mouseup', handleMouseUp)
+    }
+
+    document.addEventListener('mousemove', handleMouseMove)
+    document.addEventListener('mouseup', handleMouseUp)
+  }
+}