feat(workflow): 优化工作流节点展示和功能
- 修改工作流节点的样式和布局 - 优化条件节点的表达式显示 - 调整回调节点和任务节点的展示内容 - 新增手动触发和工作流调用的执行原因 - 更新多语言文案
This commit is contained in:
parent
1d740bb143
commit
99eb47971d
@ -125,6 +125,7 @@ const jobTaskChange = (_: string, option: { label: string; value: number }) => {
|
||||
value: item.id
|
||||
};
|
||||
})
|
||||
.filter(item => item.value != store.id)
|
||||
"
|
||||
@update:value="jobTaskChange"
|
||||
/>
|
||||
|
@ -97,7 +97,7 @@ const toText = (node: Workflow.NodeModelType, currentIndex: number) => {
|
||||
if (nodeName !== $t('workflow.node.condition.conditionNodes.otherNodeName')) {
|
||||
const text = `<span class="content_label">${$t('workflow.node.condition.conditionNodes.expressionType')}: </span>${
|
||||
expressionRecord[expressionType!]
|
||||
}\n<span class="content_label">${$t('workflow.node.condition.conditionNodes.nodeExpression')}: </span><span style="display: inline-block; vertical-align: bottom; width: 120px; overflow: hidden; text-overflow: ellipsis">${nodeExpression}<span/>`;
|
||||
}`;
|
||||
return text;
|
||||
}
|
||||
return $t('workflow.node.condition.conditionNodes.otherNodeTip');
|
||||
@ -286,7 +286,7 @@ const getClass = (item: Workflow.ConditionNodeType) => {
|
||||
|
||||
.auto-judge {
|
||||
white-space: pre;
|
||||
min-height: 132px !important;
|
||||
min-height: 79px !important;
|
||||
}
|
||||
|
||||
.top-tips {
|
||||
|
@ -166,16 +166,16 @@ const getClass = (item: Workflow.ConditionNodeType) => {
|
||||
</div>
|
||||
<template v-if="item.callback?.webhook">
|
||||
<div class="flex justify-between">
|
||||
<span class="content_label">Webhook:</span>
|
||||
<NEllipsis class="w-116px">{{ item.callback.webhook }}</NEllipsis>
|
||||
<!-- <span class="content_label">Webhook:</span>-->
|
||||
<NEllipsis class="w-190px">{{ item.callback.webhook }}</NEllipsis>
|
||||
</div>
|
||||
<div>
|
||||
<span class="content_label">
|
||||
{{ $t('workflow.node.callback.conditionNodes.contentType') }}:
|
||||
</span>
|
||||
{{ contentTypeRecord[item.callback.contentType!] }}
|
||||
</div>
|
||||
<div>.........</div>
|
||||
<!-- <div>-->
|
||||
<!-- <span class="content_label">-->
|
||||
<!-- {{ $t('workflow.node.callback.conditionNodes.contentType') }}:-->
|
||||
<!-- </span>-->
|
||||
<!-- {{ contentTypeRecord[item.callback.contentType!] }}-->
|
||||
<!-- </div>-->
|
||||
<!-- <div>.........</div>-->
|
||||
</template>
|
||||
</div>
|
||||
<NTooltip v-if="store.type === 2 && item.taskBatchStatus">
|
||||
|
@ -98,11 +98,11 @@ const show = () => {
|
||||
{{ nodeData.groupName }}
|
||||
</NEllipsis>
|
||||
</div>
|
||||
<div>
|
||||
<span class="content_label">阻塞策略: </span>
|
||||
{{ $t(blockStrategyRecord[nodeData.blockStrategy!]) }}
|
||||
</div>
|
||||
<div>.........</div>
|
||||
<!-- <div>-->
|
||||
<!-- <span class="content_label">阻塞策略: </span>-->
|
||||
<!-- {{ $t(blockStrategyRecord[nodeData.blockStrategy!]) }}-->
|
||||
<!-- </div>-->
|
||||
<!-- <div>.........</div>-->
|
||||
</div>
|
||||
<div v-else class="content min-h-85px">
|
||||
<span class="placeholder">请配置工作流</span>
|
||||
|
@ -228,16 +228,16 @@ const isShow = (taskBatchStatus: number) => {
|
||||
<div v-if="!item.jobTask?.jobId" class="placeholder">请选择任务</div>
|
||||
<template v-if="item.jobTask?.jobId">
|
||||
<div>
|
||||
<span class="content_label">任务名称: </span>
|
||||
<!-- <span class="content_label">任务名称: </span>-->
|
||||
<NEllipsis class="max-w-123px">
|
||||
{{ `${item.jobTask?.jobName}(${item.jobTask?.jobId})` }}
|
||||
</NEllipsis>
|
||||
</div>
|
||||
<div>
|
||||
<span class="content_label">失败策略: </span>
|
||||
{{ $t(failStrategyRecord[item.failStrategy!]) }}
|
||||
</div>
|
||||
<div>.........</div>
|
||||
<!-- <div>-->
|
||||
<!-- <span class="content_label">失败策略: </span>-->
|
||||
<!-- {{ $t(failStrategyRecord[item.failStrategy!]) }}-->
|
||||
<!-- </div>-->
|
||||
<!-- <div>.........</div>-->
|
||||
</template>
|
||||
</div>
|
||||
<div
|
||||
|
@ -225,16 +225,16 @@ const isShow = (taskBatchStatus: number) => {
|
||||
<div v-if="!item.subWorkflow?.id" class="placeholder">请选择工作流</div>
|
||||
<template v-if="item.subWorkflow?.id">
|
||||
<div>
|
||||
<span class="content_label">工作流名称: </span>
|
||||
<!-- <span class="content_label">工作流名称: </span>-->
|
||||
<NEllipsis class="max-w-123px">
|
||||
{{ `${item.subWorkflow?.name}(${item.subWorkflow?.id})` }}
|
||||
</NEllipsis>
|
||||
</div>
|
||||
<div>
|
||||
<span class="content_label">失败策略: </span>
|
||||
{{ $t(failStrategyRecord[item.failStrategy!]) }}
|
||||
</div>
|
||||
<div>.........</div>
|
||||
<!-- <div>-->
|
||||
<!-- <span class="content_label">失败策略: </span>-->
|
||||
<!-- {{ $t(failStrategyRecord[item.failStrategy!]) }}-->
|
||||
<!-- </div>-->
|
||||
<!-- <div>.........</div>-->
|
||||
</template>
|
||||
</div>
|
||||
<div
|
||||
|
@ -270,7 +270,7 @@
|
||||
width: 220px;
|
||||
min-height: 72px;
|
||||
background: rgb(255, 255, 255);
|
||||
border-radius: 4px;
|
||||
border-radius: 10px;
|
||||
padding: 15px 15px;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
|
||||
@ -331,8 +331,8 @@
|
||||
.auto-judge .content {
|
||||
line-height: 23px;
|
||||
position: relative;
|
||||
padding-top: 15px;
|
||||
min-height: 59px;
|
||||
padding-top: 10px;
|
||||
min-height: 33px;
|
||||
}
|
||||
|
||||
.auto-judge .content .placeholder {
|
||||
|
@ -270,7 +270,9 @@ export const operationReasonRecord: Record<Api.Common.OperationReason, App.I18n.
|
||||
11: 'common.jobOperationReason.items.workflowCallbackNodeExecutionError',
|
||||
12: 'common.jobOperationReason.items.workflowNodeNoRequired',
|
||||
13: 'common.jobOperationReason.items.workflowNodeClosedSkipExecution',
|
||||
14: 'common.jobOperationReason.items.workflowDecisionFailed'
|
||||
14: 'common.jobOperationReason.items.workflowDecisionFailed',
|
||||
15: 'common.jobOperationReason.items.manualTrigger',
|
||||
16: 'common.jobOperationReason.items.workflowBeCalled',
|
||||
};
|
||||
export const operationReasonOptions = transformRecordToNumberOption(operationReasonRecord);
|
||||
|
||||
|
@ -219,7 +219,9 @@ const local: App.I18n.Schema = {
|
||||
workflowCallbackNodeExecutionError: 'Callback node execution error',
|
||||
workflowNodeNoRequired: 'No process required',
|
||||
workflowNodeClosedSkipExecution: 'Node closed, skip execution',
|
||||
workflowDecisionFailed: 'Workflow decision failed'
|
||||
workflowDecisionFailed: 'Workflow decision failed',
|
||||
manualTrigger: 'Manual trigger',
|
||||
workflowBeCalled: 'WorkflowBeCalled',
|
||||
}
|
||||
},
|
||||
retryOperationReason: {
|
||||
|
@ -225,7 +225,9 @@ const local: App.I18n.Schema = {
|
||||
workflowCallbackNodeExecutionError: '回调节点执行异常',
|
||||
workflowNodeNoRequired: '无需处理',
|
||||
workflowNodeClosedSkipExecution: '节点关闭跳过执行',
|
||||
workflowDecisionFailed: '判定未通过'
|
||||
workflowDecisionFailed: '判定未通过',
|
||||
manualTrigger: '手动触发',
|
||||
workflowBeCalled: '工作流中被调用',
|
||||
}
|
||||
},
|
||||
retryOperationReason: {
|
||||
@ -1015,7 +1017,7 @@ const local: App.I18n.Schema = {
|
||||
logicalCondition: '判定逻辑',
|
||||
expressionType: '表达式类型',
|
||||
nodeExpression: '节点表达式',
|
||||
otherNodeTip: '如存在未满足其他分支条件的情况,则进入此分支'
|
||||
otherNodeTip: '其他情况,进入此分支'
|
||||
},
|
||||
addBranch: '添加条件'
|
||||
},
|
||||
@ -1028,7 +1030,7 @@ const local: App.I18n.Schema = {
|
||||
}
|
||||
},
|
||||
subWorkflow: {
|
||||
nodeName: '工作流',
|
||||
nodeName: '子工作流',
|
||||
conditionNodes: {
|
||||
nodeName: '工作流',
|
||||
contentType: '工作流',
|
||||
|
4
src/typings/api.d.ts
vendored
4
src/typings/api.d.ts
vendored
@ -114,9 +114,9 @@ declare namespace Api {
|
||||
|
||||
/**
|
||||
* 1、任务执行超时 2、无客户端节点 3、JOB已关闭 4、任务丢弃 5、任务被覆盖 6、无可执行任务项 7、任务执行期间发生非预期异常 8、手动停止 9、条件节点执行异常 10、任务中断 11、回调节点执行异常 12、无需处理
|
||||
* 13、节点关闭跳过执行 14、判定未通过
|
||||
* 13、节点关闭跳过执行 14、判定未通过 15、手动执行 16、工作流中被调用
|
||||
*/
|
||||
type OperationReason = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14;
|
||||
type OperationReason = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16;
|
||||
|
||||
/**
|
||||
* 1、任务执行超时 2、无客户端节点 3、JOB已关闭 4、任务丢弃 5、任务被覆盖 6、无可执行任务项 7、任务执行期间发生非预期异常 8、手动停止 8、当前重试非运行中 9、当前场景已关闭 10、重试失败
|
||||
|
4
src/typings/app.d.ts
vendored
4
src/typings/app.d.ts
vendored
@ -512,6 +512,10 @@ declare namespace App {
|
||||
workflowNodeNoRequired: string;
|
||||
workflowNodeClosedSkipExecution: string;
|
||||
workflowDecisionFailed: string;
|
||||
//手动触发
|
||||
manualTrigger: string;
|
||||
//工作流中被调用
|
||||
workflowBeCalled: string;
|
||||
};
|
||||
};
|
||||
retryOperationReason: {
|
||||
|
@ -97,27 +97,27 @@ const href = (url: string) => {
|
||||
<component :is="activeModule.component" />
|
||||
</Transition>
|
||||
</div>
|
||||
<div class="pt-12px text-center">
|
||||
<ButtonIcon
|
||||
tooltip-content="Mail"
|
||||
class="color-#272636 dark:color-#f0f2f5"
|
||||
icon="simple-icons:maildotru"
|
||||
@click="href('mailto:598092184@qq.com')"
|
||||
/>
|
||||
<ButtonIcon
|
||||
class="color-#c71d23"
|
||||
tooltip-content="Gitee"
|
||||
icon="simple-icons:gitee"
|
||||
@click="href('https://gitee.com/aizuda/snail-job')"
|
||||
/>
|
||||
<ButtonIcon
|
||||
tooltip-content="Github"
|
||||
class="color-#010409 dark:color-#e6edf3"
|
||||
icon="simple-icons:github"
|
||||
@click="href('https://github.com/aizuda/snail-job')"
|
||||
/>
|
||||
</div>
|
||||
<GlobalFooter />
|
||||
<!-- <div class="pt-12px text-center">-->
|
||||
<!-- <ButtonIcon-->
|
||||
<!-- tooltip-content="Mail"-->
|
||||
<!-- class="color-#272636 dark:color-#f0f2f5"-->
|
||||
<!-- icon="simple-icons:maildotru"-->
|
||||
<!-- @click="href('mailto:598092184@qq.com')"-->
|
||||
<!-- />-->
|
||||
<!-- <ButtonIcon-->
|
||||
<!-- class="color-#c71d23"-->
|
||||
<!-- tooltip-content="Gitee"-->
|
||||
<!-- icon="simple-icons:gitee"-->
|
||||
<!-- @click="href('https://gitee.com/aizuda/snail-job')"-->
|
||||
<!-- />-->
|
||||
<!-- <ButtonIcon-->
|
||||
<!-- tooltip-content="Github"-->
|
||||
<!-- class="color-#010409 dark:color-#e6edf3"-->
|
||||
<!-- icon="simple-icons:github"-->
|
||||
<!-- @click="href('https://github.com/aizuda/snail-job')"-->
|
||||
<!-- />-->
|
||||
<!-- </div>-->
|
||||
<!-- <GlobalFooter />-->
|
||||
</main>
|
||||
</div>
|
||||
</NCard>
|
||||
|
Loading…
Reference in New Issue
Block a user