✨ feat(frontend): 升级 DataGrid 组件并引入高性能拖拽交互

- 实现基于原生 DOM 事件的零渲染列宽拖拽，彻底解决卡顿与误触排序问题
- 查询编辑器集成 DataGrid，支持 SQL 结果直接编辑与事务提交
- 侧边栏新增上下文感知的 "新建查询" 快捷入口
- 优化 TabManager 渲染逻辑与全局布局，消除不必要的滚动条

frontend/src/components/TabManager.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import { Tabs, Button } from 'antd';
 import { useStore } from '../store';
 import DataViewer from './DataViewer';
@@ -18,7 +18,7 @@ const TabManager: React.FC = () => {
     }
   };
 
-  const items = tabs.map(tab => {
+  const items = useMemo(() => tabs.map(tab => {
     let content;
     if (tab.type === 'query') {
       content = <QueryEditor tab={tab} />;
@@ -33,18 +33,24 @@ const TabManager: React.FC = () => {
       key: tab.id,
       children: content,
     };
-  });
+  }), [tabs]);
 
   return (
-    <Tabs
-      type="editable-card"
-      onChange={onChange}
-      activeKey={activeTabId || undefined}
-      onEdit={onEdit}
-      items={items}
-      style={{ height: '100%' }}
-      hideAdd
-    />
+    <>
+        <style>{`
+            .ant-tabs-content { height: 100%; }
+            .ant-tabs-tabpane { height: 100%; }
+        `}</style>
+        <Tabs
+            type="editable-card"
+            onChange={onChange}
+            activeKey={activeTabId || undefined}
+            onEdit={onEdit}
+            items={items}
+            style={{ height: '100%' }}
+            hideAdd
+        />
+    </>
   );
 };