init

src/views/workflow/common/ProcessDiagramViewer.vue

@@ -0,0 +1,27 @@
+<template>
+  <div>
+    <div class="scale">
+      <el-button icon="Plus" size="mini" @click="scale += 10" :disabled="scale >= 150" circle></el-button>
+      <span>{{ scale }}%</span>
+      <el-button icon="Minus" size="mini" @click="scale -= 10" :disabled="scale <= 40" circle></el-button>
+    </div>
+  </div>
+  <div style="margin-top: 40px">
+    <div :style="'transform: scale('+ scale / 100 +');'">
+      <div id="previewProcess">
+        <process-tree mode="preview" ref="processTreePreview" id-name="previewProcess"/>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import ProcessTree from '@/views/workflow/process/ProcessTree.vue'
+
+const processTreePreview = ref()
+const scale = ref(100)
+
+nextTick(()=>{
+  processTreePreview.value.init()
+})
+</script>