chris 3 лет назад
Родитель
Сommit
10b8d97544

+ 49 - 51
src/views/modules/common/vue-super-flow/Graph.js

@@ -13,49 +13,47 @@ import {
 } from './utils'
 
 class Graph extends GraphEvent {
-  constructor(options) {
+  constructor (options) {
     const {
       nodeList = [],
       linkList = [],
       origin
     } = options
-    
+
     super()
-    
+
     this.nodeList = []
     this.linkList = []
-    
+
     this.origin = origin
-    
+
     this.mouseonLink = null
     this.mouseonNode = null
-    
+
     this.graphSelected = false
     this.maskBoundingClientRect = {}
-    
+
     this.initNode(nodeList)
     this.initLink(linkList)
   }
-  
-  pointMap() {
+
+  pointMap () {
     const map = {}
     this.nodeList.forEach(point => {
       map[point.id] = point
     })
     return map
   }
-  
-  initNode(nodeList) {
+
+  initNode (nodeList) {
     arrayReplace(this.nodeList, nodeList.map(node => this.createNode(node)))
     return this.nodeList
   }
-  
-  initLink(linkList) {
-    
+
+  initLink (linkList) {
     const list = []
-    
+
     linkList.forEach(link => {
-      
       const {
         startId = '',
         endId = '',
@@ -63,12 +61,12 @@ class Graph extends GraphEvent {
         endAt = [0, 0],
         meta = null
       } = link
-      
+
       const pointMap = this.pointMap()
-      
+
       const start = pointMap[startId]
       const end = pointMap[endId]
-      
+
       if (start && end) {
         list.push(
           this.createLink({
@@ -81,62 +79,62 @@ class Graph extends GraphEvent {
         )
       }
     })
-    
+
     arrayReplace(this.linkList, list)
-    
+
     return this.linkList
   }
-  
-  createNode(options) {
+
+  createNode (options) {
     return new GraphNode(options, this)
   }
-  
-  createLink(options) {
+
+  createLink (options) {
     return new GraphLink(options, this)
   }
-  
-  addNode(options) {
+
+  addNode (options) {
     const node = options.constructor === GraphNode
       ? options
       : this.createNode(options)
-    
+
     this.nodeList.push(node)
     return node
   }
-  
-  addLink(options) {
+
+  addLink (options) {
     const newLink = options.constructor === GraphLink
       ? options
       : this.createLink(options)
-    
+
     const currentLink = this.linkList.find(item => {
       return item.start === newLink.start && item.end === newLink.end
     })
-    
+
     if (currentLink) {
       currentLink.startAt = newLink.startAt
       currentLink.endAt = newLink.endAt
     } else if (newLink.start && newLink.end) {
       this.linkList.push(newLink)
     }
-    
+
     return newLink
   }
-  
-  removeNode(node) {
+
+  removeNode (node) {
     const idx = this.nodeList.indexOf(node)
     this.linkList.filter(link => {
       return link.start === node || link.end === node
     }).forEach(link => {
       this.removeLink(link)
     })
-    
+
     this.nodeList.splice(idx, 1)
-    
+
     return node
   }
-  
-  removeLink(link) {
+
+  removeLink (link) {
     const idx = this.linkList.indexOf(link)
     this.linkList.splice(idx, 1)
     if (this.mouseonLink === link) {
@@ -144,8 +142,8 @@ class Graph extends GraphEvent {
     }
     return link
   }
-  
-  toLastNode(idx) {
+
+  toLastNode (idx) {
     const nodeList = this.nodeList
     nodeList.splice(
       nodeList.length - 1, 0,
@@ -153,48 +151,48 @@ class Graph extends GraphEvent {
     )
   }
 
-  toLastLink(idx) {
+  toLastLink (idx) {
     const linkList = this.linkList
     linkList.splice(
       linkList.length - 1, 0,
       ...linkList.splice(idx, 1)
     )
   }
-  
-  toJSON() {
+
+  toJSON () {
     return {
       origin: this.origin,
       nodeList: this.nodeList.map(node => node.toJSON()),
       linkList: this.linkList.map(link => link.toJSON())
     }
   }
-  
-  selectAll() {
+
+  selectAll () {
     const nodeList = this.nodeList
     const margin = 20
-    
+
     this.maskBoundingClientRect = {
       top: Math.min(
         ...nodeList.map(
           node => node.center[1] - node.height / 2)
       ) - margin,
-      
+
       right: Math.max(
         ...nodeList.map(
           node => node.center[0] + node.width / 2)
       ) + margin,
-      
+
       bottom: Math.max(
         ...nodeList.map(
           node => node.center[1] + node.height / 2)
       ) + margin,
-      
+
       left: Math.min(
         ...nodeList.map(
           node => node.center[0] - node.width / 2)
       ) - margin
     }
-    
+
     this.graphSelected = true
   }
 }

+ 9 - 9
src/views/modules/common/vue-super-flow/GraphEvent.js

@@ -4,18 +4,18 @@
  * Time: 14:53
  */
 export default class GraphEvent {
-  constructor() {
+  constructor () {
     this.listeners = {}
   }
-  
-  add(type, callback) {
+
+  add (type, callback) {
     if (!(type in this.listeners)) {
       this.listeners[type] = []
     }
     this.listeners[type].push(callback)
   }
-  
-  remove(type, callback) {
+
+  remove (type, callback) {
     if (!(type in this.listeners)) {
       return
     }
@@ -27,18 +27,18 @@ export default class GraphEvent {
       }
     }
   }
-  
-  dispatch(event, breakOff = false) {
+
+  dispatch (event, breakOff = false) {
     if (!(event.type in this.listeners)) {
       return
     }
     const stack = this.listeners[event.type]
     event.target = this
-    
+
     if (breakOff) {
       stack.some((fun, idx) => {
         const result = fun.call(this, event)
-        if(result) stack.unshift(...stack.splice(idx, 1))
+        if (result) stack.unshift(...stack.splice(idx, 1))
         return result
       })
     } else {

+ 1 - 0
src/views/modules/common/vue-super-flow/GraphLink.js

@@ -99,6 +99,7 @@ export default class GraphLink {
   }
 
   get pathPointList () {
+    // eslint-disable-next-line one-var
     const pointList = this.coordinateList(),
       xList = [],
       yList = []

+ 2 - 0
src/views/modules/common/vue-super-flow/GraphNode.js

@@ -5,6 +5,7 @@
  */
 
 import {
+  // eslint-disable-next-line no-unused-vars
   minus,
   uuid,
   vector
@@ -81,6 +82,7 @@ export default class GraphNode {
   }
 
   angle () {
+    // eslint-disable-next-line one-var
     const
       w = this.width / 2,
       h = this.height / 2,

+ 34 - 33
src/views/modules/common/vue-super-flow/index.vue

@@ -108,10 +108,12 @@
 
   import {
     getOffset,
+    // eslint-disable-next-line no-unused-vars
     isIntersect,
     isBool,
     isFun,
     vector,
+    // eslint-disable-next-line no-unused-vars
     debounce,
     arrayReplace
   } from './utils'
@@ -188,7 +190,7 @@
         default: () => true
       }
     },
-    data() {
+    data () {
       return {
         graph: new Graph({
           width: this.width,
@@ -229,7 +231,7 @@
       MarkLine
     },
     computed: {
-      maskStyle() {
+      maskStyle () {
         const {
           top,
           right,
@@ -244,7 +246,7 @@
         }
       }
     },
-    mounted() {
+    mounted () {
       document.addEventListener('mouseup', this.docMouseup)
       document.addEventListener('mousemove', this.docMousemove)
       this.$once('hook:beforeDestroy', () => {
@@ -257,7 +259,7 @@
       })
     },
     methods: {
-      initMenu(menu, source) {
+      initMenu (menu, source) {
         return menu.map(subList => subList
           .map(item => {
             let disable
@@ -289,7 +291,7 @@
         ).filter(sublist => sublist.length)
       },
 
-      showContextMenu(position, list, source) {
+      showContextMenu (position, list, source) {
         if (!list.length) return
         this.$set(this.menuConf, 'position', position)
         this.$set(this.menuConf, 'list', list)
@@ -297,7 +299,7 @@
         this.menuConf.visible = true
       },
 
-      docMouseup(evt) {
+      docMouseup (evt) {
         if (this.moveNodeConf.isMove) {
           evt.stopPropagation()
           evt.preventDefault()
@@ -314,7 +316,7 @@
         this.moveAllConf.isMove = false
       },
 
-      docMousemove(evt) {
+      docMousemove (evt) {
         if (this.moveNodeConf.isMove) {
           this.moveNode(evt)
         } else if (this.temEdgeConf.visible) {
@@ -329,7 +331,7 @@
         }
       },
 
-      moveNode(evt) {
+      moveNode (evt) {
         const distance = 10
         const conf = this.moveNodeConf
         const origin = this.graph.origin
@@ -379,12 +381,12 @@
         conf.node.center = position
       },
 
-      moveTemEdge(evt) {
-        this.temEdgeConf.link.movePosition
-          = getOffset(evt, this.$el)
+      moveTemEdge (evt) {
+        this.temEdgeConf.link.movePosition =
+        getOffset(evt, this.$el)
       },
 
-      moveWhole(evt) {
+      moveWhole (evt) {
         if (this.moveAllConf.isMove) {
           const offset = vector(this.moveAllConf.downPosition)
             .differ([evt.clientX, evt.clientY])
@@ -398,7 +400,7 @@
         }
       },
 
-      contextmenu(evt) {
+      contextmenu (evt) {
         const mouseonLink = this.graph.mouseonLink
         const position = getOffset(evt)
         let list, source
@@ -419,7 +421,7 @@
         )
       },
 
-      nodeMousedown(node, offset) {
+      nodeMousedown (node, offset) {
         if (this.draggable) {
           this.clientWidth = this.$el.clientWidth
           this.clientHeight = this.$el.clientHeight
@@ -439,14 +441,13 @@
             ...new Set(centerList.map(center => center[1]))
           ].sort((prev, next) => prev - next))
 
-
           this.moveNodeConf.isMove = true
           this.moveNodeConf.node = node
           this.moveNodeConf.offset = offset
         }
       },
 
-      nodeMouseenter(evt, node, offset) {
+      nodeMouseenter (evt, node, offset) {
         const link = this.temEdgeConf.link
         if (this.enterIntercept(link.start, node, this.graph)) {
           link.end = node
@@ -454,15 +455,15 @@
         }
       },
 
-      nodeMouseleave() {
+      nodeMouseleave () {
         this.temEdgeConf.link.end = null
       },
 
-      nodeMouseup() {
+      nodeMouseup () {
         this.graph.addLink(this.temEdgeConf.link)
       },
 
-      nodeContextmenu(evt, node) {
+      nodeContextmenu (evt, node) {
         const list = this.initMenu(this.nodeMenu, node)
         if (!list.length) return
         this.$set(this.menuConf, 'position', getOffset(evt, this.$el))
@@ -471,7 +472,7 @@
         this.menuConf.visible = true
       },
 
-      sideMousedown(evt, node, startAt) {
+      sideMousedown (evt, node, startAt) {
         if (this.linkAddable) {
           const link = this.graph.createLink({
             start: node,
@@ -483,15 +484,15 @@
         }
       },
 
-      nodeIntercept(node) {
+      nodeIntercept (node) {
         return () => this.outputIntercept(node, this.graph)
       },
 
-      menuItemSelect() {
+      menuItemSelect () {
         this.menuConf.visible = false
       },
 
-      selectAllMaskMouseDown(evt) {
+      selectAllMaskMouseDown (evt) {
         this.moveAllConf.isMove = true
         this.moveAllConf.origin = [...this.graph.origin]
         this.moveAllConf.downPosition = [
@@ -500,51 +501,51 @@
         ]
       },
 
-      selectedAll() {
+      selectedAll () {
         this.graph.selectAll()
       },
 
-      toJSON() {
+      toJSON () {
         return this.graph.toJSON()
       },
 
-      getMouseCoordinate(clientX, clientY) {
+      getMouseCoordinate (clientX, clientY) {
         const offset = getOffset({clientX, clientY}, this.$el)
         return vector(offset)
           .minus(this.graph.origin)
           .end
       },
 
-      addNode(options) {
+      addNode (options) {
         return this.graph.addNode(options)
       }
     },
     watch: {
-      'graph.graphSelected'() {
+      'graph.graphSelected' () {
         if (this.graph.graphSelected) {
           this.$nextTick(() => {
             this.$refs.selectAllMask.focus()
           })
         }
       },
-      'graph.mouseonLink'() {
+      'graph.mouseonLink' () {
         if (this.graph.mouseonLink) {
           document.body.style.cursor = 'pointer'
         } else {
           document.body.style.cursor = ''
         }
       },
-      origin() {
+      origin () {
         this.graph.origin = this.origin || []
       },
-      nodeList() {
+      nodeList () {
         this.graph.initNode(this.nodeList)
       },
-      linkList() {
+      linkList () {
         this.graph.initLink(this.linkList)
       }
     },
-    install(Vue) {
+    install (Vue) {
       Vue.component(this.name, this)
     }
   }

+ 0 - 1
src/views/modules/common/vue-super-flow/node.vue

@@ -26,7 +26,6 @@
 </template>
 
 <script>
-
 import {
   direction
 } from './types'

+ 38 - 44
src/views/modules/common/vue-super-flow/utils.js

@@ -4,8 +4,7 @@
  * Time: 14:03
  */
 
-
-export function uuid(before = '', after = '') {
+export function uuid (before = '', after = '') {
   const chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('')
   const charsLen = chars.length
   let uuid = []
@@ -16,101 +15,98 @@ export function uuid(before = '', after = '') {
   return before + uuid.join('') + after
 }
 
-
-export function getOffset(evt, target = null) {
+export function getOffset (evt, target = null) {
   const {
     clientX,
     clientY,
     currentTarget
   } = evt
-  
+
   const current = target || currentTarget
-  
+
   const {
     left,
     top
   } = current.getBoundingClientRect()
-  
+
   return [clientX - left, clientY - top]
 }
 
-
-export function isIntersect({clientX, clientY}, target) {
+export function isIntersect ({clientX, clientY}, target) {
   const {
     top,
     right,
     bottom,
     left
   } = target.getBoundingClientRect()
-  
-  return top < clientY
-    && right > clientX
-    && bottom > clientY
-    && left < clientX
-}
 
+  return top < clientY &&
+    right > clientX &&
+    bottom > clientY &&
+    left < clientX
+}
 
 // 向量相加
-export function addVector(vectorA, vectorB) {
+export function addVector (vectorA, vectorB) {
   return [vectorA[0] + vectorB[0], vectorA[1] + vectorB[1]]
 }
 
 //  向量乘以常量系数
-export function multiply(vector, k) {
+export function multiply (vector, k) {
   return [vector[0] * k, vector[1] * k]
 }
 
-export function differ(pointA, pointB) {
+export function differ (pointA, pointB) {
   return [pointB[0] - pointA[0], pointB[1] - pointA[1]]
 }
 
-export function minus(pointA, pointB) {
+export function minus (pointA, pointB) {
   return [(pointA[0] || 0) - (pointB[0] || 0), (pointA[1] || 0) - (pointB[1] || 0)]
 }
 
 // 向量点积
-export function dotProduct(vectorA, vectorB) {
+export function dotProduct (vectorA, vectorB) {
   return vectorA[0] * vectorB[0] + vectorA[1] * vectorB[1]
 }
 
 // 向量叉乘
-export function cross(vectorA, vectorB) {
+export function cross (vectorA, vectorB) {
   return vectorA[0] * vectorB[1] - vectorA[1] * vectorB[0]
 }
 
 // 向量的单位向量
-export function unitVector(vector) {
+export function unitVector (vector) {
   const m = Math.sqrt(vector[0] * vector[0] + vector[1] * vector[1])
   return [vector[0] / m, vector[1] / m]
 }
 
 // 判断向量 x,y 坐标相等
-export function equals(vector, target) {
+export function equals (vector, target) {
   return vector[0] === target[0] && vector[1] === target[1]
 }
 
 // 向量夹角
-export function angle(vector) {
+export function angle (vector) {
   return Math.round(180 / Math.PI * Math.atan2(vector[1], vector[0])) + 180
 }
 
 // 判断向量是否平行
-export function parallel(vectorA, vectorB) {
+export function parallel (vectorA, vectorB) {
   return vectorA[0] * vectorB[1] - vectorA[1] * vectorB[0] === 0
 }
 
 // 判断 y 轴相等
-export function yAxisEqual(vectorA, vectorB) {
+export function yAxisEqual (vectorA, vectorB) {
   return vectorA[1] === vectorB[1]
 }
 
 // 判断 x 轴相等
-export function xAxisEqual(vectorA, vectorB) {
+export function xAxisEqual (vectorA, vectorB) {
   return vectorA[0] === vectorB[0]
 }
 
 //
-export function vector(result) {
+export function vector (result) {
   const handler = {
     add: addVector,
     multiply,
@@ -124,10 +120,10 @@ export function vector(result) {
     parallel
   }
   const proxyHandler = {}
-  
+
   Object.keys(handler).forEach(key => {
     Object.defineProperty(proxyHandler, key, {
-      get() {
+      get () {
         return function (val) {
           result = handler[key](result, val)
           return proxyHandler
@@ -135,50 +131,48 @@ export function vector(result) {
       }
     })
   })
-  
+
   Object.defineProperty(proxyHandler, 'end', {
-    get() {
+    get () {
       return result
     }
   })
-  
+
   return proxyHandler
 }
 
-
-export function toRawType(val) {
+export function toRawType (val) {
   return Object.prototype.toString.call(val).slice(8, -1).toLocaleLowerCase()
 }
 
-export function isFun(val) {
+export function isFun (val) {
   return toRawType(val) === 'function'
 }
 
-export function isBool(val) {
+export function isBool (val) {
   return toRawType(val) === 'boolean'
 }
 
-export function isUndef(val) {
+export function isUndef (val) {
   return toRawType(val) === 'undefined'
 }
 
-export function isString(val) {
+export function isString (val) {
   return toRawType(val) === 'string'
 }
 
-export function isObject(val) {
+export function isObject (val) {
   return toRawType(val) === 'object'
 }
 
-export function arrayReplace(arr1, arr2) {
+export function arrayReplace (arr1, arr2) {
   arr1.splice(0, arr1.length, ...arr2)
 }
 
-export function debounce(fn, timestamp) {
+export function debounce (fn, timestamp) {
   let timeout = null
   return function () {
-    if (timeout)
-      clearTimeout(timeout)
+    if (timeout) { clearTimeout(timeout) }
     timeout = setTimeout(fn, timestamp)
   }
 }

+ 21 - 19
src/views/modules/tech/ctafts-add-or-detail.vue

@@ -305,7 +305,7 @@
               selected: (graph, coordinate) => {
                 graph.selectAll()
                 this.datas = graph
-              console.log(graph)
+                console.log(graph)
               }
             }
           ]
@@ -340,7 +340,7 @@
                 link.remove()
               }
             }
-          ],
+          ]
           // [
           //   {
           //     label: '编辑',
@@ -406,11 +406,12 @@
             if (data.data.proTechnologyStepLists) {
               const dataline = []
               const datanode = []
-              await data.data.proTechnologyStepLists.forEach((v,i) => {
+              await data.data.proTechnologyStepLists.forEach((v, i) => {
+                // eslint-disable-next-line no-unused-vars
                 const sortNo = []
-                const datas = v.sort((a,b) => Number(a['sortNo']) - Number(b['sortNo']))
+                const datas = v.sort((a, b) => Number(a['sortNo']) - Number(b['sortNo']))
                 datas.forEach((item, index) => {
-                  const find = datanode.find(map => map.id == item.stepId)
+                  const find = datanode.find(map => map.id === item.stepId)
                   if (!find) {
                     datanode.push({
                       id: item.stepId,
@@ -427,15 +428,16 @@
                   }
                   const id = item.stepId
                   if ((index + 1) < datas.length) {
-                    if (datas[index + 1])
-                    dataline.push({
-                      id: uuid('link') ,
-                      startId: id,
-                      endId: datas[index + 1].stepId,
-                      meta: '',
-                      startAt: [(index === 0 || item.workTypeId === '0') ? 90 : 120, (index === 0 || item.workTypeId === '0') ? 25 : 35],
-                      endAt: [0, (index === 0 || item.workTypeId === '0') ? 25 : 35],
-                    })
+                    if (datas[index + 1]) {
+                      dataline.push({
+                        id: uuid('link'),
+                        startId: id,
+                        endId: datas[index + 1].stepId,
+                        meta: '',
+                        startAt: [(index === 0 || item.workTypeId === '0') ? 90 : 120, (index === 0 || item.workTypeId === '0') ? 25 : 35],
+                        endAt: [0, (index === 0 || item.workTypeId === '0') ? 25 : 35]
+                      })
+                    }
                   }
                 })
               })
@@ -492,9 +494,9 @@
         dList.forEach(v => {
           const _i = _l.indexOf(v.id)
           if (_i > -1) {
-            if (!v.meta.workTypeId &&  v.meta.prop != 'end') {
+            if (!v.meta.workTypeId && v.meta.prop !== 'end') {
               this.$message.error('完善节点工种')
-              return 
+              return
             }
             if (!sortNo) {
               dataAll[_i].push({
@@ -510,7 +512,7 @@
             } else {
               let _has = false
               dataAll.forEach(items => {
-                if (items.stepId == v.id) {
+                if (items.stepId === v.id) {
                   _has = true
                 }
               })
@@ -546,7 +548,7 @@
             const proTechnologyStepLists = []
             let has = false
             let has1 = false
-            this.datas.nodeList.forEach(v =>{
+            this.datas.nodeList.forEach(v => {
               if (v.meta.prop === 'start') {
                 has = true
                 this.getLineData(proTechnologyStepLists, this.datas.nodeList, this.datas.linkList, v.id, 0)
@@ -563,7 +565,7 @@
               this.$message.error('成流程图没有结束结点!')
               return
             }
-            if (proTechnologyStepLists.length == 0) {
+            if (proTechnologyStepLists.length === 0) {
               this.$message.error('请先完成流程图!')
               return
             }

+ 9 - 10
src/views/modules/tech/test.vue

@@ -33,14 +33,13 @@
 </template>
 
 <script>
-
   const drawerType = {
     node: 0,
     link: 1
   }
 
   export default {
-    data() {
+    data () {
       return {
         drawerType,
         drawerConf: {
@@ -89,7 +88,7 @@
           [
             {
               label: '开始节点',
-              disable(graph) {
+              disable (graph) {
                 return !!graph.nodeList.find(node => node.meta.prop === 'start')
               },
               selected: (graph, coordinate) => {
@@ -154,7 +153,7 @@
             },
             {
               label: '结束节点',
-              disable(graph) {
+              disable (graph) {
                 return !!graph.nodeList.find(point => point.meta.prop === 'end')
               },
               selected: (graph, coordinate) => {
@@ -190,10 +189,10 @@
             {
               label: '删除',
               disable: false,
-              hidden(node) {
+              hidden (node) {
                 return node.meta.prop === 'start'
               },
-              selected(node, coordinate) {
+              selected (node, coordinate) {
                 node.remove()
               }
             }
@@ -229,7 +228,7 @@
         ]
       }
     },
-    created() {
+    created () {
       const nodeList = [
         {
           'id': 'nodeS3WgFnzCI15X58Qw',
@@ -430,7 +429,7 @@
       }, 100)
     },
     methods: {
-      enterIntercept(formNode, toNode, graph) {
+      enterIntercept (formNode, toNode, graph) {
         const formType = formNode.meta.prop
         switch (toNode.meta.prop) {
           case 'start':
@@ -458,10 +457,10 @@
             return true
         }
       },
-      outputIntercept(node, graph) {
+      outputIntercept (node, graph) {
         return !(node.meta.prop === 'end')
       },
-      linkDesc(link) {
+      linkDesc (link) {
         return link.meta ? link.meta.desc : ''
       }
     }