diff --git a/dolphinscheduler-ui-next/src/views/datasource/list/index.tsx b/dolphinscheduler-ui-next/src/views/datasource/list/index.tsx
index c35e0f50c..bc3bb61d7 100644
--- a/dolphinscheduler-ui-next/src/views/datasource/list/index.tsx
+++ b/dolphinscheduler-ui-next/src/views/datasource/list/index.tsx
@@ -32,6 +32,7 @@ import { useColumns } from './use-columns'
 import { useTable } from './use-table'
 import styles from './index.module.scss'
 import type { TableColumns } from './types'
+import { DefaultTableWidth } from '@/utils/column-width-config'
 
 const list = defineComponent({
   name: 'list',
@@ -39,7 +40,10 @@ const list = defineComponent({
     const { t } = useI18n()
     const showDetailModal = ref(false)
     const selectId = ref()
-    const columns = ref({ columns: [] as TableColumns, tableWidth: 0 })
+    const columns = ref({
+      columns: [] as TableColumns,
+      tableWidth: DefaultTableWidth
+    })
     const { data, changePage, changePageSize, deleteRecord, updateList } =
       useTable()
 
diff --git a/dolphinscheduler-ui-next/src/views/datasource/list/use-columns.ts b/dolphinscheduler-ui-next/src/views/datasource/list/use-columns.ts
index 2f3682a71..396ced08e 100644
--- a/dolphinscheduler-ui-next/src/views/datasource/list/use-columns.ts
+++ b/dolphinscheduler-ui-next/src/views/datasource/list/use-columns.ts
@@ -108,6 +108,7 @@ export function useColumns(onCallback: Function) {
                     {
                       circle: true,
                       type: 'info',
+                      size: 'small',
                       onClick: () => void onCallback(rowData.id, 'edit')
                     },
                     {
@@ -134,6 +135,7 @@ export function useColumns(onCallback: Function) {
                           {
                             circle: true,
                             type: 'error',
+                            size: 'small',
                             class: 'btn-delete'
                           },
                           {