Merge branch 'dev' of http://highdatas.com:9000/r/foundation/designer.appro...

zhangyanpeng

2024-03-04 6a72e9e44dc7278e18d55ccd5637b81a1cb2f047

 src/views/admin/layout/process/ProcessTreeViewer.vue

@@ -1,16 +1,16 @@
<script>
//导入所有节点组件
import Approval from '@/views/common/process/nodes/ApprovalNode.vue'
import Task from '@/views/common/process/nodes/TaskNode.vue'
import Cc from '@/views/common/process/nodes/CcNode.vue'
import Concurrent from '@/views/common/process/nodes/ConcurrentNode.vue'
import Condition from '@/views/common/process/nodes/ConditionNode.vue'
import Inclusive from '@/views/common/process/nodes/InclusiveNode.vue'
import Trigger from '@/views/common/process/nodes/TriggerNode.vue'
import Delay from '@/views/common/process/nodes/DelayNode.vue'
import Empty from '@/views/common/process/nodes/EmptyNode.vue'
import Root from '@/views/common/process/nodes/RootNode.vue'
import Node from '@/views/common/process/nodes/Node.vue'
import Approval from '@/views/common/process/viewNodes/ApprovalNode.vue'
import Task from '@/views/common/process/viewNodes/TaskNode.vue'
import Cc from '@/views/common/process/viewNodes/CcNode.vue'
import Concurrent from '@/views/common/process/viewNodes/ConcurrentNode.vue'
import Condition from '@/views/common/process/viewNodes/ConditionNode.vue'
import Inclusive from '@/views/common/process/viewNodes/InclusiveNode.vue'
import Trigger from '@/views/common/process/viewNodes/TriggerNode.vue'
import Delay from '@/views/common/process/viewNodes/DelayNode.vue'
import Empty from '@/views/common/process/viewNodes/EmptyNode.vue'
import Root from '@/views/common/process/viewNodes/RootNode.vue'
import Node from '@/views/common/process/viewNodes/Node.vue'

import DefaultProps from "./DefaultNodeProps"

@@ -34,7 +34,7 @@
    this.nodeMap.clear()
    let processTrees = this.getDomTree(h, this.dom)
    //插入末端节点
    processTrees.push(h('div', {style:{'text-align': 'center'}}, [
    processTrees.push(h('div', {class:{'end-class': true}}, [
      h('div', {class:{'process-end': true}, domProps: {innerHTML:'流程结束'}})
    ]))
    return h('div', {class:{'_root': true}, ref:'_root'}, processTrees)
@@ -46,8 +46,7 @@

        //普通业务节点
        let childDoms = this.getDomTree(h, node.children)

        let headerBgc = '#ff943e'
        let headerBgc = '#909399'
        if (this.$store.state.runningList.includes(node.id)) {
          headerBgc = '#1e90ff'
        }
@@ -189,7 +188,6 @@
    },
    //选中一个节点
    selectNode(node){
      console.log("ProcessTreeViewer-emit-selectNode")
      this.$store.commit('selectedNode', node)
      this.$emit('selectedNode', node)
    },
@@ -349,7 +347,6 @@
    },
    //删除当前节点
    delNode(node){
      console.log("删除节点", node)
      //获取该节点的父节点
      let parentNode = this.nodeMap.get(node.parentId)
      if (parentNode){
@@ -450,29 +447,58 @@

<style lang="less" scoped>
._root{
 margin: 0 auto;
  display: flex;
  align-items:center;
  margin: 0 auto;

}
.end-class {
  display: flex;
  align-items: center;

  &:before {
    content: '';
    top: 50%;
    left: 100%;
    display: block;
    width: 0;
    height: 0;

    border-style: solid;
    border-color: #CACACA transparent transparent;
    background: #F5F5F7;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 10px solid #CACACA; /* 左边界 */
  }
}
.process-end{
  width: 60px;
  width: 100px;
  height: 40px;
  margin: 0 auto;
  margin-bottom: 20px;
  // margin-bottom: 20px;
  border-radius: 15px;
  padding: 5px 10px;
  font-size: small;
  //font-size: small;
  color: #747474;
  background-color: #f2f2f2;
  box-shadow: 0 0 10px 0 #bcbcbc;
}
  display: flex;
  justify-content:center;
  align-items: center;


  }


.primary-node{
  display: flex;
  align-items: center;
  flex-direction: column;
  flex-direction: row
}
.branch-node{
  display: flex;
  justify-content: center;
  /*border-top: 2px solid #cccccc;
  border-bottom: 2px solid #cccccc;*/
}
.branch-node-item{
  position: relative;
@@ -531,4 +557,5 @@
  flex-direction: column;
  align-items: center;
}

</style>