From 4c2e57cfb3947ca6071d78e375beb91bbc820632 Mon Sep 17 00:00:00 2001
From: calvin <jianghuachinacom@163.com>
Date: Wed, 24 May 2023 08:50:53 +0800
Subject: [PATCH] [Feature][UI] Support to view and manage all timing settings
 of a project. (#14178)

---
 .../api/controller/SchedulerController.java   |   2 +-
 .../service/impl/SchedulerServiceImpl.java    |  16 +-
 .../dao/mapper/ScheduleMapper.java            |  14 +
 .../dao/mapper/ScheduleMapper.xml             |  19 +
 .../dao/mapper/ScheduleMapperTest.java        |  38 ++
 .../src/common/column-width-config.ts         |   2 +-
 dolphinscheduler-ui/src/common/common.ts      |   7 +-
 .../src/components/input-search/index.tsx     |  19 +-
 .../content/components/navbar/index.tsx       |   8 +-
 .../components/sidebar/use-menuClick.ts       |   4 +-
 .../src/layouts/content/use-dataList.ts       |  21 +-
 .../src/locales/en_US/datasource.ts           |  12 +-
 .../src/locales/en_US/input-search.ts         |   4 +-
 dolphinscheduler-ui/src/locales/en_US/menu.ts |   3 +-
 .../src/locales/en_US/project.ts              |   3 +-
 .../src/locales/en_US/resource.ts             |   2 +-
 .../src/locales/en_US/security.ts             |   2 +-
 .../src/locales/zh_CN/datasource.ts           |  12 +-
 .../src/locales/zh_CN/input-search.ts         |   4 +-
 dolphinscheduler-ui/src/locales/zh_CN/menu.ts |   1 +
 .../src/locales/zh_CN/project.ts              |   1 +
 .../src/locales/zh_CN/security.ts             |   2 +-
 .../src/router/modules/projects.ts            |  11 +
 .../src/service/modules/data-source/types.ts  |  34 +-
 .../src/service/modules/dynamic-dag/index.ts  |   2 +-
 .../src/service/modules/login/index.ts        |   2 +-
 .../modules/process-definition/index.ts       |   6 +-
 .../modules/process-instances/index.ts        |   1 -
 .../src/service/modules/projects/index.ts     |  12 +-
 .../src/service/modules/resources/index.ts    |  49 +-
 .../src/service/modules/resources/types.ts    |   2 +-
 .../src/service/modules/schedules/types.ts    |   2 +-
 .../service/modules/task-instances/index.ts   |   5 +-
 .../src/store/project/dynamic/dag.ts          |   2 +-
 .../src/store/project/dynamic/types.ts        |   2 +-
 .../src/utils/environmental-distinction.ts    |  47 +-
 dolphinscheduler-ui/src/utils/tree-format.ts  |   7 +-
 .../src/views/data-quality/rule/index.tsx     |   8 +-
 .../views/data-quality/task-result/index.tsx  |   6 +-
 .../src/views/datasource/list/detail.tsx      | 126 +++--
 .../src/views/datasource/list/use-columns.ts  |   5 +-
 .../src/views/datasource/list/use-form.ts     |  48 +-
 .../src/views/datasource/list/use-table.ts    |   2 +-
 dolphinscheduler-ui/src/views/login/index.tsx |  36 +-
 .../src/views/login/use-login.ts              |   2 +-
 .../src/views/profile/use-form.ts             |   4 +-
 .../src/views/projects/list/index.tsx         |  18 +-
 .../src/views/projects/list/use-table.ts      |   2 +-
 .../task/components/node/fields/use-cache.ts  |  14 +-
 .../node/fields/use-custom-labels.ts          | 108 ++--
 .../components/node/fields/use-datasource.ts  |   2 +-
 .../components/node/fields/use-datasync.ts    | 117 +++--
 .../task/components/node/fields/use-datax.ts  | 466 +++++++++---------
 .../node/fields/use-dependent-timeout.ts      |   4 +-
 .../task/components/node/fields/use-dms.ts    |   7 +-
 .../node/fields/use-environment-name.ts       |   6 +-
 .../task/components/node/fields/use-flink.ts  |   3 +-
 .../components/node/fields/use-hive-cli.ts    |  14 +-
 .../task/components/node/fields/use-linkis.ts |   4 +-
 .../components/node/fields/use-namespace.ts   |   2 +-
 .../components/node/fields/use-resources.ts   |   2 +-
 .../components/node/fields/use-sea-tunnel.ts  |  32 +-
 .../components/node/fields/use-zeppelin.ts    |   2 +-
 .../task/components/node/format-data.ts       |  14 +-
 .../components/node/tasks/use-datasync.ts     | 110 ++---
 .../task/components/node/tasks/use-dms.ts     |   2 +-
 .../task/components/node/tasks/use-linkis.ts  |   2 +-
 .../components/node/tasks/use-sea-tunnel.ts   |  46 +-
 .../projects/task/components/node/types.ts    |   6 +-
 .../projects/task/definition/use-table.ts     |  14 +-
 .../projects/task/instance/batch-task.tsx     |   2 +-
 .../views/projects/task/instance/index.tsx    |   3 +-
 .../views/projects/task/instance/use-table.ts |  28 +-
 .../workflow/components/dag/dag-config.ts     |   2 +-
 .../components/dag/dag-context-menu.tsx       |  79 +--
 .../workflow/components/dag/dag-sidebar.tsx   |  51 +-
 .../workflow/components/dag/dag-toolbar.tsx   |  58 +--
 .../workflow/components/dag/index.tsx         |  37 +-
 .../components/dag/use-canvas-init.ts         |  16 +-
 .../components/dynamic-dag/dag-canvas.tsx     |  23 +-
 .../components/dynamic-dag/dag-sidebar.tsx    |  22 +-
 .../workflow/components/dynamic-dag/index.tsx |  18 +-
 .../components/dynamic-dag/task/index.tsx     |  81 +--
 .../components/dynamic-dag/task/types.ts      |   2 +-
 .../dynamic-dag/task/use-dynamic-locales.ts   |   2 +-
 .../dynamic-dag/task/use-form-field.ts        |   9 +-
 .../dynamic-dag/task/use-form-request.ts      |   4 +-
 .../dynamic-dag/task/use-form-structure.ts    |   2 +-
 .../dynamic-dag/task/use-form-validate.ts     |   2 +-
 .../dynamic-dag/task/use-task-form.ts         |   4 +-
 .../dynamic-dag/use-add-dag-shape.ts          |   2 +-
 .../components/dynamic-dag/use-dag-edge.ts    |   2 +-
 .../components/dynamic-dag/use-dag-graph.ts   |   2 +-
 .../components/dynamic-dag/use-dag-node.ts    |   2 +-
 .../components/dynamic-dag/use-dag-resize.ts  |   2 +-
 .../components/dynamic-dag/use-sidebar.ts     |   5 +-
 .../definition/components/use-modal.ts        |   2 +-
 .../workflow/definition/create/index.tsx      |   8 +-
 .../projects/workflow/definition/index.tsx    |  10 +-
 .../workflow/definition/timing/index.tsx      |   4 +-
 .../workflow/definition/timing/types.ts       |   2 +
 .../workflow/definition/timing/use-table.ts   |  59 ++-
 .../projects/workflow/definition/use-table.ts |   2 +-
 .../instance/components/variables-view.tsx    |  19 +-
 .../projects/workflow/instance/use-table.ts   |   2 +-
 .../projects/workflow/relation/index.tsx      |  17 +-
 .../timing/components/timing-condition.tsx    |  87 ++++
 .../views/projects/workflow/timing/index.tsx  | 116 +++++
 .../views/projects/workflow/timing/types.ts   |  22 +
 .../components/resource/create/use-form.ts    |   2 +-
 .../components/resource/edit/index.tsx        |   6 +-
 .../components/resource/edit/use-edit.ts      |  17 +-
 .../components/resource/folder/index.tsx      |   2 +-
 .../components/resource/folder/use-form.ts    |   2 +-
 .../resource/components/resource/index.tsx    |  66 ++-
 .../components/resource/rename/index.tsx      |  10 +-
 .../components/resource/rename/use-form.ts    |  34 +-
 .../components/resource/rename/use-rename.ts  |  10 +-
 .../resource/table/table-action.tsx           | 103 ++--
 .../components/resource/table/use-table.ts    |  97 ++--
 .../resource/components/resource/types.ts     |  69 +--
 .../components/resource/upload/index.tsx      |  11 +-
 .../components/resource/upload/use-form.ts    |   2 +-
 .../src/views/resource/file/create/index.tsx  |   7 +-
 .../src/views/resource/file/edit/index.tsx    |   7 +-
 .../src/views/resource/file/index.tsx         |   9 +-
 .../resource/task-group/option/index.tsx      |  20 +-
 .../views/resource/task-group/queue/index.tsx |  16 +-
 .../function/components/function-modal.tsx    |   4 +-
 .../udf/function/components/use-form.ts       |   2 +-
 .../udf/function/components/use-modal.ts      |  10 +-
 .../src/views/resource/udf/function/index.tsx |  10 +-
 .../views/resource/udf/function/use-table.ts  |   4 +-
 .../src/views/resource/udf/resource/index.tsx |   9 +-
 .../security/alarm-group-manage/index.tsx     |  10 +-
 .../security/alarm-instance-manage/index.tsx  |  10 +-
 .../views/security/cluster-manage/index.tsx   |  10 +-
 .../security/environment-manage/index.tsx     |  10 +-
 .../security/k8s-namespace-manage/index.tsx   |  10 +-
 .../views/security/tenant-manage/index.tsx    |  10 +-
 .../src/views/security/token-manage/index.tsx |  10 +-
 .../components/authorize-modal.tsx            |  89 ++--
 .../user-manage/components/use-authorize.ts   |  30 +-
 .../user-manage/components/use-columns.ts     |   7 +-
 .../src/views/security/user-manage/index.tsx  |  16 +-
 .../security/worker-group-manage/index.tsx    |  10 +-
 .../security/yarn-queue-manage/index.tsx      |  10 +-
 147 files changed, 1825 insertions(+), 1360 deletions(-)
 create mode 100644 dolphinscheduler-ui/src/views/projects/workflow/timing/components/timing-condition.tsx
 create mode 100644 dolphinscheduler-ui/src/views/projects/workflow/timing/index.tsx
 create mode 100644 dolphinscheduler-ui/src/views/projects/workflow/timing/types.ts

diff --git a/dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/controller/SchedulerController.java b/dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/controller/SchedulerController.java
index e0b5fdc8c4..5935e2b30b 100644
--- a/dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/controller/SchedulerController.java
+++ b/dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/controller/SchedulerController.java
@@ -250,7 +250,7 @@ public class SchedulerController extends BaseController {
     @AccessLogAnnotation(ignoreRequestArgs = "loginUser")
     public Result queryScheduleListPaging(@Parameter(hidden = true) @RequestAttribute(value = SESSION_USER) User loginUser,
                                           @Parameter(name = "projectCode", description = "PROJECT_CODE", required = true) @PathVariable long projectCode,
-                                          @RequestParam long processDefinitionCode,
+                                          @RequestParam(value = "processDefinitionCode", required = false, defaultValue = "0") long processDefinitionCode,
                                           @RequestParam(value = "searchVal", required = false) String searchVal,
                                           @RequestParam("pageNo") Integer pageNo,
                                           @RequestParam("pageSize") Integer pageSize) {
diff --git a/dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/service/impl/SchedulerServiceImpl.java b/dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/service/impl/SchedulerServiceImpl.java
index 419f1151df..589d509ae0 100644
--- a/dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/service/impl/SchedulerServiceImpl.java
+++ b/dolphinscheduler-api/src/main/java/org/apache/dolphinscheduler/api/service/impl/SchedulerServiceImpl.java
@@ -568,16 +568,20 @@ public class SchedulerServiceImpl extends BaseServiceImpl implements SchedulerSe
             return result;
         }
 
-        ProcessDefinition processDefinition = processDefinitionMapper.queryByCode(processDefineCode);
-        if (processDefinition == null || projectCode != processDefinition.getProjectCode()) {
-            log.error("Process definition does not exist, processDefinitionCode:{}.", processDefineCode);
-            putMsg(result, Status.PROCESS_DEFINE_NOT_EXIST, String.valueOf(processDefineCode));
-            return result;
+        if (processDefineCode != 0) {
+            ProcessDefinition processDefinition = processDefinitionMapper.queryByCode(processDefineCode);
+            if (processDefinition == null || projectCode != processDefinition.getProjectCode()) {
+                log.error("Process definition does not exist, processDefinitionCode:{}.", processDefineCode);
+                putMsg(result, Status.PROCESS_DEFINE_NOT_EXIST, String.valueOf(processDefineCode));
+                return result;
+            }
         }
 
         Page<Schedule> page = new Page<>(pageNo, pageSize);
+
         IPage<Schedule> schedulePage =
-                scheduleMapper.queryByProcessDefineCodePaging(page, processDefineCode, searchVal);
+                scheduleMapper.queryByProjectAndProcessDefineCodePaging(page, projectCode, processDefineCode,
+                        searchVal);
 
         List<ScheduleVo> scheduleList = new ArrayList<>();
         for (Schedule schedule : schedulePage.getRecords()) {
diff --git a/dolphinscheduler-dao/src/main/java/org/apache/dolphinscheduler/dao/mapper/ScheduleMapper.java b/dolphinscheduler-dao/src/main/java/org/apache/dolphinscheduler/dao/mapper/ScheduleMapper.java
index 953fa35c47..8bf63269c2 100644
--- a/dolphinscheduler-dao/src/main/java/org/apache/dolphinscheduler/dao/mapper/ScheduleMapper.java
+++ b/dolphinscheduler-dao/src/main/java/org/apache/dolphinscheduler/dao/mapper/ScheduleMapper.java
@@ -63,6 +63,20 @@ public interface ScheduleMapper extends BaseMapper<Schedule> {
                                                    @Param("processDefinitionCode") long processDefinitionCode,
                                                    @Param("searchVal") String searchVal);
 
+    /**
+     * scheduler page
+     *
+     * @param page page
+     * @param projectCode projectCode
+     * @param processDefinitionCode processDefinitionCode
+     * @param searchVal searchVal
+     * @return scheduler IPage
+     */
+    IPage<Schedule> queryByProjectAndProcessDefineCodePaging(IPage<Schedule> page,
+                                                             @Param("projectCode") long projectCode,
+                                                             @Param("processDefinitionCode") long processDefinitionCode,
+                                                             @Param("searchVal") String searchVal);
+
     /**
      * Filter schedule
      *
diff --git a/dolphinscheduler-dao/src/main/resources/org/apache/dolphinscheduler/dao/mapper/ScheduleMapper.xml b/dolphinscheduler-dao/src/main/resources/org/apache/dolphinscheduler/dao/mapper/ScheduleMapper.xml
index 86001a1fce..5c047fb3b3 100644
--- a/dolphinscheduler-dao/src/main/resources/org/apache/dolphinscheduler/dao/mapper/ScheduleMapper.xml
+++ b/dolphinscheduler-dao/src/main/resources/org/apache/dolphinscheduler/dao/mapper/ScheduleMapper.xml
@@ -44,6 +44,25 @@
         </if>
         order by s.update_time desc
     </select>
+    <select id="queryByProjectAndProcessDefineCodePaging" resultType="org.apache.dolphinscheduler.dao.entity.Schedule">
+        select p_f.name as process_definition_name, p.name as project_name,u.user_name,e.name as environment_name,
+        <include refid="baseSqlV2">
+            <property name="alias" value="s"/>
+        </include>
+        from t_ds_schedules s
+        join t_ds_process_definition p_f on s.process_definition_code = p_f.code
+        join t_ds_project as p on p_f.project_code = p.code
+        join t_ds_user as u on s.user_id = u.id
+        left join t_ds_environment as e on s.environment_code = e.code
+        where 1=1
+        <if test="projectCode != 0">
+            and p.code = #{projectCode}
+        </if>
+        <if test="processDefinitionCode != 0">
+            and s.process_definition_code = #{processDefinitionCode}
+        </if>
+        order by s.update_time desc
+    </select>
     <select id="querySchedulerListByProjectName" resultType="org.apache.dolphinscheduler.dao.entity.Schedule">
         select p_f.name as process_definition_name, p_f.description as definition_description, p.name as project_name,u.user_name, s.*
         from t_ds_schedules s
diff --git a/dolphinscheduler-dao/src/test/java/org/apache/dolphinscheduler/dao/mapper/ScheduleMapperTest.java b/dolphinscheduler-dao/src/test/java/org/apache/dolphinscheduler/dao/mapper/ScheduleMapperTest.java
index 2084f8fe66..d916ad92a1 100644
--- a/dolphinscheduler-dao/src/test/java/org/apache/dolphinscheduler/dao/mapper/ScheduleMapperTest.java
+++ b/dolphinscheduler-dao/src/test/java/org/apache/dolphinscheduler/dao/mapper/ScheduleMapperTest.java
@@ -141,6 +141,44 @@ public class ScheduleMapperTest extends BaseDaoTest {
         Assertions.assertNotEquals(scheduleIPage.getSize(), 0);
     }
 
+    /**
+     * test page
+     */
+    @Test
+    public void testQueryByProjectAndProcessDefineIdPaging() {
+
+        User user = new User();
+        user.setUserName("ut name");
+        userMapper.insert(user);
+
+        Project project = new Project();
+        project.setName("ut project");
+        project.setUserId(user.getId());
+        project.setCode(1L);
+        project.setUpdateTime(new Date());
+        project.setCreateTime(new Date());
+        projectMapper.insert(project);
+
+        ProcessDefinition processDefinition = new ProcessDefinition();
+        processDefinition.setCode(1L);
+        processDefinition.setProjectCode(project.getCode());
+        processDefinition.setUserId(user.getId());
+        processDefinition.setLocations("");
+        processDefinition.setCreateTime(new Date());
+        processDefinition.setUpdateTime(new Date());
+        processDefinitionMapper.insert(processDefinition);
+
+        Schedule schedule = insertOne();
+        schedule.setUserId(user.getId());
+        schedule.setProcessDefinitionCode(processDefinition.getCode());
+        scheduleMapper.updateById(schedule);
+
+        Page<Schedule> page = new Page(1, 3);
+        IPage<Schedule> scheduleIPage = scheduleMapper.queryByProjectAndProcessDefineCodePaging(page, project.getCode(),
+                processDefinition.getCode(), "");
+        Assertions.assertNotEquals(scheduleIPage.getSize(), 0);
+    }
+
     /**
      * test query schedule list by project name
      */
diff --git a/dolphinscheduler-ui/src/common/column-width-config.ts b/dolphinscheduler-ui/src/common/column-width-config.ts
index e291c87c88..43fd75dda9 100644
--- a/dolphinscheduler-ui/src/common/column-width-config.ts
+++ b/dolphinscheduler-ui/src/common/column-width-config.ts
@@ -98,7 +98,7 @@ export const COLUMN_WIDTH_CONFIG = {
   tag: {
     width: 160
   },
-  checkbox:{
+  checkbox: {
     width: 20
   },
   copy: {
diff --git a/dolphinscheduler-ui/src/common/common.ts b/dolphinscheduler-ui/src/common/common.ts
index aa98186c5d..2bd087955e 100644
--- a/dolphinscheduler-ui/src/common/common.ts
+++ b/dolphinscheduler-ui/src/common/common.ts
@@ -154,7 +154,6 @@ export const workflowExecutionStateType = (t: any) => [
   }))
 ]
 
-
 /**
  * Stream task state
  */
@@ -271,7 +270,7 @@ export const tasksState = (t: any): ITaskStateConfig => ({
     icon: SendOutlined,
     isSpin: false,
     classNames: 'dispatch'
-  },
+  }
 })
 
 /**
@@ -282,7 +281,9 @@ export const tasksState = (t: any): ITaskStateConfig => ({
  * @icon icon
  * @isSpin is loading (Need to execute the code block to write if judgment)
  */
-export const workflowExecutionState = (t: any): IWorkflowExecutionStateConfig => ({
+export const workflowExecutionState = (
+  t: any
+): IWorkflowExecutionStateConfig => ({
   SUBMITTED_SUCCESS: {
     id: 0,
     desc: `${t('project.workflow.submit_success')}`,
diff --git a/dolphinscheduler-ui/src/components/input-search/index.tsx b/dolphinscheduler-ui/src/components/input-search/index.tsx
index ea482cb2df..94a93067cd 100644
--- a/dolphinscheduler-ui/src/components/input-search/index.tsx
+++ b/dolphinscheduler-ui/src/components/input-search/index.tsx
@@ -28,8 +28,8 @@ const props = {
 
 const Search = defineComponent({
   name: 'Search',
-  emits: ['search','clear'],
   props: props,
+  emits: ['search', 'clear'],
   setup(props, ctx) {
     const { t } = useI18n()
 
@@ -40,14 +40,15 @@ const Search = defineComponent({
       ctx.emit('clear', (ev.target as HTMLInputElement)?.value || '')
     }
     return () => (
-
-        <NInput
-            size='small'
-            clearable
-            placeholder = {props.placeholder?props.placeholder:t('input_search.placeholder')}
-            onKeydown={withKeys(onKeyDown, ['enter'])}
-            onClear = {onClear}
-        />
+      <NInput
+        size='small'
+        clearable
+        placeholder={
+          props.placeholder ? props.placeholder : t('input_search.placeholder')
+        }
+        onKeydown={withKeys(onKeyDown, ['enter'])}
+        onClear={onClear}
+      />
     )
   }
 })
diff --git a/dolphinscheduler-ui/src/layouts/content/components/navbar/index.tsx b/dolphinscheduler-ui/src/layouts/content/components/navbar/index.tsx
index b648e88f84..903120cf6c 100644
--- a/dolphinscheduler-ui/src/layouts/content/components/navbar/index.tsx
+++ b/dolphinscheduler-ui/src/layouts/content/components/navbar/index.tsx
@@ -85,9 +85,11 @@ const Navbar = defineComponent({
         <div class={styles.settings}>
           <NButton quaternary onClick={this.handleUISettingClick}>
             {{
-              icon: () => <NIcon size='16'>
-                <SettingOutlined />
-              </NIcon>,
+              icon: () => (
+                <NIcon size='16'>
+                  <SettingOutlined />
+                </NIcon>
+              ),
               default: this.t('menu.ui_setting')
             }}
           </NButton>
diff --git a/dolphinscheduler-ui/src/layouts/content/components/sidebar/use-menuClick.ts b/dolphinscheduler-ui/src/layouts/content/components/sidebar/use-menuClick.ts
index fe569e87a1..80ac3a1fbf 100644
--- a/dolphinscheduler-ui/src/layouts/content/components/sidebar/use-menuClick.ts
+++ b/dolphinscheduler-ui/src/layouts/content/components/sidebar/use-menuClick.ts
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import {LocationQueryRaw, useRouter} from 'vue-router'
+import { LocationQueryRaw, useRouter } from 'vue-router'
 import type { Router } from 'vue-router'
 import { MenuOption } from 'naive-ui'
 
@@ -25,7 +25,7 @@ export function useMenuClick() {
   const handleMenuClick = (key: string, menuOption: MenuOption) => {
     router.push({
       path: `${key}`,
-      query: menuOption.payload? menuOption.payload as LocationQueryRaw: {}
+      query: menuOption.payload ? (menuOption.payload as LocationQueryRaw) : {}
     })
   }
 
diff --git a/dolphinscheduler-ui/src/layouts/content/use-dataList.ts b/dolphinscheduler-ui/src/layouts/content/use-dataList.ts
index 8085e925e3..1815fb524a 100644
--- a/dolphinscheduler-ui/src/layouts/content/use-dataList.ts
+++ b/dolphinscheduler-ui/src/layouts/content/use-dataList.ts
@@ -102,10 +102,12 @@ export function useDataList() {
         icon: renderIcon(ProfileOutlined),
         children: [
           {
-            label: t('menu.project_overview') + (projectName? `[${projectName}]` : ''),
+            label:
+              t('menu.project_overview') +
+              (projectName ? `[${projectName}]` : ''),
             key: `/projects/${projectCode}`,
             icon: renderIcon(FundProjectionScreenOutlined),
-            payload: {projectName:projectName}
+            payload: { projectName: projectName }
           },
           {
             label: t('menu.workflow'),
@@ -115,17 +117,22 @@ export function useDataList() {
               {
                 label: t('menu.workflow_relation'),
                 key: `/projects/${projectCode}/workflow/relation`,
-                payload: {projectName:projectName}
+                payload: { projectName: projectName }
               },
               {
                 label: t('menu.workflow_definition'),
                 key: `/projects/${projectCode}/workflow-definition`,
-                payload: {projectName:projectName}
+                payload: { projectName: projectName }
               },
               {
                 label: t('menu.workflow_instance'),
                 key: `/projects/${projectCode}/workflow/instances`,
-                payload: {projectName:projectName}
+                payload: { projectName: projectName }
+              },
+              {
+                label: t('menu.workflow_timing'),
+                key: `/projects/${projectCode}/workflow/timings`,
+                payload: { projectName: projectName }
               }
             ]
           },
@@ -137,12 +144,12 @@ export function useDataList() {
               {
                 label: t('menu.task_definition'),
                 key: `/projects/${projectCode}/task/definitions`,
-                payload: {projectName:projectName}
+                payload: { projectName: projectName }
               },
               {
                 label: t('menu.task_instance'),
                 key: `/projects/${projectCode}/task/instances`,
-                payload: {projectName:projectName}
+                payload: { projectName: projectName }
               }
             ]
           }
diff --git a/dolphinscheduler-ui/src/locales/en_US/datasource.ts b/dolphinscheduler-ui/src/locales/en_US/datasource.ts
index d054714410..b38b0ecc45 100644
--- a/dolphinscheduler-ui/src/locales/en_US/datasource.ts
+++ b/dolphinscheduler-ui/src/locales/en_US/datasource.ts
@@ -90,10 +90,10 @@ export default {
   clientSecret: 'ClientSecret',
   OAuth_token_endpoint: 'OAuth 2.0 token endpoint',
   endpoint_tips: 'Please enter OAuth Token',
-  AccessKeyID:'AccessKeyID',
-  AccessKeyID_tips:'Please input AccessKeyID',
-  SecretAccessKey:'SecretAccessKey',
-  SecretAccessKey_tips:'Please input SecretAccessKey',
-  dbUser:'DbUser',
-  dbUser_tips:'Please input DbUser',
+  AccessKeyID: 'AccessKeyID',
+  AccessKeyID_tips: 'Please input AccessKeyID',
+  SecretAccessKey: 'SecretAccessKey',
+  SecretAccessKey_tips: 'Please input SecretAccessKey',
+  dbUser: 'DbUser',
+  dbUser_tips: 'Please input DbUser'
 }
diff --git a/dolphinscheduler-ui/src/locales/en_US/input-search.ts b/dolphinscheduler-ui/src/locales/en_US/input-search.ts
index 8708fe2707..245851d8e3 100644
--- a/dolphinscheduler-ui/src/locales/en_US/input-search.ts
+++ b/dolphinscheduler-ui/src/locales/en_US/input-search.ts
@@ -16,5 +16,5 @@
  */
 
 export default {
-    placeholder: 'Please enter keyword'
-}
\ No newline at end of file
+  placeholder: 'Please enter keyword'
+}
diff --git a/dolphinscheduler-ui/src/locales/en_US/menu.ts b/dolphinscheduler-ui/src/locales/en_US/menu.ts
index 852c9ba302..1a49c561c7 100644
--- a/dolphinscheduler-ui/src/locales/en_US/menu.ts
+++ b/dolphinscheduler-ui/src/locales/en_US/menu.ts
@@ -27,6 +27,7 @@ export default {
   workflow: 'Workflow',
   workflow_definition: 'Workflow Definition',
   workflow_instance: 'Workflow Instance',
+  workflow_timing: 'Workflow Timing',
   task: 'Task',
   task_instance: 'Task Instance',
   task_definition: 'Task Definition',
@@ -57,5 +58,5 @@ export default {
   data_quality: 'Data Quality',
   task_result: 'Task Result',
   rule: 'Rule management',
-  ui_setting: 'UI Setting',
+  ui_setting: 'UI Setting'
 }
diff --git a/dolphinscheduler-ui/src/locales/en_US/project.ts b/dolphinscheduler-ui/src/locales/en_US/project.ts
index f6e072960e..9c54ac348e 100644
--- a/dolphinscheduler-ui/src/locales/en_US/project.ts
+++ b/dolphinscheduler-ui/src/locales/en_US/project.ts
@@ -65,6 +65,7 @@ export default {
     workflow_publish_status: 'Workflow Publish Status',
     schedule_publish_status: 'Schedule Publish Status',
     workflow_definition: 'Workflow Definition',
+    workflow_timing: 'Workflow Timing',
     workflow_instance: 'Workflow Instance',
     status: 'Status',
     create_time: 'Create Time',
@@ -82,7 +83,7 @@ export default {
     copy_workflow: 'Copy Workflow',
     copy_workflow_name: 'Copy workflow name',
     visit_workflow_instances: 'Visit workflow instances',
-    cron_manage: 'Cron manage',
+    cron_manage: 'Timing Management',
     delete: 'Delete',
     tree_view: 'Tree View',
     tree_limit: 'Limit Size',
diff --git a/dolphinscheduler-ui/src/locales/en_US/resource.ts b/dolphinscheduler-ui/src/locales/en_US/resource.ts
index ffbe9bb5e0..9df7d6fce2 100644
--- a/dolphinscheduler-ui/src/locales/en_US/resource.ts
+++ b/dolphinscheduler-ui/src/locales/en_US/resource.ts
@@ -59,7 +59,7 @@ export default {
     udf_resources: 'UDF resources',
     upload_udf_resources: 'Upload UDF Resources',
     udf_source_name: 'UDF Resource Name',
-    user_name: 'Resource userName',
+    user_name: 'Resource userName'
   },
   function: {
     udf_function: 'UDF Function',
diff --git a/dolphinscheduler-ui/src/locales/en_US/security.ts b/dolphinscheduler-ui/src/locales/en_US/security.ts
index 4318cdb0c8..8c55ff7ef3 100644
--- a/dolphinscheduler-ui/src/locales/en_US/security.ts
+++ b/dolphinscheduler-ui/src/locales/en_US/security.ts
@@ -152,7 +152,7 @@ export default {
     namespace: 'Namespace',
     revoke_auth: 'Revoke',
     grant_read: 'Grant Read',
-    grant_all:'Grant All',
+    grant_all: 'Grant All',
     authorize_project: 'Project Authorize',
     authorize_resource: 'Resource Authorize',
     authorize_namespace: 'Namespace Authorize',
diff --git a/dolphinscheduler-ui/src/locales/zh_CN/datasource.ts b/dolphinscheduler-ui/src/locales/zh_CN/datasource.ts
index e3daf608fa..c66bd99522 100644
--- a/dolphinscheduler-ui/src/locales/zh_CN/datasource.ts
+++ b/dolphinscheduler-ui/src/locales/zh_CN/datasource.ts
@@ -87,10 +87,10 @@ export default {
   clientSecret: 'ClientSecret',
   OAuth_token_endpoint: 'OAuth 2.0 token endpoint',
   endpoint_tips: '请输入OAuth',
-  AccessKeyID:'AccessKeyID',
-  AccessKeyID_tips:'请输入AccessKeyID',
-  SecretAccessKey:'SecretAccessKey',
-  SecretAccessKey_tips:'请输入SecretAccessKey',
-  dbUser:'DbUser',
-  dbUser_tips:'请输入DbUser',
+  AccessKeyID: 'AccessKeyID',
+  AccessKeyID_tips: '请输入AccessKeyID',
+  SecretAccessKey: 'SecretAccessKey',
+  SecretAccessKey_tips: '请输入SecretAccessKey',
+  dbUser: 'DbUser',
+  dbUser_tips: '请输入DbUser'
 }
diff --git a/dolphinscheduler-ui/src/locales/zh_CN/input-search.ts b/dolphinscheduler-ui/src/locales/zh_CN/input-search.ts
index 699c215ade..cd7e38de42 100644
--- a/dolphinscheduler-ui/src/locales/zh_CN/input-search.ts
+++ b/dolphinscheduler-ui/src/locales/zh_CN/input-search.ts
@@ -16,5 +16,5 @@
  */
 
 export default {
-    placeholder: '请输入关键词'
-}
\ No newline at end of file
+  placeholder: '请输入关键词'
+}
diff --git a/dolphinscheduler-ui/src/locales/zh_CN/menu.ts b/dolphinscheduler-ui/src/locales/zh_CN/menu.ts
index 885cec6c17..a29be34687 100644
--- a/dolphinscheduler-ui/src/locales/zh_CN/menu.ts
+++ b/dolphinscheduler-ui/src/locales/zh_CN/menu.ts
@@ -28,6 +28,7 @@ export default {
   workflow: '工作流',
   workflow_definition: '工作流定义',
   workflow_instance: '工作流实例',
+  workflow_timing: '工作流定时',
   task: '任务',
   task_instance: '任务实例',
   task_definition: '任务定义',
diff --git a/dolphinscheduler-ui/src/locales/zh_CN/project.ts b/dolphinscheduler-ui/src/locales/zh_CN/project.ts
index ccb68b80aa..ba37e6e282 100644
--- a/dolphinscheduler-ui/src/locales/zh_CN/project.ts
+++ b/dolphinscheduler-ui/src/locales/zh_CN/project.ts
@@ -66,6 +66,7 @@ export default {
     schedule_publish_status: '定时状态',
     workflow_definition: '工作流定义',
     workflow_instance: '工作流实例',
+    workflow_timing: '工作流定时',
     status: '状态',
     create_time: '创建时间',
     update_time: '更新时间',
diff --git a/dolphinscheduler-ui/src/locales/zh_CN/security.ts b/dolphinscheduler-ui/src/locales/zh_CN/security.ts
index 995293ec68..5eeace0155 100644
--- a/dolphinscheduler-ui/src/locales/zh_CN/security.ts
+++ b/dolphinscheduler-ui/src/locales/zh_CN/security.ts
@@ -150,7 +150,7 @@ export default {
     namespace: '命名空间',
     revoke_auth: '撤销权限',
     grant_read: '授予读权限',
-    grant_all:'授予所有权限',
+    grant_all: '授予所有权限',
     authorize_project: '项目授权',
     authorize_resource: '资源授权',
     authorize_namespace: '命名空间授权',
diff --git a/dolphinscheduler-ui/src/router/modules/projects.ts b/dolphinscheduler-ui/src/router/modules/projects.ts
index 39f0b144f2..e0b05b051d 100644
--- a/dolphinscheduler-ui/src/router/modules/projects.ts
+++ b/dolphinscheduler-ui/src/router/modules/projects.ts
@@ -111,6 +111,17 @@ export default {
         auth: []
       }
     },
+    {
+      path: '/projects/:projectCode/workflow/timings',
+      name: 'workflow-timing-list',
+      component: components['projects-workflow-timing'],
+      meta: {
+        title: '工作流定时管理',
+        activeMenu: 'projects',
+        showSide: true,
+        auth: []
+      }
+    },
     {
       path: '/projects/:projectCode/workflow/instances',
       name: 'workflow-instance-list',
diff --git a/dolphinscheduler-ui/src/service/modules/data-source/types.ts b/dolphinscheduler-ui/src/service/modules/data-source/types.ts
index ab3dc1ed07..b445c974c8 100644
--- a/dolphinscheduler-ui/src/service/modules/data-source/types.ts
+++ b/dolphinscheduler-ui/src/service/modules/data-source/types.ts
@@ -37,23 +37,23 @@ type IDataBase =
   | 'SNOWFLAKE'
 
 type IDataBaseLabel =
-| 'MYSQL'
-| 'POSTGRESQL'
-| 'HIVE'
-| 'SPARK'
-| 'CLICKHOUSE'
-| 'ORACLE'
-| 'SQLSERVER'
-| 'DB2'
-| 'PRESTO'
-| 'REDSHIFT'
-| 'ATHENA'
-| 'TRINO'
-| 'AZURESQL'
-| 'STARROCKS'
-| 'DAMENG'
-| 'OCEANBASE'
-| 'SSH'
+  | 'MYSQL'
+  | 'POSTGRESQL'
+  | 'HIVE'
+  | 'SPARK'
+  | 'CLICKHOUSE'
+  | 'ORACLE'
+  | 'SQLSERVER'
+  | 'DB2'
+  | 'PRESTO'
+  | 'REDSHIFT'
+  | 'ATHENA'
+  | 'TRINO'
+  | 'AZURESQL'
+  | 'STARROCKS'
+  | 'DAMENG'
+  | 'OCEANBASE'
+  | 'SSH'
 
 interface IDataSource {
   id?: number
diff --git a/dolphinscheduler-ui/src/service/modules/dynamic-dag/index.ts b/dolphinscheduler-ui/src/service/modules/dynamic-dag/index.ts
index c52e763d79..c6818dc57d 100644
--- a/dolphinscheduler-ui/src/service/modules/dynamic-dag/index.ts
+++ b/dolphinscheduler-ui/src/service/modules/dynamic-dag/index.ts
@@ -36,4 +36,4 @@ export function queryDynamicTaskResource(url: string): any {
     url,
     method: 'get'
   })
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/service/modules/login/index.ts b/dolphinscheduler-ui/src/service/modules/login/index.ts
index f6cbc0983b..e426b8330d 100644
--- a/dolphinscheduler-ui/src/service/modules/login/index.ts
+++ b/dolphinscheduler-ui/src/service/modules/login/index.ts
@@ -31,4 +31,4 @@ export function ssoLoginUrl(): any {
     url: '/login/sso',
     method: 'get'
   })
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/service/modules/process-definition/index.ts b/dolphinscheduler-ui/src/service/modules/process-definition/index.ts
index 6b16e560e2..8adc0441ac 100644
--- a/dolphinscheduler-ui/src/service/modules/process-definition/index.ts
+++ b/dolphinscheduler-ui/src/service/modules/process-definition/index.ts
@@ -248,10 +248,12 @@ export function viewTree(
   })
 }
 
-export function viewProcessDefinitionVariables(code: number, processCode: number): any {
+export function viewProcessDefinitionVariables(
+  code: number,
+  processCode: number
+): any {
   return axios({
     url: `/projects/${code}/process-definition/${processCode}/view-variables`,
     method: 'get'
   })
 }
-
diff --git a/dolphinscheduler-ui/src/service/modules/process-instances/index.ts b/dolphinscheduler-ui/src/service/modules/process-instances/index.ts
index dd02b1eff4..be8c019600 100644
--- a/dolphinscheduler-ui/src/service/modules/process-instances/index.ts
+++ b/dolphinscheduler-ui/src/service/modules/process-instances/index.ts
@@ -130,4 +130,3 @@ export function viewVariables(id: number, code: number): any {
     method: 'get'
   })
 }
-
diff --git a/dolphinscheduler-ui/src/service/modules/projects/index.ts b/dolphinscheduler-ui/src/service/modules/projects/index.ts
index e426d47f5e..e8c5e43ae3 100644
--- a/dolphinscheduler-ui/src/service/modules/projects/index.ts
+++ b/dolphinscheduler-ui/src/service/modules/projects/index.ts
@@ -16,7 +16,13 @@
  */
 
 import { axios } from '@/service/service'
-import { ListReq, ListIdReq, ProjectsReq, UserIdReq, UpdateProjectsReq } from './types'
+import {
+  ListReq,
+  ListIdReq,
+  ProjectsReq,
+  UserIdReq,
+  UpdateProjectsReq
+} from './types'
 
 export function queryProjectListPaging(params: ListReq): any {
   return axios({
@@ -26,7 +32,9 @@ export function queryProjectListPaging(params: ListReq): any {
   })
 }
 
-export function queryProjectWithAuthorizedLevelListPaging(params: ListIdReq): any {
+export function queryProjectWithAuthorizedLevelListPaging(
+  params: ListIdReq
+): any {
   return axios({
     url: '/projects/project-with-authorized-level-list-paging',
     method: 'get',
diff --git a/dolphinscheduler-ui/src/service/modules/resources/index.ts b/dolphinscheduler-ui/src/service/modules/resources/index.ts
index 2081ad292e..dddfa3912a 100644
--- a/dolphinscheduler-ui/src/service/modules/resources/index.ts
+++ b/dolphinscheduler-ui/src/service/modules/resources/index.ts
@@ -45,9 +45,7 @@ export function queryResourceListPaging(
   })
 }
 
-export function queryBaseDir(
-    params: ResourceTypeReq
-): any {
+export function queryBaseDir(params: ResourceTypeReq): any {
   return axios({
     url: '/resources/base-dir',
     method: 'get',
@@ -56,20 +54,20 @@ export function queryBaseDir(
 }
 
 export function queryCurrentResourceByFileName(
-  params: ResourceTypeReq & FileNameReq & TenantCodeReq,
+  params: ResourceTypeReq & FileNameReq & TenantCodeReq
 ): any {
   return axios({
-    url: `/resources/query-file-name`,
+    url: '/resources/query-file-name',
     method: 'get',
     params
   })
 }
 
 export function queryCurrentResourceByFullName(
-  params: ResourceTypeReq & FullNameReq & TenantCodeReq,
+  params: ResourceTypeReq & FullNameReq & TenantCodeReq
 ): any {
   return axios({
-    url: `/resources/query-full-name`,
+    url: '/resources/query-full-name',
     method: 'get',
     params
   })
@@ -195,21 +193,19 @@ export function verifyResourceName(params: FullNameReq & ResourceTypeReq): any {
   })
 }
 
-export function doesResourceExist(
-  params: FullNameReq & ResourceTypeReq,
-): any {
+export function doesResourceExist(params: FullNameReq & ResourceTypeReq): any {
   return axios({
-    url: `/resources/verify-name`,
+    url: '/resources/verify-name',
     method: 'get',
     params
   })
 }
 
 export function updateResource(
-  data: NameReq & ResourceTypeReq & DescriptionReq & FullNameReq & TenantCodeReq,
+  data: NameReq & ResourceTypeReq & DescriptionReq & FullNameReq & TenantCodeReq
 ): any {
   return axios({
-    url: `/resources`,
+    url: '/resources',
     method: 'put',
     data
   })
@@ -217,14 +213,14 @@ export function updateResource(
 
 export function deleteResource(params: FullNameReq & TenantCodeReq): any {
   return axios({
-    url: `/resources`,
+    url: '/resources',
     method: 'delete',
     params
   })
 }
 
 export function downloadResource(params: FullNameReq): void {
-  utils.downloadFile(`resources/download`, params)
+  utils.downloadFile('resources/download', params)
 }
 
 export function viewUIUdfFunction(id: IdReq): any {
@@ -234,36 +230,35 @@ export function viewUIUdfFunction(id: IdReq): any {
   })
 }
 
-export function updateResourceContent(data: ContentReq & TenantCodeReq & FullNameReq): any {
+export function updateResourceContent(
+  data: ContentReq & TenantCodeReq & FullNameReq
+): any {
   return axios({
-    url: `/resources/update-content`,
+    url: '/resources/update-content',
     method: 'put',
     data
   })
 }
 
-export function viewResource(params: ViewResourceReq & FullNameReq & TenantCodeReq): any {
+export function viewResource(
+  params: ViewResourceReq & FullNameReq & TenantCodeReq
+): any {
   return axios({
-    url: `/resources/view`,
+    url: '/resources/view',
     method: 'get',
     params
   })
 }
 
-export function createUdfFunc(
-  data: UdfFuncReq
-): any {
+export function createUdfFunc(data: UdfFuncReq): any {
   return axios({
-    url: `/resources/udf-func`,
+    url: '/resources/udf-func',
     method: 'post',
     data
   })
 }
 
-export function updateUdfFunc(
-  data: UdfFuncReq,
-  id: number
-): any {
+export function updateUdfFunc(data: UdfFuncReq, id: number): any {
   return axios({
     url: `/resources/udf-func/${id}`,
     method: 'put',
diff --git a/dolphinscheduler-ui/src/service/modules/resources/types.ts b/dolphinscheduler-ui/src/service/modules/resources/types.ts
index 35c12043c5..0da764ccfa 100644
--- a/dolphinscheduler-ui/src/service/modules/resources/types.ts
+++ b/dolphinscheduler-ui/src/service/modules/resources/types.ts
@@ -36,7 +36,7 @@ interface FileNameReq {
   fileName: string
 }
 
-interface TenantCodeReq{
+interface TenantCodeReq {
   tenantCode: string
 }
 
diff --git a/dolphinscheduler-ui/src/service/modules/schedules/types.ts b/dolphinscheduler-ui/src/service/modules/schedules/types.ts
index e6ac46a00e..8c7c3d346e 100644
--- a/dolphinscheduler-ui/src/service/modules/schedules/types.ts
+++ b/dolphinscheduler-ui/src/service/modules/schedules/types.ts
@@ -34,7 +34,7 @@ interface ListReq {
 }
 
 interface ProcessDefinitionCodeReq {
-  processDefinitionCode: number
+  processDefinitionCode?: number
 }
 
 interface ScheduleReq {
diff --git a/dolphinscheduler-ui/src/service/modules/task-instances/index.ts b/dolphinscheduler-ui/src/service/modules/task-instances/index.ts
index 9100ab8136..3e8b9c4e1a 100644
--- a/dolphinscheduler-ui/src/service/modules/task-instances/index.ts
+++ b/dolphinscheduler-ui/src/service/modules/task-instances/index.ts
@@ -55,7 +55,10 @@ export function savePoint(projectCode: number, taskId: number): any {
   })
 }
 
-export function removeTaskInstanceCache(projectCode: number, taskId: number): any {
+export function removeTaskInstanceCache(
+  projectCode: number,
+  taskId: number
+): any {
   return axios({
     url: `projects/${projectCode}/task-instances/${taskId}/remove-cache`,
     method: 'delete'
diff --git a/dolphinscheduler-ui/src/store/project/dynamic/dag.ts b/dolphinscheduler-ui/src/store/project/dynamic/dag.ts
index 348a0e7f46..b6a698ac8d 100644
--- a/dolphinscheduler-ui/src/store/project/dynamic/dag.ts
+++ b/dolphinscheduler-ui/src/store/project/dynamic/dag.ts
@@ -34,4 +34,4 @@ export const useDagStore = defineStore({
       this.tasks = tasks
     }
   }
-})
\ No newline at end of file
+})
diff --git a/dolphinscheduler-ui/src/store/project/dynamic/types.ts b/dolphinscheduler-ui/src/store/project/dynamic/types.ts
index d3560b1484..f6f4b2f3b0 100644
--- a/dolphinscheduler-ui/src/store/project/dynamic/types.ts
+++ b/dolphinscheduler-ui/src/store/project/dynamic/types.ts
@@ -19,4 +19,4 @@ interface DagStore {
   tasks: Array<any>
 }
 
-export { DagStore }
\ No newline at end of file
+export { DagStore }
diff --git a/dolphinscheduler-ui/src/utils/environmental-distinction.ts b/dolphinscheduler-ui/src/utils/environmental-distinction.ts
index 6882464604..3c05f08256 100644
--- a/dolphinscheduler-ui/src/utils/environmental-distinction.ts
+++ b/dolphinscheduler-ui/src/utils/environmental-distinction.ts
@@ -15,31 +15,30 @@
  * limitations under the License.
  */
 
-import {h} from "vue";
-import {NTag} from "naive-ui";
+import { h } from 'vue'
+import { NTag } from 'naive-ui'
 
 export function renderEnvironmentalDistinctionCell(
-    testFlag: number | undefined,
-    t: Function
+  testFlag: number | undefined,
+  t: Function
 ) {
-    if (testFlag === 0) {
-        return h(
-            NTag,
-            { type: 'success', size: 'small' },
-            {
-                default: () => t('datasource.on_line')
-            }
-        )
-    } else if (testFlag === 1) {
-        return h(
-            NTag,
-            { type: 'warning', size: 'small' },
-            {
-                default: () => t('datasource.test')
-            }
-        )
-    } else {
-        return '-'
-    }
+  if (testFlag === 0) {
+    return h(
+      NTag,
+      { type: 'success', size: 'small' },
+      {
+        default: () => t('datasource.on_line')
+      }
+    )
+  } else if (testFlag === 1) {
+    return h(
+      NTag,
+      { type: 'warning', size: 'small' },
+      {
+        default: () => t('datasource.test')
+      }
+    )
+  } else {
+    return '-'
+  }
 }
-
diff --git a/dolphinscheduler-ui/src/utils/tree-format.ts b/dolphinscheduler-ui/src/utils/tree-format.ts
index 9168ead429..10db893dc8 100644
--- a/dolphinscheduler-ui/src/utils/tree-format.ts
+++ b/dolphinscheduler-ui/src/utils/tree-format.ts
@@ -16,7 +16,12 @@
  */
 
 const removeUselessChildren = (
-  list: { children?: []; directory?: boolean; disabled?: boolean; dirctory?: boolean }[]
+  list: {
+    children?: []
+    directory?: boolean
+    disabled?: boolean
+    dirctory?: boolean
+  }[]
 ) => {
   if (!list.length) return
   list.forEach((item) => {
diff --git a/dolphinscheduler-ui/src/views/data-quality/rule/index.tsx b/dolphinscheduler-ui/src/views/data-quality/rule/index.tsx
index 879820dce6..99f164018f 100644
--- a/dolphinscheduler-ui/src/views/data-quality/rule/index.tsx
+++ b/dolphinscheduler-ui/src/views/data-quality/rule/index.tsx
@@ -22,7 +22,7 @@ import {
   ref,
   toRefs
 } from 'vue'
-import {NSpace, NButton, NIcon, NDataTable, NPagination} from 'naive-ui'
+import { NSpace, NButton, NIcon, NDataTable, NPagination } from 'naive-ui'
 import { SearchOutlined } from '@vicons/antd'
 import { useTable } from './use-table'
 import Card from '@/components/card'
@@ -113,11 +113,7 @@ const TaskResult = defineComponent({
               placeholder={t('data_quality.rule.name')}
               onSearch={onSearch}
             />
-            <NButton
-              size='small'
-              type='primary'
-              onClick={onSearch}
-            >
+            <NButton size='small' type='primary' onClick={onSearch}>
               <NIcon>
                 <SearchOutlined />
               </NIcon>
diff --git a/dolphinscheduler-ui/src/views/data-quality/task-result/index.tsx b/dolphinscheduler-ui/src/views/data-quality/task-result/index.tsx
index ab42fcd51b..f3bdc0f8f3 100644
--- a/dolphinscheduler-ui/src/views/data-quality/task-result/index.tsx
+++ b/dolphinscheduler-ui/src/views/data-quality/task-result/index.tsx
@@ -91,9 +91,9 @@ const TaskResult = defineComponent({
         <Card>
           <NSpace justify='end'>
             <Search
-                v-model:value={this.searchVal}
-                placeholder={t('data_quality.task_result.task_name')}
-                onSearch={onSearch}
+              v-model:value={this.searchVal}
+              placeholder={t('data_quality.task_result.task_name')}
+              onSearch={onSearch}
             />
             <NSelect
               v-model={[this.ruleType, 'value']}
diff --git a/dolphinscheduler-ui/src/views/datasource/list/detail.tsx b/dolphinscheduler-ui/src/views/datasource/list/detail.tsx
index 6888dbfb5b..7edd16f7c2 100644
--- a/dolphinscheduler-ui/src/views/datasource/list/detail.tsx
+++ b/dolphinscheduler-ui/src/views/datasource/list/detail.tsx
@@ -108,7 +108,8 @@ const DetailModal = defineComponent({
       () => props.show,
       async () => {
         state.detailForm.type = props.selectType
-        state.detailForm.label = props.selectType === 'HIVE' ? 'HIVE/IMPALA' :  props.selectType
+        state.detailForm.label =
+          props.selectType === 'HIVE' ? 'HIVE/IMPALA' : props.selectType
         props.show &&
           state.detailForm.type &&
           (await changeType(
@@ -116,7 +117,9 @@ const DetailModal = defineComponent({
             datasourceType[state.detailForm.type]
           ))
         props.show && props.id && setFieldsValue(await queryById(props.id))
-        props.show && state.detailForm.testFlag == 0 && await getSameTypeTestDataSource()
+        props.show &&
+          state.detailForm.testFlag == 0 &&
+          (await getSameTypeTestDataSource())
       }
     )
 
@@ -124,12 +127,13 @@ const DetailModal = defineComponent({
       () => props.selectType,
       async () => {
         state.detailForm.type = props.selectType
-        state.detailForm.label = props.selectType === 'HIVE' ? 'HIVE/IMPALA' :  props.selectType
+        state.detailForm.label =
+          props.selectType === 'HIVE' ? 'HIVE/IMPALA' : props.selectType
         state.detailForm.type &&
-        (await changeType(
-          state.detailForm.type,
-          datasourceType[state.detailForm.type]
-        ))
+          (await changeType(
+            state.detailForm.type,
+            datasourceType[state.detailForm.type]
+          ))
       }
     )
 
@@ -205,8 +209,18 @@ const DetailModal = defineComponent({
                   show-require-mark
                 >
                   <div class={[styles.typeBox, !!id && styles.disabledBox]}>
-                    <div v-model={[detailForm.type, 'value']}>{detailForm.label}</div>
-                    <div class={[styles['text-color'], 'btn-data-source-type-drop-down']} onClick={handleSourceModalOpen}>{t('datasource.select')}</div>
+                    <div v-model={[detailForm.type, 'value']}>
+                      {detailForm.label}
+                    </div>
+                    <div
+                      class={[
+                        styles['text-color'],
+                        'btn-data-source-type-drop-down'
+                      ]}
+                      onClick={handleSourceModalOpen}
+                    >
+                      {t('datasource.select')}
+                    </div>
                   </div>
                 </NFormItem>
                 <NFormItem
@@ -290,14 +304,18 @@ const DetailModal = defineComponent({
                 </NFormItem>
                 {/* 验证条件选择 */}
                 <NFormItem
-                    v-show={showMode}
-                    label={t('datasource.validation')}
-                    path='mode'
-                    show-require-mark
+                  v-show={showMode}
+                  label={t('datasource.validation')}
+                  path='mode'
+                  show-require-mark
                 >
                   <NSelect
-                   v-model={[detailForm.mode, 'value']}
-                   options={detailForm.type === 'REDSHIFT' ? redShitModeOptions : modeOptions}
+                    v-model={[detailForm.mode, 'value']}
+                    options={
+                      detailForm.type === 'REDSHIFT'
+                        ? redShitModeOptions
+                        : modeOptions
+                    }
                   ></NSelect>
                 </NFormItem>
                 {/* SqlPassword */}
@@ -329,7 +347,9 @@ const DetailModal = defineComponent({
                 </NFormItem>
                 {/* ActiveDirectoryPassword */}
                 <NFormItem
-                  v-show={showMode && detailForm.mode === 'ActiveDirectoryPassword'}
+                  v-show={
+                    showMode && detailForm.mode === 'ActiveDirectoryPassword'
+                  }
                   label={t('datasource.Azure_AD_username')}
                   path='userName'
                   show-require-mark
@@ -342,7 +362,9 @@ const DetailModal = defineComponent({
                   />
                 </NFormItem>
                 <NFormItem
-                  v-show={showMode && detailForm.mode === 'ActiveDirectoryPassword'}
+                  v-show={
+                    showMode && detailForm.mode === 'ActiveDirectoryPassword'
+                  }
                   label={t('datasource.Azure_AD_password')}
                   path='password'
                   show-require-mark
@@ -369,7 +391,10 @@ const DetailModal = defineComponent({
                 </NFormItem>
                 {/* ActiveDirectoryServicePrincipal */}
                 <NFormItem
-                  v-show={showMode && detailForm.mode === 'ActiveDirectoryServicePrincipal'}
+                  v-show={
+                    showMode &&
+                    detailForm.mode === 'ActiveDirectoryServicePrincipal'
+                  }
                   label={t('datasource.clientId')}
                   path='userName'
                   show-require-mark
@@ -382,7 +407,10 @@ const DetailModal = defineComponent({
                   />
                 </NFormItem>
                 <NFormItem
-                  v-show={showMode && detailForm.mode === 'ActiveDirectoryServicePrincipal'}
+                  v-show={
+                    showMode &&
+                    detailForm.mode === 'ActiveDirectoryServicePrincipal'
+                  }
                   label={t('datasource.clientSecret')}
                   path='password'
                   show-require-mark
@@ -528,17 +556,17 @@ const DetailModal = defineComponent({
                   />
                 </NFormItem>
                 <NFormItem
-                    v-show={showAwsRegion}
-                    label={t('datasource.aws_region')}
-                    path='awsRegion'
-                    show-require-mark
+                  v-show={showAwsRegion}
+                  label={t('datasource.aws_region')}
+                  path='awsRegion'
+                  show-require-mark
                 >
                   <NInput
-                      allowInput={this.trim}
-                      v-model={[detailForm.awsRegion, 'value']}
-                      type='text'
-                      maxlength={60}
-                      placeholder={t('datasource.aws_region_tips')}
+                    allowInput={this.trim}
+                    v-model={[detailForm.awsRegion, 'value']}
+                    type='text'
+                    maxlength={60}
+                    placeholder={t('datasource.aws_region_tips')}
                   />
                 </NFormItem>
                 <NFormItem
@@ -557,19 +585,19 @@ const DetailModal = defineComponent({
                   />
                 </NFormItem>
                 {detailForm.type === 'SNOWFLAKE' && (
-                      <NFormItem
-                          label={t('datasource.datawarehouse')}
-                          path='datawarehouse'
-                          show-require-mark
-                      >
-                          <NInput
-                              allowInput={this.trim}
-                              class='input-datawarehouse'
-                              v-model={[detailForm.datawarehouse, 'value']}
-                              maxlength={60}
-                              placeholder={t('datasource.datawarehouse_tips')}
-                          />
-                      </NFormItem>
+                  <NFormItem
+                    label={t('datasource.datawarehouse')}
+                    path='datawarehouse'
+                    show-require-mark
+                  >
+                    <NInput
+                      allowInput={this.trim}
+                      class='input-datawarehouse'
+                      v-model={[detailForm.datawarehouse, 'value']}
+                      maxlength={60}
+                      placeholder={t('datasource.datawarehouse_tips')}
+                    />
+                  </NFormItem>
                 )}
                 <NFormItem
                   v-show={showConnectType}
@@ -655,16 +683,16 @@ const DetailModal = defineComponent({
                   />
                 </NFormItem>
                 <NFormItem
-                    v-show={showPublicKey}
-                    label='PublicKey'
-                    path='publicKey'
+                  v-show={showPublicKey}
+                  label='PublicKey'
+                  path='publicKey'
                 >
                   <NInput
-                      v-model={[detailForm.publicKey, 'value']}
-                      type='textarea'
-                      autosize={{
-                        minRows: 4
-                      }}
+                    v-model={[detailForm.publicKey, 'value']}
+                    type='textarea'
+                    autosize={{
+                      minRows: 4
+                    }}
                   />
                 </NFormItem>
               </NForm>
diff --git a/dolphinscheduler-ui/src/views/datasource/list/use-columns.ts b/dolphinscheduler-ui/src/views/datasource/list/use-columns.ts
index e0a016014e..6812a99cf1 100644
--- a/dolphinscheduler-ui/src/views/datasource/list/use-columns.ts
+++ b/dolphinscheduler-ui/src/views/datasource/list/use-columns.ts
@@ -34,7 +34,7 @@ import {
   calculateTableWidth,
   DefaultTableWidth
 } from '@/common/column-width-config'
-import {renderEnvironmentalDistinctionCell} from "@/utils/environmental-distinction";
+import { renderEnvironmentalDistinctionCell } from '@/utils/environmental-distinction'
 
 export function useColumns(onCallback: Function) {
   const { t } = useI18n()
@@ -118,7 +118,8 @@ export function useColumns(onCallback: Function) {
                       circle: true,
                       type: 'info',
                       size: 'small',
-                      onClick: () => void onCallback(rowData.id, 'edit', rowData)
+                      onClick: () =>
+                        void onCallback(rowData.id, 'edit', rowData)
                     },
                     {
                       default: () =>
diff --git a/dolphinscheduler-ui/src/views/datasource/list/use-form.ts b/dolphinscheduler-ui/src/views/datasource/list/use-form.ts
index daae30c745..fa856d6b8d 100644
--- a/dolphinscheduler-ui/src/views/datasource/list/use-form.ts
+++ b/dolphinscheduler-ui/src/views/datasource/list/use-form.ts
@@ -220,25 +220,25 @@ export function useForm(id?: number) {
     } as FormRules,
     modeOptions: [
       {
-        label: "SqlPassword",
-        value: 'SqlPassword',
+        label: 'SqlPassword',
+        value: 'SqlPassword'
       },
       {
-        label: "ActiveDirectoryPassword",
-        value: 'ActiveDirectoryPassword',
+        label: 'ActiveDirectoryPassword',
+        value: 'ActiveDirectoryPassword'
       },
       {
-        label: "ActiveDirectoryMSI",
-        value: 'ActiveDirectoryMSI',
+        label: 'ActiveDirectoryMSI',
+        value: 'ActiveDirectoryMSI'
       },
       {
-        label: "ActiveDirectoryServicePrincipal",
-        value: 'ActiveDirectoryServicePrincipal',
+        label: 'ActiveDirectoryServicePrincipal',
+        value: 'ActiveDirectoryServicePrincipal'
       },
       {
-        label: "accessToken",
-        value: 'accessToken',
-      },
+        label: 'accessToken',
+        value: 'accessToken'
+      }
     ],
     redShitModeOptions: [
       {
@@ -256,7 +256,7 @@ export function useForm(id?: number) {
     state.detailForm.port = options.previousPort || options.defaultPort
     state.detailForm.type = type
 
-    state.requiredDataBase = (type !== 'POSTGRESQL' && type !== 'ATHENA')
+    state.requiredDataBase = type !== 'POSTGRESQL' && type !== 'ATHENA'
 
     state.showHost = type !== 'ATHENA'
     state.showPort = type !== 'ATHENA'
@@ -280,12 +280,11 @@ export function useForm(id?: number) {
       state.requiredDataBase = false
       state.showJDBCConnectParameters = false
       state.showPublicKey = true
-    }else {
+    } else {
       state.showDataBaseName = true
       state.requiredDataBase = true
       state.showJDBCConnectParameters = true
       state.showPublicKey = false
-
     }
 
     if (state.detailForm.id === undefined) {
@@ -312,13 +311,13 @@ export function useForm(id?: number) {
     const params = { type: state.detailForm.type, testFlag: 1 } as TypeReq
     const result = await queryDataSourceList(params)
     state.bindTestDataSourceExample = result
-        .filter((value: { label: string; value: string }) => {
-          // @ts-ignore
-          if (state.detailForm.id && state.detailForm.id === value.id)
-            return false
-          return true
-        })
-        .map((TestDataSourceExample: { name: string; id: number }) => ({
+      .filter((value: { label: string; value: string }) => {
+        // @ts-ignore
+        if (state.detailForm.id && state.detailForm.id === value.id)
+          return false
+        return true
+      })
+      .map((TestDataSourceExample: { name: string; id: number }) => ({
         label: TestDataSourceExample.name,
         value: TestDataSourceExample.id
       }))
@@ -338,7 +337,6 @@ export function useForm(id?: number) {
 
   const getFieldsValue = () => state.detailForm
 
-
   return {
     state,
     changeType,
@@ -418,9 +416,9 @@ export const datasourceType: IDataBaseOptionKeys = {
     defaultPort: 1433
   },
   STARROCKS: {
-      value: 'STARROCKS',
-      label: 'STARROCKS',
-      defaultPort: 9030
+    value: 'STARROCKS',
+    label: 'STARROCKS',
+    defaultPort: 9030
   },
   DAMENG: {
     value: 'DAMENG',
diff --git a/dolphinscheduler-ui/src/views/datasource/list/use-table.ts b/dolphinscheduler-ui/src/views/datasource/list/use-table.ts
index 08603a57c7..976bc55ca2 100644
--- a/dolphinscheduler-ui/src/views/datasource/list/use-table.ts
+++ b/dolphinscheduler-ui/src/views/datasource/list/use-table.ts
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import {reactive, ref} from 'vue'
+import { reactive, ref } from 'vue'
 import {
   queryDataSourceListPaging,
   deleteDataSource
diff --git a/dolphinscheduler-ui/src/views/login/index.tsx b/dolphinscheduler-ui/src/views/login/index.tsx
index 85eea54926..aa23755f3b 100644
--- a/dolphinscheduler-ui/src/views/login/index.tsx
+++ b/dolphinscheduler-ui/src/views/login/index.tsx
@@ -15,7 +15,13 @@
  * limitations under the License.
  */
 
-import {defineComponent, getCurrentInstance, onMounted, toRefs, withKeys} from 'vue'
+import {
+  defineComponent,
+  getCurrentInstance,
+  onMounted,
+  toRefs,
+  withKeys
+} from 'vue'
 import styles from './index.module.scss'
 import {
   NInput,
@@ -31,7 +37,7 @@ import { useLogin } from './use-login'
 import { useLocalesStore } from '@/store/locales/locales'
 import { useThemeStore } from '@/store/theme/theme'
 import cookies from 'js-cookie'
-import {ssoLoginUrl} from "@/service/modules/login";
+import { ssoLoginUrl } from '@/service/modules/login'
 
 const login = defineComponent({
   name: 'login',
@@ -57,8 +63,8 @@ const login = defineComponent({
       state.loginForm.ssoLoginUrl = ssoLoginUrlRes
       if (state.loginForm.ssoLoginUrl) {
         const url = new URL(window.location.href)
-        let ssoState = url.searchParams.get('state')
-        let ssoCode = url.searchParams.get('code')
+        const ssoState = url.searchParams.get('state')
+        const ssoCode = url.searchParams.get('code')
         if (ssoState && ssoCode) {
           state.loginForm.userName = ssoState
           state.loginForm.userPassword = ssoCode
@@ -98,7 +104,10 @@ const login = defineComponent({
           <div class={styles.logo}>
             <div class={styles['logo-img']} />
           </div>
-          <div class={styles['form-model']} v-show={this.loginForm.ssoLoginUrl.length === 0}>
+          <div
+            class={styles['form-model']}
+            v-show={this.loginForm.ssoLoginUrl.length === 0}
+          >
             <NForm rules={this.rules} ref='loginFormRef'>
               <NFormItem
                 label={this.t('login.userName')}
@@ -145,14 +154,17 @@ const login = defineComponent({
               {this.t('login.login')}
             </NButton>
           </div>
-          <div class={styles['form-model']} v-show={this.loginForm.ssoLoginUrl.length !== 0}>
-            <a href={this.loginForm.ssoLoginUrl} style="text-decoration:none">
+          <div
+            class={styles['form-model']}
+            v-show={this.loginForm.ssoLoginUrl.length !== 0}
+          >
+            <a href={this.loginForm.ssoLoginUrl} style='text-decoration:none'>
               <NButton
-                  class='btn-login-sso'
-                  round
-                  type='info'
-                  style={{width: '100%', marginTop: '30px'}}
-                  onClick={this.handleLogin}
+                class='btn-login-sso'
+                round
+                type='info'
+                style={{ width: '100%', marginTop: '30px' }}
+                onClick={this.handleLogin}
               >
                 {this.t('login.ssoLogin')}
               </NButton>
diff --git a/dolphinscheduler-ui/src/views/login/use-login.ts b/dolphinscheduler-ui/src/views/login/use-login.ts
index 1fd742c679..b39037aa59 100644
--- a/dolphinscheduler-ui/src/views/login/use-login.ts
+++ b/dolphinscheduler-ui/src/views/login/use-login.ts
@@ -25,7 +25,7 @@ import type { UserInfoRes } from '@/service/modules/users/types'
 import { useRouteStore } from '@/store/route/route'
 import { useTimezoneStore } from '@/store/timezone/timezone'
 import cookies from 'js-cookie'
-import {queryBaseDir} from "@/service/modules/resources";
+import { queryBaseDir } from '@/service/modules/resources'
 
 export function useLogin(state: any) {
   const router: Router = useRouter()
diff --git a/dolphinscheduler-ui/src/views/profile/use-form.ts b/dolphinscheduler-ui/src/views/profile/use-form.ts
index 6f0dd2c0f6..8ed1a0b5e3 100644
--- a/dolphinscheduler-ui/src/views/profile/use-form.ts
+++ b/dolphinscheduler-ui/src/views/profile/use-form.ts
@@ -32,7 +32,7 @@ export function useForm() {
     profileForm: {
       username: userInfo.userName,
       email: userInfo.email,
-      phone: userInfo.phone,
+      phone: userInfo.phone
     },
     saving: false,
     rules: {
@@ -63,7 +63,7 @@ export function useForm() {
     state.profileForm = {
       username: userInfo.userName,
       email: userInfo.email,
-      phone: userInfo.phone,
+      phone: userInfo.phone
     }
   })
 
diff --git a/dolphinscheduler-ui/src/views/projects/list/index.tsx b/dolphinscheduler-ui/src/views/projects/list/index.tsx
index 52ddce4cac..83bcefd5b8 100644
--- a/dolphinscheduler-ui/src/views/projects/list/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/list/index.tsx
@@ -16,13 +16,7 @@
  */
 
 import { SearchOutlined } from '@vicons/antd'
-import {
-  NButton,
-  NDataTable,
-  NIcon,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NDataTable, NIcon, NPagination, NSpace } from 'naive-ui'
 import {
   defineComponent,
   getCurrentInstance,
@@ -33,7 +27,7 @@ import {
 import { useI18n } from 'vue-i18n'
 import { useTable } from './use-table'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 import ProjectModal from './components/project-modal'
 
 const list = defineComponent({
@@ -122,10 +116,10 @@ const list = defineComponent({
             </NButton>
             <NSpace>
               <Search
-                  v-model:value = {this.searchVal}
-                  placeholder={t('project.list.project_tips')}
-                  onSearch={this.handleSearch}
-                  onClear={this.onClearSearch}
+                v-model:value={this.searchVal}
+                placeholder={t('project.list.project_tips')}
+                onSearch={this.handleSearch}
+                onClear={this.onClearSearch}
               />
 
               <NButton size='small' type='primary' onClick={this.handleSearch}>
diff --git a/dolphinscheduler-ui/src/views/projects/list/use-table.ts b/dolphinscheduler-ui/src/views/projects/list/use-table.ts
index a62bd3b5a1..6cc01d3b27 100644
--- a/dolphinscheduler-ui/src/views/projects/list/use-table.ts
+++ b/dolphinscheduler-ui/src/views/projects/list/use-table.ts
@@ -84,7 +84,7 @@ export function useTable() {
               onClick: () => {
                 router.push({
                   path: `/projects/${row.code}`,
-                  query: {projectName: row.name}
+                  query: { projectName: row.name }
                 })
               }
             },
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-cache.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-cache.ts
index 75f2454a13..fd7e90431c 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-cache.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-cache.ts
@@ -19,11 +19,11 @@ import { useI18n } from 'vue-i18n'
 import type { IJsonItem } from '../types'
 
 export function useCache(): IJsonItem {
-    const { t } = useI18n()
-    return {
-        type: 'switch',
-        field: 'isCache',
-        name: t('project.node.is_cache'),
-        span: 12
-    }
+  const { t } = useI18n()
+  return {
+    type: 'switch',
+    field: 'isCache',
+    name: t('project.node.is_cache'),
+    span: 12
+  }
 }
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-custom-labels.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-custom-labels.ts
index 221210b0a9..915fcceab9 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-custom-labels.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-custom-labels.ts
@@ -19,64 +19,64 @@ import { useI18n } from 'vue-i18n'
 import type { IJsonItem } from '../types'
 
 export function useCustomLabels({
-                                    model,
-                                    field,
-                                    name = 'custom_labels',
-                                    span = 24
-                                }: {
-    model: { [field: string]: any }
-    field: string
-    name?: string
-    span?: Ref | number
+  model,
+  field,
+  name = 'custom_labels',
+  span = 24
+}: {
+  model: { [field: string]: any }
+  field: string
+  name?: string
+  span?: Ref | number
 }): IJsonItem[] {
-    const { t } = useI18n()
+  const { t } = useI18n()
 
-    return [
+  return [
+    {
+      type: 'custom-parameters',
+      field: field,
+      name: t(`project.node.${name}`),
+      class: 'btn-custom-parameters',
+      span,
+      children: [
         {
-            type: 'custom-parameters',
-            field: field,
-            name: t(`project.node.${name}`),
-            class: 'btn-custom-parameters',
-            span,
-            children: [
-                {
-                    type: 'input',
-                    field: 'label',
-                    span: 8,
-                    class: 'customized-label-name',
-                    props: {
-                        placeholder: t('project.node.label_name_tips'),
-                        maxLength: 256
-                    },
-                    validate: {
-                        trigger: ['input', 'blur'],
-                        required: true,
-                        validator(validate: any, value: string) {
-                            if (!value) {
-                                return new Error(t('project.node.label_name_tips'))
-                            }
+          type: 'input',
+          field: 'label',
+          span: 8,
+          class: 'customized-label-name',
+          props: {
+            placeholder: t('project.node.label_name_tips'),
+            maxLength: 256
+          },
+          validate: {
+            trigger: ['input', 'blur'],
+            required: true,
+            validator(validate: any, value: string) {
+              if (!value) {
+                return new Error(t('project.node.label_name_tips'))
+              }
 
-                            const sameItems = model[field].filter(
-                                (item: { label: string }) => item.label === value
-                            )
+              const sameItems = model[field].filter(
+                (item: { label: string }) => item.label === value
+              )
 
-                            if (sameItems.length > 1) {
-                                return new Error(t('project.node.label_repeat'))
-                            }
-                        }
-                    }
-                },
-                {
-                    type: 'input',
-                    field: 'value',
-                    span: 14,
-                    class: 'customized-label-value',
-                    props: {
-                        placeholder: t('project.node.label_value_tips'),
-                        maxLength: 256
-                    }
-                }
-            ]
+              if (sameItems.length > 1) {
+                return new Error(t('project.node.label_repeat'))
+              }
+            }
+          }
+        },
+        {
+          type: 'input',
+          field: 'value',
+          span: 14,
+          class: 'customized-label-value',
+          props: {
+            placeholder: t('project.node.label_value_tips'),
+            maxLength: 256
+          }
         }
-    ]
+      ]
+    }
+  ]
 }
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datasource.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datasource.ts
index 6d51276332..46942a526f 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datasource.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datasource.ts
@@ -122,7 +122,7 @@ export function useDatasource(
       id: 16,
       code: 'DATABEND',
       disabled: false
-    },
+    }
   ]
 
   const getDatasourceTypes = async () => {
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datasync.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datasync.ts
index 3288c90d1d..23ccd24d95 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datasync.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datasync.ts
@@ -20,67 +20,66 @@ import { watch, ref } from 'vue'
 import { useCustomParams } from '.'
 
 export function useDatasync(model: { [field: string]: any }): IJsonItem[] {
+  const jsonSpan = ref(0)
+  const destinationLocationArnSpan = ref(0)
+  const sourceLocationArnSpan = ref(0)
+  const nameSpan = ref(0)
+  const cloudWatchLogGroupArnSpan = ref(0)
 
-    const jsonSpan = ref(0)
-    const destinationLocationArnSpan = ref(0)
-    const sourceLocationArnSpan = ref(0)
-    const nameSpan = ref(0)
-    const cloudWatchLogGroupArnSpan = ref(0)
+  const resetSpan = () => {
+    jsonSpan.value = model.jsonFormat ? 24 : 0
+    destinationLocationArnSpan.value = model.jsonFormat ? 0 : 24
+    sourceLocationArnSpan.value = model.jsonFormat ? 0 : 24
+    nameSpan.value = model.jsonFormat ? 0 : 24
+    cloudWatchLogGroupArnSpan.value = model.jsonFormat ? 0 : 24
+  }
 
-    const resetSpan = () => {
-        jsonSpan.value = model.jsonFormat ? 24 : 0
-        destinationLocationArnSpan.value = model.jsonFormat ? 0 : 24
-        sourceLocationArnSpan.value = model.jsonFormat ? 0 : 24
-        nameSpan.value = model.jsonFormat ? 0 : 24
-        cloudWatchLogGroupArnSpan.value = model.jsonFormat ? 0 : 24
+  watch(
+    () => [model.jsonFormat],
+    () => {
+      resetSpan()
     }
+  )
 
-    watch(
-        () => [model.jsonFormat],
-        () => {
-            resetSpan()
-        }
-    )
+  resetSpan()
 
-    resetSpan()
-
-    return [
-        {
-            type: 'switch',
-            field: 'jsonFormat',
-            name: 'jsonFormat',
-            span: 12
-        },
-        {
-            type: 'editor',
-            field: 'json',
-            name: 'json',
-            span: jsonSpan
-        },
-        {
-            type: 'input',
-            field: 'destinationLocationArn',
-            name: 'destinationLocationArn',
-            span: destinationLocationArnSpan
-        },
-        {
-            type: 'input',
-            field: 'sourceLocationArn',
-            name: 'sourceLocationArn',
-            span: sourceLocationArnSpan
-        },
-        {
-            type: 'input',
-            field: 'name',
-            name: 'name',
-            span: nameSpan
-        },
-        {
-            type: 'input',
-            field: 'cloudWatchLogGroupArn',
-            name: 'cloudWatchLogGroupArn',
-            span: cloudWatchLogGroupArnSpan
-        },
-        ...useCustomParams({ model, field: 'localParams', isSimple: false })
-    ]
-}
\ No newline at end of file
+  return [
+    {
+      type: 'switch',
+      field: 'jsonFormat',
+      name: 'jsonFormat',
+      span: 12
+    },
+    {
+      type: 'editor',
+      field: 'json',
+      name: 'json',
+      span: jsonSpan
+    },
+    {
+      type: 'input',
+      field: 'destinationLocationArn',
+      name: 'destinationLocationArn',
+      span: destinationLocationArnSpan
+    },
+    {
+      type: 'input',
+      field: 'sourceLocationArn',
+      name: 'sourceLocationArn',
+      span: sourceLocationArnSpan
+    },
+    {
+      type: 'input',
+      field: 'name',
+      name: 'name',
+      span: nameSpan
+    },
+    {
+      type: 'input',
+      field: 'cloudWatchLogGroupArn',
+      name: 'cloudWatchLogGroupArn',
+      span: cloudWatchLogGroupArnSpan
+    },
+    ...useCustomParams({ model, field: 'localParams', isSimple: false })
+  ]
+}
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datax.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datax.ts
index abe30495ed..24552bfb0b 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datax.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-datax.ts
@@ -14,243 +14,243 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import {ref, onMounted, watch} from 'vue'
-import {useI18n} from 'vue-i18n'
-import {useCustomParams, useDatasource, useResources} from '.'
-import type {IJsonItem} from '../types'
+import { ref, onMounted, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useCustomParams, useDatasource, useResources } from '.'
+import type { IJsonItem } from '../types'
 
 export function useDataX(model: { [field: string]: any }): IJsonItem[] {
-    const {t} = useI18n()
-    const jobSpeedByteOptions: any[] = [
-        {
-            label: `0(${t('project.node.unlimited')})`,
-            value: 0
-        },
-        {
-            label: '1KB',
-            value: 1024
-        },
-        {
-            label: '10KB',
-            value: 10240
-        },
-        {
-            label: '50KB',
-            value: 51200
-        },
-        {
-            label: '100KB',
-            value: 102400
-        },
-        {
-            label: '512KB',
-            value: 524288
-        }
-    ]
-    const jobSpeedRecordOptions: any[] = [
-        {
-            label: `0(${t('project.node.unlimited')})`,
-            value: 0
-        },
-        {
-            label: '500',
-            value: 500
-        },
-        {
-            label: '1000',
-            value: 1000
-        },
-        {
-            label: '1500',
-            value: 1500
-        },
-        {
-            label: '2000',
-            value: 2000
-        },
-        {
-            label: '2500',
-            value: 2500
-        },
-        {
-            label: '3000',
-            value: 3000
-        }
-    ]
-    const memoryLimitOptions = [
-        {
-            label: '1G',
-            value: 1
-        },
-        {
-            label: '2G',
-            value: 2
-        },
-        {
-            label: '3G',
-            value: 3
-        },
-        {
-            label: '4G',
-            value: 4
-        }
-    ]
+  const { t } = useI18n()
+  const jobSpeedByteOptions: any[] = [
+    {
+      label: `0(${t('project.node.unlimited')})`,
+      value: 0
+    },
+    {
+      label: '1KB',
+      value: 1024
+    },
+    {
+      label: '10KB',
+      value: 10240
+    },
+    {
+      label: '50KB',
+      value: 51200
+    },
+    {
+      label: '100KB',
+      value: 102400
+    },
+    {
+      label: '512KB',
+      value: 524288
+    }
+  ]
+  const jobSpeedRecordOptions: any[] = [
+    {
+      label: `0(${t('project.node.unlimited')})`,
+      value: 0
+    },
+    {
+      label: '500',
+      value: 500
+    },
+    {
+      label: '1000',
+      value: 1000
+    },
+    {
+      label: '1500',
+      value: 1500
+    },
+    {
+      label: '2000',
+      value: 2000
+    },
+    {
+      label: '2500',
+      value: 2500
+    },
+    {
+      label: '3000',
+      value: 3000
+    }
+  ]
+  const memoryLimitOptions = [
+    {
+      label: '1G',
+      value: 1
+    },
+    {
+      label: '2G',
+      value: 2
+    },
+    {
+      label: '3G',
+      value: 3
+    },
+    {
+      label: '4G',
+      value: 4
+    }
+  ]
 
-    const sqlEditorSpan = ref(24)
-    const jsonEditorSpan = ref(0)
-    const datasourceSpan = ref(12)
-    const destinationDatasourceSpan = ref(8)
-    const otherStatementSpan = ref(22)
-    const jobSpeedSpan = ref(12)
-    const useResourcesSpan = ref(0)
+  const sqlEditorSpan = ref(24)
+  const jsonEditorSpan = ref(0)
+  const datasourceSpan = ref(12)
+  const destinationDatasourceSpan = ref(8)
+  const otherStatementSpan = ref(22)
+  const jobSpeedSpan = ref(12)
+  const useResourcesSpan = ref(0)
 
-    const initConstants = () => {
-        if (model.customConfig) {
-            sqlEditorSpan.value = 0
-            jsonEditorSpan.value = 24
-            datasourceSpan.value = 0
-            destinationDatasourceSpan.value = 0
-            otherStatementSpan.value = 0
-            jobSpeedSpan.value = 0
-            useResourcesSpan.value = 24
-        } else {
-            sqlEditorSpan.value = 24
-            jsonEditorSpan.value = 0
-            datasourceSpan.value = 12
-            destinationDatasourceSpan.value = 8
-            otherStatementSpan.value = 22
-            jobSpeedSpan.value = 12
-            useResourcesSpan.value = 0
-        }
+  const initConstants = () => {
+    if (model.customConfig) {
+      sqlEditorSpan.value = 0
+      jsonEditorSpan.value = 24
+      datasourceSpan.value = 0
+      destinationDatasourceSpan.value = 0
+      otherStatementSpan.value = 0
+      jobSpeedSpan.value = 0
+      useResourcesSpan.value = 24
+    } else {
+      sqlEditorSpan.value = 24
+      jsonEditorSpan.value = 0
+      datasourceSpan.value = 12
+      destinationDatasourceSpan.value = 8
+      otherStatementSpan.value = 22
+      jobSpeedSpan.value = 12
+      useResourcesSpan.value = 0
+    }
+  }
+  const supportedDatasourceType = [
+    'MYSQL',
+    'POSTGRESQL',
+    'ORACLE',
+    'SQLSERVER',
+    'CLICKHOUSE',
+    'DATABEND',
+    'HIVE',
+    'PRESTO'
+  ]
+  onMounted(() => {
+    initConstants()
+  })
+  watch(
+    () => model.customConfig,
+    () => {
+      initConstants()
     }
-    const supportedDatasourceType = [
-        'MYSQL',
-        'POSTGRESQL',
-        'ORACLE',
-        'SQLSERVER',
-        'CLICKHOUSE',
-        'DATABEND',
-        'HIVE',
-        'PRESTO'
-    ]
-    onMounted(() => {
-        initConstants()
-    })
-    watch(
-        () => model.customConfig,
-        () => {
-            initConstants()
-        }
-    )
+  )
 
-    return [
-        {
-            type: 'switch',
-            field: 'customConfig',
-            name: t('project.node.datax_custom_template')
-        },
-        ...useDatasource(model, {
-            typeField: 'dsType',
-            sourceField: 'dataSource',
-            span: datasourceSpan,
-            supportedDatasourceType
-        }),
-        {
-            type: 'editor',
-            field: 'sql',
-            name: t('project.node.sql_statement'),
-            span: sqlEditorSpan,
-            validate: {
-                trigger: ['input', 'trigger'],
-                required: true,
-                message: t('project.node.sql_empty_tips')
-            }
-        },
-        {
-            type: 'editor',
-            field: 'json',
-            name: t('project.node.datax_json_template'),
-            span: jsonEditorSpan,
-            validate: {
-                trigger: ['input', 'trigger'],
-                required: true,
-                message: t('project.node.sql_empty_tips')
-            }
-        },
-        useResources(useResourcesSpan),
-        ...useDatasource(model, {
-            typeField: 'dtType',
-            sourceField: 'dataTarget',
-            span: destinationDatasourceSpan,
-            supportedDatasourceType
-        }),
-        {
-            type: 'input',
-            field: 'targetTable',
-            name: t('project.node.datax_target_table'),
-            span: destinationDatasourceSpan,
-            props: {
-                placeholder: t('project.node.datax_target_table_tips')
-            },
-            validate: {
-                trigger: ['input', 'blur'],
-                required: true
-            }
-        },
-        {
-            type: 'multi-input',
-            field: 'preStatements',
-            name: t('project.node.datax_target_database_pre_sql'),
-            span: otherStatementSpan,
-            props: {
-                placeholder: t('project.node.datax_non_query_sql_tips'),
-                type: 'textarea',
-                autosize: {minRows: 1}
-            }
-        },
-        {
-            type: 'multi-input',
-            field: 'postStatements',
-            name: t('project.node.datax_target_database_post_sql'),
-            span: otherStatementSpan,
-            props: {
-                placeholder: t('project.node.datax_non_query_sql_tips'),
-                type: 'textarea',
-                autosize: {minRows: 1}
-            }
-        },
-        {
-            type: 'select',
-            field: 'jobSpeedByte',
-            name: t('project.node.datax_job_speed_byte'),
-            span: jobSpeedSpan,
-            options: jobSpeedByteOptions,
-            value: 0
-        },
-        {
-            type: 'select',
-            field: 'jobSpeedRecord',
-            name: t('project.node.datax_job_speed_record'),
-            span: jobSpeedSpan,
-            options: jobSpeedRecordOptions,
-            value: 1000
-        },
-        {
-            type: 'select',
-            field: 'xms',
-            name: t('project.node.datax_job_runtime_memory_xms'),
-            span: 12,
-            options: memoryLimitOptions,
-            value: 1
-        },
-        {
-            type: 'select',
-            field: 'xmx',
-            name: t('project.node.datax_job_runtime_memory_xmx'),
-            span: 12,
-            options: memoryLimitOptions,
-            value: 1
-        },
-        ...useCustomParams({model, field: 'localParams', isSimple: true})
-    ]
+  return [
+    {
+      type: 'switch',
+      field: 'customConfig',
+      name: t('project.node.datax_custom_template')
+    },
+    ...useDatasource(model, {
+      typeField: 'dsType',
+      sourceField: 'dataSource',
+      span: datasourceSpan,
+      supportedDatasourceType
+    }),
+    {
+      type: 'editor',
+      field: 'sql',
+      name: t('project.node.sql_statement'),
+      span: sqlEditorSpan,
+      validate: {
+        trigger: ['input', 'trigger'],
+        required: true,
+        message: t('project.node.sql_empty_tips')
+      }
+    },
+    {
+      type: 'editor',
+      field: 'json',
+      name: t('project.node.datax_json_template'),
+      span: jsonEditorSpan,
+      validate: {
+        trigger: ['input', 'trigger'],
+        required: true,
+        message: t('project.node.sql_empty_tips')
+      }
+    },
+    useResources(useResourcesSpan),
+    ...useDatasource(model, {
+      typeField: 'dtType',
+      sourceField: 'dataTarget',
+      span: destinationDatasourceSpan,
+      supportedDatasourceType
+    }),
+    {
+      type: 'input',
+      field: 'targetTable',
+      name: t('project.node.datax_target_table'),
+      span: destinationDatasourceSpan,
+      props: {
+        placeholder: t('project.node.datax_target_table_tips')
+      },
+      validate: {
+        trigger: ['input', 'blur'],
+        required: true
+      }
+    },
+    {
+      type: 'multi-input',
+      field: 'preStatements',
+      name: t('project.node.datax_target_database_pre_sql'),
+      span: otherStatementSpan,
+      props: {
+        placeholder: t('project.node.datax_non_query_sql_tips'),
+        type: 'textarea',
+        autosize: { minRows: 1 }
+      }
+    },
+    {
+      type: 'multi-input',
+      field: 'postStatements',
+      name: t('project.node.datax_target_database_post_sql'),
+      span: otherStatementSpan,
+      props: {
+        placeholder: t('project.node.datax_non_query_sql_tips'),
+        type: 'textarea',
+        autosize: { minRows: 1 }
+      }
+    },
+    {
+      type: 'select',
+      field: 'jobSpeedByte',
+      name: t('project.node.datax_job_speed_byte'),
+      span: jobSpeedSpan,
+      options: jobSpeedByteOptions,
+      value: 0
+    },
+    {
+      type: 'select',
+      field: 'jobSpeedRecord',
+      name: t('project.node.datax_job_speed_record'),
+      span: jobSpeedSpan,
+      options: jobSpeedRecordOptions,
+      value: 1000
+    },
+    {
+      type: 'select',
+      field: 'xms',
+      name: t('project.node.datax_job_runtime_memory_xms'),
+      span: 12,
+      options: memoryLimitOptions,
+      value: 1
+    },
+    {
+      type: 'select',
+      field: 'xmx',
+      name: t('project.node.datax_job_runtime_memory_xmx'),
+      span: 12,
+      options: memoryLimitOptions,
+      value: 1
+    },
+    ...useCustomParams({ model, field: 'localParams', isSimple: true })
+  ]
 }
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-dependent-timeout.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-dependent-timeout.ts
index a7b9468fde..a84e50b43d 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-dependent-timeout.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-dependent-timeout.ts
@@ -24,7 +24,9 @@ export function useDependentTimeout(model: {
 }): IJsonItem[] {
   const { t } = useI18n()
   const timeCompleteSpan = computed(() => (model.timeoutShowFlag ? 24 : 0))
-  const timeCompleteEnableSpan = computed(() => (model.timeoutFlag && model.timeoutShowFlag ? 12 : 0))
+  const timeCompleteEnableSpan = computed(() =>
+    model.timeoutFlag && model.timeoutShowFlag ? 12 : 0
+  )
 
   const strategyOptions = [
     {
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-dms.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-dms.ts
index 7385b16114..7c566141b6 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-dms.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-dms.ts
@@ -20,7 +20,6 @@ import { watch, ref } from 'vue'
 import { useCustomParams, useResources } from '.'
 
 export function useDms(model: { [field: string]: any }): IJsonItem[] {
-
   const jsonDataSpan = ref(0)
   const replicationTaskArnSpan = ref(0)
   const replicationTaskIdentifierSpan = ref(0)
@@ -31,8 +30,10 @@ export function useDms(model: { [field: string]: any }): IJsonItem[] {
   const tableMappingsSpan = ref(0)
 
   const setFlag = () => {
-    model.isCreateAndNotJson = !model.isRestartTask && !model.isJsonFormat ? true : false
-    model.isRestartAndNotJson = model.isRestartTask && !model.isJsonFormat ? true : false
+    model.isCreateAndNotJson =
+      !model.isRestartTask && !model.isJsonFormat ? true : false
+    model.isRestartAndNotJson =
+      model.isRestartTask && !model.isJsonFormat ? true : false
   }
 
   const resetSpan = () => {
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-environment-name.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-environment-name.ts
index 0f959ebdfb..36795b2e0e 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-environment-name.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-environment-name.ts
@@ -49,7 +49,9 @@ export function useEnvironmentName(
     if (options.value.length === 0) {
       model.environmentCode = null
     } else {
-      (isCreate && !model.environmentCode)  && (model.environmentCode = options.value[0].value)
+      isCreate &&
+        !model.environmentCode &&
+        (model.environmentCode = options.value[0].value)
     }
   }
 
@@ -83,7 +85,7 @@ export function useEnvironmentName(
     name: t('project.node.environment_name'),
     props: {
       loading: loading,
-      clearable: true,
+      clearable: true
     },
     options: options
   }
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-flink.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-flink.ts
index 9efde03d6c..5c66dd15f9 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-flink.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-flink.ts
@@ -102,7 +102,8 @@ export function useFlink(model: { [field: string]: any }): IJsonItem[] {
   )
 
   watchEffect(() => {
-    model.flinkVersion = model.programType === 'SQL' ? '>=1.13' : model.flinkVersion
+    model.flinkVersion =
+      model.programType === 'SQL' ? '>=1.13' : model.flinkVersion
   })
 
   return [
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-hive-cli.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-hive-cli.ts
index 1ae178bfb2..ed842f3bdc 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-hive-cli.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-hive-cli.ts
@@ -14,16 +14,22 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- import { computed } from 'vue'
+import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useCustomParams, useResources } from '.'
 import type { IJsonItem } from '../types'
 
 export function useHiveCli(model: { [field: string]: any }): IJsonItem[] {
   const { t } = useI18n()
-  const hiveSqlScriptSpan = computed(() => (model.hiveCliTaskExecutionType === 'SCRIPT' ? 24 : 0))
-  const resourcesRequired = computed(() => (model.hiveCliTaskExecutionType === 'SCRIPT' ? false : true))
-  const resourcesLimit = computed(() => (model.hiveCliTaskExecutionType === 'SCRIPT' ? -1 : 1))
+  const hiveSqlScriptSpan = computed(() =>
+    model.hiveCliTaskExecutionType === 'SCRIPT' ? 24 : 0
+  )
+  const resourcesRequired = computed(() =>
+    model.hiveCliTaskExecutionType === 'SCRIPT' ? false : true
+  )
+  const resourcesLimit = computed(() =>
+    model.hiveCliTaskExecutionType === 'SCRIPT' ? -1 : 1
+  )
 
   return [
     {
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-linkis.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-linkis.ts
index df3088a48a..b55b6eb7ec 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-linkis.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-linkis.ts
@@ -24,7 +24,7 @@ export function useLinkis(model: { [field: string]: any }): IJsonItem[] {
 
   const configEditorSpan = computed(() => (model.useCustom ? 24 : 0))
   const parmaEditorSpan = computed(() => (model.useCustom ? 0 : 24))
-  computed(() => (model.useCustom ? 0 : 24));
+  computed(() => (model.useCustom ? 0 : 24))
   return [
     {
       type: 'switch',
@@ -54,7 +54,7 @@ export function useLinkis(model: { [field: string]: any }): IJsonItem[] {
               }
 
               const sameItems = model.localParams.filter(
-                  (item: { prop: string }) => item.prop === value
+                (item: { prop: string }) => item.prop === value
               )
 
               if (sameItems.length > 1) {
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-namespace.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-namespace.ts
index 2c0e52aaad..a00389ae1b 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-namespace.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-namespace.ts
@@ -58,7 +58,7 @@ export function useNamespace(): IJsonItem {
     props: {
       loading,
       'render-label': renderLabel,
-      'clearable': true
+      clearable: true
     },
     options: [
       {
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-resources.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-resources.ts
index 32c804a35b..671d8c6c8a 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-resources.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-resources.ts
@@ -41,7 +41,7 @@ export function useResources(
     }
     if (resourcesLoading.value) return
     resourcesLoading.value = true
-    const res = await queryResourceList({ type: 'FILE', fullName:"" })
+    const res = await queryResourceList({ type: 'FILE', fullName: '' })
     utils.removeUselessChildren(res)
     resourcesOptions.value = res || []
     resourcesLoading.value = false
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-sea-tunnel.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-sea-tunnel.ts
index 3f31422596..980fd86d9a 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-sea-tunnel.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-sea-tunnel.ts
@@ -24,19 +24,35 @@ export function useSeaTunnel(model: { [field: string]: any }): IJsonItem[] {
 
   const configEditorSpan = computed(() => (model.useCustom ? 24 : 0))
   const resourceEditorSpan = computed(() => (model.useCustom ? 0 : 24))
-  const flinkSpan = computed(() => (model.startupScript.includes("flink") ? 24 : 0))
-  const deployModeSpan = computed(() => (model.startupScript.includes("spark") || model.startupScript === "seatunnel.sh" ? 24 : 0))
-  const masterSpan = computed(() => (model.startupScript.includes("spark")) && model.deployMode !== 'local' ? 12 : 0)
+  const flinkSpan = computed(() =>
+    model.startupScript.includes('flink') ? 24 : 0
+  )
+  const deployModeSpan = computed(() =>
+    model.startupScript.includes('spark') ||
+    model.startupScript === 'seatunnel.sh'
+      ? 24
+      : 0
+  )
+  const masterSpan = computed(() =>
+    model.startupScript.includes('spark') && model.deployMode !== 'local'
+      ? 12
+      : 0
+  )
   const masterUrlSpan = computed(() =>
-    (model.startupScript.includes("spark")) &&
+    model.startupScript.includes('spark') &&
     model.deployMode !== 'local' &&
     (model.master === 'SPARK' || model.master === 'MESOS')
       ? 12
       : 0
   )
-  const showClient = computed(() => model.startupScript.includes("spark"))
+  const showClient = computed(() => model.startupScript.includes('spark'))
   const showLocal = computed(() => model.startupScript === 'seatunnel.sh')
-  const othersSpan = computed(() => (model.startupScript.includes("flink") || model.startupScript === 'seatunnel.sh' ? 24 : 0))
+  const othersSpan = computed(() =>
+    model.startupScript.includes('flink') ||
+    model.startupScript === 'seatunnel.sh'
+      ? 24
+      : 0
+  )
 
   return [
     {
@@ -56,12 +72,12 @@ export function useSeaTunnel(model: { [field: string]: any }): IJsonItem[] {
             if (model.startupScript === 'seatunnel.sh') {
               model.deployMode = 'local'
             }
-            if (model.startupScript.includes("spark")) {
+            if (model.startupScript.includes('spark')) {
               model.deployMode = 'client'
             }
           }
         }
-      },
+      }
     },
 
     // SeaTunnel flink parameter
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-zeppelin.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-zeppelin.ts
index a643e1a4bc..a2069b3bd5 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-zeppelin.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/fields/use-zeppelin.ts
@@ -85,7 +85,7 @@ export function useZeppelin(model: { [field: string]: any }): IJsonItem[] {
       field: 'password',
       name: t('project.node.zeppelin_password'),
       props: {
-        placeholder:  t('project.node.zeppelin_password_tips')
+        placeholder: t('project.node.zeppelin_password_tips')
       }
     },
     {
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/format-data.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/format-data.ts
index 8ee6140b4c..96ba5916d9 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/format-data.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/format-data.ts
@@ -218,16 +218,16 @@ export function formatParams(data: INodeData): {
     taskParams.startupScript = data.startupScript
     taskParams.useCustom = data.useCustom
     taskParams.rawScript = data.rawScript
-    if (data.startupScript?.includes("flink")) {
+    if (data.startupScript?.includes('flink')) {
       taskParams.runMode = data.runMode
       taskParams.others = data.others
     }
-    if (data.startupScript?.includes("spark")) {
+    if (data.startupScript?.includes('spark')) {
       taskParams.deployMode = data.deployMode
       taskParams.master = data.master
       taskParams.masterUrl = data.masterUrl
     }
-    if (data.startupScript === "seatunnel.sh") {
+    if (data.startupScript === 'seatunnel.sh') {
       taskParams.deployMode = data.deployMode
       taskParams.others = data.others
     }
@@ -502,7 +502,7 @@ export function formatParams(data: INodeData): {
         : '0',
       failRetryTimes: data.failRetryTimes ? String(data.failRetryTimes) : '0',
       flag: data.flag,
-      isCache: data.isCache ? "YES" : "NO",
+      isCache: data.isCache ? 'YES' : 'NO',
       name: data.name,
       taskGroupId: data.taskGroupId,
       taskGroupPriority: data.taskGroupPriority,
@@ -514,7 +514,9 @@ export function formatParams(data: INodeData): {
         initScript: data.initScript,
         rawScript: data.rawScript,
         resourceList: data.resourceList?.length
-          ? data.resourceList.map((fullName: string) => ({ resourceName: `${fullName}` }))
+          ? data.resourceList.map((fullName: string) => ({
+              resourceName: `${fullName}`
+            }))
           : [],
         ...taskParams
       },
@@ -563,7 +565,7 @@ export function formatModel(data: ITaskData) {
   }
   if (data.taskParams?.resourceList) {
     params.resourceList = data.taskParams.resourceList.map(
-      (item: { resourceName: string }) => (`${item.resourceName}`)
+      (item: { resourceName: string }) => `${item.resourceName}`
     )
   }
   if (data.taskParams?.mainJar) {
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-datasync.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-datasync.ts
index 1aad25fde3..2cf5029a47 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-datasync.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-datasync.ts
@@ -20,64 +20,64 @@ import * as Fields from '../fields/index'
 import type { IJsonItem, INodeData, ITaskData } from '../types'
 
 export function useDatasync({
-   projectCode,
-   from = 0,
-   readonly,
-   data
+  projectCode,
+  from = 0,
+  readonly,
+  data
 }: {
-    projectCode: number
-    from?: number
-    readonly?: boolean
-    data?: ITaskData
+  projectCode: number
+  from?: number
+  readonly?: boolean
+  data?: ITaskData
 }) {
- const model = reactive({
-     name: '',
-     taskType: 'DATASYNC',
-     flag: 'YES',
-     description: '',
-     timeoutFlag: false,
-     localParams: [],
-     environmentCode: null,
-     failRetryInterval: 1,
-     failRetryTimes: 0,
-     workerGroup: 'default',
-     delayTime: 0,
-     timeout: 30,
-     timeoutNotifyStrategy: ['WARN'],
+  const model = reactive({
+    name: '',
+    taskType: 'DATASYNC',
+    flag: 'YES',
+    description: '',
+    timeoutFlag: false,
+    localParams: [],
+    environmentCode: null,
+    failRetryInterval: 1,
+    failRetryTimes: 0,
+    workerGroup: 'default',
+    delayTime: 0,
+    timeout: 30,
+    timeoutNotifyStrategy: ['WARN']
   } as INodeData)
 
-   let extra: IJsonItem[] = []
-   if (from === 1) {
-     extra = [
-         Fields.useTaskType(model, readonly),
-         Fields.useProcessName({
-             model,
-             projectCode,
-             isCreate: !data?.id,
-             from,
-             processName: data?.processName
-         })
-     ]
- }
+  let extra: IJsonItem[] = []
+  if (from === 1) {
+    extra = [
+      Fields.useTaskType(model, readonly),
+      Fields.useProcessName({
+        model,
+        projectCode,
+        isCreate: !data?.id,
+        from,
+        processName: data?.processName
+      })
+    ]
+  }
 
- return {
-     json: [
-         Fields.useName(from),
-         ...extra,
-         Fields.useRunFlag(),
-         Fields.useCache(),
-         Fields.useDescription(),
-         Fields.useTaskPriority(),
-         Fields.useWorkerGroup(),
-         Fields.useEnvironmentName(model, !model.id),
-         ...Fields.useTaskGroup(model, projectCode),
-         ...Fields.useFailed(),
-         ...Fields.useResourceLimit(),
-         Fields.useDelayTime(model),
-         ...Fields.useTimeoutAlarm(model),
-         ...Fields.useDatasync(model),
-         Fields.usePreTasks()
-     ] as IJsonItem[],
-     model
- }
+  return {
+    json: [
+      Fields.useName(from),
+      ...extra,
+      Fields.useRunFlag(),
+      Fields.useCache(),
+      Fields.useDescription(),
+      Fields.useTaskPriority(),
+      Fields.useWorkerGroup(),
+      Fields.useEnvironmentName(model, !model.id),
+      ...Fields.useTaskGroup(model, projectCode),
+      ...Fields.useFailed(),
+      ...Fields.useResourceLimit(),
+      Fields.useDelayTime(model),
+      ...Fields.useTimeoutAlarm(model),
+      ...Fields.useDatasync(model),
+      Fields.usePreTasks()
+    ] as IJsonItem[],
+    model
+  }
 }
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-dms.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-dms.ts
index 1c9399aec6..74e00fd997 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-dms.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-dms.ts
@@ -44,7 +44,7 @@ export function useDms({
     delayTime: 0,
     timeout: 30,
     timeoutNotifyStrategy: ['WARN'],
-    isRestartTask: false,
+    isRestartTask: false
   } as INodeData)
 
   let extra: IJsonItem[] = []
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-linkis.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-linkis.ts
index 5bfaf265e0..858c53ae34 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-linkis.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-linkis.ts
@@ -52,7 +52,7 @@ export function useLinkis({
       {
         prop: '',
         value: ''
-      },
+      }
     ],
     rawScript: ''
   } as INodeData)
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-sea-tunnel.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-sea-tunnel.ts
index 62be29bfb9..7f42217da7 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-sea-tunnel.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/tasks/use-sea-tunnel.ts
@@ -56,29 +56,29 @@ export function useSeaTunnel({
     timeoutNotifyStrategy: ['WARN'],
     rawScript:
       'env {\n' +
-        '  execution.parallelism = 2\n' +
-        '  job.mode = "BATCH"\n' +
-        '  checkpoint.interval = 10000\n' +
-        '}\n' +
-        '\n' +
-        'source {\n' +
-        '  FakeSource {\n' +
-        '    parallelism = 2\n' +
-        '    result_table_name = "fake"\n' +
-        '    row.num = 16\n' +
-        '    schema = {\n' +
-        '      fields {\n' +
-        '        name = "string"\n' +
-        '        age = "int"\n' +
-        '      }\n' +
-        '    }\n' +
-        '  }\n' +
-        '}\n' +
-        '\n' +
-        'sink {\n' +
-        '  Console {\n' +
-        '  }\n' +
-        '}'
+      '  execution.parallelism = 2\n' +
+      '  job.mode = "BATCH"\n' +
+      '  checkpoint.interval = 10000\n' +
+      '}\n' +
+      '\n' +
+      'source {\n' +
+      '  FakeSource {\n' +
+      '    parallelism = 2\n' +
+      '    result_table_name = "fake"\n' +
+      '    row.num = 16\n' +
+      '    schema = {\n' +
+      '      fields {\n' +
+      '        name = "string"\n' +
+      '        age = "int"\n' +
+      '      }\n' +
+      '    }\n' +
+      '  }\n' +
+      '}\n' +
+      '\n' +
+      'sink {\n' +
+      '  Console {\n' +
+      '  }\n' +
+      '}'
   } as INodeData)
 
   return {
diff --git a/dolphinscheduler-ui/src/views/projects/task/components/node/types.ts b/dolphinscheduler-ui/src/views/projects/task/components/node/types.ts
index e65045b140..64aa599aff 100644
--- a/dolphinscheduler-ui/src/views/projects/task/components/node/types.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/components/node/types.ts
@@ -120,8 +120,8 @@ interface IDependentParameters {
  * res: resource file name
  */
 interface ISourceItem {
-  id?: number,
-  resourceName: string,
+  id?: number
+  resourceName: string
   res?: string
 }
 
@@ -495,7 +495,7 @@ interface ITaskData
   > {
   name?: string
   taskPriority?: string
-  isCache?: "YES" | "NO"
+  isCache?: 'YES' | 'NO'
   timeoutFlag?: 'OPEN' | 'CLOSE'
   timeoutNotifyStrategy?: string | []
   taskParams?: ITaskParams
diff --git a/dolphinscheduler-ui/src/views/projects/task/definition/use-table.ts b/dolphinscheduler-ui/src/views/projects/task/definition/use-table.ts
index ccd57d6266..78e59b9e70 100644
--- a/dolphinscheduler-ui/src/views/projects/task/definition/use-table.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/definition/use-table.ts
@@ -77,13 +77,13 @@ export function useTable(onEdit: Function) {
             },
             {
               default: () =>
-                  h(
-                      NEllipsis,
-                      {
-                        style: 'max-width: 580px;line-height: 1.5'
-                      },
-                      () => row.taskName
-                  )
+                h(
+                  NEllipsis,
+                  {
+                    style: 'max-width: 580px;line-height: 1.5'
+                  },
+                  () => row.taskName
+                )
             }
           )
       },
diff --git a/dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx b/dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx
index 642ab4eab8..2ba8c31d77 100644
--- a/dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx
+++ b/dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx
@@ -107,7 +107,7 @@ const BatchTaskInstance = defineComponent({
       variables.showModalRef = false
     }
 
-    var getLogsID: number
+    let getLogsID: number
 
     const getLogs = (row: any, logTimer: number) => {
       const { state } = useAsyncState(
diff --git a/dolphinscheduler-ui/src/views/projects/task/instance/index.tsx b/dolphinscheduler-ui/src/views/projects/task/instance/index.tsx
index f0212a50ba..de9e7f690b 100644
--- a/dolphinscheduler-ui/src/views/projects/task/instance/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/task/instance/index.tsx
@@ -21,7 +21,6 @@ import { NTabPane, NTabs } from 'naive-ui'
 import BatchTaskInstance from './batch-task'
 import StreamTaskInstance from './stream-task'
 
-
 const TaskDefinition = defineComponent({
   name: 'task-instance',
   setup() {
@@ -39,4 +38,4 @@ const TaskDefinition = defineComponent({
   }
 })
 
-export default TaskDefinition
\ No newline at end of file
+export default TaskDefinition
diff --git a/dolphinscheduler-ui/src/views/projects/task/instance/use-table.ts b/dolphinscheduler-ui/src/views/projects/task/instance/use-table.ts
index 553feb1282..154f793271 100644
--- a/dolphinscheduler-ui/src/views/projects/task/instance/use-table.ts
+++ b/dolphinscheduler-ui/src/views/projects/task/instance/use-table.ts
@@ -23,14 +23,7 @@ import {
   forceSuccess,
   downloadLog
 } from '@/service/modules/task-instances'
-import {
-  NButton,
-  NIcon,
-  NSpace,
-  NTooltip,
-  NSpin,
-  NEllipsis
-} from 'naive-ui'
+import { NButton, NIcon, NSpace, NTooltip, NSpin, NEllipsis } from 'naive-ui'
 import ButtonLink from '@/components/button-link'
 import {
   AlignLeftOutlined,
@@ -39,19 +32,14 @@ import {
 } from '@vicons/antd'
 import { format } from 'date-fns'
 import { useRoute, useRouter } from 'vue-router'
-import {
-  parseTime,
-  renderTableTime,
-  tasksState
-} from '@/common/common'
+import { parseTime, renderTableTime, tasksState } from '@/common/common'
 import {
   COLUMN_WIDTH_CONFIG,
   calculateTableWidth,
   DefaultTableWidth
 } from '@/common/column-width-config'
 import type { Router, TaskInstancesRes, IRecord, ITaskState } from './types'
-import {renderEnvironmentalDistinctionCell} from "@/utils/environmental-distinction";
-
+import { renderEnvironmentalDistinctionCell } from '@/utils/environmental-distinction'
 
 export function useTable() {
   const { t } = useI18n()
@@ -98,7 +86,7 @@ export function useTable() {
         ...COLUMN_WIDTH_CONFIG['name'],
         resizable: true,
         minWidth: 200,
-        maxWidth: 600,
+        maxWidth: 600
       },
       {
         title: t('project.task.workflow_instance'),
@@ -115,7 +103,7 @@ export function useTable() {
             ButtonLink,
             {
               onClick: () => {
-                let routeUrl = router.resolve({
+                const routeUrl = router.resolve({
                   name: 'workflow-instance-detail',
                   params: { id: row.processInstanceId },
                   query: { code: projectCode }
@@ -127,9 +115,9 @@ export function useTable() {
               default: () =>
                 h(
                   NEllipsis,
-                    {
-                      style: 'max-width: 580px;line-height: 1.5'
-                    },
+                  {
+                    style: 'max-width: 580px;line-height: 1.5'
+                  },
                   () => row.processInstanceName
                 )
             }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-config.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-config.ts
index 5adc809260..94cde38f08 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-config.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-config.ts
@@ -252,7 +252,7 @@ export const EDGE = {
   router: {
     name: 'er',
     args: {
-      offset: 12,
+      offset: 12
     }
   },
   defaultLabel: {
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-context-menu.tsx b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-context-menu.tsx
index be27c88ac9..3fd3ca0b5a 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-context-menu.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-context-menu.tsx
@@ -63,7 +63,16 @@ const props = {
 export default defineComponent({
   name: 'dag-context-menu',
   props,
-  emits: ['hide', 'start', 'edit', 'viewLog', 'copyTask', 'removeTasks', 'executeTask', 'removeTaskInstanceCache'],
+  emits: [
+    'hide',
+    'start',
+    'edit',
+    'viewLog',
+    'copyTask',
+    'removeTasks',
+    'executeTask',
+    'removeTaskInstanceCache'
+  ],
   setup(props, ctx) {
     const graph = inject('graph', ref())
     const route = useRoute()
@@ -188,42 +197,42 @@ export default defineComponent({
             </>
           )}
           {this.taskInstance && (
-              <>
-                <NButton
-                    class={`${styles['menu-item']}`}
-                    onClick={this.handleViewLog}
-                >
-                  {t('project.node.view_log')}
-                </NButton>
-                <NButton
-                    class={`${styles['menu-item']}`}
-                    onClick={this.handleRemoveTaskInstanceCache}
-                >
-                  {t('project.task.remove_task_cache')}
-                </NButton>
-              </>
+            <>
+              <NButton
+                class={`${styles['menu-item']}`}
+                onClick={this.handleViewLog}
+              >
+                {t('project.node.view_log')}
+              </NButton>
+              <NButton
+                class={`${styles['menu-item']}`}
+                onClick={this.handleRemoveTaskInstanceCache}
+              >
+                {t('project.task.remove_task_cache')}
+              </NButton>
+            </>
           )}
           {this.executeTaskDisplay && (
-              <>
-                <NButton
-                    class={`${styles['menu-item']}`}
-                    onClick={this.handleExecuteTaskOnly}
-                >
-                  {t('project.workflow.current_node_execution_task')}
-                </NButton>
-                <NButton
-                    class={`${styles['menu-item']}`}
-                    onClick={this.handleExecuteTaskPOST}
-                >
-                  {t('project.workflow.backward_execution_task')}
-                </NButton>
-                <NButton
-                    class={`${styles['menu-item']}`}
-                    onClick={this.handleExecuteTaskPRE}
-                >
-                  {t('project.workflow.forward_execution_task')}
-                </NButton>
-              </>
+            <>
+              <NButton
+                class={`${styles['menu-item']}`}
+                onClick={this.handleExecuteTaskOnly}
+              >
+                {t('project.workflow.current_node_execution_task')}
+              </NButton>
+              <NButton
+                class={`${styles['menu-item']}`}
+                onClick={this.handleExecuteTaskPOST}
+              >
+                {t('project.workflow.backward_execution_task')}
+              </NButton>
+              <NButton
+                class={`${styles['menu-item']}`}
+                onClick={this.handleExecuteTaskPRE}
+              >
+                {t('project.workflow.forward_execution_task')}
+              </NButton>
+            </>
           )}
         </div>
       )
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-sidebar.tsx b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-sidebar.tsx
index 7420525514..5efbde95a8 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-sidebar.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-sidebar.tsx
@@ -96,7 +96,7 @@ export default defineComponent({
       handleDagMenu()
     })
 
-    return () =>
+    return () => (
       <div class={styles.sidebar}>
         <NCollapse default-expanded-names='1' accordion>
           {variables.fav.length > 0 && (
@@ -139,11 +139,7 @@ export default defineComponent({
                               : '#ccc'
                           }
                         >
-                          {task.collection ? (
-                            <StarFilled />
-                          ) : (
-                            <StarOutlined />
-                          )}
+                          {task.collection ? <StarFilled /> : <StarOutlined />}
                         </NIcon>
                       </div>
                     </div>
@@ -192,11 +188,7 @@ export default defineComponent({
                               : '#ccc'
                           }
                         >
-                          {task.collection ? (
-                            <StarFilled />
-                          ) : (
-                            <StarOutlined />
-                          )}
+                          {task.collection ? <StarFilled /> : <StarOutlined />}
                         </NIcon>
                       </div>
                     </div>
@@ -245,11 +237,7 @@ export default defineComponent({
                               : '#ccc'
                           }
                         >
-                          {task.collection ? (
-                            <StarFilled />
-                          ) : (
-                            <StarOutlined />
-                          )}
+                          {task.collection ? <StarFilled /> : <StarOutlined />}
                         </NIcon>
                       </div>
                     </div>
@@ -298,11 +286,7 @@ export default defineComponent({
                               : '#ccc'
                           }
                         >
-                          {task.collection ? (
-                            <StarFilled />
-                          ) : (
-                            <StarOutlined />
-                          )}
+                          {task.collection ? <StarFilled /> : <StarOutlined />}
                         </NIcon>
                       </div>
                     </div>
@@ -351,11 +335,7 @@ export default defineComponent({
                               : '#ccc'
                           }
                         >
-                          {task.collection ? (
-                            <StarFilled />
-                          ) : (
-                            <StarOutlined />
-                          )}
+                          {task.collection ? <StarFilled /> : <StarOutlined />}
                         </NIcon>
                       </div>
                     </div>
@@ -404,11 +384,7 @@ export default defineComponent({
                               : '#ccc'
                           }
                         >
-                          {task.collection ? (
-                            <StarFilled />
-                          ) : (
-                            <StarOutlined />
-                          )}
+                          {task.collection ? <StarFilled /> : <StarOutlined />}
                         </NIcon>
                       </div>
                     </div>
@@ -457,11 +433,7 @@ export default defineComponent({
                               : '#ccc'
                           }
                         >
-                          {task.collection ? (
-                            <StarFilled />
-                          ) : (
-                            <StarOutlined />
-                          )}
+                          {task.collection ? <StarFilled /> : <StarOutlined />}
                         </NIcon>
                       </div>
                     </div>
@@ -510,11 +482,7 @@ export default defineComponent({
                               : '#ccc'
                           }
                         >
-                          {task.collection ? (
-                            <StarFilled />
-                          ) : (
-                            <StarOutlined />
-                          )}
+                          {task.collection ? <StarFilled /> : <StarOutlined />}
                         </NIcon>
                       </div>
                     </div>
@@ -525,5 +493,6 @@ export default defineComponent({
           )}
         </NCollapse>
       </div>
+    )
   }
 })
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-toolbar.tsx b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-toolbar.tsx
index 398e31baa9..d7d517b867 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-toolbar.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/dag-toolbar.tsx
@@ -217,37 +217,33 @@ export default defineComponent({
         )}
         {props.definition?.processDefinition?.name && (
           <NTooltip
-              v-slots={{
-                trigger: () => (
-                    <NPopover
-                        placement='bottom'
-                        trigger='click'
-                        scrollable
-                        style={{ maxWidth: '50vw', maxHeight: '70vh' }}
-                    >
-                      {{
-                        trigger: () => (
-                            <NButton
-                                quaternary
-                                circle
-                                class={Styles['toolbar-btn']}
-                            >
-                              <NIcon>
-                                <FundViewOutlined />
-                              </NIcon>
-                            </NButton>
-                        ),
-                        header: () => (
-                            <NText strong depth={1}>
-                              {t('project.workflow.parameters_variables')}
-                            </NText>
-                        ),
-                        default: () => <VariablesView onCopy={copy} />
-                      }}
-                    </NPopover>
-                ),
-                default: () => t('project.dag.view_variables')
-              }}
+            v-slots={{
+              trigger: () => (
+                <NPopover
+                  placement='bottom'
+                  trigger='click'
+                  scrollable
+                  style={{ maxWidth: '50vw', maxHeight: '70vh' }}
+                >
+                  {{
+                    trigger: () => (
+                      <NButton quaternary circle class={Styles['toolbar-btn']}>
+                        <NIcon>
+                          <FundViewOutlined />
+                        </NIcon>
+                      </NButton>
+                    ),
+                    header: () => (
+                      <NText strong depth={1}>
+                        {t('project.workflow.parameters_variables')}
+                      </NText>
+                    ),
+                    default: () => <VariablesView onCopy={copy} />
+                  }}
+                </NPopover>
+              ),
+              default: () => t('project.dag.view_variables')
+            }}
           ></NTooltip>
         )}
         <div class={Styles['toolbar-left-part']}>
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/index.tsx b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/index.tsx
index 45d9d907de..c41485db21 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/index.tsx
@@ -139,9 +139,7 @@ export default defineComponent({
 
     // execute task buttons in the dag node menu
     const executeTaskDisplay = computed(() => {
-        return (
-            route.name === 'workflow-instance-detail'
-        )
+      return route.name === 'workflow-instance-detail'
     })
 
     // other button in the dag node menu
@@ -250,7 +248,7 @@ export default defineComponent({
       getLogs(logTimer)
     }
 
-    var getLogsID: number
+    let getLogsID: number
 
     const getLogs = (logTimer: number) => {
       const { state } = useAsyncState(
@@ -259,7 +257,6 @@ export default defineComponent({
           limit: nodeVariables.limit,
           skipLineNum: nodeVariables.skipLineNum
         }).then((res: any) => {
-
           nodeVariables.logRef += res.message || ''
           if (res && res.message !== '') {
             nodeVariables.limit += 1000
@@ -292,18 +289,23 @@ export default defineComponent({
       getLogs(logTimer)
     }
 
-    const handleExecuteTask = (startNodeList: number, taskDependType: string) => {
-      executeTask({
-        processInstanceId: Number(route.params.id),
-        startNodeList: startNodeList,
-        taskDependType: taskDependType,
-      },
-        props.projectCode).then(() => {
-          window.$message.success(t('project.workflow.success'))
-          setTimeout(() => {
-            window.location.reload();
-          }, 1000);
-        })
+    const handleExecuteTask = (
+      startNodeList: number,
+      taskDependType: string
+    ) => {
+      executeTask(
+        {
+          processInstanceId: Number(route.params.id),
+          startNodeList: startNodeList,
+          taskDependType: taskDependType
+        },
+        props.projectCode
+      ).then(() => {
+        window.$message.success(t('project.workflow.success'))
+        setTimeout(() => {
+          window.location.reload()
+        }, 1000)
+      })
     }
 
     const handleRemoveTaskInstanceCache = (taskId: number) => {
@@ -450,4 +452,3 @@ export default defineComponent({
     )
   }
 })
-
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/use-canvas-init.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/use-canvas-init.ts
index 8ceb541a5f..8877f1906f 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dag/use-canvas-init.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dag/use-canvas-init.ts
@@ -108,10 +108,10 @@ export function useCanvasInit(options: Options) {
           const { sourceCell, targetCell } = data
 
           if (
-              sourceCell &&
-              targetCell &&
-              sourceCell.isNode() &&
-              targetCell.isNode()
+            sourceCell &&
+            targetCell &&
+            sourceCell.isNode() &&
+            targetCell.isNode()
           ) {
             const sourceData = sourceCell.getData()
             if (!sourceData) return true
@@ -135,10 +135,10 @@ export function useCanvasInit(options: Options) {
           edge?.setAttrs({
             line: {
               strokeDasharray:
-                  sourceData.taskExecuteType === 'STREAM' ||
-                  targetData.taskExecuteType === 'STREAM'
-                      ? '5 5'
-                      : 'none'
+                sourceData.taskExecuteType === 'STREAM' ||
+                targetData.taskExecuteType === 'STREAM'
+                  ? '5 5'
+                  : 'none'
             }
           })
           return true
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/dag-canvas.tsx b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/dag-canvas.tsx
index d501929fab..05ac7f7e44 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/dag-canvas.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/dag-canvas.tsx
@@ -62,7 +62,7 @@ const DagCanvas = defineComponent({
     })
 
     watch(dagTasks, () => {
-      useAddDagShape((graph.value as Graph))
+      useAddDagShape(graph.value as Graph)
     })
 
     return {
@@ -74,19 +74,22 @@ const DagCanvas = defineComponent({
     }
   },
   render() {
-    return(
+    return (
       <>
-        <div ref='container' class={styles.container}
-           onDrop={this.handleDrop}
-           onDragenter={this.handlePreventDefault}
-           onDragover={this.handlePreventDefault}
-           onDragleave={this.handlePreventDefault}>
-          <div ref='dag-container' class={styles['dag-container']}/>
+        <div
+          ref='container'
+          class={styles.container}
+          onDrop={this.handleDrop}
+          onDragenter={this.handlePreventDefault}
+          onDragover={this.handlePreventDefault}
+          onDragleave={this.handlePreventDefault}
+        >
+          <div ref='dag-container' class={styles['dag-container']} />
         </div>
-        <div ref='minimapContainer' class={styles.minimap}/>
+        <div ref='minimapContainer' class={styles.minimap} />
       </>
     )
   }
 })
 
-export { DagCanvas }
\ No newline at end of file
+export { DagCanvas }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/dag-sidebar.tsx b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/dag-sidebar.tsx
index b44da1d183..4cd3176044 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/dag-sidebar.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/dag-sidebar.tsx
@@ -41,18 +41,20 @@ const DagSidebar = defineComponent({
   render() {
     return (
       <div>
-        {
-          this.taskList.map((task: any) => {
-            return (
-              <div class={styles['task-item']} draggable='true' onDragstart={() => this.handleDragstart(task)}>
-                {task.name}
-              </div>
-            )
-          })
-        }
+        {this.taskList.map((task: any) => {
+          return (
+            <div
+              class={styles['task-item']}
+              draggable='true'
+              onDragstart={() => this.handleDragstart(task)}
+            >
+              {task.name}
+            </div>
+          )
+        })}
       </div>
     )
   }
 })
 
-export { DagSidebar }
\ No newline at end of file
+export { DagSidebar }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/index.tsx b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/index.tsx
index db2fa0bf5e..0f8830cc29 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/index.tsx
@@ -40,7 +40,7 @@ const DynamicDag = defineComponent({
     }
 
     const handelDrop = (e: DragEvent) => {
-      if (!draggedTask) return
+      if (!draggedTask.value) return
 
       const shapes = useDagStore().getDagTasks
 
@@ -73,21 +73,21 @@ const DynamicDag = defineComponent({
     return (
       <>
         <div class={styles['workflow-dag']}>
-          <DagSidebar onDragstart={this.handelDragstart}/>
-          <DagCanvas onDrop={this.handelDrop}/>
+          <DagSidebar onDragstart={this.handelDragstart} />
+          <DagCanvas onDrop={this.handelDrop} />
         </div>
-        {
-          this.draggedTask && this.formData && <TaskForm
+        {this.draggedTask && this.formData && (
+          <TaskForm
             task={this.draggedTask}
             formData={this.formData}
             showModal={this.showModal}
-            onCancelModal={() => this.showModal = false}
-            onConfirmModal={() => this.showModal = false}
+            onCancelModal={() => (this.showModal = false)}
+            onConfirmModal={() => (this.showModal = false)}
           />
-        }
+        )}
       </>
     )
   }
 })
 
-export { DynamicDag }
\ No newline at end of file
+export { DynamicDag }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/index.tsx b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/index.tsx
index 79a4ee9a30..9cc72bb925 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/index.tsx
@@ -15,7 +15,13 @@
  * limitations under the License.
  */
 
-import { defineComponent, getCurrentInstance, PropType, toRefs, watch } from 'vue'
+import {
+  defineComponent,
+  getCurrentInstance,
+  PropType,
+  toRefs,
+  watch
+} from 'vue'
 import { NForm, NFormItem, NInput, NSelect } from 'naive-ui'
 import { useTaskForm } from './use-task-form'
 import { useI18n } from 'vue-i18n'
@@ -55,15 +61,19 @@ const TaskForm = defineComponent({
     }
 
     const onUpdateValue = (v: any, f: any) => {
-      f.modelField.indexOf('.') >= 0 ?
-        (variables.model as any)[f.modelField.split('.')[0]][f.modelField.split('.')[1]] = v :
-        (variables.model as any)[f.modelField] = v
+      f.modelField.indexOf('.') >= 0
+        ? ((variables.model as any)[f.modelField.split('.')[0]][
+            f.modelField.split('.')[1]
+          ] = v)
+        : ((variables.model as any)[f.modelField] = v)
     }
 
     const setDefaultValue = (f: any) => {
-      return f.modelField.indexOf('.') >= 0 ?
-        (variables.model as any)[f.modelField.split('.')[0]][f.modelField.split('.')[1]] :
-        (variables.model as any)[f.modelField]
+      return f.modelField.indexOf('.') >= 0
+        ? (variables.model as any)[f.modelField.split('.')[0]][
+            f.modelField.split('.')[1]
+          ]
+        : (variables.model as any)[f.modelField]
     }
 
     watch(variables.model, () => {
@@ -86,56 +96,51 @@ const TaskForm = defineComponent({
         title={this.task}
         show={this.showModal}
         onCancel={this.cancelModal}
-        onConfirm={this.confirmModal}>
-        <NForm
-          model={this.model}
-          rules={this.rules}
-          ref={'taskForm'}>
-          {
-            (this.formStructure as Array<any>).map(f => {
-              return <NFormItem
-                label={this.t(f.label)}
-                path={f.field}
-              >
-                {
-                  f.type === 'input' && <NInput
+        onConfirm={this.confirmModal}
+      >
+        <NForm model={this.model} rules={this.rules} ref={'taskForm'}>
+          {(this.formStructure as Array<any>).map((f) => {
+            return (
+              <NFormItem label={this.t(f.label)} path={f.field}>
+                {f.type === 'input' && (
+                  <NInput
                     allowInput={this.trim}
                     placeholder={f.placeholder ? this.t(f.placeholder) : ''}
                     defaultValue={this.setDefaultValue(f)}
                     onUpdateValue={(v) => this.onUpdateValue(v, f)}
                     clearable={f.clearable}
                   />
-                }
-                {
-                  f.type === 'select' && <NSelect
+                )}
+                {f.type === 'select' && (
+                  <NSelect
                     placeholder={f.placeholder ? this.t(f.placeholder) : ''}
                     defaultValue={this.setDefaultValue(f)}
                     onUpdateValue={(v) => this.onUpdateValue(v, f)}
                     options={
-                      f.optionsLocale ?
-                        f.options.map((o: SelectOption) => {
-                          return {
-                            label: this.t(o.label as string),
-                            value: o.value
-                          }
-                        }) :
-                        f.options
+                      f.optionsLocale
+                        ? f.options.map((o: SelectOption) => {
+                            return {
+                              label: this.t(o.label as string),
+                              value: o.value
+                            }
+                          })
+                        : f.options
                     }
                   />
-                }
-                {
-                  f.type === 'studio' && <MonacoEditor
+                )}
+                {f.type === 'studio' && (
+                  <MonacoEditor
                     defaultValue={this.setDefaultValue(f)}
                     onUpdateValue={(v) => this.onUpdateValue(v, f)}
                   />
-                }
+                )}
               </NFormItem>
-            })
-          }
+            )
+          })}
         </NForm>
       </Modal>
     )
   }
 })
 
-export { TaskForm }
\ No newline at end of file
+export { TaskForm }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/types.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/types.ts
index 52c49cd359..8a9ff52555 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/types.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/types.ts
@@ -26,4 +26,4 @@ interface TaskDynamic {
   items: Array<any>
 }
 
-export { DynamicLocales, TaskDynamic }
\ No newline at end of file
+export { DynamicLocales, TaskDynamic }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-dynamic-locales.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-dynamic-locales.ts
index dac61582cc..6d62cd98ec 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-dynamic-locales.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-dynamic-locales.ts
@@ -21,4 +21,4 @@ import type { DynamicLocales } from './types'
 export function useDynamicLocales(locales: DynamicLocales): void {
   useI18n().mergeLocaleMessage('zh_CN', { task_components: locales.zh_CN })
   useI18n().mergeLocaleMessage('en_US', { task_components: locales.en_US })
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-field.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-field.ts
index b179b745f4..466aa6539d 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-field.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-field.ts
@@ -22,12 +22,7 @@ export function useFormField(forms: Array<any>) {
   const model: any = {}
 
   const setField = (value: string, type: string): Ref<null | string> => {
-    return ref(value ?
-      value :
-      type === 'select' ?
-        null :
-        ''
-    )
+    return ref(value ? value : type === 'select' ? null : '')
   }
 
   forms.forEach((f: any) => {
@@ -42,4 +37,4 @@ export function useFormField(forms: Array<any>) {
   })
 
   return model
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-request.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-request.ts
index 35ffd2dd12..9f09b86200 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-request.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-request.ts
@@ -25,7 +25,7 @@ const reqFunction = (url: string, method: string) => {
 }
 
 export function useFormRequest(apis: any, forms: Array<any>): Array<any> {
-  forms.map(f => {
+  forms.map((f) => {
     if (f.api) {
       reqFunction(apis[f.api].url, apis[f.api].method).then((res: any) => {
         f.options = res.map((r: any) => {
@@ -36,4 +36,4 @@ export function useFormRequest(apis: any, forms: Array<any>): Array<any> {
   })
 
   return forms
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-structure.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-structure.ts
index 056af50f1d..142f430fdc 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-structure.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-structure.ts
@@ -29,4 +29,4 @@ export function useFormStructure(forms: Array<any>): Array<any> {
 
     return f
   })
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-validate.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-validate.ts
index 78bbc0de19..f1663aba8f 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-validate.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-form-validate.ts
@@ -60,4 +60,4 @@ export function useFormValidate(forms: Array<any>, model: any) {
   })
 
   return validate
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-task-form.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-task-form.ts
index 7178eac585..0670139c8b 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-task-form.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/task/use-task-form.ts
@@ -33,7 +33,9 @@ export function useTaskForm(data: any) {
   useDynamicLocales(data.locales)
   variables.model = useFormField(data.forms)
   variables.rules = useFormValidate(data.forms, variables.model)
-  variables.formStructure = useFormStructure(useFormRequest(data.apis, data.forms))
+  variables.formStructure = useFormStructure(
+    useFormRequest(data.apis, data.forms)
+  )
 
   const handleValidate = () => {
     variables.taskForm.validate((err: any) => {
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-add-dag-shape.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-add-dag-shape.ts
index a19b3d5ad1..25156cbcd1 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-add-dag-shape.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-add-dag-shape.ts
@@ -22,4 +22,4 @@ export function useAddDagShape(graph: Graph) {
   const cells: Array<Cell> = useDagStore().getDagTasks
 
   ;(graph as Graph).addNode(cells.at(-1) as any)
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-edge.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-edge.ts
index 0ea27d1a68..a97ce27268 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-edge.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-edge.ts
@@ -27,4 +27,4 @@ export function useDagEdge() {
       name: 'orth'
     }
   }
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-graph.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-graph.ts
index 5fa5e28812..1d34573383 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-graph.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-graph.ts
@@ -32,4 +32,4 @@ export function useDagGraph(container: any, minimapContainer: any) {
       container: minimapContainer
     }
   })
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-node.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-node.ts
index 175798fdc2..e721d28dd2 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-node.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-node.ts
@@ -21,4 +21,4 @@ export function useDagNode() {
   return {
     inherit: NodeShape
   }
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-resize.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-resize.ts
index 1cc1f83284..db96a1b54d 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-resize.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-dag-resize.ts
@@ -29,4 +29,4 @@ export function useDagResize(dagContainer: any, graph: Graph) {
   }, 200)
 
   useResizeObserver(dagContainer, resize)
-}
\ No newline at end of file
+}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-sidebar.ts b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-sidebar.ts
index ce5ac51584..7c1c380d28 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-sidebar.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/components/dynamic-dag/use-sidebar.ts
@@ -16,7 +16,10 @@
  */
 
 import { reactive } from 'vue'
-import { queryDynamicTaskCategories, queryDynamicTaskResourceList } from '@/service/modules/dynamic-dag'
+import {
+  queryDynamicTaskCategories,
+  queryDynamicTaskResourceList
+} from '@/service/modules/dynamic-dag'
 
 export function useSidebar() {
   const variables = reactive({
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/definition/components/use-modal.ts b/dolphinscheduler-ui/src/views/projects/workflow/definition/components/use-modal.ts
index a1174479e1..fa1336909e 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/components/use-modal.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/components/use-modal.ts
@@ -87,7 +87,7 @@ export function useModal(
     }
   }
 
-  const handleStartDefinition = async (code: number,version: number) => {
+  const handleStartDefinition = async (code: number, version: number) => {
     await state.startFormRef.validate()
 
     if (state.saving) return
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/definition/create/index.tsx b/dolphinscheduler-ui/src/views/projects/workflow/definition/create/index.tsx
index bc97fd8558..471daa4705 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/create/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/create/index.tsx
@@ -88,9 +88,11 @@ export default defineComponent({
           theme.darkTheme ? Styles['dark'] : Styles['light']
         ]}
       >
-        {
-          route.query.dynamic === 'true' ? <DynamicDag /> : <Dag projectCode={projectCode} onSave={onSave} />
-        }
+        {route.query.dynamic === 'true' ? (
+          <DynamicDag />
+        ) : (
+          <Dag projectCode={projectCode} onSave={onSave} />
+        )}
       </div>
     )
   }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx b/dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx
index 5ec3bee582..b0b6c51035 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx
@@ -43,7 +43,7 @@ import TimingModal from './components/timing-modal'
 import VersionModal from './components/version-modal'
 import CopyModal from './components/copy-modal'
 import type { Router } from 'vue-router'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 export default defineComponent({
   name: 'WorkflowDefinitionList',
@@ -158,15 +158,15 @@ export default defineComponent({
               >
                 {t('project.workflow.create_workflow')}
               </NButton>
-              {
-                this.uiSettingStore.getDynamicTask && <NButton
+              {this.uiSettingStore.getDynamicTask && (
+                <NButton
                   type='warning'
                   size='small'
                   onClick={this.createDefinitionDynamic}
                 >
                   {t('project.workflow.create_workflow_dynamic')}
                 </NButton>
-              }
+              )}
               <NButton
                 strong
                 secondary
@@ -178,7 +178,7 @@ export default defineComponent({
             </NSpace>
             <NSpace>
               <Search
-                placeholder = {t('resource.function.enter_keyword_tips')}
+                placeholder={t('resource.function.enter_keyword_tips')}
                 v-model:value={this.searchVal}
                 onSearch={this.handleSearch}
                 onClear={this.onClearSearch}
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/index.tsx b/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/index.tsx
index 3ce26e1bba..bd348fb8d7 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/index.tsx
@@ -34,7 +34,9 @@ export default defineComponent({
       getTableData({
         pageSize: variables.pageSize,
         pageNo: variables.page,
-        searchVal: variables.searchVal
+        searchVal: variables.searchVal,
+        projectCode: variables.projectCode,
+        processDefinitionCode: variables.processDefinitionCode
       })
     }
 
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/types.ts b/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/types.ts
index cc7f0e769f..8d6231658a 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/types.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/types.ts
@@ -18,5 +18,7 @@
 export interface ISearchParam {
   pageSize: number
   pageNo: number
+  projectCode: number
+  processDefinitionCode: number
   searchVal: string | undefined
 }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/use-table.ts b/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/use-table.ts
index 061e353172..d46a3e8751 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/use-table.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/timing/use-table.ts
@@ -18,7 +18,7 @@
 import { h, ref, reactive } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useRouter } from 'vue-router'
-import { NSpace, NTooltip, NButton, NPopconfirm } from 'naive-ui'
+import { NSpace, NTooltip, NButton, NPopconfirm, NTag } from 'naive-ui'
 import {
   deleteScheduleById,
   offline,
@@ -55,7 +55,10 @@ export function useTable() {
     searchVal: ref(),
     totalPage: ref(1),
     showRef: ref(false),
-    loadingRef: ref(false)
+    loadingRef: ref(false),
+    processDefinitionCode: router.currentRoute.value.params.definitionCode
+      ? ref(Number(router.currentRoute.value.params.definitionCode))
+      : ref()
   })
 
   const renderTime = (time: string, timeZone: string) => {
@@ -118,10 +121,25 @@ export function useTable() {
         title: t('project.workflow.status'),
         key: 'releaseState',
         ...COLUMN_WIDTH_CONFIG['state'],
-        render: (row: any) =>
-          row.releaseState === 'ONLINE'
-            ? t('project.workflow.up_line')
-            : t('project.workflow.down_line')
+        render: (row: any) => {
+          if (row.releaseState === 'ONLINE') {
+            return h(
+              NTag,
+              { type: 'success', size: 'small' },
+              {
+                default: () => t('project.workflow.up_line')
+              }
+            )
+          } else {
+            return h(
+              NTag,
+              { type: 'warning', size: 'small' },
+              {
+                default: () => t('project.workflow.down_line')
+              }
+            )
+          }
+        }
       },
       {
         title: t('project.workflow.worker_group'),
@@ -258,19 +276,16 @@ export function useTable() {
   const getTableData = (params: ISearchParam) => {
     if (variables.loadingRef) return
     variables.loadingRef = true
-    const definitionCode = Number(
-      router.currentRoute.value.params.definitionCode
+
+    queryScheduleListPaging({ ...params }, variables.projectCode).then(
+      (res: any) => {
+        variables.totalPage = res.totalPage
+        variables.tableData = res.totalList.map((item: any) => {
+          return { ...item }
+        })
+        variables.loadingRef = false
+      }
     )
-    queryScheduleListPaging(
-      { ...params, processDefinitionCode: definitionCode },
-      variables.projectCode
-    ).then((res: any) => {
-      variables.totalPage = res.totalPage
-      variables.tableData = res.totalList.map((item: any) => {
-        return { ...item }
-      })
-      variables.loadingRef = false
-    })
   }
 
   const handleReleaseState = (row: any) => {
@@ -284,7 +299,9 @@ export function useTable() {
       getTableData({
         pageSize: variables.pageSize,
         pageNo: variables.page,
-        searchVal: variables.searchVal
+        searchVal: variables.searchVal,
+        projectCode: variables.projectCode,
+        processDefinitionCode: variables.processDefinitionCode
       })
     })
   }
@@ -299,7 +316,9 @@ export function useTable() {
       getTableData({
         pageSize: variables.pageSize,
         pageNo: variables.page,
-        searchVal: variables.searchVal
+        searchVal: variables.searchVal,
+        projectCode: variables.projectCode,
+        processDefinitionCode: variables.processDefinitionCode
       })
     })
   }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/definition/use-table.ts b/dolphinscheduler-ui/src/views/projects/workflow/definition/use-table.ts
index 85eb5cc19a..d8e57139c3 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/use-table.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/use-table.ts
@@ -103,7 +103,7 @@ export function useTable() {
                   ButtonLink,
                   {
                     onClick: () => {
-                      let routeUrl = router.resolve({
+                      const routeUrl = router.resolve({
                         name: 'workflow-definition-detail',
                         params: { code: row.code }
                       })
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/instance/components/variables-view.tsx b/dolphinscheduler-ui/src/views/projects/workflow/instance/components/variables-view.tsx
index 2f75fd3e54..6c1e302766 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/instance/components/variables-view.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/instance/components/variables-view.tsx
@@ -19,11 +19,10 @@ import { useRoute } from 'vue-router'
 import { defineComponent, onMounted, ref, computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { viewVariables } from '@/service/modules/process-instances'
-import { viewProcessDefinitionVariables } from "@/service/modules/process-definition";
+import { viewProcessDefinitionVariables } from '@/service/modules/process-definition'
 import styles from './variables.module.scss'
 import { NButton } from 'naive-ui'
 
-
 export default defineComponent({
   name: 'variables-view',
   emits: ['copy'],
@@ -38,18 +37,24 @@ export default defineComponent({
     const processCode = Number(route.params.code)
 
     const globalParams = computed(() => {
-      return paramsRef.value && paramsRef.value.globalParams ? paramsRef.value.globalParams : []
+      return paramsRef.value && paramsRef.value.globalParams
+        ? paramsRef.value.globalParams
+        : []
     })
 
     const localParams = computed(() => {
-      return paramsRef.value && paramsRef.value.localParams ? paramsRef.value.localParams : {}
+      return paramsRef.value && paramsRef.value.localParams
+        ? paramsRef.value.localParams
+        : {}
     })
 
     const getViewVariables = () => {
       if (Number.isNaN(instanceId)) {
-        viewProcessDefinitionVariables(projectCode, processCode).then((res: any) => {
-          paramsRef.value = res
-        })
+        viewProcessDefinitionVariables(projectCode, processCode).then(
+          (res: any) => {
+            paramsRef.value = res
+          }
+        )
       } else {
         viewVariables(instanceId, projectCode).then((res: any) => {
           paramsRef.value = res
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/instance/use-table.ts b/dolphinscheduler-ui/src/views/projects/workflow/instance/use-table.ts
index 2eee813e8e..c2771c7c35 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/instance/use-table.ts
+++ b/dolphinscheduler-ui/src/views/projects/workflow/instance/use-table.ts
@@ -98,7 +98,7 @@ export function useTable() {
             ButtonLink,
             {
               onClick: () => {
-                let routeUrl = router.resolve({
+                const routeUrl = router.resolve({
                   name: 'workflow-instance-detail',
                   params: { id: row.id },
                   query: { code: row.processDefinitionCode }
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/relation/index.tsx b/dolphinscheduler-ui/src/views/projects/workflow/relation/index.tsx
index b0557ad053..9d1aae4965 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/relation/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/relation/index.tsx
@@ -18,7 +18,14 @@
 import { defineComponent, onMounted, toRefs, watch, VNode, h } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useRoute } from 'vue-router'
-import { NSelect, NButton, NIcon, NSpace, NTooltip, SelectOption } from 'naive-ui'
+import {
+  NSelect,
+  NButton,
+  NIcon,
+  NSpace,
+  NTooltip,
+  SelectOption
+} from 'naive-ui'
 import { ReloadOutlined, EyeOutlined } from '@vicons/antd'
 import { useRelation } from './use-relation'
 import Card from '@/components/card'
@@ -48,7 +55,13 @@ const workflowRelation = defineComponent({
         : getWorkflowList(Number(route.params.projectCode))
     }
 
-    const renderOption = ({ node, option }: { node: VNode; option: SelectOption }) =>
+    const renderOption = ({
+      node,
+      option
+    }: {
+      node: VNode
+      option: SelectOption
+    }) =>
       h(NTooltip, null, {
         trigger: () => node,
         default: () => option.label
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/timing/components/timing-condition.tsx b/dolphinscheduler-ui/src/views/projects/workflow/timing/components/timing-condition.tsx
new file mode 100644
index 0000000000..de69eb6254
--- /dev/null
+++ b/dolphinscheduler-ui/src/views/projects/workflow/timing/components/timing-condition.tsx
@@ -0,0 +1,87 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { SearchOutlined } from '@vicons/antd'
+import { NButton, NSelect, NIcon, NSpace, NEllipsis } from 'naive-ui'
+import { defineComponent, h, ref } from 'vue'
+import { queryProcessDefinitionList } from '@/service/modules/process-definition'
+import { SelectMixedOption } from 'naive-ui/lib/select/src/interface'
+import { Router, useRouter } from 'vue-router'
+
+export default defineComponent({
+  name: 'TimingCondition',
+  emits: ['handleSearch'],
+  setup(props, ctx) {
+    const router: Router = useRouter()
+
+    const projectCode = ref(
+      Number(router.currentRoute.value.params.projectCode)
+    )
+    const processDefineCodeRef = router.currentRoute.value.query
+      .processDefineCode
+      ? ref(Number(router.currentRoute.value.query.processDefineCode))
+      : ref()
+
+    const processDefinitionOptions = ref<Array<SelectMixedOption>>([])
+
+    const initProcessList = (code: number) => {
+      queryProcessDefinitionList(code).then((result: any) => {
+        result.map((item: { code: number; name: string }) => {
+          const option: SelectMixedOption = {
+            value: item.code,
+            label: () => h(NEllipsis, null, item.name),
+            filterLabel: item.name
+          }
+          processDefinitionOptions.value.push(option)
+        })
+      })
+    }
+
+    initProcessList(projectCode.value)
+
+    const handleSearch = () => {
+      ctx.emit('handleSearch', {
+        processDefinitionCode: processDefineCodeRef.value
+      })
+    }
+
+    return {
+      handleSearch,
+      processDefinitionOptions,
+      processDefineCodeRef
+    }
+  },
+  render() {
+    return (
+      <NSpace justify='end'>
+        <NSelect
+          clearable
+          filterable
+          options={this.processDefinitionOptions}
+          size='small'
+          style={{ width: '310px' }}
+          v-model:value={this.processDefineCodeRef}
+        />
+        <NButton type='primary' size='small' onClick={this.handleSearch}>
+          <NIcon>
+            <SearchOutlined />
+          </NIcon>
+        </NButton>
+      </NSpace>
+    )
+  }
+})
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/timing/index.tsx b/dolphinscheduler-ui/src/views/projects/workflow/timing/index.tsx
new file mode 100644
index 0000000000..1228cfd835
--- /dev/null
+++ b/dolphinscheduler-ui/src/views/projects/workflow/timing/index.tsx
@@ -0,0 +1,116 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { NDataTable, NPagination, NSpace } from 'naive-ui'
+import { defineComponent, onMounted, toRefs, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useTable } from '../definition/timing/use-table'
+import Card from '@/components/card'
+import TimingModal from '../definition/components/timing-modal'
+import TimingCondition from '@/views/projects/workflow/timing/components/timing-condition'
+import { ITimingSearch } from '@/views/projects/workflow/timing/types'
+
+export default defineComponent({
+  name: 'WorkflowTimingList',
+  setup() {
+    const { variables, createColumns, getTableData } = useTable()
+
+    const requestData = () => {
+      getTableData({
+        pageSize: variables.pageSize,
+        pageNo: variables.page,
+        searchVal: variables.searchVal,
+        projectCode: variables.projectCode,
+        processDefinitionCode: variables.processDefinitionCode
+      })
+    }
+
+    const handleUpdateList = () => {
+      requestData()
+    }
+
+    const handleSearch = (params: ITimingSearch) => {
+      variables.processDefinitionCode = params.processDefinitionCode
+      variables.page = 1
+      requestData()
+    }
+
+    const handleChangePageSize = () => {
+      variables.page = 1
+      requestData()
+    }
+
+    onMounted(() => {
+      createColumns(variables)
+      requestData()
+    })
+
+    watch(useI18n().locale, () => {
+      createColumns(variables)
+    })
+
+    return {
+      requestData,
+      handleSearch,
+      handleUpdateList,
+      handleChangePageSize,
+      ...toRefs(variables)
+    }
+  },
+  render() {
+    const { t } = useI18n()
+    const { loadingRef } = this
+
+    return (
+      <NSpace vertical>
+        <Card>
+          <TimingCondition onHandleSearch={this.handleSearch} />
+        </Card>
+        <Card title={t('project.workflow.cron_manage')}>
+          <NSpace vertical>
+            <NDataTable
+              loading={loadingRef}
+              columns={this.columns}
+              data={this.tableData}
+              striped
+              size={'small'}
+              scrollX={this.tableWidth}
+            />
+            <NSpace justify='center'>
+              <NPagination
+                v-model:page={this.page}
+                v-model:page-size={this.pageSize}
+                page-count={this.totalPage}
+                show-size-picker
+                page-sizes={[10, 30, 50]}
+                show-quick-jumper
+                onUpdatePage={this.requestData}
+                onUpdatePageSize={this.handleChangePageSize}
+              />
+            </NSpace>
+          </NSpace>
+        </Card>
+        <TimingModal
+          type={'update'}
+          v-model:row={this.row}
+          v-model:show={this.showRef}
+          onUpdateList={this.handleUpdateList}
+        />
+      </NSpace>
+    )
+  }
+})
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/timing/types.ts b/dolphinscheduler-ui/src/views/projects/workflow/timing/types.ts
new file mode 100644
index 0000000000..c6f8719ad9
--- /dev/null
+++ b/dolphinscheduler-ui/src/views/projects/workflow/timing/types.ts
@@ -0,0 +1,22 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+interface ITimingSearch {
+  processDefinitionCode: number
+}
+
+export { ITimingSearch }
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/create/use-form.ts b/dolphinscheduler-ui/src/views/resource/components/resource/create/use-form.ts
index ed13587da7..96b5b696fc 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/create/use-form.ts
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/create/use-form.ts
@@ -18,7 +18,7 @@
 import { useI18n } from 'vue-i18n'
 import { reactive, ref, unref } from 'vue'
 import type { FormRules } from 'naive-ui'
-import { ICreateFileDefaultValue } from "@/views/resource/components/resource/types";
+import { ICreateFileDefaultValue } from '@/views/resource/components/resource/types'
 
 const defaultValue: ICreateFileDefaultValue = () => ({
   pid: -1,
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/edit/index.tsx b/dolphinscheduler-ui/src/views/resource/components/resource/edit/index.tsx
index 5f7d8c5dd6..0e2e6ea0c9 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/edit/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/edit/index.tsx
@@ -33,8 +33,8 @@ export default defineComponent({
 
     const componentName = route.name
     // fullname is now the id of resources
-    const fullName = String(router.currentRoute.value.query.prefix || "")
-    const tenantCode = String(router.currentRoute.value.query.tenantCode || "")
+    const fullName = String(router.currentRoute.value.query.prefix || '')
+    const tenantCode = String(router.currentRoute.value.query.tenantCode || '')
 
     const { state } = useForm()
     const { getResourceView, handleUpdateContent } = useEdit(state)
@@ -129,4 +129,4 @@ export default defineComponent({
       </Card>
     )
   }
-})
\ No newline at end of file
+})
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/edit/use-edit.ts b/dolphinscheduler-ui/src/views/resource/components/resource/edit/use-edit.ts
index 122fda8d7b..111b2e304e 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/edit/use-edit.ts
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/edit/use-edit.ts
@@ -19,7 +19,10 @@ import { useI18n } from 'vue-i18n'
 import type { Router } from 'vue-router'
 import { useRouter } from 'vue-router'
 import { useAsyncState } from '@vueuse/core'
-import { updateResourceContent, viewResource } from '@/service/modules/resources'
+import {
+  updateResourceContent,
+  viewResource
+} from '@/service/modules/resources'
 
 export function useEdit(state: any) {
   const { t } = useI18n()
@@ -41,13 +44,11 @@ export function useEdit(state: any) {
   const handleUpdateContent = (fullName: string, tenantCode: string) => {
     state.fileFormRef.validate(async (valid: any) => {
       if (!valid) {
-        await updateResourceContent(
-          {
-            ...state.fileForm,
-            tenantCode: tenantCode,
-            fullName: fullName,
-          },
-        )
+        await updateResourceContent({
+          ...state.fileForm,
+          tenantCode: tenantCode,
+          fullName: fullName
+        })
 
         window.$message.success(t('resource.file.success'))
         router.go(-1)
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/folder/index.tsx b/dolphinscheduler-ui/src/views/resource/components/resource/folder/index.tsx
index c7eb4d8792..dcf8a411f7 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/folder/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/folder/index.tsx
@@ -22,7 +22,7 @@ import Modal from '@/components/modal'
 import { noSpace } from '@/utils/trim'
 import { useForm } from './use-form'
 import { useFolder } from './use-folder'
-import { ResourceType } from "@/views/resource/components/resource/types";
+import { ResourceType } from '@/views/resource/components/resource/types'
 
 const props = {
   show: {
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/folder/use-form.ts b/dolphinscheduler-ui/src/views/resource/components/resource/folder/use-form.ts
index 63718e90fc..aacdc1af42 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/folder/use-form.ts
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/folder/use-form.ts
@@ -18,7 +18,7 @@
 import { reactive, ref, unref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import type { FormRules } from 'naive-ui'
-import { IFolderDefaultValue } from "@/views/resource/components/resource/types";
+import { IFolderDefaultValue } from '@/views/resource/components/resource/types'
 
 const defaultValue: IFolderDefaultValue = () => ({
   pid: -1,
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/index.tsx b/dolphinscheduler-ui/src/views/resource/components/resource/index.tsx
index e6bbfd5297..0021f2aa59 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/index.tsx
@@ -49,7 +49,6 @@ import Search from '@/components/input-search'
 import { ResourceType } from '@/views/resource/components/resource/types'
 import { useUserStore } from '@/store/user/user'
 
-
 const props = {
   resourceType: {
     type: String as PropType<ResourceType>,
@@ -71,7 +70,7 @@ export default defineComponent({
       requestData,
       updateList,
       createColumns,
-      handleCreateFile,
+      handleCreateFile
     } = useTable()
 
     const userStore = useUserStore()
@@ -109,27 +108,41 @@ export default defineComponent({
     onMounted(() => {
       createColumns(variables)
       fileStore.setCurrentDir(variables.fullName)
-      breadListRef.value = fileStore.getCurrentDir.replace(/\/+$/g, '')
-        .split('/').slice(2) as Array<string>
+      breadListRef.value = fileStore.getCurrentDir
+        .replace(/\/+$/g, '')
+        .split('/')
+        .slice(2) as Array<string>
       requestData()
     })
 
     const trim = getCurrentInstance()?.appContext.config.globalProperties.trim
 
     const handleBread = (index: number) => {
-      const breadName = variables.fullName.split('/').slice(0, index+3).join('/')+'/'
+      const breadName =
+        variables.fullName
+          .split('/')
+          .slice(0, index + 3)
+          .join('/') + '/'
       goBread(breadName)
     }
 
     const goBread = (fullName: string) => {
       const { resourceType, tenantCode } = variables
-      const baseDir = resourceType === 'UDF' ? userStore.getBaseUdfDir : userStore.getBaseResDir
+      const baseDir =
+        resourceType === 'UDF'
+          ? userStore.getBaseUdfDir
+          : userStore.getBaseResDir
       if (fullName === '' || !fullName.startsWith(baseDir)) {
-        router.push({ name: resourceType === 'UDF' ? 'resource-manage' : 'file-manage' })
+        router.push({
+          name: resourceType === 'UDF' ? 'resource-manage' : 'file-manage'
+        })
       } else {
         router.push({
-          name: resourceType === 'UDF' ? 'resource-sub-manage' : 'resource-file-subdirectory',
-          query: { prefix: fullName, tenantCode: tenantCode}
+          name:
+            resourceType === 'UDF'
+              ? 'resource-sub-manage'
+              : 'resource-file-subdirectory',
+          query: { prefix: fullName, tenantCode: tenantCode }
         })
       }
     }
@@ -162,11 +175,12 @@ export default defineComponent({
       handleCreateFolder,
       handleCreateFile,
       handleUploadFile,
-      tableWidth,
+      tableWidth
     } = this
-    const manageTitle = this.resourceType === 'UDF'
-      ? t('resource.udf.udf_resources')
-      : t('resource.file.file_manage')
+    const manageTitle =
+      this.resourceType === 'UDF'
+        ? t('resource.udf.udf_resources')
+        : t('resource.file.file_manage')
 
     return (
       <NSpace vertical>
@@ -180,27 +194,26 @@ export default defineComponent({
               >
                 {t('resource.file.create_folder')}
               </NButton>
-              {this.resourceType !== 'UDF' &&
-                  <NButton onClick={handleCreateFile} class='btn-create-file'>
-                    {t('resource.file.create_file')}
-                  </NButton>
-              }
+              {this.resourceType !== 'UDF' && (
+                <NButton onClick={handleCreateFile} class='btn-create-file'>
+                  {t('resource.file.create_file')}
+                </NButton>
+              )}
               <NButton onClick={handleUploadFile} class='btn-upload-resource'>
                 {this.resourceType === 'UDF'
                   ? t('resource.udf.upload_udf_resources')
-                  : t('resource.file.upload_files')
-                }
+                  : t('resource.file.upload_files')}
               </NButton>
             </NButtonGroup>
             <NSpace>
               <Search
-                placeholder = {t('resource.file.enter_keyword_tips')}
+                placeholder={t('resource.file.enter_keyword_tips')}
                 v-model:value={this.searchRef}
                 onSearch={handleConditions}
               />
               <NButton size='small' type='primary' onClick={handleConditions}>
                 <NIcon>
-                  <SearchOutlined/>
+                  <SearchOutlined />
                 </NIcon>
               </NButton>
             </NSpace>
@@ -214,9 +227,12 @@ export default defineComponent({
                   <NBreadcrumbItem>
                     <NButton
                       text
-                      disabled={index > 0 && index === this.breadListRef!.length - 1}
+                      disabled={
+                        index > 0 && index === this.breadListRef!.length - 1
+                      }
                       onClick={() => this.handleBread(index)}
-                    >{index === 0 ? manageTitle : item}
+                    >
+                      {index === 0 ? manageTitle : item}
                     </NButton>
                   </NBreadcrumbItem>
                 ))}
@@ -277,4 +293,4 @@ export default defineComponent({
       </NSpace>
     )
   }
-})
\ No newline at end of file
+})
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/rename/index.tsx b/dolphinscheduler-ui/src/views/resource/components/resource/rename/index.tsx
index 4866a8d743..9dd9bb448a 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/rename/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/rename/index.tsx
@@ -26,7 +26,7 @@ import { useI18n } from 'vue-i18n'
 import Modal from '@/components/modal'
 import { useForm } from './use-form'
 import { useRename } from './use-rename'
-import type { ResourceType } from "@/views/resource/components/resource/types";
+import type { ResourceType } from '@/views/resource/components/resource/types'
 
 const props = {
   show: {
@@ -60,7 +60,13 @@ export default defineComponent({
   props,
   emits: ['updateList', 'update:show'],
   setup(props, ctx) {
-    const { state, resetForm } = useForm(props.resourceType!,props.fullName, props.name, props.description, props.userName)
+    const { state, resetForm } = useForm(
+      props.resourceType!,
+      props.fullName,
+      props.name,
+      props.description,
+      props.userName
+    )
     const { handleRenameFile } = useRename(state)
     const hideModal = () => {
       ctx.emit('update:show', false)
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/rename/use-form.ts b/dolphinscheduler-ui/src/views/resource/components/resource/rename/use-form.ts
index a8dc6599d5..bc4f134a56 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/rename/use-form.ts
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/rename/use-form.ts
@@ -18,9 +18,18 @@
 import { reactive, ref, unref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import type { FormRules } from 'naive-ui'
-import { IRenameDefaultValue, ResourceType } from "@/views/resource/components/resource/types";
+import {
+  IRenameDefaultValue,
+  ResourceType
+} from '@/views/resource/components/resource/types'
 
-const defaultValue:IRenameDefaultValue = (type: ResourceType, fullName = '', name = '', description = '', user_name = '') => ({
+const defaultValue: IRenameDefaultValue = (
+  type: ResourceType,
+  fullName = '',
+  name = '',
+  description = '',
+  user_name = ''
+) => ({
   fullName,
   name,
   type: type,
@@ -28,15 +37,30 @@ const defaultValue:IRenameDefaultValue = (type: ResourceType, fullName = '', nam
   user_name
 })
 
-export function useForm(resourceType: ResourceType, fullName: string, name: string, description: string, user_name: string) {
+export function useForm(
+  resourceType: ResourceType,
+  fullName: string,
+  name: string,
+  description: string,
+  user_name: string
+) {
   const { t } = useI18n()
   const resetForm = () => {
-    state.renameForm = Object.assign(unref(state.renameForm), defaultValue(resourceType))
+    state.renameForm = Object.assign(
+      unref(state.renameForm),
+      defaultValue(resourceType)
+    )
   }
 
   const state = reactive({
     renameFormRef: ref(),
-    renameForm: defaultValue(resourceType,fullName, name, description, user_name),
+    renameForm: defaultValue(
+      resourceType,
+      fullName,
+      name,
+      description,
+      user_name
+    ),
     saving: false,
     rules: {
       name: {
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/rename/use-rename.ts b/dolphinscheduler-ui/src/views/resource/components/resource/rename/use-rename.ts
index bd3a064c38..f4d80dbb3d 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/rename/use-rename.ts
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/rename/use-rename.ts
@@ -31,12 +31,10 @@ export function useRename(state: any) {
     if (state.saving) return
     state.saving = true
     try {
-      await updateResource(
-        {
-          ...state.renameForm,
-          tenantCode: state.renameForm.user_name,
-        }
-      )
+      await updateResource({
+        ...state.renameForm,
+        tenantCode: state.renameForm.user_name
+      })
       window.$message.success(t('resource.file.success'))
       state.saving = false
       emit('updateList')
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/table/table-action.tsx b/dolphinscheduler-ui/src/views/resource/components/resource/table/table-action.tsx
index d1f2f4b20f..5fb28a4b27 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/table/table-action.tsx
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/table/table-action.tsx
@@ -28,7 +28,12 @@ import {
 } from '@vicons/antd'
 import _ from 'lodash'
 import { useI18n } from 'vue-i18n'
-import { ResourceFileTableData, IRenameResource, IRtDisb, IReuploadResource } from '../types'
+import {
+  ResourceFileTableData,
+  IRenameResource,
+  IRtDisb,
+  IReuploadResource
+} from '../types'
 import { fileTypeArr } from '@/common/common'
 import { downloadResource, deleteResource } from '@/service/modules/resources'
 import type { Router } from 'vue-router'
@@ -43,7 +48,7 @@ const props = {
     default: {
       name: '',
       description: '',
-      user_name: '',
+      user_name: ''
     }
   }
 }
@@ -63,19 +68,35 @@ export default defineComponent({
       return !(flag && size < 1000000)
     }
 
-    const handleEditFile = (item: {fullName: string, user_name: string }) => {
-      router.push({ name: 'resource-file-edit', query: {prefix: item.fullName, tenantCode: item.user_name} })
+    const handleEditFile = (item: { fullName: string; user_name: string }) => {
+      router.push({
+        name: 'resource-file-edit',
+        query: { prefix: item.fullName, tenantCode: item.user_name }
+      })
     }
 
-    const handleDeleteFile = (fullNameObj: {fullName: string, tenantCode: string}) => {
+    const handleDeleteFile = (fullNameObj: {
+      fullName: string
+      tenantCode: string
+    }) => {
       deleteResource(fullNameObj).then(() => emit('updateList'))
     }
 
-    const handleReuploadFile: IReuploadResource = (name: string, description: string, fullName: string, user_name: string) => {
+    const handleReuploadFile: IReuploadResource = (
+      name: string,
+      description: string,
+      fullName: string,
+      user_name: string
+    ) => {
       emit('reuploadResource', name, description, fullName, user_name)
     }
 
-    const handleRenameFile: IRenameResource = (name: string, description: string, fullName: string, user_name: string) => {
+    const handleRenameFile: IRenameResource = (
+      name: string,
+      description: string,
+      fullName: string,
+      user_name: string
+    ) => {
       emit('renameResource', name, description, fullName, user_name)
     }
 
@@ -93,31 +114,34 @@ export default defineComponent({
     const { t } = useI18n()
     return (
       <NSpace>
-        { this.row.type !== 'UDF' &&
-        <NTooltip trigger={'hover'}>
-          {{
-            default: () => t('resource.file.edit'),
-            trigger: () => (
-              <NButton
-                size='tiny'
-                type='info'
-                disabled={this.rtDisb(this.row.name, this.row.size)}
-                tag='div'
-                onClick={() => {
-                  this.handleEditFile({fullName:this.row.fullName, user_name:this.row.user_name})
-                }}
-                style={{ marginRight: '-5px' }}
-                circle
-                class='btn-edit'
-              >
-                <NIcon>
-                  <FormOutlined />
-                </NIcon>
-              </NButton>
-            )
-          }}
-        </NTooltip>
-        }
+        {this.row.type !== 'UDF' && (
+          <NTooltip trigger={'hover'}>
+            {{
+              default: () => t('resource.file.edit'),
+              trigger: () => (
+                <NButton
+                  size='tiny'
+                  type='info'
+                  disabled={this.rtDisb(this.row.name, this.row.size)}
+                  tag='div'
+                  onClick={() => {
+                    this.handleEditFile({
+                      fullName: this.row.fullName,
+                      user_name: this.row.user_name
+                    })
+                  }}
+                  style={{ marginRight: '-5px' }}
+                  circle
+                  class='btn-edit'
+                >
+                  <NIcon>
+                    <FormOutlined />
+                  </NIcon>
+                </NButton>
+              )
+            }}
+          </NTooltip>
+        )}
         <NTooltip trigger={'hover'}>
           {{
             default: () => t('resource.file.reupload'),
@@ -139,7 +163,7 @@ export default defineComponent({
                 class='btn-reupload'
               >
                 <NIcon>
-                  <UploadOutlined/>
+                  <UploadOutlined />
                 </NIcon>
               </NButton>
             )
@@ -159,9 +183,7 @@ export default defineComponent({
                     this.row.fullName,
                     this.row.user_name
                   )
-                }
-
-                }
+                }}
                 style={{ marginRight: '-5px' }}
                 circle
                 class='btn-rename'
@@ -184,7 +206,9 @@ export default defineComponent({
                 tag='div'
                 circle
                 style={{ marginRight: '-5px' }}
-                onClick={() => downloadResource({fullName: this.row.fullName})}
+                onClick={() =>
+                  downloadResource({ fullName: this.row.fullName })
+                }
                 class='btn-download'
               >
                 <NIcon>
@@ -203,7 +227,10 @@ export default defineComponent({
                   positive-text={t('resource.file.confirm')}
                   negative-text={t('resource.file.cancel')}
                   onPositiveClick={() => {
-                    this.handleDeleteFile({fullName: this.row.fullName, tenantCode: this.row.user_name})
+                    this.handleDeleteFile({
+                      fullName: this.row.fullName,
+                      tenantCode: this.row.user_name
+                    })
                   }}
                 >
                   {{
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/table/use-table.ts b/dolphinscheduler-ui/src/views/resource/components/resource/table/use-table.ts
index 1bd73ae510..ad680ef0d4 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/table/use-table.ts
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/table/use-table.ts
@@ -29,28 +29,33 @@ import {
   DefaultTableWidth
 } from '@/common/column-width-config'
 import type { Router } from 'vue-router'
-import { useFileState } from "@/views/resource/components/resource/use-file";
+import { useFileState } from '@/views/resource/components/resource/use-file'
 
 const goSubFolder = (router: Router, item: any) => {
   if (item.directory) {
     router.push({
-      name: item.type === 'UDF' ? 'resource-sub-manage' : 'resource-file-subdirectory',
-      query: { prefix: item.fullName, tenantCode: item.user_name}
+      name:
+        item.type === 'UDF'
+          ? 'resource-sub-manage'
+          : 'resource-file-subdirectory',
+      query: { prefix: item.fullName, tenantCode: item.user_name }
     })
   } else if (item.type === 'FILE') {
-    router.push({ name: 'resource-file-list', query: {prefix: item.fullName, tenantCode: item.user_name}} )
+    router.push({
+      name: 'resource-file-list',
+      query: { prefix: item.fullName, tenantCode: item.user_name }
+    })
   }
 }
 
-
 export function useTable() {
   const { t } = useI18n()
   const router: Router = useRouter()
 
   const variables = reactive({
     columns: [],
-    fullName: ref(String(router.currentRoute.value.query.prefix || "")),
-    tenantCode: ref(String(router.currentRoute.value.query.tenantCode || "")),
+    fullName: ref(String(router.currentRoute.value.query.prefix || '')),
+    tenantCode: ref(String(router.currentRoute.value.query.tenantCode || '')),
     resourceType: ref<ResourceType>(),
     resourceList: ref(),
     folderShowRef: ref(false),
@@ -75,7 +80,6 @@ export function useTable() {
       pageSize: 10,
       itemCount: 0,
       pageSizes: [10, 30, 50]
-
     })
   })
 
@@ -93,20 +97,20 @@ export function useTable() {
         ...COLUMN_WIDTH_CONFIG['linkName'],
         render: (row: any) => {
           return !row.directory
-              ? row.alias
-              : h(
-                  ButtonLink,
-                  {
-                    onClick: () => goSubFolder(router, row)
-                  },
-                  {
-                    default: () =>
-                        h(
-                            NEllipsis,
-                            COLUMN_WIDTH_CONFIG['linkEllipsis'],
-                            () => row.alias
-                        )
-                  }
+            ? row.alias
+            : h(
+                ButtonLink,
+                {
+                  onClick: () => goSubFolder(router, row)
+                },
+                {
+                  default: () =>
+                    h(
+                      NEllipsis,
+                      COLUMN_WIDTH_CONFIG['linkEllipsis'],
+                      () => row.alias
+                    )
+                }
               )
         }
       },
@@ -120,7 +124,7 @@ export function useTable() {
         key: 'whether_directory',
         ...COLUMN_WIDTH_CONFIG['yesOrNo'],
         render: (row: any) =>
-            row.directory ? t('resource.file.yes') : t('resource.file.no')
+          row.directory ? t('resource.file.yes') : t('resource.file.no')
       },
       {
         title: t('resource.file.file_name'),
@@ -152,47 +156,57 @@ export function useTable() {
         title: t('resource.file.operation'),
         key: 'operation',
         render: (row: any) =>
-            h(TableAction, {
-              row,
-              onReuploadResource: ( name, description, fullName, user_name ) =>
-                  reuploadResource( name, description, fullName, user_name ),
-              onRenameResource: ( name, description, fullName, user_name ) =>
-                  renameResource( name, description, fullName, user_name ),
-              onUpdateList: () => updateList()
-            }),
-        ...COLUMN_WIDTH_CONFIG['operation'](variables.resourceType === 'UDF' ? 4 : 5)
+          h(TableAction, {
+            row,
+            onReuploadResource: (name, description, fullName, user_name) =>
+              reuploadResource(name, description, fullName, user_name),
+            onRenameResource: (name, description, fullName, user_name) =>
+              renameResource(name, description, fullName, user_name),
+            onUpdateList: () => updateList()
+          }),
+        ...COLUMN_WIDTH_CONFIG['operation'](
+          variables.resourceType === 'UDF' ? 4 : 5
+        )
       }
     ]
   }
 
   const createFile = () => {
     const { fullName } = variables
-    const name = fullName
-      ? 'resource-subfile-create'
-      : 'resource-file-create'
+    const name = fullName ? 'resource-subfile-create' : 'resource-file-create'
     router.push({
       name,
-      params: { id: fullName}
+      params: { id: fullName }
     })
   }
 
-  const reuploadResource: IReuploadResource = ( name, description, fullName, user_name ) => {
+  const reuploadResource: IReuploadResource = (
+    name,
+    description,
+    fullName,
+    user_name
+  ) => {
     variables.reuploadInfo = {
       name: name,
       description: description,
       fullName: fullName,
-      user_name:user_name
+      user_name: user_name
     }
     variables.isReupload = true
     variables.uploadShowRef = true
   }
 
-  const renameResource: IRenameResource = ( name, description, fullName, user_name ) => {
+  const renameResource: IRenameResource = (
+    name,
+    description,
+    fullName,
+    user_name
+  ) => {
     variables.renameInfo = {
       name: name,
       description: description,
       fullName: fullName,
-      user_name:user_name
+      user_name: user_name
     }
     variables.renameShowRef = true
   }
@@ -214,7 +228,6 @@ export function useTable() {
     )
   }
 
-
   const updateList = () => {
     variables.pagination.page = 1
     requestData()
@@ -226,6 +239,6 @@ export function useTable() {
     requestData,
     updateList,
     createColumns,
-    handleCreateFile: createFile,
+    handleCreateFile: createFile
   }
 }
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/types.ts b/dolphinscheduler-ui/src/views/resource/components/resource/types.ts
index b6661ec980..d52230c0e8 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/types.ts
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/types.ts
@@ -46,7 +46,14 @@ export interface IRtDisb {
 }
 
 export interface IResourceListState {
-  (type: ResourceType, searchVal?: string, fullName?: string, tenantCode?: string, pageNo?: number, pageSize?: number): any
+  (
+    type: ResourceType,
+    searchVal?: string,
+    fullName?: string,
+    tenantCode?: string,
+    pageNo?: number,
+    pageSize?: number
+  ): any
 }
 
 export interface BasicTableProps {
@@ -81,25 +88,24 @@ export interface BreadcrumbItem {
 
 export interface ICreateFileDefaultValue {
   (): {
-    pid: number,
-    type: ResourceType,
-    suffix: string,
-    fileName: string,
-    description: string,
-    content: string,
+    pid: number
+    type: ResourceType
+    suffix: string
+    fileName: string
+    description: string
+    content: string
     currentDir: string
   }
 }
 
 export interface IFolderDefaultValue {
-  ():
-    {
-      pid: number,
-      type: ResourceType,
-      name: string,
-      description: string,
-      currentDir: string
-    }
+  (): {
+    pid: number
+    type: ResourceType
+    name: string
+    description: string
+    currentDir: string
+  }
 }
 
 export interface IRenameDefaultValue {
@@ -109,20 +115,25 @@ export interface IRenameDefaultValue {
     name?: string,
     description?: string,
     user_name?: string
-  ): {fullName: string, name: string, type: ResourceType, description: string, user_name: string}
+  ): {
+    fullName: string
+    name: string
+    type: ResourceType
+    description: string
+    user_name: string
+  }
 }
 
 export interface IUploadDefaultValue {
-  ():
-    {
-      isReupload: boolean,
-      fullName: string,
-      user_name: string,
-      name: string,
-      file: string,
-      description: string,
-      type: ResourceType,
-      pid: number,
-      currentDir: string
-    }
-}
\ No newline at end of file
+  (): {
+    isReupload: boolean
+    fullName: string
+    user_name: string
+    name: string
+    file: string
+    description: string
+    type: ResourceType
+    pid: number
+    currentDir: string
+  }
+}
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/upload/index.tsx b/dolphinscheduler-ui/src/views/resource/components/resource/upload/index.tsx
index 3639c417ee..c6a0390de8 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/upload/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/upload/index.tsx
@@ -14,14 +14,20 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { defineComponent, toRefs, PropType, getCurrentInstance, watch } from 'vue'
+import {
+  defineComponent,
+  toRefs,
+  PropType,
+  getCurrentInstance,
+  watch
+} from 'vue'
 import { NButton, NForm, NFormItem, NInput, NUpload } from 'naive-ui'
 
 import { useI18n } from 'vue-i18n'
 import Modal from '@/components/modal'
 import { useForm } from './use-form'
 import { useUpload } from './use-upload'
-import { ResourceType } from "@/views/resource/components/resource/types";
+import { ResourceType } from '@/views/resource/components/resource/types'
 
 const props = {
   show: {
@@ -84,7 +90,6 @@ export default defineComponent({
 
     const trim = getCurrentInstance()?.appContext.config.globalProperties.trim
 
-
     watch(
       () => props.show,
       () => {
diff --git a/dolphinscheduler-ui/src/views/resource/components/resource/upload/use-form.ts b/dolphinscheduler-ui/src/views/resource/components/resource/upload/use-form.ts
index 4c47963e93..04673b110a 100644
--- a/dolphinscheduler-ui/src/views/resource/components/resource/upload/use-form.ts
+++ b/dolphinscheduler-ui/src/views/resource/components/resource/upload/use-form.ts
@@ -18,7 +18,7 @@
 import { reactive, ref, unref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import type { FormRules } from 'naive-ui'
-import { IUploadDefaultValue } from "@/views/resource/components/resource/types";
+import { IUploadDefaultValue } from '@/views/resource/components/resource/types'
 
 const defaultValue: IUploadDefaultValue = () => ({
   isReupload: false,
diff --git a/dolphinscheduler-ui/src/views/resource/file/create/index.tsx b/dolphinscheduler-ui/src/views/resource/file/create/index.tsx
index 1c07e9b07a..d59d03d3c1 100644
--- a/dolphinscheduler-ui/src/views/resource/file/create/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/file/create/index.tsx
@@ -20,9 +20,8 @@ import ResourceCreateModal from '../../components/resource/create'
 
 export default defineComponent({
   name: 'ResourceFileCreate',
-  setup() {
-  },
+  setup() {},
   render() {
-    return <ResourceCreateModal/>
+    return <ResourceCreateModal />
   }
-})
\ No newline at end of file
+})
diff --git a/dolphinscheduler-ui/src/views/resource/file/edit/index.tsx b/dolphinscheduler-ui/src/views/resource/file/edit/index.tsx
index d78e7d1c71..d0915cf345 100644
--- a/dolphinscheduler-ui/src/views/resource/file/edit/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/file/edit/index.tsx
@@ -20,9 +20,8 @@ import ResourceEditModal from '../../components/resource/edit'
 
 export default defineComponent({
   name: 'ResourceFileEdit',
-  setup() {
-  },
+  setup() {},
   render() {
-    return <ResourceEditModal/>
+    return <ResourceEditModal />
   }
-})
\ No newline at end of file
+})
diff --git a/dolphinscheduler-ui/src/views/resource/file/index.tsx b/dolphinscheduler-ui/src/views/resource/file/index.tsx
index 301a7cac9a..5ec972a31f 100644
--- a/dolphinscheduler-ui/src/views/resource/file/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/file/index.tsx
@@ -20,11 +20,8 @@ import ResourceListModal from '../components/resource'
 
 export default defineComponent({
   name: 'File',
-  setup() {
-  },
+  setup() {},
   render() {
-    return <ResourceListModal
-      resourceType={'FILE'}
-    />
+    return <ResourceListModal resourceType={'FILE'} />
   }
-})
\ No newline at end of file
+})
diff --git a/dolphinscheduler-ui/src/views/resource/task-group/option/index.tsx b/dolphinscheduler-ui/src/views/resource/task-group/option/index.tsx
index 292e757cdb..569fdb9eff 100644
--- a/dolphinscheduler-ui/src/views/resource/task-group/option/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/task-group/option/index.tsx
@@ -23,19 +23,13 @@ import {
   onMounted,
   getCurrentInstance
 } from 'vue'
-import {
-  NButton,
-  NIcon,
-  NDataTable,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NIcon, NDataTable, NPagination, NSpace } from 'naive-ui'
 import Card from '@/components/card'
 import { SearchOutlined } from '@vicons/antd'
 import { useI18n } from 'vue-i18n'
 import { useTable } from './use-table'
 import FormModal from './components/form-modal'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const taskGroupOption = defineComponent({
   name: 'taskGroupOption',
@@ -164,11 +158,11 @@ const taskGroupOption = defineComponent({
             </NButton>
             <NSpace>
               <Search
-                  placeholder={t(
-                      'resource.task_group_option.please_enter_keywords'
-                  )}
-                  v-model:value={this.name}
-                  onSearch={this.onSearch}
+                placeholder={t(
+                  'resource.task_group_option.please_enter_keywords'
+                )}
+                v-model:value={this.name}
+                onSearch={this.onSearch}
               ></Search>
               <NButton size='small' type='primary' onClick={onSearch}>
                 <NIcon>
diff --git a/dolphinscheduler-ui/src/views/resource/task-group/queue/index.tsx b/dolphinscheduler-ui/src/views/resource/task-group/queue/index.tsx
index b197319159..33ac14e4b9 100644
--- a/dolphinscheduler-ui/src/views/resource/task-group/queue/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/task-group/queue/index.tsx
@@ -40,7 +40,7 @@ import { SelectMixedOption } from 'naive-ui/lib/select/src/interface'
 import { useRouter } from 'vue-router'
 import FormModal from '@/views/resource/task-group/queue/components/form-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 import type { Ref } from 'vue'
 import type { Router } from 'vue-router'
 
@@ -177,16 +177,16 @@ const taskGroupQueue = defineComponent({
               placeholder={t('resource.task_group_queue.task_group_name')}
             />
             <Search
-                v-model:value={this.searchParamRef.processName}
-                placeholder={t(
-                    'resource.task_group_queue.workflow_instance_name'
-                )}
+              v-model:value={this.searchParamRef.processName}
+              placeholder={t(
+                'resource.task_group_queue.workflow_instance_name'
+              )}
               onSearch={onSearch}
             ></Search>
             <Search
-                v-model:value={this.searchParamRef.instanceName}
-                placeholder={t('resource.task_group_queue.task_instance_name')}
-                onSearch ={onSearch}
+              v-model:value={this.searchParamRef.instanceName}
+              placeholder={t('resource.task_group_queue.task_instance_name')}
+              onSearch={onSearch}
             ></Search>
             <NButton size='small' type='primary' onClick={onSearch}>
               <NIcon>
diff --git a/dolphinscheduler-ui/src/views/resource/udf/function/components/function-modal.tsx b/dolphinscheduler-ui/src/views/resource/udf/function/components/function-modal.tsx
index f54cb1f82f..e3668936c7 100644
--- a/dolphinscheduler-ui/src/views/resource/udf/function/components/function-modal.tsx
+++ b/dolphinscheduler-ui/src/views/resource/udf/function/components/function-modal.tsx
@@ -106,7 +106,7 @@ export default defineComponent({
         state.functionForm.funcName = props.row.funcName
         state.functionForm.className = props.row.className
         state.functionForm.resourceId = props.row.resourceId || -1
-        state.functionForm.fullName = props.row.resourceName || ""
+        state.functionForm.fullName = props.row.resourceName || ''
         state.functionForm.description = props.row.description
       }
     )
@@ -239,7 +239,7 @@ export default defineComponent({
                     <NButton>
                       {t('resource.function.upload')}
                       <NIcon>
-                        <CloudUploadOutlined/>
+                        <CloudUploadOutlined />
                       </NIcon>
                     </NButton>
                   </NUpload>
diff --git a/dolphinscheduler-ui/src/views/resource/udf/function/components/use-form.ts b/dolphinscheduler-ui/src/views/resource/udf/function/components/use-form.ts
index a1cedc2ab7..2d4d067c65 100644
--- a/dolphinscheduler-ui/src/views/resource/udf/function/components/use-form.ts
+++ b/dolphinscheduler-ui/src/views/resource/udf/function/components/use-form.ts
@@ -76,7 +76,7 @@ export const useForm = () => {
         required: true,
         trigger: ['input', 'blur'],
         validator() {
-          if (state.functionForm.fullName == "") {
+          if (state.functionForm.fullName == '') {
             return new Error(t('resource.function.enter_name_tips'))
           }
         }
diff --git a/dolphinscheduler-ui/src/views/resource/udf/function/components/use-modal.ts b/dolphinscheduler-ui/src/views/resource/udf/function/components/use-modal.ts
index db58d62b05..dc60ff4207 100644
--- a/dolphinscheduler-ui/src/views/resource/udf/function/components/use-modal.ts
+++ b/dolphinscheduler-ui/src/views/resource/udf/function/components/use-modal.ts
@@ -36,11 +36,9 @@ export function useModal(
   const handleCreateFunc = async () => {
     submitRequest(
       async () =>
-        await createUdfFunc(
-          {
-            ...state.functionForm
-          }
-        )
+        await createUdfFunc({
+          ...state.functionForm
+        })
     )
   }
 
@@ -117,7 +115,7 @@ export function useModal(
 
   const getUdfList = () => {
     const { state } = useAsyncState(
-      queryResourceList({ type: 'UDF', fullName: "" }).then((res: any) => {
+      queryResourceList({ type: 'UDF', fullName: '' }).then((res: any) => {
         let item = res
         let item1 = _.cloneDeep(res)
 
diff --git a/dolphinscheduler-ui/src/views/resource/udf/function/index.tsx b/dolphinscheduler-ui/src/views/resource/udf/function/index.tsx
index 2338f3e603..06ef343430 100644
--- a/dolphinscheduler-ui/src/views/resource/udf/function/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/udf/function/index.tsx
@@ -24,19 +24,13 @@ import {
   watch,
   getCurrentInstance
 } from 'vue'
-import {
-  NIcon,
-  NSpace,
-  NDataTable,
-  NButton,
-  NPagination
-} from 'naive-ui'
+import { NIcon, NSpace, NDataTable, NButton, NPagination } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import { SearchOutlined } from '@vicons/antd'
 import { useTable } from './use-table'
 import Card from '@/components/card'
 import FolderModal from './components/function-modal'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 import styles from './index.module.scss'
 
 export default defineComponent({
diff --git a/dolphinscheduler-ui/src/views/resource/udf/function/use-table.ts b/dolphinscheduler-ui/src/views/resource/udf/function/use-table.ts
index 75a53b1507..75fc406e38 100644
--- a/dolphinscheduler-ui/src/views/resource/udf/function/use-table.ts
+++ b/dolphinscheduler-ui/src/views/resource/udf/function/use-table.ts
@@ -45,7 +45,7 @@ export function useTable() {
     tableData: [],
     // here is id not prefix because udf function is still stored in db
     id: ref(Number(router.currentRoute.value.params.id) || -1),
-    fullName: ref(String(router.currentRoute.value.query.prefix || "")),
+    fullName: ref(String(router.currentRoute.value.query.prefix || '')),
     page: ref(1),
     pageSize: ref(10),
     searchVal: ref(),
@@ -196,7 +196,7 @@ export function useTable() {
       variables.page -= 1
     }
 
-    deleteUdfFunc(id, {fullName: fullName}).then(() =>
+    deleteUdfFunc(id, { fullName: fullName }).then(() =>
       getTableData({
         fullName: variables.fullName,
         id: variables.id,
diff --git a/dolphinscheduler-ui/src/views/resource/udf/resource/index.tsx b/dolphinscheduler-ui/src/views/resource/udf/resource/index.tsx
index e59320d8f4..0d78ade01f 100644
--- a/dolphinscheduler-ui/src/views/resource/udf/resource/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/udf/resource/index.tsx
@@ -20,11 +20,8 @@ import ResourceListModal from '../../components/resource'
 
 export default defineComponent({
   name: 'resource-manage',
-  setup() {
-  },
+  setup() {},
   render() {
-    return <ResourceListModal
-      resourceType={'UDF'}
-    />
+    return <ResourceListModal resourceType={'UDF'} />
   }
-})
\ No newline at end of file
+})
diff --git a/dolphinscheduler-ui/src/views/security/alarm-group-manage/index.tsx b/dolphinscheduler-ui/src/views/security/alarm-group-manage/index.tsx
index 70b9b7171a..6a1b47800b 100644
--- a/dolphinscheduler-ui/src/views/security/alarm-group-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/alarm-group-manage/index.tsx
@@ -22,19 +22,13 @@ import {
   toRefs,
   watch
 } from 'vue'
-import {
-  NButton,
-  NDataTable,
-  NIcon,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NDataTable, NIcon, NPagination, NSpace } from 'naive-ui'
 import { SearchOutlined } from '@vicons/antd'
 import { useI18n } from 'vue-i18n'
 import { useTable } from './use-table'
 import AlarmGroupModal from './components/alarm-group-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const alarmGroupManage = defineComponent({
   name: 'alarm-group-manage',
diff --git a/dolphinscheduler-ui/src/views/security/alarm-instance-manage/index.tsx b/dolphinscheduler-ui/src/views/security/alarm-instance-manage/index.tsx
index 7963331e44..685b14c00c 100644
--- a/dolphinscheduler-ui/src/views/security/alarm-instance-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/alarm-instance-manage/index.tsx
@@ -23,13 +23,7 @@ import {
   toRefs,
   watch
 } from 'vue'
-import {
-  NButton,
-  NIcon,
-  NDataTable,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NIcon, NDataTable, NPagination, NSpace } from 'naive-ui'
 import DetailModal from './detail'
 import Card from '@/components/card'
 import { SearchOutlined } from '@vicons/antd'
@@ -38,7 +32,7 @@ import { useUserInfo } from './use-userinfo'
 import { useColumns } from './use-columns'
 import { useTable } from './use-table'
 import type { IRecord } from './types'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const AlarmInstanceManage = defineComponent({
   name: 'alarm-instance-manage',
diff --git a/dolphinscheduler-ui/src/views/security/cluster-manage/index.tsx b/dolphinscheduler-ui/src/views/security/cluster-manage/index.tsx
index e12f55f52c..c6a040493a 100644
--- a/dolphinscheduler-ui/src/views/security/cluster-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/cluster-manage/index.tsx
@@ -22,19 +22,13 @@ import {
   toRefs,
   watch
 } from 'vue'
-import {
-  NButton,
-  NDataTable,
-  NIcon,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NDataTable, NIcon, NPagination, NSpace } from 'naive-ui'
 import { SearchOutlined } from '@vicons/antd'
 import { useI18n } from 'vue-i18n'
 import { useTable } from './use-table'
 import ClusterModal from './components/cluster-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const clusterManage = defineComponent({
   name: 'cluster-manage',
diff --git a/dolphinscheduler-ui/src/views/security/environment-manage/index.tsx b/dolphinscheduler-ui/src/views/security/environment-manage/index.tsx
index 7b54ea89c6..55301ac07e 100644
--- a/dolphinscheduler-ui/src/views/security/environment-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/environment-manage/index.tsx
@@ -22,19 +22,13 @@ import {
   toRefs,
   watch
 } from 'vue'
-import {
-  NButton,
-  NDataTable,
-  NIcon,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NDataTable, NIcon, NPagination, NSpace } from 'naive-ui'
 import { SearchOutlined } from '@vicons/antd'
 import { useI18n } from 'vue-i18n'
 import { useTable } from './use-table'
 import EnvironmentModal from './components/environment-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const environmentManage = defineComponent({
   name: 'environment-manage',
diff --git a/dolphinscheduler-ui/src/views/security/k8s-namespace-manage/index.tsx b/dolphinscheduler-ui/src/views/security/k8s-namespace-manage/index.tsx
index ceeaec62b6..4aae8c0cbf 100644
--- a/dolphinscheduler-ui/src/views/security/k8s-namespace-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/k8s-namespace-manage/index.tsx
@@ -22,19 +22,13 @@ import {
   toRefs,
   watch
 } from 'vue'
-import {
-  NButton,
-  NDataTable,
-  NIcon,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NDataTable, NIcon, NPagination, NSpace } from 'naive-ui'
 import { SearchOutlined } from '@vicons/antd'
 import { useI18n } from 'vue-i18n'
 import { useTable } from './use-table'
 import K8sNamespaceModal from './components/k8s-namespace-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const k8sNamespaceManage = defineComponent({
   name: 'k8s-namespace-manage',
diff --git a/dolphinscheduler-ui/src/views/security/tenant-manage/index.tsx b/dolphinscheduler-ui/src/views/security/tenant-manage/index.tsx
index 536a351810..5a67883d82 100644
--- a/dolphinscheduler-ui/src/views/security/tenant-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/tenant-manage/index.tsx
@@ -22,19 +22,13 @@ import {
   watch,
   getCurrentInstance
 } from 'vue'
-import {
-  NButton,
-  NIcon,
-  NDataTable,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NIcon, NDataTable, NPagination, NSpace } from 'naive-ui'
 import { useTable } from './use-table'
 import { SearchOutlined } from '@vicons/antd'
 import { useI18n } from 'vue-i18n'
 import TenantModal from './components/tenant-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const tenementManage = defineComponent({
   name: 'tenement-manage',
diff --git a/dolphinscheduler-ui/src/views/security/token-manage/index.tsx b/dolphinscheduler-ui/src/views/security/token-manage/index.tsx
index c18b30a2b3..5bf9c5d288 100644
--- a/dolphinscheduler-ui/src/views/security/token-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/token-manage/index.tsx
@@ -22,19 +22,13 @@ import {
   toRefs,
   watch
 } from 'vue'
-import {
-  NButton,
-  NDataTable,
-  NIcon,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NDataTable, NIcon, NPagination, NSpace } from 'naive-ui'
 import { SearchOutlined } from '@vicons/antd'
 import { useI18n } from 'vue-i18n'
 import { useTable } from './use-table'
 import TokenModal from './components/token-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const tokenManage = defineComponent({
   name: 'token-manage',
diff --git a/dolphinscheduler-ui/src/views/security/user-manage/components/authorize-modal.tsx b/dolphinscheduler-ui/src/views/security/user-manage/components/authorize-modal.tsx
index e0855d9d5b..8490a3f6b9 100644
--- a/dolphinscheduler-ui/src/views/security/user-manage/components/authorize-modal.tsx
+++ b/dolphinscheduler-ui/src/views/security/user-manage/components/authorize-modal.tsx
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { defineComponent, PropType, toRefs, watch} from 'vue'
+import { defineComponent, PropType, toRefs, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import {
   NInput,
@@ -56,7 +56,17 @@ export const AuthorizeModal = defineComponent({
   emits: ['cancel'],
   setup(props, ctx) {
     const { t } = useI18n()
-    const { state, onInit, onSave, getProjects, revokeProjectByIdRequest, grantProjectRequest, grantProjectWithReadPermRequest, requestData, handleChangePageSize } = useAuthorize()
+    const {
+      state,
+      onInit,
+      onSave,
+      getProjects,
+      revokeProjectByIdRequest,
+      grantProjectRequest,
+      grantProjectWithReadPermRequest,
+      requestData,
+      handleChangePageSize
+    } = useAuthorize()
     const onCancel = () => {
       ctx.emit('cancel')
     }
@@ -97,14 +107,14 @@ export const AuthorizeModal = defineComponent({
       onConfirm,
       getProjects,
       handleCheck,
-      requestData, 
+      requestData,
       handleChangePageSize,
       onRevokeProject,
       onGrantReadPerm,
       onGrantAllPerm
     }
   },
-  render(props: { type: TAuthType, userId: number }) {
+  render(props: { type: TAuthType; userId: number }) {
     const { t } = this
     const { type, userId } = props
     return (
@@ -118,17 +128,28 @@ export const AuthorizeModal = defineComponent({
         cancelClassName='btn-cancel'
       >
         {type === 'authorize_project' && (
-
           <NSpace vertical>
             <NSpace>
-              <NButton size='small' type='primary' onClick={this.onRevokeProject}>
+              <NButton
+                size='small'
+                type='primary'
+                onClick={this.onRevokeProject}
+              >
                 {t('security.user.revoke_auth')}
               </NButton>
-              <NButton size='small' type='primary' onClick={this.onGrantReadPerm}>
-              {t('security.user.grant_read')}
+              <NButton
+                size='small'
+                type='primary'
+                onClick={this.onGrantReadPerm}
+              >
+                {t('security.user.grant_read')}
               </NButton>
-              <NButton size='small' type='primary' onClick={this.onGrantAllPerm}>
-              {t('security.user.grant_all')}
+              <NButton
+                size='small'
+                type='primary'
+                onClick={this.onGrantAllPerm}
+              >
+                {t('security.user.grant_all')}
               </NButton>
               <NInput
                 size='small'
@@ -137,34 +158,38 @@ export const AuthorizeModal = defineComponent({
                 v-model:value={this.searchVal}
               />
               {/* <NButton size='small' type='primary' onClick={this.handleSearch}> */}
-              <NButton size='small' type='primary' onClick={() => this.getProjects(userId)}>
+              <NButton
+                size='small'
+                type='primary'
+                onClick={() => this.getProjects(userId)}
+              >
                 <NIcon>
                   <SearchOutlined />
                 </NIcon>
               </NButton>
             </NSpace>
-          <NDataTable
-            virtualScroll
-            row-class-name='items'
-            columns={this.columnsRef.columns}
-            data={this.projectWithAuthorizedLevel}
-            loading={this.loading}
-            max-height="250"
-            row-key={this.rowKey}
-            on-update:checked-row-keys={this.handleCheck}
-          />
-          <div class={styles.pagination}>
-            <NPagination
-              v-model:page={this.pagination.page}
-              v-model:page-size={this.pagination.pageSize}
-              page-count={this.pagination.totalPage}
-              show-size-picker
-              page-sizes={[5, 10]}
-              show-quick-jumper
-              onUpdatePage={this.requestData}
-              onUpdatePageSize={this.handleChangePageSize}
+            <NDataTable
+              virtualScroll
+              row-class-name='items'
+              columns={this.columnsRef.columns}
+              data={this.projectWithAuthorizedLevel}
+              loading={this.loading}
+              max-height='250'
+              row-key={this.rowKey}
+              on-update:checked-row-keys={this.handleCheck}
             />
-          </div>
+            <div class={styles.pagination}>
+              <NPagination
+                v-model:page={this.pagination.page}
+                v-model:page-size={this.pagination.pageSize}
+                page-count={this.pagination.totalPage}
+                show-size-picker
+                page-sizes={[5, 10]}
+                show-quick-jumper
+                onUpdatePage={this.requestData}
+                onUpdatePageSize={this.handleChangePageSize}
+              />
+            </div>
           </NSpace>
         )}
         {type === 'authorize_datasource' && (
diff --git a/dolphinscheduler-ui/src/views/security/user-manage/components/use-authorize.ts b/dolphinscheduler-ui/src/views/security/user-manage/components/use-authorize.ts
index e1cfbd9438..a327227ea5 100644
--- a/dolphinscheduler-ui/src/views/security/user-manage/components/use-authorize.ts
+++ b/dolphinscheduler-ui/src/views/security/user-manage/components/use-authorize.ts
@@ -15,9 +15,7 @@
  * limitations under the License.
  */
 import { reactive } from 'vue'
-import {
-  queryProjectWithAuthorizedLevelListPaging
-} from '@/service/modules/projects'
+import { queryProjectWithAuthorizedLevelListPaging } from '@/service/modules/projects'
 import {
   authedDatasource,
   unAuthDatasource
@@ -39,7 +37,7 @@ import {
   grantDataSource,
   grantUDFFunc,
   grantNamespaceFunc,
-  revokeProjectById,
+  revokeProjectById
 } from '@/service/modules/users'
 import utils from '@/utils'
 import type { TAuthType, IResourceOption, IOption, IRecord } from '../types'
@@ -79,7 +77,7 @@ export function useAuthorize() {
     if (userId) {
       state.userId = userId
     }
-    
+
     const projectsList = await queryProjectWithAuthorizedLevelListPaging({
       userId,
       searchVal: state.searchVal,
@@ -104,7 +102,10 @@ export function useAuthorize() {
     await getProjects(state.userId)
   }
 
-  const revokeProjectByIdRequest = async (userId: number, projectIds: string) => {
+  const revokeProjectByIdRequest = async (
+    userId: number,
+    projectIds: string
+  ) => {
     await revokeProjectById({
       userId,
       projectIds: projectIds
@@ -120,7 +121,10 @@ export function useAuthorize() {
     await getProjects(userId)
   }
 
-  const grantProjectWithReadPermRequest = async (userId: number, projectIds: string) => {
+  const grantProjectWithReadPermRequest = async (
+    userId: number,
+    projectIds: string
+  ) => {
     await grantProjectWithReadPerm({
       userId,
       projectIds: projectIds
@@ -322,5 +326,15 @@ export function useAuthorize() {
     return true
   }
 
-  return { state, onInit, onSave, getProjects, revokeProjectByIdRequest, grantProjectRequest, grantProjectWithReadPermRequest, requestData, handleChangePageSize }
+  return {
+    state,
+    onInit,
+    onSave,
+    getProjects,
+    revokeProjectByIdRequest,
+    grantProjectRequest,
+    grantProjectWithReadPermRequest,
+    requestData,
+    handleChangePageSize
+  }
 }
diff --git a/dolphinscheduler-ui/src/views/security/user-manage/components/use-columns.ts b/dolphinscheduler-ui/src/views/security/user-manage/components/use-columns.ts
index 9e7a609136..fee6e0b4a6 100644
--- a/dolphinscheduler-ui/src/views/security/user-manage/components/use-columns.ts
+++ b/dolphinscheduler-ui/src/views/security/user-manage/components/use-columns.ts
@@ -39,7 +39,6 @@ const PERM_LIST = [
     value: 7
   }
 ]
-  
 
 export function useColumns() {
   const { t } = useI18n()
@@ -64,8 +63,10 @@ export function useColumns() {
       {
         title: t('project.list.authorize_level'),
         key: 'perm',
-        render: (record: any):any => {
-          return PERM_LIST.filter(item => item.value == record.perm).map(item => t(item.label))
+        render: (record: any): any => {
+          return PERM_LIST.filter((item) => item.value == record.perm).map(
+            (item) => t(item.label)
+          )
         },
         ...COLUMN_WIDTH_CONFIG['index']
       }
diff --git a/dolphinscheduler-ui/src/views/security/user-manage/index.tsx b/dolphinscheduler-ui/src/views/security/user-manage/index.tsx
index 0c592ee887..92bb7d29f5 100644
--- a/dolphinscheduler-ui/src/views/security/user-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/user-manage/index.tsx
@@ -15,18 +15,8 @@
  * limitations under the License.
  */
 
-import {
-  defineComponent,
-  getCurrentInstance,
-  toRefs
-} from 'vue'
-import {
-  NButton,
-  NIcon,
-  NSpace,
-  NDataTable,
-  NPagination
-} from 'naive-ui'
+import { defineComponent, getCurrentInstance, toRefs } from 'vue'
+import { NButton, NIcon, NSpace, NDataTable, NPagination } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import { SearchOutlined } from '@vicons/antd'
 import { useColumns } from './use-columns'
@@ -34,7 +24,7 @@ import { useTable } from './use-table'
 import UserDetailModal from './components/user-detail-modal'
 import AuthorizeModal from './components/authorize-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const UsersManage = defineComponent({
   name: 'user-manage',
diff --git a/dolphinscheduler-ui/src/views/security/worker-group-manage/index.tsx b/dolphinscheduler-ui/src/views/security/worker-group-manage/index.tsx
index 9272731300..d5076fca43 100644
--- a/dolphinscheduler-ui/src/views/security/worker-group-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/worker-group-manage/index.tsx
@@ -22,19 +22,13 @@ import {
   toRefs,
   watch
 } from 'vue'
-import {
-  NButton,
-  NDataTable,
-  NIcon,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NDataTable, NIcon, NPagination, NSpace } from 'naive-ui'
 import { SearchOutlined } from '@vicons/antd'
 import { useI18n } from 'vue-i18n'
 import { useTable } from './use-table'
 import WorkerGroupModal from './components/worker-group-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const workerGroupManage = defineComponent({
   name: 'worker-group-manage',
diff --git a/dolphinscheduler-ui/src/views/security/yarn-queue-manage/index.tsx b/dolphinscheduler-ui/src/views/security/yarn-queue-manage/index.tsx
index d7de7fb00e..98282916c6 100644
--- a/dolphinscheduler-ui/src/views/security/yarn-queue-manage/index.tsx
+++ b/dolphinscheduler-ui/src/views/security/yarn-queue-manage/index.tsx
@@ -22,19 +22,13 @@ import {
   toRefs,
   watch
 } from 'vue'
-import {
-  NButton,
-  NDataTable,
-  NIcon,
-  NPagination,
-  NSpace
-} from 'naive-ui'
+import { NButton, NDataTable, NIcon, NPagination, NSpace } from 'naive-ui'
 import { SearchOutlined } from '@vicons/antd'
 import { useI18n } from 'vue-i18n'
 import { useTable } from './use-table'
 import YarnQueueModal from './components/yarn-queue-modal'
 import Card from '@/components/card'
-import Search from "@/components/input-search";
+import Search from '@/components/input-search'
 
 const yarnQueueManage = defineComponent({
   name: 'yarn-queue-manage',