+                            
                                 
                                     {{ rowIndex + 1 }}
                                 
@@ -78,7 +87,7 @@
                                 
 
                                 
-                                    
+                                    
                                         NULL
                                     
 
@@ -134,6 +143,7 @@ import SvgIcon from '@/components/svgIcon/index.vue';
 import { exportCsv, exportFile } from '@/common/utils/export';
 import { dateStrFormat } from '@/common/utils/date';
 import { useIntervalFn } from '@vueuse/core';
+import { getDbDialect, DbDialect } from '../../dialect/index';
 
 const emits = defineEmits(['dataDelete', 'sortChange', 'deleteData', 'selectionChange', 'changeUpdatedField']);
 
@@ -273,6 +283,8 @@ class TableCellData {
     oldValue: any;
 }
 
+let dbDialect: DbDialect = null as any;
+
 let nowSortColumn = null as any;
 
 // 当前正在更新的单元格
@@ -388,6 +400,8 @@ onMounted(async () => {
 
     state.dbId = props.dbId;
     state.dbType = props.dbType;
+    dbDialect = getDbDialect(state.dbType);
+
     state.db = props.db;
     state.table = props.table;
     setTableData(props.data);
@@ -789,5 +803,14 @@ defineExpose({
     .update_field_active {
         background-color: var(--el-color-success);
     }
+
+    .column-type {
+        color: var(--el-color-info-light-3);
+        font-weight: bold;
+        position: absolute;
+        top: -12px;
+        padding: 2px;
+        height: 12px;
+    }
 }
 
diff --git a/mayfly_go_web/src/views/ops/db/db.ts b/mayfly_go_web/src/views/ops/db/db.ts
index 5e7aa285..00ce5b4c 100644
--- a/mayfly_go_web/src/views/ops/db/db.ts
+++ b/mayfly_go_web/src/views/ops/db/db.ts
@@ -373,6 +373,15 @@ export class DbInst {
         return columnType.match(/int|double|float|nubmer|decimal|byte|bit/gi);
     }
 
+    /**
+     * 判断字段类型是否为日期相关类型
+     * @param columnType 字段类型
+     * @returns
+     */
+    static isDate(columnType: string) {
+        return columnType.match(/date|time/gi);
+    }
+
     /**
      *
      * @param str 字符串
@@ -385,8 +394,8 @@ export class DbInst {
             return;
         }
 
-        // 获取列名称的长度 加上排序图标长度
-        const columnWidth: number = getTextWidth(prop) + 23;
+        // 获取列名称的长度 加上排序图标长度、abc为字段类型简称占位符
+        const columnWidth: number = getTextWidth(prop + 'abc') + 23;
         // prop为该列的字段名(传字符串);tableData为该表格的数据源(传变量);
         if (!tableData || !tableData.length || tableData.length === 0 || tableData === undefined) {
             return columnWidth;
diff --git a/mayfly_go_web/src/views/ops/db/dialect/dm_dialect.ts b/mayfly_go_web/src/views/ops/db/dialect/dm_dialect.ts
index 0e43c728..6211b4a5 100644
--- a/mayfly_go_web/src/views/ops/db/dialect/dm_dialect.ts
+++ b/mayfly_go_web/src/views/ops/db/dialect/dm_dialect.ts
@@ -1,3 +1,4 @@
+import { DbInst } from '../db';
 import { DbDialect, sqlColumnType, DialectInfo, RowDefinition, IndexDefinition, EditorCompletionItem, commonCustomKeywords, EditorCompletion } from './index';
 import { language as sqlLanguage } from 'monaco-editor/esm/vs/basic-languages/sql/sql.js';
 export { DMDialect, DM_TYPE_LIST };
@@ -429,10 +430,21 @@ class DMDialect implements DbDialect {
             indexComment: '',
         };
     }
+
     wrapName = (name: string) => {
         return name;
     };
 
+    getShortColumnType(columnType: string): string {
+        if (DbInst.isNumber(columnType)) {
+            return '123';
+        }
+        if (DbInst.isDate(columnType)) {
+            return 'date';
+        }
+        return 'abc';
+    }
+
     matchType(text: string, arr: string[]): boolean {
         if (!text || !arr || arr.length === 0) {
             return false;
diff --git a/mayfly_go_web/src/views/ops/db/dialect/index.ts b/mayfly_go_web/src/views/ops/db/dialect/index.ts
index f11d140d..6528944c 100644
--- a/mayfly_go_web/src/views/ops/db/dialect/index.ts
+++ b/mayfly_go_web/src/views/ops/db/dialect/index.ts
@@ -106,6 +106,12 @@ export interface DbDialect {
 
     getDefaultIndex(): IndexDefinition;
 
+    /**
+     * 根据数据库完整字段类型,获取类型简称。如字符串为abc、数字为123、日期为date等。
+     * @param columnType 数据库原始字段类型
+     */
+    getShortColumnType(columnType: string): string;
+
     /**
      * 包裹数据库表名、字段名等,避免使用关键字为字段名或表名时报错
      * @param name 名称
diff --git a/mayfly_go_web/src/views/ops/db/dialect/mysql_dialect.ts b/mayfly_go_web/src/views/ops/db/dialect/mysql_dialect.ts
index c2bf17f9..10f93671 100644
--- a/mayfly_go_web/src/views/ops/db/dialect/mysql_dialect.ts
+++ b/mayfly_go_web/src/views/ops/db/dialect/mysql_dialect.ts
@@ -1,3 +1,4 @@
+import { DbInst } from '../db';
 import { commonCustomKeywords, DbDialect, DialectInfo, EditorCompletion, EditorCompletionItem, IndexDefinition, RowDefinition } from './index';
 import { language as mysqlLanguage } from 'monaco-editor/esm/vs/basic-languages/mysql/mysql.js';
 
@@ -178,6 +179,16 @@ class MysqlDialect implements DbDialect {
         };
     }
 
+    getShortColumnType(columnType: string): string {
+        if (DbInst.isNumber(columnType)) {
+            return '123';
+        }
+        if (DbInst.isDate(columnType)) {
+            return 'date';
+        }
+        return 'abc';
+    }
+
     wrapName = (name: string) => {
         return `\`${name}\``;
     };
diff --git a/mayfly_go_web/src/views/ops/db/dialect/postgres_dialect.ts b/mayfly_go_web/src/views/ops/db/dialect/postgres_dialect.ts
index 7bb0ad43..3b474ccf 100644
--- a/mayfly_go_web/src/views/ops/db/dialect/postgres_dialect.ts
+++ b/mayfly_go_web/src/views/ops/db/dialect/postgres_dialect.ts
@@ -1,3 +1,4 @@
+import { DbInst } from '../db';
 import { commonCustomKeywords, DbDialect, DialectInfo, EditorCompletion, EditorCompletionItem, IndexDefinition, RowDefinition, sqlColumnType } from './index';
 import { language as pgsqlLanguage } from 'monaco-editor/esm/vs/basic-languages/pgsql/pgsql.js';
 
@@ -189,6 +190,16 @@ class PostgresqlDialect implements DbDialect {
         };
     }
 
+    getShortColumnType(columnType: string): string {
+        if (DbInst.isNumber(columnType)) {
+            return '123';
+        }
+        if (DbInst.isDate(columnType)) {
+            return 'date';
+        }
+        return 'abc';
+    }
+
     wrapName = (name: string) => {
         return name;
     };
diff --git a/server/internal/db/api/db.go b/server/internal/db/api/db.go
index 2c926053..06a6b4ec 100644
--- a/server/internal/db/api/db.go
+++ b/server/internal/db/api/db.go
@@ -136,7 +136,7 @@ func (d *Db) ExecSql(rc *req.Ctx) {
 	}
 
 	colAndRes := make(map[string]any)
-	colAndRes["colNames"] = execResAll.ColNames
+	colAndRes["columns"] = execResAll.Columns
 	colAndRes["res"] = execResAll.Res
 	rc.ResData = colAndRes
 }
@@ -349,11 +349,11 @@ func (d *Db) dumpDb(writer *gzipWriter, dbId uint64, dbName string, tables []str
 		writer.WriteString(fmt.Sprintf("\n-- ----------------------------\n-- 表记录: %s \n-- ----------------------------\n", table))
 		writer.WriteString("BEGIN;\n")
 		insertSql := "INSERT INTO %s VALUES (%s);\n"
-		dbMeta.WalkTableRecord(table, func(record map[string]any, columns []string) {
+		dbMeta.WalkTableRecord(table, func(record map[string]any, columns []*dbm.QueryColumn) {
 			var values []string
 			writer.TryFlush()
 			for _, column := range columns {
-				value := record[column]
+				value := record[column.Name]
 				if value == nil {
 					values = append(values, "NULL")
 					continue
diff --git a/server/internal/db/application/db_sql_exec.go b/server/internal/db/application/db_sql_exec.go
index bf931e6a..97a7e291 100644
--- a/server/internal/db/application/db_sql_exec.go
+++ b/server/internal/db/application/db_sql_exec.go
@@ -26,19 +26,19 @@ type DbSqlExecReq struct {
 }
 
 type DbSqlExecRes struct {
-	ColNames []string
-	Res      []map[string]any
+	Columns []*dbm.QueryColumn
+	Res     []map[string]any
 }
 
 // 合并执行结果,主要用于执行多条sql使用
 func (d *DbSqlExecRes) Merge(execRes *DbSqlExecRes) {
-	canMerge := len(d.ColNames) == len(execRes.ColNames)
+	canMerge := len(d.Columns) == len(execRes.Columns)
 	if !canMerge {
 		return
 	}
 	// 列名不一致,则不合并
-	for i, colName := range d.ColNames {
-		if execRes.ColNames[i] != colName {
+	for i, col := range d.Columns {
+		if execRes.Columns[i].Name != col.Name {
 			return
 		}
 	}
@@ -188,13 +188,13 @@ func doSelect(ctx context.Context, selectStmt *sqlparser.Select, execSqlReq *DbS
 func doRead(ctx context.Context, execSqlReq *DbSqlExecReq) (*DbSqlExecRes, error) {
 	dbConn := execSqlReq.DbConn
 	sql := execSqlReq.Sql
-	colNames, res, err := dbConn.QueryContext(ctx, sql)
+	cols, res, err := dbConn.QueryContext(ctx, sql)
 	if err != nil {
 		return nil, err
 	}
 	return &DbSqlExecRes{
-		ColNames: colNames,
-		Res:      res,
+		Columns: cols,
+		Res:     res,
 	}, nil
 }
 
@@ -285,7 +285,11 @@ func doExec(ctx context.Context, sql string, dbConn *dbm.DbConn) (*DbSqlExecRes,
 	res = append(res, resData)
 
 	return &DbSqlExecRes{
-		ColNames: []string{"sql", "rowsAffected", "result"},
-		Res:      res,
+		Columns: []*dbm.QueryColumn{
+			{Name: "sql", Type: "string"},
+			{Name: "rowsAffected", Type: "number"},
+			{Name: "result", Type: "string"},
+		},
+		Res: res,
 	}, err
 }
diff --git a/server/internal/db/dbm/conn.go b/server/internal/db/dbm/conn.go
index c601f9bb..99f3a331 100644
--- a/server/internal/db/dbm/conn.go
+++ b/server/internal/db/dbm/conn.go
@@ -19,17 +19,23 @@ type DbConn struct {
 	db *sql.DB
 }
 
+// 执行数据库查询返回的列信息
+type QueryColumn struct {
+	Name string `json:"name"` // 列名
+	Type string `json:"type"` // 类型
+}
+
 // 执行查询语句
-// 依次返回 列名数组(顺序),结果map,错误
-func (d *DbConn) Query(querySql string) ([]string, []map[string]any, error) {
+// 依次返回 列信息数组(顺序),结果map,错误
+func (d *DbConn) Query(querySql string) ([]*QueryColumn, []map[string]any, error) {
 	return d.QueryContext(context.Background(), querySql)
 }
 
 // 执行查询语句
-// 依次返回 列名数组(顺序),结果map,错误
-func (d *DbConn) QueryContext(ctx context.Context, querySql string) ([]string, []map[string]any, error) {
+// 依次返回 列信息数组(顺序),结果map,错误
+func (d *DbConn) QueryContext(ctx context.Context, querySql string) ([]*QueryColumn, []map[string]any, error) {
 	result := make([]map[string]any, 0, 16)
-	columns, err := walkTableRecord(ctx, d.db, querySql, func(record map[string]any, columns []string) {
+	columns, err := walkTableRecord(ctx, d.db, querySql, func(record map[string]any, columns []*QueryColumn) {
 		result = append(result, record)
 	})
 	if err != nil {
@@ -55,7 +61,7 @@ func (d *DbConn) Query2Struct(execSql string, dest any) error {
 }
 
 // WalkTableRecord 遍历表记录
-func (d *DbConn) WalkTableRecord(ctx context.Context, selectSql string, walk func(record map[string]any, columns []string)) error {
+func (d *DbConn) WalkTableRecord(ctx context.Context, selectSql string, walk func(record map[string]any, columns []*QueryColumn)) error {
 	_, err := walkTableRecord(ctx, d.db, selectSql, walk)
 	return err
 }
@@ -100,7 +106,7 @@ func (d *DbConn) Close() {
 	}
 }
 
-func walkTableRecord(ctx context.Context, db *sql.DB, selectSql string, walk func(record map[string]any, columns []string)) ([]string, error) {
+func walkTableRecord(ctx context.Context, db *sql.DB, selectSql string, walk func(record map[string]any, columns []*QueryColumn)) ([]*QueryColumn, error) {
 	rows, err := db.QueryContext(ctx, selectSql)
 
 	if err != nil {
@@ -120,13 +126,13 @@ func walkTableRecord(ctx context.Context, db *sql.DB, selectSql string, walk fun
 	}
 	lenCols := len(colTypes)
 	// 列名用于前端表头名称按照数据库与查询字段顺序显示
-	colNames := make([]string, lenCols)
+	cols := make([]*QueryColumn, lenCols)
 	// 这里表示一行填充数据
 	scans := make([]any, lenCols)
 	// 这里表示一行所有列的值,用[]byte表示
 	values := make([][]byte, lenCols)
 	for k, colType := range colTypes {
-		colNames[k] = colType.Name()
+		cols[k] = &QueryColumn{Name: colType.Name(), Type: colType.DatabaseTypeName()}
 		// 这里scans引用values,把数据填充到[]byte里
 		scans[k] = &values[k]
 	}
@@ -142,10 +148,10 @@ func walkTableRecord(ctx context.Context, db *sql.DB, selectSql string, walk fun
 		for i, v := range values {
 			rowData[colTypes[i].Name()] = valueConvert(v, colTypes[i])
 		}
-		walk(rowData, colNames)
+		walk(rowData, cols)
 	}
 
-	return colNames, nil
+	return cols, nil
 }
 
 // 将查询的值转为对应列类型的实际值,不全部转为字符串
diff --git a/server/internal/db/dbm/dialect.go b/server/internal/db/dbm/dialect.go
index 6985dc8c..f3d5d58d 100644
--- a/server/internal/db/dbm/dialect.go
+++ b/server/internal/db/dbm/dialect.go
@@ -63,10 +63,10 @@ type DbDialect interface {
 
 	// 获取指定表的数据-分页查询
 	// @return columns: 列字段名;result: 结果集;error: 错误
-	GetTableRecord(tableName string, pageNum, pageSize int) ([]string, []map[string]any, error)
+	GetTableRecord(tableName string, pageNum, pageSize int) ([]*QueryColumn, []map[string]any, error)
 
 	// WalkTableRecord 遍历指定表的数据
-	WalkTableRecord(tableName string, walk func(record map[string]any, columns []string)) error
+	WalkTableRecord(tableName string, walk func(record map[string]any, columns []*QueryColumn)) error
 
 	GetSchemas() ([]string, error)
 }
diff --git a/server/internal/db/dbm/dialect_dm.go b/server/internal/db/dbm/dialect_dm.go
index f727a84f..e3c67acd 100644
--- a/server/internal/db/dbm/dialect_dm.go
+++ b/server/internal/db/dbm/dialect_dm.go
@@ -232,11 +232,11 @@ func (pd *DMDialect) GetCreateTableDdl(tableName string) (string, error) {
 	return builder.String(), nil
 }
 
-func (pd *DMDialect) GetTableRecord(tableName string, pageNum, pageSize int) ([]string, []map[string]any, error) {
+func (pd *DMDialect) GetTableRecord(tableName string, pageNum, pageSize int) ([]*QueryColumn, []map[string]any, error) {
 	return pd.dc.Query(fmt.Sprintf("SELECT * FROM %s OFFSET %d LIMIT %d", tableName, (pageNum-1)*pageSize, pageSize))
 }
 
-func (pd *DMDialect) WalkTableRecord(tableName string, walk func(record map[string]any, columns []string)) error {
+func (pd *DMDialect) WalkTableRecord(tableName string, walk func(record map[string]any, columns []*QueryColumn)) error {
 	return pd.dc.WalkTableRecord(context.Background(), fmt.Sprintf("SELECT * FROM %s", tableName), walk)
 }
 
diff --git a/server/internal/db/dbm/dialect_mysql.go b/server/internal/db/dbm/dialect_mysql.go
index 946a58af..ab136cc4 100644
--- a/server/internal/db/dbm/dialect_mysql.go
+++ b/server/internal/db/dbm/dialect_mysql.go
@@ -174,11 +174,11 @@ func (md *MysqlDialect) GetCreateTableDdl(tableName string) (string, error) {
 	return res[0]["Create Table"].(string) + ";", nil
 }
 
-func (md *MysqlDialect) GetTableRecord(tableName string, pageNum, pageSize int) ([]string, []map[string]any, error) {
+func (md *MysqlDialect) GetTableRecord(tableName string, pageNum, pageSize int) ([]*QueryColumn, []map[string]any, error) {
 	return md.dc.Query(fmt.Sprintf("SELECT * FROM %s LIMIT %d, %d", tableName, (pageNum-1)*pageSize, pageSize))
 }
 
-func (md *MysqlDialect) WalkTableRecord(tableName string, walk func(record map[string]any, columns []string)) error {
+func (md *MysqlDialect) WalkTableRecord(tableName string, walk func(record map[string]any, columns []*QueryColumn)) error {
 	return md.dc.WalkTableRecord(context.Background(), fmt.Sprintf("SELECT * FROM %s", tableName), walk)
 }
 
diff --git a/server/internal/db/dbm/dialect_pgsql.go b/server/internal/db/dbm/dialect_pgsql.go
index 49ca595e..ac231c7c 100644
--- a/server/internal/db/dbm/dialect_pgsql.go
+++ b/server/internal/db/dbm/dialect_pgsql.go
@@ -245,11 +245,11 @@ func (pd *PgsqlDialect) GetCreateTableDdl(tableName string) (string, error) {
 	return res[0]["sql"].(string), nil
 }
 
-func (pd *PgsqlDialect) GetTableRecord(tableName string, pageNum, pageSize int) ([]string, []map[string]any, error) {
+func (pd *PgsqlDialect) GetTableRecord(tableName string, pageNum, pageSize int) ([]*QueryColumn, []map[string]any, error) {
 	return pd.dc.Query(fmt.Sprintf("SELECT * FROM %s OFFSET %d LIMIT %d", tableName, (pageNum-1)*pageSize, pageSize))
 }
 
-func (pd *PgsqlDialect) WalkTableRecord(tableName string, walk func(record map[string]any, columns []string)) error {
+func (pd *PgsqlDialect) WalkTableRecord(tableName string, walk func(record map[string]any, columns []*QueryColumn)) error {
 	return pd.dc.WalkTableRecord(context.Background(), fmt.Sprintf("SELECT * FROM %s", tableName), walk)
 }