support to resize the columns (#13123)

dolphinscheduler-ui/src/views/projects/task/definition/use-table.ts

@@ -67,6 +67,9 @@ export function useTable(onEdit: Function) {
         title: t('project.task.task_name'),
         key: 'taskName',
         ...COLUMN_WIDTH_CONFIG['linkName'],
+        resizable: true,
+        minWidth: 200,
+        maxWidth: 600,
         render: (row: IRecord) =>
           h(
             ButtonLink,
@@ -77,7 +80,9 @@ export function useTable(onEdit: Function) {
               default: () =>
                   h(
                       NEllipsis,
-                  COLUMN_WIDTH_CONFIG['linkEllipsis'],
+                      {
+                        style: 'max-width: 580px;line-height: 1.5'
+                      },
                       () => row.taskName
                   )
             }
@@ -86,7 +91,10 @@ export function useTable(onEdit: Function) {
       {
         title: t('project.task.workflow_name'),
         key: 'processDefinitionName',
-        ...COLUMN_WIDTH_CONFIG['name']
+        ...COLUMN_WIDTH_CONFIG['name'],
+        resizable: true,
+        minWidth: 200,
+        maxWidth: 600
       },
       {
         title: t('project.task.workflow_state'),

dolphinscheduler-ui/src/views/projects/task/instance/use-table.ts

@@ -95,12 +95,18 @@ export function useTable() {
       {
         title: t('project.task.task_name'),
         key: 'name',
-        ...COLUMN_WIDTH_CONFIG['name']
+        ...COLUMN_WIDTH_CONFIG['name'],
+        resizable: true,
+        minWidth: 200,
+        maxWidth: 600,
       },
       {
         title: t('project.task.workflow_instance'),
         key: 'processInstanceName',
         ...COLUMN_WIDTH_CONFIG['linkName'],
+        resizable: true,
+        minWidth: 300,
+        maxWidth: 600,
         render: (row: {
           processInstanceId: number
           processInstanceName: string
@@ -119,7 +125,9 @@ export function useTable() {
               default: () =>
                 h(
                   NEllipsis,
-                  COLUMN_WIDTH_CONFIG['linkEllipsis'],
+                    {
+                      style: 'max-width: 580px;line-height: 1.5'
+                    },
                   () => row.processInstanceName
                 )
             }

dolphinscheduler-ui/src/views/projects/workflow/instance/use-table.ts

@@ -85,6 +85,10 @@ export function useTable() {
         key: 'name',
         ...COLUMN_WIDTH_CONFIG['linkName'],
         className: 'workflow-name',
+        resizable: true,
+        width: 300,
+        minWidth: 300,
+        maxWidth: 600,
         render: (row: IWorkflowInstance) =>
           h(
             ButtonLink,
@@ -100,7 +104,9 @@ export function useTable() {
               default: () =>
                   h(
                       NEllipsis,
-                  COLUMN_WIDTH_CONFIG['linkEllipsis'],
+                      {
+                        style: 'max-width: 580px;line-height: 1.5'
+                      },
                       () => row.name
                   )
             }