master合并 dingding分支

src/components/DrawFlow/src/DrawFlow.vue

@@ -14,9 +14,9 @@ import {
   ConditionNode,
   CopyNode
 } from "./components/NodeConfigFactory/NodeFactory";
-import { deepClone } from "@/common/utils";
+// import { deepClone } from "@/common/utils";
 import FlowFactory from "./components/factory";
-import { HashCode, transToTreeDat, getPidArr } from "./utils";
+import { HashCode, transToTreeDat } from "./utils";
 import FlowNode from "@/components/DrawFlow/src/components/DrawRow/FlowNode";
 export default {
   name: "FactoryDrawFlow",
@@ -36,6 +36,14 @@ export default {
       }
     }
   },
+  watch: {
+    FlowConfig: {
+      handler() {
+        this.init();
+      },
+      deep: true
+    }
+  },
   data() {
     return {
       rectTypeDic: {
@@ -46,16 +54,20 @@ export default {
       },
       isColList: ["3", "5"],
       selfConfig: null,
-      currentNode: null
+      currentNode: null,
+      //缓存数据
+      cacheData: null
     };
   },
   methods: {
     // 节点数据变化事件
     nodeChange(node) {
       this.currentNode.title = node.title;
+      this.currentNode.content = node.content;
       this.selfConfig.forEach(i => {
         if (i.id === this.currentNode.id) {
           i.data = node.data;
+          i.content = node.content;
           i.title = node.title;
         }
       });
@@ -76,14 +88,19 @@ export default {
      */
     getResData() {
       let list = JSON.parse(JSON.stringify(this.selfConfig));
-      getPidArr(list);
+      this.transformTree(list);
+      list.forEach(i => {
+        if (i.isRow) {
+          delete i.childNode;
+        }
+      });
       return list;
     },
     /**
      * 初始化 数据私有化
      */
     init() {
-      this.selfConfig = deepClone(this.FlowConfig);
+      this.selfConfig = JSON.parse(JSON.stringify(this.FlowConfig));
     },
     /**
      *  @param data  源数组一维数组
@@ -94,6 +111,7 @@ export default {
     },
     clickSelectBox(nextNode) {
       let { node, selfConfig } = this.getNodeFactory(nextNode);
+      console.log(node, nextNode);
       this.selfConfig = selfConfig.concat(node);
     },
     /**
@@ -114,7 +132,7 @@ export default {
     getRowNode(nextNode) {
       let node = [new RowNode(nextNode)];
       let selfConfig = this.repickArr(node[0]);
-      this.clickNode(node[0]);
+      // this.clickNode(node[0]);
       return { node, selfConfig };
     },
     /**
@@ -174,6 +192,7 @@ export default {
         repickConfig.groupId = node.groupId;
         repickConfig.id = node.id;
         let selfConfig = JSON.parse(JSON.stringify(this.selfConfig));
+        console.log("selfConfigselfConfigselfConfig", selfConfig);
         this.selfConfig = this.deleteNode(selfConfig, node);
         this.repickDeleteArr(repickConfig);
       } else {
@@ -272,8 +291,9 @@ export default {
   },
   render(h) {
     // this.init();
-    let FlowConfig = this.selfConfig;
+    let FlowConfig = JSON.parse(JSON.stringify(this.selfConfig));
     FlowConfig = this.transformTree(FlowConfig);
+    this.cacheData = FlowConfig;
     const root = JSON.parse(JSON.stringify(this.selfConfig[0]));
     return (
       <div class="design-engine">

src/components/DrawFlow/src/components/DrawAddSelectBox/DrawAddBox.vue

@@ -61,8 +61,8 @@ export default {
       if (item.value === "流转至") {
         this.nodeConfig.isFlowTo = true;
       }
-      let { id, prevId, type, isRow } = Object.assign(nodeConfig, item);
-      let nextNode = new NextNode({ id, prevId, type, isRow });
+      let { id, prevId, type, isRow, title } = Object.assign(nodeConfig, item);
+      let nextNode = new NextNode({ id, prevId, type, isRow, title });
       this.$emit("clickSelectBox", nextNode);
     },
     renderAddSBox() {

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

@@ -6,33 +6,39 @@
  */
 import { HashCode } from "../../utils";
 export class Node {
-  title = "标题";
+  nodeId;
+  type;
+  childNode;
+  title = "title";
   content = "content";
   conditionNodes;
   constructor({ id, type, isRow }) {
+    if (type === "2") {
+      this.title = "你好";
+    }
     this.groupId = id;
     this.id = HashCode();
     this.type = type;
-    this.content = "请选择";
+    this.content += this.id;
     this.isRow = isRow;
   }
 }
 export class ConditionNode {
-  title = "标题";
+  title = "title";
   data = {};
   constructor({ groupId, type, id, isRow }) {
     this.id = HashCode();
     this.groupId = groupId;
     this.type = type;
-    this.content = "请选择";
+    this.content += this.id;
     this.groupPid = id;
     this.isRow = isRow;
   }
 }
 export class RowNode extends Node {
   data = {};
-  constructor({ id, type, isRow }) {
-    super({ id, type, isRow });
+  constructor({ id, type, isRow, title }) {
+    super({ id, type, isRow, title });
   }
 }
 export class CopyNode {

src/components/DrawFlow/src/mixin/factory.vue

@@ -1,30 +0,0 @@
-<!--
-* @author 肖阳
-* @time 2020-9-10
-* @dec  预留接口 主要用在添加新功能 应用场景 多流程
--->
-<script>
-import { transToTreeDat } from "../utils";
-
-export default {
-  name: "FlowFactoryMixin",
-  props: {},
-  methods: {
-    /**
-     *  @param data  源数组一维数组
-     *  @requires  tree 二维数组
-     */
-    transformTree(data) {
-      return transToTreeDat(data);
-    }
-  },
-  watch: {}
-};
-</script>
-
-<style>
-.branch-wrap {
-  display: inline-flex;
-  width: 100%;
-}
-</style>

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

@@ -18,11 +18,13 @@ export function compose(...funcs) {
  * 转化为el-tree树形结构数据
  */
 export function transToTreeDat(arr) {
-  let list = JSON.parse(JSON.stringify(arr));
+  let list = arr;
   let colNodes = list.filter(i => !i.isRow);
   let colNodesGroup = getColNode(colNodes);
   let allNodes = list.concat(colNodesGroup);
   let tree = transTree(allNodes);
+  console.log(arr);
+  getPidArr(arr);
   return tree;
 }
 export function getColNode(colNodeArrs) {
@@ -41,12 +43,12 @@ export function getColNode(colNodeArrs) {
       groupId: map[groupId][0].groupPid,
       type: "route",
       isRow: true,
+      // TODO "流转至" 应单独写配置文件
       isFlowTo: map[groupId][0].type === "6",
       conditionNodes: map[groupId]
     };
     colNodesArr.push(obj);
   }
-
   return colNodesArr;
 }
 /**
@@ -162,6 +164,7 @@ export function transTree(arr) {
     p.childNode = lis;
     if (
       p.childNode.conditionNodes &&
+      // TODO "流转至" 应单独写配置文件
       p.childNode.conditionNodes[0].type === "6"
     ) {
       p.isFlowTo = true;

src/components/echarts/data.js

@@ -1,279 +0,0 @@
-class areaData {
-  constructor() {
-    return [
-      {
-        areaName: "东城区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "西城区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "朝阳区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "300"
-          }
-        ]
-      },
-      {
-        areaName: "丰台区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "石景山区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "海淀区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "门头沟区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "房山区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "通州区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "90"
-          },
-          {
-            title: "标题3",
-            value: "1230"
-          }
-        ]
-      },
-      {
-        areaName: "顺义区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "昌平区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "大兴区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "怀柔区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "平谷区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "密云区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "延庆区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      }
-    ];
-  }
-}
-export default areaData;

src/components/echarts/echartsSimple.vue

@@ -1,383 +0,0 @@
-<template>
-  <div class="echartDemo">
-    <div class="wrap">
-      <div id="map" style="width: 100%; height: 800px;">
-        <div :style="{ height: '400px', width: '100%' }" ref="myEchart"></div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import echarts from "echarts";
-import "echarts/map/js/province/beijing";
-import AreaData from "./data";
-import EchartsOption from "./optionConfig";
-export default {
-  name: "EchartsDemo",
-  props: {
-    areaData: {
-      type: Array,
-      default() {
-        return new AreaData();
-      }
-    },
-    option: {
-      type: Object,
-      default() {
-        return new EchartsOption();
-      }
-    },
-    colorList: {
-      type: Array,
-      default() {
-        return ["#F4E001", "#F0805A", "#26C0C0"];
-      }
-    },
-    cityConfig: {
-      type: Object,
-      default() {
-        return {
-          name: "北京市",
-          dataJson: null
-        };
-      }
-    },
-    areaItems: {
-      type: Object,
-      default() {
-        return {
-          东城区: [116.418757, 39.937544],
-          西城区: [116.366794, 39.910309],
-          朝阳区: [116.486409, 39.991489],
-          丰台区: [116.286968, 39.863642],
-          石景山区: [116.170445, 39.974601],
-          海淀区: [116.280316, 40.039074],
-          门头沟区: [115.905381, 40.009183],
-          房山区: [115.701157, 39.735535],
-          通州区: [116.758603, 39.802486],
-          顺义区: [116.753525, 40.128936],
-          昌平区: [116.235906, 40.318085],
-          大兴区: [116.338033, 39.658908],
-          怀柔区: [116.607122, 40.524272],
-          平谷区: [117.112335, 40.244783],
-          密云区: [116.943352, 40.477362],
-          延庆区: [115.985006, 40.465325]
-        };
-      }
-    }
-  },
-  beforeDestroy() {
-    this.myChart.off("click");
-  },
-  data() {
-    return {
-      wrap: null, //包裹框
-      drawBar: null, // 柱状图
-      barWrap: null,
-      shaDe: null, // 遮挡层
-      myChart: null,
-      // 地区坐标
-      selfAreaItems: {},
-      selfAreaData: new AreaData(),
-      selfOption: new EchartsOption()
-    };
-  },
-
-  mounted() {
-    this.init();
-  },
-  methods: {
-    loadMap(mapName, data) {
-      if (data) {
-        console.log(mapName, data, "mapName, datamapName, data");
-        echarts.registerMap(mapName, data);
-      }
-    },
-    init() {
-      // console.log(mapJson, "mapJsonmapJson");
-
-      this.selfAreaData = JSON.parse(JSON.stringify(this.areaData));
-      this.selfOption = JSON.parse(JSON.stringify(this.option));
-      this.selfColor = JSON.parse(JSON.stringify(this.colorList));
-      this.selfOption = JSON.parse(JSON.stringify(this.option));
-      this.myChart = echarts.init(this.$refs.myEchart);
-      if (this.cityConfig.dataJson) {
-        console.log(this.cityConfig);
-        this.loadMap(this.cityConfig.name, this.cityConfig.dataJson);
-      }
-      this.selfAreaItems = JSON.parse(JSON.stringify(this.areaItems));
-      window.onresize = this.myChart.resize;
-
-      this.myChart.setOption(this.selfOption);
-      // 拖拽跟缩放重置
-      let throttledRenderEachCity = this.throttle(this.renderItems, 0);
-      this.myChart.on("geoRoam", throttledRenderEachCity);
-      this.renderItems();
-      this.itemonClick();
-    },
-    // 缩放和拖拽
-    throttle(fn, delay, debounce) {
-      let currCall;
-      let lastCall = 0;
-      let lastExec = 0;
-      let timer = null;
-      let diff;
-      let scope;
-      let args;
-      delay = delay || 0;
-      function exec() {
-        lastExec = new Date().getTime();
-        timer = null;
-        fn.apply(scope, args || []);
-      }
-
-      let cb = function() {
-        currCall = new Date().getTime();
-        scope = this;
-        args = arguments;
-        diff = currCall - (debounce ? lastCall : lastExec) - delay;
-
-        clearTimeout(timer);
-
-        if (debounce) {
-          timer = setTimeout(exec, delay);
-        } else {
-          if (diff >= 0) {
-            exec();
-          } else {
-            timer = setTimeout(exec, -diff);
-          }
-        }
-
-        lastCall = currCall;
-      };
-
-      return cb;
-    },
-    // 填充 地图点位
-    renderItems() {
-      let option = Object.assign(this.selfOption, {
-        xAxis: [],
-        yAxis: [],
-        grid: [],
-        series: [],
-        tooltip: {
-          trigger: "item",
-          axisPointer: {
-            type: "none"
-          }
-        }
-      });
-      this.selfAreaData.forEach((item, idx) => {
-        let nodeCoord = this.selfAreaItems[item.areaName];
-        let coord = this.myChart.convertToPixel("geo", nodeCoord);
-        let titleItems = item.DateItems.map(i => i.title);
-        let itemData = item.DateItems.map(i => Number(i.value));
-        console.log(item, this.selfAreaItems, coord);
-        if (coord) {
-          option.xAxis.push({
-            id: idx + item.areaName,
-            gridId: idx + item.areaName,
-            type: "category",
-            name: item.areaName,
-            nameLocation: "middle",
-            nameGap: 3,
-            splitLine: {
-              show: false
-            },
-            axisTick: {
-              show: false
-            },
-            axisLabel: {
-              show: false
-            },
-            axisLine: {
-              onZero: false,
-              lineStyle: {
-                color: "#666"
-              }
-            },
-            data: titleItems,
-            z: 100
-          });
-          option.yAxis.push({
-            id: idx + item.areaName,
-            gridId: idx + item.areaName,
-            type: "value",
-            splitLine: {
-              show: false
-            },
-            axisTick: {
-              show: false
-            },
-            axisLabel: {
-              show: false
-            },
-            axisLine: {
-              show: false,
-              lineStyle: {
-                color: "red"
-              }
-            },
-            min: 0,
-            max: "dataMax"
-          });
-          option.grid.push({
-            id: idx + item.areaName,
-            width: 30,
-            height: 40,
-            left: coord[0] - 15,
-            top: coord[1] - 15,
-            z: 100
-          });
-          option.series.push({
-            id: idx + item.areaName,
-            type: "bar",
-            xAxisId: idx + item.areaName,
-            yAxisId: idx + item.areaName,
-            barGap: 0,
-            barCategoryGap: 0,
-            data: itemData,
-            z: 100,
-            itemStyle: {
-              normal: {
-                color: params => {
-                  // build a color map as your need.
-                  let color = this.selfColor[params.dataIndex];
-                  return color;
-                }
-              },
-              opacity: 0,
-              emphasis: {
-                label: {
-                  show: false
-                }
-              }
-            }
-          });
-        }
-      });
-      this.myChart.setOption(option);
-    },
-    // 点击显示柱状图
-    itemonClick() {
-      this.myChart.on("click", e => {
-        if (e.componentSubType == "bar") {
-          this.barWrap = document.createElement("div");
-          this.drawBar = document.createElement("div");
-          this.wrap = document.getElementsByClassName("wrap")[0];
-          // 先清除所有柱状图
-          // $(".tongJiTu").remove();
-          // 创建遮挡层
-          this.creatWrap();
-          // 创建柱状图容器
-          this.barWrap.id = "bar-wrap";
-          this.barWrap.className = "bar-wrap";
-          this.drawBar.className = "zhuzhuang";
-          let divX = this.getMousePos()["x"];
-          let divY = this.getMousePos()["y"];
-          this.barWrap.setAttribute(
-            "style",
-            `width: 350px; height: 180px;border: 1px solid #ccc;position:absolute;top: ${divY}px;left:${divX}px`
-          );
-          this.drawBar.setAttribute("style", `width: 100%; height: 100%`);
-          // 创建柱状图
-          this.wrap.appendChild(this.barWrap);
-          this.barWrap.appendChild(this.drawBar);
-          this.zhuZhuangTu(e);
-          // // 点击遮挡层消失
-          this.clearWrap();
-        }
-        return;
-      });
-    },
-    // 获取横纵坐标
-    getMousePos(e) {
-      e = event || window.event;
-      let x = e.clientX;
-      let y = e.clientY;
-      return { x, y };
-    },
-    // 生成柱状图
-    zhuZhuangTu(e) {
-      let index = e.seriesIndex;
-      let bar = echarts.init(this.drawBar);
-      let xTitle = this.selfAreaData[index].DateItems.map(i => i.title);
-      let yValue = this.selfAreaData[index].DateItems.map(i => i.value);
-      let option = {
-        backgroundColor: "rgba(255,255,255,.3)",
-        legend: {
-          data: xTitle
-        },
-        xAxis: [
-          {
-            type: "category",
-            data: xTitle
-          }
-        ],
-        yAxis: [
-          {
-            splitLine: {
-              show: false
-            },
-            type: "value"
-          }
-        ],
-        series: [
-          {
-            type: "bar",
-            itemStyle: {
-              normal: {
-                color: function(params) {
-                  let colorList = ["#F75D5D", "#59ED4F", "#4C91E7"];
-                  return colorList[params.dataIndex];
-                },
-                label: {
-                  show: true,
-                  position: "top",
-                  textStyle: {
-                    color: "#000"
-                  }
-                }
-              }
-            },
-            data: yValue
-          }
-        ]
-      };
-      bar.setOption(option);
-    },
-    // 生成遮挡层
-    creatWrap() {
-      this.shaDe = document.createElement("div");
-      this.shaDe.className = "shaDe";
-      this.wrap.appendChild(this.shaDe);
-    },
-    // 去掉遮挡层
-    clearWrap() {
-      this.shaDe.addEventListener(
-        "click",
-        () => {
-          this.shaDe.remove();
-          this.barWrap.remove();
-          this.drawBar.remove();
-          return false;
-        },
-        false
-      );
-    }
-  }
-};
-</script>
-
-<style lang="less">
-.shaDe {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  top: 0;
-  left: 0;
-  background-color: rgba(0, 0, 0, 0.2);
-}
-</style>

src/components/echarts/index.js

@@ -1,6 +0,0 @@
-import EchartsDemo from "./echartsSimple";
-/* istanbul ignore next */
-EchartsDemo.install = function(Vue) {
-  Vue.component(EchartsDemo.name, EchartsDemo);
-};
-export default EchartsDemo;

src/components/echarts/optionConfig.js

@@ -1,33 +0,0 @@
-export default class EchartsOptions {
-  constructor() {
-    return {
-      backgroundColor: "#02AFDB",
-      tooltip: {},
-      geo: {
-        map: "北京",
-        roam: true,
-        label: {
-          normal: {
-            show: true,
-            textStyle: {
-              color: "rgba(0,0,0,0.4)"
-            }
-          }
-        },
-        itemStyle: {
-          normal: {
-            borderColor: "rgba(0, 0, 0, 0.2)"
-          },
-          emphasis: {
-            areaColor: null,
-            shadowOffsetX: 0,
-            shadowOffsetY: 0,
-            shadowBlur: 20,
-            borderWidth: 0,
-            shadowColor: "rgba(0, 0, 0, 0.5)"
-          }
-        }
-      }
-    };
-  }
-}

src/main.js

@@ -2,16 +2,11 @@ import Vue from "vue";
 import App from "./App.vue";
 import router from "./router";
 import store from "./store";
-import elementUI from "element-ui";
-import "element-ui/lib/theme-chalk/index.css";
 import ant from "ant-design-vue";
 import DrawFlow from "./components/DrawFlow";
-import EchartsDemo from "./components/echarts";
 import "ant-design-vue/dist/antd.less";
 Vue.config.productionTip = false;
 Vue.use(ant);
-Vue.use(elementUI);
-Vue.use(EchartsDemo);
 Vue.use(DrawFlow);
 new Vue({
   router,

src/router/index.js

@@ -1,6 +1,6 @@
 import Vue from "vue";
 import VueRouter from "vue-router";
-import Home from "../views/dingdingFlow/Home.vue";
+import Home from "../views/Home.vue";
 
 Vue.use(VueRouter);
 
@@ -9,18 +9,16 @@ const routes = [
     path: "/",
     name: "Home",
     component: Home
-  },
-  {
-    path: "/echartDemo",
-    name: "echartDemo",
-    // route level code-splitting
-    // this generates a separate chunk (echartDemo.[hash].js) for this route
-    // which is lazy-loaded when the route is visited.
-    component: () =>
-      import(
-        /* webpackChunkName: "echartDemo" */ "../views/echarts/echartDemo.vue"
-      )
   }
+  // {
+  //   path: "/echartDemo",
+  //   name: "echartDemo",
+  //   // route level code-splitting
+  //   // this generates a separate chunk (echartDemo.[hash].js) for this route
+  //   // which is lazy-loaded when the route is visited.
+  //   component: () =>
+  //     import(/* webpackChunkName: "echartDemo" */ "../views/echartDemo.vue")
+  // }
 ];
 
 const router = new VueRouter({

src/views/data.js

@@ -1,279 +0,0 @@
-class areaData {
-  constructor() {
-    return [
-      {
-        areaName: "东城区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "西城区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "朝阳区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "300"
-          }
-        ]
-      },
-      {
-        areaName: "丰台区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "石景山区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "海淀区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "门头沟区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "房山区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "通州区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "90"
-          },
-          {
-            title: "标题3",
-            value: "1230"
-          }
-        ]
-      },
-      {
-        areaName: "顺义区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "昌平区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "大兴区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "怀柔区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "平谷区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "密云区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "延庆区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      }
-    ];
-  }
-}
-export default areaData;

src/views/dingdingFlow/Home.vue

@@ -1,86 +0,0 @@
-<template>
-  <div id="drawProcessDesign">
-    <a-button @click="getData">提交</a-button>
-    <el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
-      <div>这是一维数组{{ list }}</div>
-      <div class="treeData" style="color:bule">这是树形结构{{ treeData }}</div>
-
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="dialogVisible = false">取 消</el-button>
-        <el-button type="primary" @click="dialogVisible = false"
-          >确 定</el-button
-        >
-      </span>
-    </el-dialog>
-    <FactoryDrawFlow
-      @clickNode="clickNode"
-      ref="flow"
-      :FlowConfig="FlowConfig"
-    ></FactoryDrawFlow>
-  </div>
-</template>
-<style lang="less" scoped>
-#drawProcessDesign {
-  background: #f0f2f5;
-}
-.treeData {
-  color: blue;
-}
-</style>
-
-<script>
-// @ is an alias to /src
-export default {
-  name: "Home",
-  components: {},
-  data() {
-    return {
-      dialogVisible: false,
-      list: "",
-      treeData: "",
-      FlowConfig: [
-        {
-          id: "root",
-          groupId: null,
-          type: "1",
-          title: "所有人",
-          content: "请选择",
-          isRow: true,
-          isRoot: true,
-          data: {}
-        }
-      ]
-    };
-  },
-  created() {
-    this.init();
-  },
-  methods: {
-    getData() {
-      let { list: res, treeData } = this.$refs.flow.getResData();
-      this.list = JSON.stringify(res);
-      this.treeData = JSON.stringify(treeData);
-      console.log("这是返回的一维数组", treeData);
-      this.dialogVisible = true;
-    },
-    /**
-     * 1、创建一个row length 1
-     * 2、创建一个col节点
-     * 3、创建一组col length 1
-     * return [{pid id type}]
-     */
-    getNodeArr() {
-      this.FlowConfig = this.$refs.flow.getNodeArr();
-      return this.FlowConfig;
-    },
-    init() {
-      // this.FlowConfig = this.transform(this.FlowConfig);
-    },
-    clickNode(node) {
-      node.title = "123123";
-      this.$refs.flow.nodeChange(node);
-      this.$forceUpdate();
-    }
-  }
-};
-</script>

src/views/dingdingFlow/getNode.js

@@ -1,26 +0,0 @@
-class FlowNode {
-  constructor({ nodeType, nodeId, nodeName, groupId, parentGroupId, ...data }) {
-    if (nodeType === "1") {
-      return {
-        id: "root",
-        groupId: "root",
-        type: "root",
-        title: "所有人",
-        content: "请选择",
-        isRow: true,
-        isRoot: true,
-        data: {}
-      };
-    }
-    if (nodeType === "5") {
-      return null;
-    }
-    this.data = data;
-    this.id = nodeId;
-    this.title = nodeName;
-    this.type = nodeType;
-    this.groupId = groupId;
-    this.groupPid = parentGroupId;
-  }
-}
-export { FlowNode };

src/views/echartDemo.vue

@@ -1,21 +0,0 @@
-<template>
-  <div class="echartDemo">
-    <echarts-demo></echarts-demo>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "EachartsDom",
-  data() {
-    return {
-      // areaData
-      // option
-      // colorList
-    };
-  },
-  mounted() {}
-};
-</script>
-
-<style></style>

src/views/echarts/data.js

@@ -1,279 +0,0 @@
-class areaData {
-  constructor() {
-    return [
-      {
-        areaName: "东城区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "西城区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "朝阳区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "300"
-          }
-        ]
-      },
-      {
-        areaName: "丰台区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "石景山区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "海淀区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "门头沟区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "房山区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "通州区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "90"
-          },
-          {
-            title: "标题3",
-            value: "1230"
-          }
-        ]
-      },
-      {
-        areaName: "顺义区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "昌平区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "大兴区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "怀柔区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "平谷区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "密云区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      },
-      {
-        areaName: "延庆区",
-        DateItems: [
-          {
-            title: "标题1",
-            value: "10"
-          },
-          {
-            title: "标题2",
-            value: "20"
-          },
-          {
-            title: "标题3",
-            value: "30"
-          }
-        ]
-      }
-    ];
-  }
-}
-export default areaData;

