From 22d63b80fa0132f11fb23001a1bfe90268adffa2 Mon Sep 17 00:00:00 2001 From: Devosend Date: Wed, 23 Feb 2022 15:49:50 +0800 Subject: [PATCH] [Feature][UI Next] Add workflow instance startup params --- .../src/locales/modules/en_US.ts | 4 +- .../src/locales/modules/zh_CN.ts | 4 +- dolphinscheduler-ui-next/src/utils/common.ts | 19 ++ .../components/dag/dag-startup-param.tsx | 173 ++++++++++++++++++ .../workflow/components/dag/dag-toolbar.tsx | 64 ++++++- .../workflow/components/dag/index.tsx | 5 + .../components/dag/startup.module.scss | 39 ++++ .../projects/workflow/components/dag/types.ts | 10 + .../workflow/instance/detail/index.tsx | 3 + 9 files changed, 316 insertions(+), 5 deletions(-) create mode 100644 dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/dag-startup-param.tsx create mode 100644 dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/startup.module.scss diff --git a/dolphinscheduler-ui-next/src/locales/modules/en_US.ts b/dolphinscheduler-ui-next/src/locales/modules/en_US.ts index 3fae07f128..00ba16e741 100644 --- a/dolphinscheduler-ui-next/src/locales/modules/en_US.ts +++ b/dolphinscheduler-ui-next/src/locales/modules/en_US.ts @@ -472,7 +472,9 @@ const project = { delay_execution: 'Delay execution', forced_success: 'Forced success', serial_wait: 'Serial wait', - executing: 'Executing' + executing: 'Executing', + startup_type: 'Startup Type', + complement_range: 'Complement Range' }, task: { task_name: 'Task Name', diff --git a/dolphinscheduler-ui-next/src/locales/modules/zh_CN.ts b/dolphinscheduler-ui-next/src/locales/modules/zh_CN.ts index 222e71e920..f653803117 100644 --- a/dolphinscheduler-ui-next/src/locales/modules/zh_CN.ts +++ b/dolphinscheduler-ui-next/src/locales/modules/zh_CN.ts @@ -470,7 +470,9 @@ const project = { delay_execution: '延时执行', forced_success: '强制成功', serial_wait: '串行等待', - executing: '正在执行' + executing: '正在执行', + startup_type: '启动类型', + complement_range: '补数范围' }, task: { task_name: '任务名称', diff --git a/dolphinscheduler-ui-next/src/utils/common.ts b/dolphinscheduler-ui-next/src/utils/common.ts index 23ca932ca6..d7f0c3573d 100644 --- a/dolphinscheduler-ui-next/src/utils/common.ts +++ b/dolphinscheduler-ui-next/src/utils/common.ts @@ -331,3 +331,22 @@ export function uuid(prefix: string) { : prefix + id : id } + +export const warningTypeList = [ + { + id: 'NONE', + code: 'project.workflow.none_send' + }, + { + id: 'SUCCESS', + code: 'project.workflow.success_send' + }, + { + id: 'FAILURE', + code: 'project.workflow.failure_send' + }, + { + id: 'ALL', + code: 'project.workflow.all_send' + } +] diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/dag-startup-param.tsx b/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/dag-startup-param.tsx new file mode 100644 index 0000000000..da569e48bb --- /dev/null +++ b/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/dag-startup-param.tsx @@ -0,0 +1,173 @@ +/* + * 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 _ from 'lodash' +import { defineComponent, onMounted, PropType, ref, computed } from 'vue' +import { useI18n } from 'vue-i18n' +import { listAlertGroupById } from '@/service/modules/alert-group' +import { queryAllWorkerGroups } from '@/service/modules/worker-groups' +import { runningType, warningTypeList } from '@/utils/common' +import { IStartupParam } from './types' +import styles from './startup.module.scss' + +const props = { + startupParam: { + type: Object as PropType, + require: true + } +} + +export default defineComponent({ + name: 'dag-start-param', + props, + setup(props) { + const { t } = useI18n() + + const alertGroupListRef = ref([]) + const workerGroupListRef = ref([]) + const commandParam = JSON.parse(props.startupParam?.commandParam || '{}') + + const getAlertGroupList = () => { + listAlertGroupById().then((res: any) => { + alertGroupListRef.value = res.map((item: any) => ({ + label: item.groupName, + value: item.id + })) + }) + } + + const getWorkerGroupList = () => { + queryAllWorkerGroups().then((res: any) => { + workerGroupListRef.value = res + }) + } + + const runType = computed( + () => + ( + _.filter( + runningType(t), + (v) => v.code === props.startupParam?.commandType + )[0] || {} + ).desc + ) + + const warningType = computed(() => { + const id = props.startupParam?.warningType as string + const o = _.filter(warningTypeList, (v) => v.id === id) + if (o && o.length) { + return t(o[0].code) + } + return '-' + }) + + const alertGroupName = computed(() => { + const id = props.startupParam?.warningGroupId + if (!alertGroupListRef.value || !alertGroupListRef.value.length) { + return '-' + } + + const o = _.filter(alertGroupListRef.value, (v) => v.id === id) + if (o && o.length) { + return o[0].code + } + return '-' + }) + + onMounted(() => { + getAlertGroupList() + getWorkerGroupList() + }) + + return { + t, + alertGroupListRef, + workerGroupListRef, + commandParam, + runType, + warningType, + alertGroupName + } + }, + render() { + const { t } = this + + return ( +
+
    +
  • + + {t('project.workflow.startup_type')}: + + {this.runType} +
    • +
  • + + {t('project.workflow.complement_range')}: + + {this.commandParam && this.commandParam.complementStartDate ? ( + + {this.commandParam.complementStartDate}- + {this.commandParam.complementEndDate} + + ) : ( + '-' + )} +
    • +
  • + + {t('project.workflow.failure_strategy')}: + + + {this.startupParam?.failureStrategy === 'END' + ? t('project.workflow.end') + : t('project.workflow.continue')} + +
    • +
  • + + {t('project.workflow.workflow_priority')}: + + + {this.startupParam?.processInstancePriority} + +
    • +
  • + + {t('project.workflow.worker_group')}: + + + {this.workerGroupListRef.length + ? this.startupParam?.workerGroup + : '-'} + +
    • +
  • + + {t('project.workflow.notification_strategy')}: + + {this.warningType} +
    • +
  • + {t('project.workflow.alarm_group')}: + {this.alertGroupName} +
    • +
+
+ ) + } +}) diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/dag-toolbar.tsx b/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/dag-toolbar.tsx index 0c97dfef1d..8d0c5f42e6 100644 --- a/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/dag-toolbar.tsx +++ b/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/dag-toolbar.tsx @@ -18,7 +18,7 @@ import { defineComponent, ref, inject, PropType, Ref } from 'vue' import { useI18n } from 'vue-i18n' import Styles from './dag.module.scss' -import { NTooltip, NIcon, NButton, NSelect } from 'naive-ui' +import { NTooltip, NIcon, NButton, NSelect, NPopover, NText } from 'naive-ui' import { SearchOutlined, DownloadOutlined, @@ -27,14 +27,17 @@ import { InfoCircleOutlined, FormatPainterOutlined, CopyOutlined, - DeleteOutlined + DeleteOutlined, + RightCircleOutlined, + FundViewOutlined } from '@vicons/antd' import { useNodeSearch, useTextCopy } from './dag-hooks' import { DataUri } from '@antv/x6' import { useFullscreen } from '@vueuse/core' -import { useRouter } from 'vue-router' +import { useRoute, useRouter } from 'vue-router' import { useThemeStore } from '@/store/theme/theme' import type { Graph } from '@antv/x6' +import StartParam from './dag-startup-param' const props = { layoutToggle: { @@ -42,6 +45,10 @@ const props = { default: () => {} }, // If this prop is passed, it means from definition detail + instance: { + type: Object as PropType, + default: null + }, definition: { // The same as the structure responsed by the queryProcessDefinitionByCode api type: Object as PropType, @@ -56,10 +63,13 @@ export default defineComponent({ setup(props, context) { const { t } = useI18n() + const startupPopover = ref(false) + const themeStore = useThemeStore() const graph = inject>('graph', ref()) const router = useRouter() + const route = useRoute() /** * Node search and navigate @@ -142,6 +152,10 @@ export default defineComponent({ } } + // const handleUpdateShow = () => { + // startupPopover.value + // } + return () => (
)} + {route.name === 'workflow-instance-detail' && ( + <> + copy(props.definition?.processDefinition?.name)} + class={Styles['copy-btn']} + > + + + + + + {{ + trigger: () => ( + + (startupPopover.value = !startupPopover.value) + } + class={Styles['copy-btn']} + > + + + + + ), + header: () => ( + + {t('project.workflow.startup_parameter')} + + ), + default: () => ( + + ) + }} + + + )}
{/* Search node */} diff --git a/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/index.tsx b/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/index.tsx index e43076db06..75c1fc71fd 100644 --- a/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/index.tsx +++ b/dolphinscheduler-ui-next/src/views/projects/workflow/components/dag/index.tsx @@ -41,6 +41,10 @@ import './x6-style.scss' const props = { // If this prop is passed, it means from definition detail + instance: { + type: Object as PropType, + default: undefined + }, definition: { type: Object as PropType, default: undefined @@ -160,6 +164,7 @@ export default defineComponent({ > () + const instance = ref() const refresh = () => { queryProcessInstanceById(id, projectCode).then((res: any) => { + instance.value = res if (res.dagData) { definition.value = res.dagData } @@ -57,6 +59,7 @@ export default defineComponent({ ]} >