mirror of
https://github.com/kuaifan/dootask.git
synced 2026-01-27 04:58:12 +00:00
feat(workflow): 在工作流配置中添加规则摘要展示
在工作流展开后的配置表格上方添加规则摘要区块，根据实际配置动态展示： - 状态负责人规则：区分添加模式、流转模式、剔除模式的不同描述 - 限制负责人规则：显示仅限任务负责人和项目管理员修改状态 - 关联列表规则：显示流转时自动移动至指定列表 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
kuaifan
parent
ae021fd148
commit
478876ddc1
@ -30,6 +30,36 @@
|
||||
</div>
|
||||
</div>
|
||||
<div slot="content" class="taskflow-config">
|
||||
<div v-if="flowRulesMap[data.id] && flowRulesMap[data.id].length > 0" class="taskflow-config-rules">
|
||||
<div class="rules-title">
|
||||
<Icon type="md-list-box" />
|
||||
<span>{{$L('工作流规则')}}</span>
|
||||
</div>
|
||||
<div class="rules-list">
|
||||
<div v-for="(rule, ruleIndex) in flowRulesMap[data.id]" :key="ruleIndex" class="rules-item">
|
||||
<template v-if="rule.type === 'owner'">
|
||||
<span>{{$L('流转到')}}</span>
|
||||
<span class="rule-status" :class="rule.status">{{rule.name}}</span>
|
||||
<span v-if="rule.usertype === 'add'">{{$L('时添加')}}</span>
|
||||
<span v-else>{{$L('时改变任务负责人为')}}</span>
|
||||
<UserAvatar v-for="(uid, uidx) in rule.userids" :key="`${ruleIndex}_${uidx}`" :userid="uid" :size="20" :borderWidth="1" showName/>
|
||||
<span v-if="rule.usertype === 'add'">{{$L('至任务负责人')}}</span>
|
||||
<span v-else-if="rule.usertype === 'merge'">{{$L('（并保留操作人），原负责人移至协助人员')}}</span>
|
||||
<span v-else>{{$L('，原负责人移至协助人员')}}</span>
|
||||
</template>
|
||||
<template v-else-if="rule.type === 'limit'">
|
||||
<span class="rule-status" :class="rule.status">{{rule.name}}</span>
|
||||
<span>{{$L('仅限任务负责人和项目管理员修改状态')}}</span>
|
||||
</template>
|
||||
<template v-else-if="rule.type === 'column'">
|
||||
<span>{{$L('流转到')}}</span>
|
||||
<span class="rule-status" :class="rule.status">{{rule.name}}</span>
|
||||
<span>{{$L('时自动将任务移动至列表')}}</span>
|
||||
<span class="rule-column">{{rule.columnName}}</span>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="taskflow-config-table">
|
||||
<div class="taskflow-config-table-left-container">
|
||||
<div class="taskflow-config-table-column-header left-header">{{$L('配置项')}}</div>
|
||||
@ -269,6 +299,52 @@ export default {
|
||||
name: item.name,
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
flowRulesMap() {
|
||||
const map = {};
|
||||
const columnMap = {};
|
||||
this.columnList.forEach(col => {
|
||||
columnMap[col.id] = col.name;
|
||||
});
|
||||
|
||||
this.list.forEach(data => {
|
||||
const rules = [];
|
||||
data.project_flow_item.forEach(item => {
|
||||
// 状态负责人规则
|
||||
if (item.userids && item.userids.length > 0) {
|
||||
rules.push({
|
||||
type: 'owner',
|
||||
name: item.name,
|
||||
status: item.status,
|
||||
userids: item.userids,
|
||||
usertype: item.usertype
|
||||
});
|
||||
}
|
||||
|
||||
// 限制负责人规则（不依赖状态负责人）
|
||||
if (item.userlimit === 1) {
|
||||
rules.push({
|
||||
type: 'limit',
|
||||
name: item.name,
|
||||
status: item.status
|
||||
});
|
||||
}
|
||||
|
||||
// 关联列表规则
|
||||
if (item.columnid && columnMap[item.columnid]) {
|
||||
rules.push({
|
||||
type: 'column',
|
||||
name: item.name,
|
||||
status: item.status,
|
||||
columnName: columnMap[item.columnid]
|
||||
});
|
||||
}
|
||||
});
|
||||
map[data.id] = rules;
|
||||
});
|
||||
|
||||
return map;
|
||||
}
|
||||
},
|
||||
|
||||
@ -573,6 +649,7 @@ export default {
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -127,8 +127,76 @@
|
||||
|
||||
.taskflow-config {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-height: 100%;
|
||||
|
||||
.taskflow-config-rules {
|
||||
flex-shrink: 0;
|
||||
padding: 12px 20px;
|
||||
margin-bottom: 12px;
|
||||
background-color: #f7f8fa;
|
||||
border-radius: 4px;
|
||||
.rules-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 8px;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: $primary-title-color;
|
||||
> i {
|
||||
margin-right: 4px;
|
||||
font-size: 16px;
|
||||
color: #1890ff;
|
||||
}
|
||||
}
|
||||
.rules-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
.rules-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
font-size: 13px;
|
||||
color: #666;
|
||||
line-height: 24px;
|
||||
.rule-status {
|
||||
flex-shrink: 0;
|
||||
padding: 2px 8px;
|
||||
border-radius: 3px;
|
||||
font-size: 12px;
|
||||
&.start {
|
||||
background-color: rgba($flow-status-start-color, 0.1);
|
||||
color: $flow-status-start-color;
|
||||
}
|
||||
&.progress {
|
||||
background-color: rgba($flow-status-progress-color, 0.1);
|
||||
color: $flow-status-progress-color;
|
||||
}
|
||||
&.test {
|
||||
background-color: rgba($flow-status-test-color, 0.1);
|
||||
color: $flow-status-test-color;
|
||||
}
|
||||
&.end {
|
||||
background-color: rgba($flow-status-end-color, 0.1);
|
||||
color: $flow-status-end-color;
|
||||
}
|
||||
}
|
||||
.rule-column {
|
||||
padding: 2px 8px;
|
||||
background-color: rgba(#1890ff, 0.1);
|
||||
color: #1890ff;
|
||||
border-radius: 3px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.common-avatar {
|
||||
margin: 0 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.taskflow-config-table {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user