src/views/echarts/echartDemo.vue

@@ -1,21 +0,0 @@
-<template>
-  <div class="echartDemo">
-    <echarts-demo></echarts-demo>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "EachartsDom",
-  data() {
-    return {
-      // areaData
-      // option
-      // colorList
-    };
-  },
-  mounted() {}
-};
-</script>
-
-<style></style>

src/views/echarts/optionConfig.js

@@ -1,72 +0,0 @@
-export default class EchartsOptions {
-  constructor() {
-    return {
-      // 进行相关配置
-      backgroundColor: "#02AFDB",
-      tooltip: {}, // 鼠标移到图里面的浮动提示框
-      geo: {
-        // 这个是重点配置区
-        map: "北京", // 表示中国地图
-        roam: true,
-        label: {
-          normal: {
-            show: true, // 是否显示对应地名
-            textStyle: {
-              color: "rgba(0,0,0,0.4)"
-            }
-          }
-        },
-        itemStyle: {
-          normal: {
-            borderColor: "rgba(0, 0, 0, 0.2)"
-          },
-          emphasis: {
-            areaColor: null,
-            shadowOffsetX: 0,
-            shadowOffsetY: 0,
-            shadowBlur: 20,
-            borderWidth: 0,
-            shadowColor: "rgba(0, 0, 0, 0.5)"
-          }
-        }
-      },
-      series: [
-        {
-          type: "scatter",
-          coordinateSystem: "geo" // 对应上方配置
-        },
-        {
-          name: "启动次数", // 浮动框的标题
-          type: "map",
-          geoIndex: 0,
-          data: [
-            {
-              name: "北京",
-              value: 599
-            },
-            {
-              name: "上海",
-              value: 142
-            },
-            {
-              name: "黑龙江",
-              value: 1144
-            },
-            {
-              name: "深圳",
-              value: 92
-            },
-            {
-              name: "湖北",
-              value: 810
-            },
-            {
-              name: "四川",
-              value: 453
-            }
-          ]
-        }
-      ]
-    };
-  }
-}