湖里大屏(进度计划)：抽离获取进度条参数代码

src/views/projectAdmin/jlw/planProgress/centerTop.vue

@@ -75,6 +75,7 @@ export default {
           pName: '地基与基础工程',
           startTime: '2020/04/06',
           endTime: '2020/05/09',
+          delay: 5,
           status: 0,
           gantts: [],
           // gantts: [{ left: '420px', width: '100px', status: '' }],
@@ -91,45 +92,48 @@ export default {
     }
   },
   methods: {
+    getGanttStyle(project) {
+      let { startTime, endTime, pName } = project
+      const startArr = startTime.split('/')
+      const endArr = endTime.split('/')
+      let startRef = null
+      let endRef = null
+
+      if (!(startArr[2] % 2)) {
+        const day = startArr[2] - 1
+        startArr[2] = day < 10 ? '0' + day : day
+        startTime = startArr.join('/')
+        console.log(startTime, 'xxx')
+      }
+      if (!(endArr[2] % 2)) {
+        const day = endArr[2] - 1
+        endArr[2] = day < 10 ? '0' + day : day
+        endTime = endArr.join('/')
+        console.log(endTime, 'xxx')
+      }
+
+      startRef = this.$refs[`${pName}-${startTime}`][0]
+      const startLeft = startRef.offsetLeft
+
+      endRef = this.$refs[`${pName}-${endTime}`][0]
+      const endWidth = endRef.offsetWidth
+      const endLeft = endRef.offsetLeft
+      const ganttWidth = endLeft - startLeft + endWidth
+
+      return { left: startLeft + 'px', width: ganttWidth + 'px' }
+    },
     setGantts() {
       const configGantts = projects => {
         projects.map(project => {
-          let { startTime, endTime, pName, gantts } = project
+          let { gantts } = project
-          const startArr = startTime.split('/')
+          const gantt = this.getGanttStyle(project)
-          const endArr = endTime.split('/')
+          gantt.background = this.colors[project.status]
-          let startRef = null
-          let endRef = null
-
-          if (!(startArr[2] % 2)) {
-            const day = startArr[2] - 1
-            startArr[2] = day < 10 ? '0' + day : day
-            startTime = startArr.join('/')
-            console.log(startTime, 'xxx')
-          }
-          if (!(endArr[2] % 2)) {
-            const day = endArr[2] - 1
-            endArr[2] = day < 10 ? '0' + day : day
-            endTime = endArr.join('/')
-            console.log(endTime, 'xxx')
-          }
-
-          startRef = this.$refs[`${pName}-${startTime}`][0]
-          const startLeft = startRef.offsetLeft
-
-          endRef = this.$refs[`${pName}-${endTime}`][0]
-          const endWidth = endRef.offsetWidth
-          const endLeft = endRef.offsetLeft
-          const ganttWidth = endLeft - startLeft + endWidth
-
-          const gantt = { left: startLeft + 'px', width: ganttWidth + 'px', background: this.colors[project.status] }
           if (gantts) {
             gantts.push(gantt)
           } else {
             project.gantts = [gantt]
           }
 
-          console.log(startLeft, ganttWidth, '丢雷', `${pName}-${endTime}`)
-
           // debugger
           project.children && configGantts(project.children)
         })