Browse Source

feat: 条件描述默认条件样式

luoyali 1 year ago
parent
commit
bf6f3cc025
2 changed files with 33 additions and 6 deletions
  1. 9 0
      src/components/scWorkflow/index.vue
  2. 24 6
      src/components/scWorkflow/nodes/branch.vue

+ 9 - 0
src/components/scWorkflow/index.vue

@@ -320,6 +320,9 @@ export default {
 	}
 	}
 	.auto-judge .title .node-title {
 	.auto-judge .title .node-title {
 		color: #15bc83;
 		color: #15bc83;
+		&.last-child-title {
+			color: #999;
+		}
 	}
 	}
 	.auto-judge .title .close {
 	.auto-judge .title .close {
 		font-size: 15px;
 		font-size: 15px;
@@ -338,6 +341,12 @@ export default {
 	.auto-judge .content {
 	.auto-judge .content {
 		position: relative;
 		position: relative;
 		padding-top: 15px;
 		padding-top: 15px;
+		&.last-child-title {
+			padding-top: 5px;
+			span {
+				line-height: 1;
+			}
+		}
 	}
 	}
 	.auto-judge .content .placeholder {
 	.auto-judge .content .placeholder {
 		color: #999;
 		color: #999;

+ 24 - 6
src/components/scWorkflow/nodes/branch.vue

@@ -7,21 +7,35 @@
 					<div class="condition-node">
 					<div class="condition-node">
 						<div class="condition-node-box">
 						<div class="condition-node-box">
 							<div class="auto-judge" @click="show(index)">
 							<div class="auto-judge" @click="show(index)">
-								<div v-if="index != 0" class="sort-left" @click.stop="arrTransfer(index, -1)">
+								<!-- 不是第一个 也不是 最后一个-->
+								<div v-if="index != 0 && index != nodeConfig.conditionNodes.length - 1" class="sort-left" @click.stop="arrTransfer(index, -1)">
 									<el-icon><ArrowLeft /></el-icon>
 									<el-icon><ArrowLeft /></el-icon>
 								</div>
 								</div>
 								<div class="title">
 								<div class="title">
-									<span class="node-title">{{ item.nodeName }}</span>
+									<span class="node-title" :class="[index === nodeConfig.conditionNodes.length - 1 ? 'last-child-title' : '']">{{
+										index === nodeConfig.conditionNodes.length - 1 ? '默认条件' : item.nodeName
+									}}</span>
 									<span class="priority-title">优先级{{ item.priorityLevel }}</span>
 									<span class="priority-title">优先级{{ item.priorityLevel }}</span>
-									<el-icon class="close" @click.stop="delTerm(index)">
+									<el-icon v-if="index != nodeConfig.conditionNodes.length - 1" class="close" @click.stop="delTerm(index)">
 										<Close />
 										<Close />
 									</el-icon>
 									</el-icon>
 								</div>
 								</div>
-								<div class="content">
+								<div class="content" :class="[index === nodeConfig.conditionNodes.length - 1 ? 'last-child-title' : '']">
 									<span v-if="toText(nodeConfig, index)">{{ toText(nodeConfig, index) }}</span>
 									<span v-if="toText(nodeConfig, index)">{{ toText(nodeConfig, index) }}</span>
 									<span v-else class="placeholder"> 请设置条件 </span>
 									<span v-else class="placeholder"> 请设置条件 </span>
 								</div>
 								</div>
-								<div v-if="index != nodeConfig.conditionNodes.length - 1" class="sort-right" @click.stop="arrTransfer(index)">
+								<!-- 最后一个没有,长度大于2倒数第二个没有 -->
+								<div
+									v-if="
+										!(nodeConfig.conditionNodes.length == 2 && (index === nodeConfig.conditionNodes.length - 1 || index === 0)) &&
+										!(
+											(nodeConfig.conditionNodes.length > 2 && index === nodeConfig.conditionNodes.length - 1) ||
+											index === nodeConfig.conditionNodes.length - 2
+										)
+									"
+									class="sort-right"
+									@click.stop="arrTransfer(index)"
+								>
 									<el-icon><ArrowRight /></el-icon>
 									<el-icon><ArrowRight /></el-icon>
 								</div>
 								</div>
 							</div>
 							</div>
@@ -153,6 +167,10 @@ export default {
 	},
 	},
 	methods: {
 	methods: {
 		show(index) {
 		show(index) {
+			if (index === this.nodeConfig.conditionNodes.length - 1) {
+				// 最后一个节点不能编辑
+				return
+			}
 			this.index = index
 			this.index = index
 			this.form = {}
 			this.form = {}
 			this.form = JSON.parse(JSON.stringify(this.nodeConfig.conditionNodes[index]))
 			this.form = JSON.parse(JSON.stringify(this.nodeConfig.conditionNodes[index]))
@@ -240,7 +258,7 @@ export default {
 				return conditionList.length + '个条件,或满足'
 				return conditionList.length + '个条件,或满足'
 			} else {
 			} else {
 				if (index == nodeConfig.conditionNodes.length - 1) {
 				if (index == nodeConfig.conditionNodes.length - 1) {
-					return '其他条件进入此流程'
+					return '未满足时其他条件时,将进入默认流程'
 				} else {
 				} else {
 					return false
 					return false
 				}
 				}