引用抽屉组件

src/components/XnWorkflow/index.vue

@@ -11,34 +11,28 @@
         <!-- 配置流程全局属性 -->
         <div style="float: right; padding-right: 10px">
             <span v-if="!toDataLegal(childNode)" style="padding-right: 5px">
-<!--				<exclamation-circle-outlined style="color: red; font-size: 18px" />-->
-<!--                <Warning style="color: red; font-size: 18px"/>-->
+                <!--				<exclamation-circle-outlined style="color: red; font-size: 18px" />-->
+                <!--                <Warning style="color: red; font-size: 18px"/>-->
             </span>
-<!--			<el-tooltip>-->
-<!--				<template #title></template>-->
-<!--				<el-button @click="$refs.process.showDrawer()">-->
-<!--					<template #icon>-->
-<!--&lt;!&ndash;						<setting-outlined />&ndash;&gt;-->
-<!--                        <Setting />-->
-<!--					</template>-->
-<!--					-->
-<!--				</el-button>-->
-<!--			</el-tooltip>-->
+            <!--			<el-tooltip>-->
+            <!--				<template #title></template>-->
+            <!--				<el-button @click="$refs.process.showDrawer()">-->
+            <!--					<template #icon>-->
+            <!--&lt;!&ndash;						<setting-outlined />&ndash;&gt;-->
+            <!--                        <Setting />-->
+            <!--					</template>-->
+            <!--					-->
+            <!--				</el-button>-->
+            <!--			</el-tooltip>-->
 
-            <el-tooltip
-                class="box-item"
-                effect="dark"
-                content="配置流程全局属性"
-                placement="top"
-            >
-                <el-button :icon='Setting'>
+            <el-tooltip class="box-item" effect="dark" content="配置流程全局属性" placement="top">
+                <el-button :icon="Setting" @click="drawerVisibile=true">
                     全局配置
                     <template #icon>
                         <Setting />
                     </template>
                 </el-button>
             </el-tooltip>
-
         </div>
         <div class="box-scale">
             <node-wrap
@@ -69,14 +63,16 @@
             :selector-api-function="selectorApiFunction"
         />
     </div>
+    <!-- 全局属性抽屉组件 -->
+    <drawerTabs v-if="drawerVisibile" v-model="drawerVisibile" @updateDrawer="updateDrawer"></drawerTabs>
 </template>
 
 <script>
-	import nodeWrap from './nodeWrap.vue'
-    import { Warning, Setting, Plus } from '@element-plus/icons-vue'
-	import process from './process.vue'
-
-	export default {
+import nodeWrap from './nodeWrap.vue'
+import { Warning, Setting, Plus } from '@element-plus/icons-vue'
+import process from './process.vue'
+import drawerTabs from './components/drawerTabs.vue'
+export default {
     computed: {
         Plus() {
             return Plus
@@ -86,7 +82,8 @@
         nodeWrap,
         Warning,
         Setting,
-			process
+        process,
+        drawerTabs
     },
     props: {
         modelValue: { type: Object, default: () => {} },
@@ -102,6 +99,7 @@
     },
     data() {
         return {
+            drawerVisibile: false,
             childNode: this.modelValue,
             childFormFieldListValue: this.formFieldListValue,
             childRecordData: this.recordData
@@ -120,7 +118,7 @@
         },
         childNode(val) {
             this.$emit('update:modelValue', val)
-			}
+        },
     },
     methods: {
         toDataLegal(childNode) {
@@ -129,11 +127,14 @@
             } else {
                 return childNode.dataLegal
             }
+        },
+		updateDrawer(){
+			this.drawerVisibile=false;
 		}
     }
-	}
+}
 </script>
 
 <style lang="less">
-	@import './flowIndex.less';
+@import './flowIndex.less';
 </style>