Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

节点&任务状态优化 #7066

Merged
merged 31 commits into from
Dec 20, 2023
Merged

节点&任务状态优化 #7066

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
31 commits
Select commit Hold shift + click to select a range
5ed420e
feature: 执行中任务状态展示及过滤优化
ZhuoZhuoCrayon Sep 13, 2023
1854e11
feature: 等待处理通知
ZhuoZhuoCrayon Oct 10, 2023
b2d94ac
minor: unit test fix
ZhuoZhuoCrayon Oct 11, 2023
e1817da
minor: review fix
ZhuoZhuoCrayon Oct 12, 2023
b0cdb91
minor: review fix
ZhuoZhuoCrayon Oct 12, 2023
2a27b2e
optimization: 节点&任务状态优化
ywywZhou Oct 27, 2023
d7e15a8
optimization: 删除暂停标签逻辑调整
ywywZhou Oct 27, 2023
87b798e
feature: 等待继续状态展示 & 任务实例补充元数据
ZhuoZhuoCrayon Nov 6, 2023
5979f4f
Merge remote-tracking branch 'upstream/release_humming_bird' into fea…
ZhuoZhuoCrayon Nov 7, 2023
c656e73
optimization: 任务状态联调
ywywZhou Nov 7, 2023
29c182d
feature: 等待继续状态收敛为等待处理 & batch_status 接口支持返回节点自动重试信息
ZhuoZhuoCrayon Nov 13, 2023
9eca538
Merge remote-tracking branch 'upstream/release_humming_bird' into fea…
ZhuoZhuoCrayon Nov 22, 2023
34670d0
feature: 优化子流程存在节点自动重试的场景
ZhuoZhuoCrayon Nov 22, 2023
7cecc9a
任务状态联调 (#7198)
ywywZhou Nov 28, 2023
e0312da
optimization: 任务状态测试问题修复
ywywZhou Nov 29, 2023
5a4d9ab
bugfix: 修复节点状态联调问题
hanshuaikang Dec 4, 2023
4fe6479
bugfix: 任务状态体验问题修复
ywywZhou Dec 1, 2023
10edaa1
optimization: 任务状态联调问题修复
ywywZhou Dec 12, 2023
299a96c
bugfix: 修改子流程暂停时搜索暂停状态会搜索到等待处理的问题
hanshuaikang Dec 12, 2023
35ae20c
bugfix: 等待处理状态允许修改任务参数
hanshuaikang Dec 12, 2023
ba2f215
minor: 任务列表等待处理状态icon调整
ywywZhou Dec 12, 2023
74364f8
bugfix: 修复节点暂停状态查询速度过慢的问题
hanshuaikang Dec 14, 2023
31cd5c5
任务状态体验问题修复 (#7245)
ywywZhou Dec 18, 2023
7257a64
optimization: 任务状态体验问题修复
ywywZhou Dec 18, 2023
394e6a7
更换icon&&任务详情中画布连线取消hover效果 (#7248)
ywywZhou Dec 19, 2023
1a87d8c
optimization: 添加【节点等待任务继续】角标
ywywZhou Dec 19, 2023
5bb8ea9
minor: 修改节点操作【确认】按钮文案
ywywZhou Dec 19, 2023
4b813df
bugfix: 任务暂停时进行节点操作后取消线上暂停样式&&再次执行添加hover
ywywZhou Dec 19, 2023
61cd6df
minor: merge hb
hanshuaikang Dec 20, 2023
66f6c3d
minor: merge task sttus
hanshuaikang Dec 20, 2023
a3f2385
Merge pull request #7254 from hanshuaikang/merged_hb
hanshuaikang Dec 20, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified frontend/desktop/src/assets/fonts/bksops-icon.eot
View file
Open in desktop
Binary file not shown.
63 changes: 57 additions & 6 deletions frontend/desktop/src/assets/fonts/bksops-icon.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified frontend/desktop/src/assets/fonts/bksops-icon.ttf
View file
Open in desktop
Binary file not shown.
Binary file modified frontend/desktop/src/assets/fonts/bksops-icon.woff
View file
Open in desktop
Binary file not shown.
7 changes: 2 additions & 5 deletions frontend/desktop/src/components/common/TableRenderHeader.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -339,17 +339,14 @@
}
.table-header-filter-popover {
.tippy-tooltip {
padding: 4px 0 0 0;
.tippy-content {
background: #fff;
}
padding: 4px 0;
background: #fff !important;
}
.option-list {
width: 200px;
max-height: 350px;
overflow: auto;
@include scrollbar;
margin-bottom: 15px;
background: #fff;
.option-item {
height: 32px;
Expand Down
28 changes: 19 additions & 9 deletions frontend/desktop/src/components/common/TemplateCanvas/NodeTemplate/NodeRightIconStatus.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,18 +4,23 @@
<div v-if="node.status === 'RUNNING'" class="task-status-icon">
<i class="common-icon-loading"></i>
</div>
<div v-else-if="node.status === 'FINISHED' && (node.retry > 0 || node.skip)" class="task-status-icon">
<i v-if="node.skip" class="bk-icon icon-arrows-right-shape"></i>
<span v-else-if="node.retry > 0" class="retry-times">{{ node.retry > 99 ? '100+' : node.retry }}</span>
<!-- 节点等待任务继续 -->
<div v-else-if="node.status === 'PENDING_TASK_CONTINUE'" class="node-pending task-status-icon">
<i v-bk-tooltips="$t('等待任务继续')" class="common-icon-pause"></i>
</div>
<!--节点等待处理/等待审批/等待确认-->
<div v-else-if="isPendingState" class="task-status-icon node-pending">
<i v-if="node.status === 'PENDING_PROCESSING'" v-bk-tooltips="$t('等待处理')" class="bk-icon icon-time"></i>
<i v-if="node.status === 'PENDING_APPROVAL'" v-bk-tooltips="$t('等待审批')" class="common-icon-pending-approval"></i>
<i v-if="node.status === 'PENDING_CONFIRMATION'" v-bk-tooltips="$t('等待确认')" class="common-icon-pending-confirm"></i>
</div>
<!-- 节点失败后自动忽略icon -->
<div v-else-if="node.status === 'FINISHED' && node.error_ignored" class="task-status-icon node-subscript">
<i class="bk-icon icon-arrows-right-shape"></i>
<div v-else-if="node.status === 'FINISHED' && node.skip" class="node-manual-skip">
<i class="common-icon-manual-skip"></i>
</div>
<!-- 节点循环次数 -->
<div v-if="node.loop > 1" :class="['task-status-icon task-node-loop', { 'loop-plural': node.loop > 9 }]">
<i :class="`common-icon-loading-${ node.loop > 9 ? 'oval' : 'round' }`"></i>
<span>{{ node.loop > 99 ? '99+' : node.loop }}</span>
<!-- 节点失败后自动忽略icon -->
<div v-else-if="node.status === 'FINISHED' && node.error_ignored" class="node-auto-skip">
<i class="common-icon-auto-skip"></i>
</div>
<!-- 节点顶部右侧生命周期 icon -->
<div class="node-phase-icon" v-if="[1, 2].includes(node.phase)">
Expand All @@ -38,6 +43,11 @@
name: 'NodeRightIconStatus',
props: {
node: Object
},
computed: {
isPendingState () {
return ['PENDING_PROCESSING', 'PENDING_APPROVAL', 'PENDING_CONFIRMATION'].includes(this.node.status)
}
}
}
</script>
Expand Down
24 changes: 23 additions & 1 deletion frontend/desktop/src/components/common/TemplateCanvas/NodeTemplate/Subflow.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,28 @@
@change="onNodeCheckClick">
</bk-checkbox>
</template>
<!-- 节点循环次数 -->
<div v-if="node.loop > 1" :class="['task-status-icon task-node-loop', { 'loop-plural': node.loop > 9 }]">
<i :class="`common-icon-loading-${ node.loop > 9 ? 'oval' : 'round' }`"></i>
<span>{{ node.loop > 99 ? '99+' : node.loop }}</span>
</div>
<!-- 任务节点自动重试/手动重试 -->
<template v-if="node.mode === 'execute'">
<span v-if="node.retry - node.auto_skip > 0" class="error-handle-icon">
<span class="text">MR</span>
<span class="count">{{ node.retry - node.auto_skip }}</span>
</span>
<span v-if="node.auto_skip" class="error-handle-icon">
<span class="text">AR</span>
<span class="count">{{ node.auto_skip }}</span>
</span>
</template>
<template v-else>
<span v-if="node.error_ignorable" class="error-handle-icon"><span class="text">AS</span></span>
<span v-if="node.isSkipped || node.skippable" class="error-handle-icon"><span class="text">MS</span></span>
<span v-if="node.can_retry || node.retryable" class="error-handle-icon"><span class="text">MR</span></span>
<span v-if="node.auto_retry && node.auto_retry.enable" class="error-handle-icon"><span class="text">AR</span></span>
</template>
</div>
<div v-if="node.hasUpdated" class="updated-dot">
<div class="ripple"></div>
Expand Down Expand Up @@ -67,7 +89,7 @@
</template>
<span v-if="node.status === 'SUSPENDED'" @click.stop="onSubflowPauseResumeClick('resume')">
<i class="common-icon-play"></i>
{{ $t('继续') }}
{{ $t('确认继续') }}
</span>
</template>
</div>
Expand Down
30 changes: 24 additions & 6 deletions frontend/desktop/src/components/common/TemplateCanvas/NodeTemplate/TaskNode.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,10 +41,28 @@
@change="onNodeCheckClick">
</bk-checkbox>
</template>
<span v-if="node.error_ignorable" class="error-handle-icon"><span class="text">AS</span></span>
<span v-if="node.isSkipped || node.skippable" class="error-handle-icon"><span class="text">MS</span></span>
<span v-if="node.can_retry || node.retryable" class="error-handle-icon"><span class="text">MR</span></span>
<span v-if="node.auto_retry && node.auto_retry.enable" class="error-handle-icon"><span class="text">AR</span></span>
<!-- 节点循环次数 -->
<div v-if="node.loop > 1" class="task-status-icon task-node-loop">
<i class="common-icon-loading-oval"></i>
<span>{{ node.loop > 99 ? '99+' : node.loop }}</span>
</div>
<!-- 任务节点自动重试/手动重试 -->
<template v-if="node.mode === 'execute'">
<span v-if="node.retry - node.auto_skip > 0" class="error-handle-icon">
<span class="text">MR</span>
<span class="count">{{ node.retry - node.auto_skip }}</span>
</span>
<span v-if="node.auto_skip" class="error-handle-icon">
<span class="text">AR</span>
<span class="count">{{ node.auto_skip }}</span>
</span>
</template>
<template v-else>
<span v-if="node.error_ignorable" class="error-handle-icon"><span class="text">AS</span></span>
<span v-if="node.isSkipped || node.skippable" class="error-handle-icon"><span class="text">MS</span></span>
<span v-if="node.can_retry || node.retryable" class="error-handle-icon"><span class="text">MR</span></span>
<span v-if="node.auto_retry && node.auto_retry.enable" class="error-handle-icon"><span class="text">AR</span></span>
</template>
</div>
<!-- 节点右上角执行相关的icon区域 -->
<node-right-icon-status :node="node"></node-right-icon-status>
Expand All @@ -58,10 +76,10 @@
<i class="common-icon-skip"></i>
{{ $t('跳过') }}
</span>
<template v-if="node.status === 'RUNNING'">
<template v-if="['RUNNING', 'PENDING_PROCESSING', 'PENDING_APPROVAL', 'PENDING_CONFIRMATION'].includes(node.status)">
<span v-if="node.code === 'pause_node'" @click.stop="$emit('onTaskNodeResumeClick', node.id)">
<i class="common-icon-play"></i>
{{ $t('继续') }}
{{ $t('确认继续') }}
</span>
<span v-else-if="node.code === 'bk_approve'" @click.stop="$emit('onApprovalClick', node.id)">
<i class="common-icon-circulation"></i>
Expand Down
115 changes: 82 additions & 33 deletions frontend/desktop/src/components/common/TemplateCanvas/NodeTemplate/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -366,6 +366,15 @@
@include nodeClick ($blueDark);
}
}
&.pending_task_continue,
&.pending_processing,
&.pending_approval,
&.pending_confirmation {
@include taskNodeStyle (#ffb848);
&.actived {
@include nodeClick (#ffb848);
}
}
&.running {
.node-name {
border-color: $blueDark;
Expand Down Expand Up @@ -406,6 +415,11 @@
.node-icon-font {
font-size: 16px;
color: #ffffff;
&.common-icon-bk-plugin-message,
&.common-icon-bk-plugin-confirm,
&.common-icon-bk-plugin-approval {
font-size: 14px;
}
}
.stage-name {
padding: 0 4px;
Expand Down Expand Up @@ -447,26 +461,43 @@
position: absolute;
top: -20px;
left: 0;
overflow: hidden;
height: 20px;
.bk-form-checkbox,
.dark-circle {
float: left;
margin-right: 2px;
margin-bottom: 2px;
font-size: 14px;
color: #979ba5;
}
.error-handle-icon {
float: left;
margin-right: 2px;
padding: 0 3px;
display: flex;
align-items: center;
margin-left: -4px;
line-height: 12px;
color: #ffffff;
background: #979ba5;
border-radius: 2px;
font-size: 12px;
transform: scale(0.75) translateY(-1px);
.text {
display: inline-block;
font-size: 12px;
transform: scale(0.8);
padding: 2px 3px;
color: #ffffff;
background: #979ba5;
border-radius: 1px 0 0 1px;
}
.count {
padding: 2px 3px;
color: #636568;
background: #dcdee5;
border-radius: 0px 1px 1px 0;
}
&:nth-of-type(2) {
margin-left: -1px;
}
&:last-child {
margin-left: -5px;
}
&:nth-of-type(4) {
margin-left: -5px;
}
&:nth-of-type(5) {
margin-left: -4px;
}
}
}
Expand Down Expand Up @@ -518,16 +549,16 @@
align-items: center;
justify-content: space-between;
top: -10px;
right: -8px;
height: 18px;
right: -10px;
height: 20px;
}
.task-status-icon {
display: flex;
justify-content: center;
align-items: center;
margin-left: 2px;
width: 18px;
height: 18px;
width: 20px;
height: 20px;
font-size: 14px;
border-radius: 50%;
background: #f8b53f;
Expand All @@ -541,37 +572,45 @@
.common-icon-clock {
display: inline-block;
}
.common-icon-pending-approval,
.common-icon-pending-confirm {
font-size: 12px;
color: #fff;
}
.common-icon-loading {
display: inline-block;
animation: loading 1.4s infinite linear;
}
.icon-arrows-right-shape {
font-size: 12px;
.common-icon-pause {
font-size: 20px;
transform: scale(0.5);
}
.retry-times {
font-size: 12px;
}
&.node-pending {
height: 20px;
width: 20px;
box-shadow: none;
}
&.task-node-loop {
position: relative;
height: 16px;
width: 16px;
width: 24px;
margin: 0 4px 0 0;
transform: translateY(1px);
color: #3a84ff;
background: #fff !important;
background: transparent !important;
box-shadow: none;
> i {
position: absolute;
font-size: 14px;
}
> span {
position: relative;
top: -0.5px;
top: -1px;
left: 0px;
font-weight: 700;
font-size: 18px;
transform: scale(.5);
}
&.loop-plural {
width: 26px;
height: 16px;
border-radius: 8px;
transform: scale(.5) translateY(2px);
}
}
@keyframes loading {
Expand All @@ -583,13 +622,23 @@
}
}
}
.node-subscript {
font-size: 12px;
background: #ea3636 !important;
.node-manual-skip,
.node-auto-skip {
display: flex;
height: 20px;
font-size: 20px;
border-radius: 50%;
color: #f0a0a0;
background: #fff;
i {
transform: translateY(1px);
}
}
.node-phase-icon {
transform: translateY(-2px);
margin-right: 4px;
i {
font-size: 14px;
font-size: 16px;
&.phase-warn {
color: $yellowDark;
}
Expand Down
12 changes: 6 additions & 6 deletions frontend/desktop/src/components/common/TemplateCanvas/ToolPanel/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
<div class="tool-position">
<div
:class="['tool-icon', {
'actived': showSmallMap
'is-active': showSmallMap
}]"
v-bk-tooltips="{
content: $t('缩略视图'),
Expand Down Expand Up @@ -60,7 +60,7 @@
</div>
<div
:class="['tool-icon', {
'actived': isSelectionOpen
'is-active': isSelectionOpen
}]"
v-if="editable"
v-bk-tooltips="{
Expand All @@ -85,7 +85,7 @@
</div>
<div
:class="['tool-icon', {
'actived': isAllSelected
'is-active': isAllSelected
}]"
v-if="isShowSelectAllTool"
v-bk-tooltips="{
Expand All @@ -99,7 +99,7 @@
</div>
<div
:class="['tool-icon', {
'actived': isShowHotKey
'is-active': isShowHotKey
}]"
v-bk-tooltips="{
content: $t('快捷键'),
Expand All @@ -111,7 +111,7 @@
</div>
<div
:class="['tool-icon', {
'actived': isPerspective
'is-active': isPerspective
}]"
v-bk-tooltips="{
content: $t('变量引用预览'),
Expand Down Expand Up @@ -251,7 +251,7 @@
background: #f4f7ff;
border-radius: 1px;
}
&.actived {
&.is-active {
color: #3a84ff;
background: #f4f7ff;
border-radius: 1px;
Expand Down
Loading
Loading