去除 jeeplus-bpmn 的工作流编辑器，原因：功能相对不完善。使用 bpmnProcessDesigner 替代

yudao-admin-ui/src/views/bpm/model/index.vue

@@ -68,10 +68,10 @@
                 @pagination="getList"/>
 
     <!-- 流程编辑器 -->
-    <el-dialog class="bpmnclass dialogClass" :visible.sync="showBpmnOpen" :before-cancel="cancel" :fullscreen="true">
-      <vue-bpmn v-if="showBpmnOpen" product="activiti" @processSave="processSave"
-                :bpmnXml="bpmnXML" :bpmnData="bpmnData" @beforeClose="cancel" />
-    </el-dialog>
+<!--    <el-dialog class="bpmnclass dialogClass" :visible.sync="showBpmnOpen" :before-cancel="cancel" :fullscreen="true">-->
+<!--      <vue-bpmn v-if="showBpmnOpen" product="activiti" @processSave="processSave"-->
+<!--                :bpmnXml="bpmnXML" :bpmnData="bpmnData" @beforeClose="cancel" />-->
+<!--    </el-dialog>-->
 
     <!-- 流程表单配置详情 -->
     <el-dialog title="表单详情" :visible.sync="detailOpen" width="50%" append-to-body>
@@ -84,7 +84,7 @@
 
 <script>
 import {deleteModel, deployModel, createModel, updateModel, getModelPage, getModel} from "@/api/bpm/model";
-import VueBpmn from "@/components/bpmn/VueBpmn";
+// import VueBpmn from "@/components/bpmn/VueBpmn";
 import {DICT_TYPE, getDictDatas} from "@/utils/dict";
 import {getForm} from "@/api/bpm/form";
 import {decodeFields} from "@/utils/formGenerator";
