From cd82f45d5eefbf549056d3e4115e0ae7d349cdc7 Mon Sep 17 00:00:00 2001
From: Devosend <devosend@gmail.com>
Date: Mon, 25 Apr 2022 10:04:04 +0800
Subject: [PATCH] [Bug][UI][V1.0.0-Beta] Fix action buttons not displayed on
 one line bug (#9700)

---
 .../src/views/datasource/list/index.tsx                     | 6 +++++-
 .../src/views/datasource/list/use-columns.ts                | 2 ++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/dolphinscheduler-ui-next/src/views/datasource/list/index.tsx b/dolphinscheduler-ui-next/src/views/datasource/list/index.tsx
index c35e0f50c0..bc3bb61d78 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 2f3682a710..396ced08eb 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'
                           },
                           {