feat: 审批人 disabled 交互 & 样式

src/components/scWorkflow/nodes/approver.vue

@@ -1,10 +1,10 @@
 <template>
 	<div class="node-wrap">
-		<div class="node-wrap-box">
+		<div class="node-wrap-box" :class="{ 'node-wrap-box--disabled': disabled }">
 			<div class="title" style="background: var(--el-color-warning)">
 				<el-icon class="icon"><user-filled /></el-icon>
 				<span v-show="!isEditTitle" class="title_label" @click="editTitle('box_nodeTitle')"
-					>{{ nodeConfig.nodeName }}<el-icon class="edit-icon"><edit /></el-icon
+					>{{ nodeConfig.nodeName }}<el-icon v-if="!disabled" class="edit-icon"><edit /></el-icon
 				></span>
 				<el-input
 					v-show="isEditTitle"
@@ -15,14 +15,14 @@
 					@blur="saveTitle"
 					@keyup.enter="saveTitle"
 				></el-input>
-				<el-icon class="close" @click.stop="delNode()"><close /></el-icon>
+				<el-icon v-if="!disabled" class="close" @click.stop="delNode()"><close /></el-icon>
 			</div>
 			<div class="content" @click="show">
 				<span v-if="toText(nodeConfig)">{{ toText(nodeConfig) }}</span>
 				<span v-else class="placeholder">请选择</span>
 			</div>
 		</div>
-		<add-node v-model="nodeConfig.childNode"></add-node>
+		<add-node v-model="nodeConfig.childNode" :disabled="disabled"></add-node>
 		<el-drawer v-model="drawer" title="审批人设置" destroy-on-close append-to-body :size="600" class="aDrawer">
 			<template #header>
 				<div class="node-wrap-drawer__title">
@@ -192,7 +192,11 @@ export default {
 	},
 	inject: ['select'],
 	props: {
-		modelValue: { type: Object, default: () => {} }
+		modelValue: { type: Object, default: () => {} },
+    disabled: {
+      type: Boolean,
+      default: false
+    }
 	},
 	data() {
 		return {
@@ -226,6 +230,7 @@ export default {
 	},
 	methods: {
 		show() {
+      if (this.disabled) return
 			this.form = JSON.parse(JSON.stringify(this.nodeConfig))
 			const { formStructure } = JSON.parse(this.processForm)
 			const formConfig = this.form.extendConfig?.formConfig || []
@@ -243,6 +248,7 @@ export default {
 			this.drawer = true
 		},
 		editTitle(refName) {
+      if (this.disabled) return
 			this.isEditTitle = true
 			this.$nextTick(() => {
 				this.$refs[refName]?.focus()