初步demo实现，初步可用 ，更加详细配置之后再写

README.md

@@ -31,14 +31,14 @@ Array<node>
 class Node {
     id // 如果是开始节点请写死 "root" 节点id
     groupId // 组ID
-    type  //  1|2|3|4|5|6  开始，抄送 条件 审批 结束 流转至
+    type  //  1|2|3|4|5|6  开始，抄送 条件 审批 结束 流转至 配置性文件
     title // "标题",
     groupPid //如果col元素 会以他们的groupId虚拟一个包裹层，包裹层的groupId 是所包裹的所有col元素的groupPid
     content // "显示内容",
     isRow //  是否为行元素 
     isRoot //  是否是根节点
-    data // {}
-    pids //非必填 无需关心
+    data // {} 
+    pids //非必填 无需关心（因项目需求需要向后端解析上一关联节点需要） 目前只有在触发 subData()时生成
 }
 ```
 暴露出去的数据格式  Array
@@ -49,6 +49,19 @@ class node {
 
 }
 ```
+暴露的方法
+``` javascript
+getResData() //获取所有节点组成的一维数组
+nodeChange(changeRes) // 当前节点发生变化时可手动去触发 //触发方式1.this.$refs.refsName.nodeChange(newNode) 2. 引入event-bus this.$emit('nodeChange',newNode)
+```
+暴露的事件
+```javascript
+@clickNode // 点击当前节点时触发 返回当前节点
+```
+基本所有的功能都能实现了，抽屉部分 每个公司里面的东西不一样，点击节点之后拿到数据自己去写吧。
+
+// 到这儿 已经可以用了 更加详细的配置 之后再写
+
 ## Project setup
 ```
 yarn install

src/components/DrawFlow/src/DrawFlow.vue

@@ -52,7 +52,6 @@ export default {
   methods: {
     // 节点数据变化事件
     nodeChange(node) {
-      console.log(node, "node");
       this.currentNode.title = node.title;
       this.selfConfig.forEach(i => {
         if (i.id === this.currentNode.id) {
@@ -67,7 +66,6 @@ export default {
      */
     addBranch(node) {
       let newNode = new CopyNode(node[0]);
-      console.log(newNode, node, "newNode");
       this.selfConfig = this.selfConfig.concat([newNode]);
     },
     creatBusNodeChange() {
@@ -76,7 +74,7 @@ export default {
     /**
      * 获取传参数据结构
      */
-    getNodeArr() {
+    getResData() {
       let list = JSON.parse(JSON.stringify(this.selfConfig));
       getPidArr(list);
       return list;
@@ -97,7 +95,6 @@ export default {
     clickSelectBox(nextNode) {
       let { node, selfConfig } = this.getNodeFactory(nextNode);
       this.selfConfig = selfConfig.concat(node);
-      console.log(node, "nodenode");
     },
     /**
      * 根据isRow去判断row或者rol
@@ -207,7 +204,6 @@ export default {
           .map(i => i.groupId === node.groupId && !i.isRow && i)
           .filter(Boolean);
         deleteArr = allCol;
-        console.log(deleteArr, node, "allCol");
         allCol.forEach(i => {
           this.deleteLoop(selfConfig, i, deleteArr);
         });
@@ -219,7 +215,6 @@ export default {
     },
     // 循环遍历删除组下关联节点
     deleteLoop(selfConfig, node, deleteArr) {
-      console.log("传入的deleteArr", deleteArr);
       let currentDeleteArr = selfConfig.filter(i => {
         if (i.isRow) {
           return i.groupId === node.id;
@@ -269,7 +264,6 @@ export default {
     let FlowConfig = this.selfConfig;
     FlowConfig = this.transformTree(FlowConfig);
     const root = JSON.parse(JSON.stringify(this.selfConfig[0]));
-    console.log(this.selfConfig, root);
     return (
       <div class="design-engine">
         <div class="dingflow-design">

src/components/DrawFlow/src/components/AddNodeBtn.vue

@@ -24,8 +24,7 @@ export default {
     };
   },
   methods: {
-    getPopupContainer(trigger) {
-      console.log(trigger.parentElement);
+    getPopupContainer() {
       let el = document.getElementsByClassName("dingflow-design")[0];
       return el;
     },
@@ -36,7 +35,6 @@ export default {
   },
   mounted() {},
   render() {
-    console.log(this.belongToNode, "this.belongeto");
     const node = this.belongToNode;
     return (
       <div class="add-node-btn-box">

src/components/DrawFlow/src/components/DrawCol/FactoryCol.js

@@ -63,7 +63,6 @@ function colBoxRender(h, colNodeArr) {
   });
 }
 function closeNode(event, node) {
-  console.log(event, node, "colCloseNode");
   event.stopPropagation();
   this.closeNode(node);
 }

src/components/DrawFlow/src/components/NodeConfigFactory/NodeFactory.js

@@ -30,15 +30,6 @@ export class ConditionNode {
     this.content += this.id;
     this.groupPid = id;
     this.isRow = isRow;
-    if (type === "3") {
-      this.data = {
-        ruleInfo: {
-          conditions: [],
-          ruleLevel: 1,
-          ruleName: ""
-        }
-      };
-    }
   }
 }
 export class RowNode extends Node {
@@ -51,7 +42,7 @@ export class CopyNode {
   title = "标题";
   id = HashCode();
   content = "内容";
-  data = { ruleInfo: {} };
+  data = {};
   constructor({ id, childNode, ...node }) {
     return Object.assign(node, this);
   }

src/components/DrawFlow/src/utils/index.js

@@ -59,7 +59,6 @@ export function getPidArr(list) {
   let rowNodes = list.filter(i => i.isRow);
   let colNodesGroup = getColNode(colNodes, list);
   let arr = colNodesGroup.concat(rowNodes);
-
   let map = {}; //所有整行元素的字典对象
   for (let item of arr) {
     map[item.id] = item;

src/views/Home.vue

@@ -1,6 +1,11 @@
 <template>
   <div id="drawProcessDesign">
-    <FactoryDrawFlow :FlowConfig="FlowConfig"></FactoryDrawFlow>
+    <a-button @click="getData">提交</a-button>
+    <FactoryDrawFlow
+      @clickNode="clickNode"
+      ref="flow"
+      :FlowConfig="FlowConfig"
+    ></FactoryDrawFlow>
   </div>
 </template>
 <style lang="less" scoped>
@@ -11,7 +16,6 @@
 
 <script>
 // @ is an alias to /src
-import { FlowNode } from "./getNode";
 export default {
   name: "Home",
   components: {},
@@ -35,6 +39,11 @@ export default {
     this.init();
   },
   methods: {
+    getData() {
+      console.log(this.$refs.flow);
+      let res = this.$refs.flow.getResData();
+      console.log("这是返回的一维数组", res);
+    },
     /**
      * 1、创建一个row length 1
      * 2、创建一个col节点
@@ -48,14 +57,8 @@ export default {
     init() {
       // this.FlowConfig = this.transform(this.FlowConfig);
     },
-    transform(arr) {
-      let resArr = [];
-      arr.forEach(i => {
-        let node = new FlowNode(i);
-        node.id && resArr.push(node);
-        console.log(node, "nnnode");
-      });
-      return resArr;
+    clickNode(node) {
+      console.log("当前点击节点", node);
     }
   }
 };

src/views/getNode.js

@@ -16,11 +16,6 @@ class FlowNode {
       return null;
     }
     this.data = data;
-    if (nodeType === "3") {
-      this.data = {
-        ruleInfo: {}
-      };
-    }
     this.id = nodeId;
     this.title = nodeName;
     this.type = nodeType;