@@ -94,7 +94,7 @@ export default {
   name: "model",
   components: {
     Parser,
-    VueBpmn
+    // VueBpmn
   },
   data() {
     return {

yudao-admin-ui/src/views/bpm/model/modelEditor.vue

@@ -4,19 +4,17 @@
 
     <!-- TODO 芋艿：去除测试任务 -->
 <!--    <my-process-palette />-->
-
     <my-process-designer
       :key="`designer-${reloadIndex}`"
       v-model="xmlString"
       v-bind="controlForm"
       keyboard
       ref="processDesigner"
-      @element-click="elementClick"
       @init-finished="initModeler"
     />
     <my-properties-panel :key="`penal-${reloadIndex}`" :bpmn-modeler="modeler" :prefix="controlForm.prefix" class="process-panel" />
 
-    <!-- demo config -->
+    <!-- 右边的全局设置 -->
     <div class="demo-control-bar">
       <div class="open-control-dialog" @click="controlDrawerVisible = true"><i class="el-icon-setting"></i></div>
     </div>
@@ -84,7 +82,7 @@ export default {
   components: { MyProcessPalette },
   data() {
     return {
-      xmlString: "",
+      xmlString: "", // BPMN XML
       modeler: null,
       reloadIndex: 0,
       controlDrawerVisible: false,
@@ -95,7 +93,7 @@ export default {
         simulation: true,
         labelEditing: false,
         labelVisible: false,
-        prefix: "flowable",
+        prefix: "activiti",
         headerButtonSize: "mini",
         // additionalModel: []
         additionalModel: [CustomContentPadProvider, CustomPaletteProvider]
@@ -138,44 +136,17 @@ export default {
     //   this.addis.customRenderer = status ? CustomRenderer : false;
     //   this.reloadProcessDesigner();
     // },
-    elementClick(element) {
-      this.element = element;
-
-      !this.elementOverlayIds && (this.elementOverlayIds = {});
-
-      !this.overlays && (this.overlays = this.modeler.get("overlays"));
-      !this.contextPad && (this.contextPad = this.modeler.get("contextPad"));
-
-      this.modeler.on("element.hover", ({ element }) => {
-        if (!this.elementOverlayIds[element.id] && element.type !== "bpmn:Process") {
-          this.elementOverlayIds[element.id] = this.overlays.add(element, {
-            position: { left: 0, bottom: 0 },
-            html: `<div class="element-overlays">
-            <p>Elemet id: ${element.id}</p>
-            <p>Elemet type: ${element.type}</p>
-          </div>`
-          });
-        }
-      });
-
-      this.modeler.on("element.out", ({ element }) => {
-        if (element) {
-          this.overlays.remove({ element });
-          this.elementOverlayIds[element.id] = null;
-        }
-      });
-    }
   }
 };
 </script>
 
 <style lang="scss">
-body {
-  overflow: hidden;
-  margin: 0;
-  box-sizing: border-box;
-}
-//#app {
+//body {
+//  overflow: hidden;
+//  margin: 0;
+//  box-sizing: border-box;
+//}
+//.app {
 //  width: 100%;
 //  height: 100%;
 //  box-sizing: border-box;
@@ -224,45 +195,22 @@ body {
   color: #fafafa;
 }
 
-.bjs-container {
-  height: 400px !important; // TODO 芋艿：bjs 容器的高度不对，临时改下
+.my-process-designer {
+  height: calc(100vh - 84px);
+  //height: 800px !important; // TODO 芋艿：bjs 容器的高度不对，临时改下
+  //z-index: 0 !important;
+  //pointer-events: none !important;
 }
 .process-panel__container { // TODO 芋艿：右边的位置不对，临时改下
-  margin-top: -200px;
-  float: right;
-  height: 800px;
-  z-index: 2147483647 !important;
+  //margin-top: -800px !important;
+  //float: right;
+  //margin-left: 800px !important;
+  //height: 800px;
+  //z-index: 2147483647 !important;
+  //cursor:pointer !important;
+  position: absolute;
+  right: 0;
+  top: 55px;
 }
 
-body,
-body * {
-  /* 滚动条 */
-  &::-webkit-scrollbar-track-piece {
-    background-color: #fff; /*滚动条的背景颜色*/
-    -webkit-border-radius: 0; /*滚动条的圆角宽度*/
-  }
-  &::-webkit-scrollbar {
-    width: 10px; /*滚动条的宽度*/
-    height: 8px; /*滚动条的高度*/
-  }
-  &::-webkit-scrollbar-thumb:vertical {
-    /*垂直滚动条的样式*/
-    height: 50px;
-    background-color: rgba(153, 153, 153, 0.5);
-    -webkit-border-radius: 4px;
-    outline: 2px solid #fff;
-    outline-offset: -2px;
-    border: 2px solid #fff;
-  }
-  &::-webkit-scrollbar-thumb {
-    /*滚动条的hover样式*/
-    background-color: rgba(159, 159, 159, 0.3);
-    -webkit-border-radius: 4px;
-  }
-  &::-webkit-scrollbar-thumb:hover {
-    /*滚动条的hover样式*/
-    background-color: rgba(159, 159, 159, 0.5);
-    -webkit-border-radius: 4px;
-  }
-}
 </style>

yudao-admin-ui/src/views/bpm/processDefinition/index.vue

@@ -42,14 +42,14 @@
     <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
                 @pagination="getList"/>
     <el-dialog :visible.sync="showBpmnBool" :before-close="close" :fullscreen="true">
-      <vue-bpmn v-if="showBpmnBool" product="activiti" @processSave="processSave" :bpmnXml="bpmnXML" :bpmnData="bpmnData" @beforeClose="close"></vue-bpmn>
+<!--      <vue-bpmn v-if="showBpmnBool" product="activiti" @processSave="processSave" :bpmnXml="bpmnXML" :bpmnData="bpmnData" @beforeClose="close"></vue-bpmn>-->
     </el-dialog>
   </div>
 </template>
 
 <script>
 import {page} from "@/api/bpm/processDefinition";
-import VueBpmn from "@/components/bpmn/VueBpmn";
+// import VueBpmn from "@/components/bpmn/VueBpmn";
 
 export default {
   name: "processDefinition",
@@ -73,7 +73,7 @@ export default {
       }
     };
   },
-  components: {VueBpmn},
+  // components: {VueBpmn},
   created() {
     this.getList();
   },