revert: add Menu in LogicFlow

src/views/flow-chart/index.vue

@@ -1,13 +1,7 @@
 <template>
   <div class="logic-flow-view">
     <!-- 辅助工具栏 -->
-    <Control
-      class="demo-control"
-      v-if="lf"
-      :lf="lf"
-      :catTurboData="false"
-      @catData="catData"
-    ></Control>
+    <Control class="demo-control" v-if="lf" :lf="lf" :catTurboData="false" @catData="catData"></Control>
     <!-- 节点面板 -->
     <NodePanel :lf="lf" :nodeList="nodeList"></NodePanel>
     <!-- 画布 -->
@@ -20,59 +14,67 @@
 </template>
 
 <script lang='ts'>
-import { ref, unref, onMounted, nextTick } from "vue"
-import LogicFlow from '@logicflow/core'
-import { Snapshot, BpmnElement } from '@logicflow/extension'
-import '@logicflow/core/dist/style/index.css'
-import '@logicflow/extension/lib/style/index.css'
-import { Control, NodePanel, DataDialog } from '/@/components/FlowChart'
+import { ref, unref, onMounted, nextTick } from "vue";
+import LogicFlow from "@logicflow/core";
+import { Snapshot, BpmnElement, Menu } from "@logicflow/extension";
+import "@logicflow/core/dist/style/index.css";
+import "@logicflow/extension/lib/style/index.css";
+import { Control, NodePanel, DataDialog } from "/@/components/FlowChart";
 
-import { toTurboData, toLogicflowData } from '/@/components/FlowChart/src/adpterForTurbo'
-import { BpmnNode } from '/@/components/FlowChart/src/config'
-import demoData from './dataTurbo.json'
+import {
+  toTurboData,
+  toLogicflowData
+} from "/@/components/FlowChart/src/adpterForTurbo";
+import { BpmnNode } from "/@/components/FlowChart/src/config";
+import demoData from "./dataTurbo.json";
 export default {
   components: { NodePanel, Control, DataDialog },
   setup() {
-    let lf = ref(null) 
-    let graphData =ref(null)
-    let dataVisible = ref(false)
+    let lf = ref(null);
+    let graphData = ref(null);
+    let dataVisible = ref(false);
     let config = ref({
-        grid: true,
-        background: {
-          color: '#f7f9ff'
-        },
-        keyboard: {
-          enabled: true
-        },
-      })
-    let nodeList= BpmnNode
+      grid: true,
+      background: {
+        color: "#f7f9ff"
+      },
+      keyboard: {
+        enabled: true
+      }
+    });
+    let nodeList = BpmnNode;
 
     function initLf() {
       // 画布配置
-      LogicFlow.use(Snapshot)
+      LogicFlow.use(Snapshot);
       // 使用bpmn插件，引入bpmn元素，这些元素可以在turbo中转换后使用
-      LogicFlow.use(BpmnElement)
-      const domLf = new LogicFlow({ ...unref(config), container: document.querySelector('#LF-Turbo') })
-      lf.value = domLf
+      LogicFlow.use(BpmnElement);
+      // 启动右键菜单
+      LogicFlow.use(Menu);
+      const domLf = new LogicFlow({
+        ...unref(config),
+        container: document.querySelector("#LF-Turbo")
+      });
+      lf.value = domLf;
       // 设置边类型bpmn:sequenceFlow为默认类型
-      unref(lf).setDefaultEdgeType('bpmn:sequenceFlow')
-      onRender()
+      unref(lf).setDefaultEdgeType("bpmn:sequenceFlow");
+      onRender();
     }
 
     function onRender() {
       // Turbo数据转换为LogicFlow内部识别的数据结构
-      const lFData = toLogicflowData(demoData)
-      lf.value.render(lFData)
+      const lFData = toLogicflowData(demoData);
+      lf.value.render(lFData);
     }
 
     function catData() {
-      graphData.value = unref(lf).getGraphData()
-      dataVisible.value = true
+      graphData.value = unref(lf).getGraphData();
+      dataVisible.value = true;
     }
 
-    onMounted(()=>{
-      initLf()
-    })
+    onMounted(() => {
+      initLf();
+    });
 
     return {
       lf,
@@ -82,7 +84,7 @@ export default {
       nodeList,
       catData
     };
-  },
+  }
 };
 </script>