甘特图站位路线

applications/dee-mes/package.json

@@ -10,6 +10,7 @@
   "dependencies": {
     "axios": "^0.19.2",
     "bpmn-js": "^7.0.0",
+    "csv-exportor": "^1.0.2",
     "camunda-bpmn-moddle": "^4.4.0",
     "lodash.foreach": "^4.5.0",
     "moment": "^2.26.0",

applications/dee-mes/src/privateComponents/components/MBOMConfig/config.js

@@ -5,14 +5,14 @@ export default {
     }
   },
   mounted() {
-    this.initGantt()
+    this.gantt && this.initGantt()
   },
   methods: {
     initGantt() {
       this.setColumnsConfig()
-      this.configLayout()
-      this.gantt.init(this.ganttElId)
+      this.usePlugins()
       this.gantt.i18n.setLocale('cn')
+      this.configLayout()
     },
     setColumnsConfig() {
       this.gantt.config.columns = this.columns

applications/dee-mes/src/privateComponents/components/MBOMConfig/data.js

@@ -33,15 +33,7 @@ export default {
 
   },
   methods: {
-    search() {
 
-    },
-    export() {
-
-    },
-    save() {
-
-    }
   }
 
 }

applications/dee-mes/src/privateComponents/components/MBOMConfig/gatt.vue

@@ -9,9 +9,9 @@
       <dee-tools mode="normal" :tools="tools" />
     </div>
     <div class="content-model">
-      <step v-show="viewType === 'ExtPosition'" :show-flag="viewType === 'ExtPosition'" :node="node" />
-      <unit v-show="viewType === 'unit'" :show-flag="viewType === 'unit'" :node="node" />
-      <view2 v-show="viewType === 'AircraftSorties'" :show-flag="viewType === 'AircraftSorties'" :node="node" />
+      <step ref="ExtPosition" v-show="viewType === 'ExtPosition'" :show-flag="viewType === 'ExtPosition'" :node="node" />
+      <unit ref="unit" v-show="viewType === 'unit'" :show-flag="viewType === 'unit'" :node="node" />
+      <view2 ref="AircraftSorties" v-show="viewType === 'AircraftSorties'" :show-flag="viewType === 'AircraftSorties'" :node="node" />
     </div>
   </div>
 </template>
@@ -101,14 +101,14 @@ export default {
     getData(params) {
       this.node = params
     },
-    import() {
-
+    export() {
+      this.$refs[this.viewType].export()
     },
     save() {
-
+      this.$refs[this.viewType].save()
     },
     config() {
-
+      this.$refs[this.viewType].config()
     }
   }
 }

applications/dee-mes/src/privateComponents/components/MBOMConfig/step.vue

@@ -7,6 +7,7 @@
 <script>
 import config from './config'
 import data from './data'
+import CsvExportor from 'csv-exportor'
 export default {
   name: 'TfMomWebStep',
   mixins: [config, data],
@@ -49,7 +50,8 @@ export default {
             }
           }
           return '<span>' + labels.join(',') + '</span>'
-        }
+        },
+        editor: { type: 'custom_datepicker_editor' }
         }
       ]
     }
@@ -76,7 +78,8 @@ export default {
           id: item.id,
           parenId: link && link.prevNodeId || '',
           start_date: '2007-1-1',
-          duration: item.workHour ? (item.workHour / 8) : 0
+          type: 'task',
+          duration: item.workHour ? Number(item.workHour / 8) : 0
         })
         if (link) {
           params.links.push({
@@ -90,9 +93,9 @@ export default {
           })
         }
       })
-      this.params = JSON.parse(JSON.stringify(params))
+      this.params = params
       this.gantt.clearAll()
-      this.gantt.parse(params)
+      this.gantt.parse(this.params)
     },
     getData() {
       this.currentId = this.node.id
@@ -120,7 +123,6 @@ export default {
     },
     configLayout() {
       const ganttAg = this.gantt
-      const that = this
       const getInput = function(node) {
         return node.querySelector('input')
       }
@@ -194,8 +196,12 @@ export default {
       ganttAg.ext.zoom.init(zoomConfig)
       // 允许通过拖放来调整任务大小
       ganttAg.config.drag_resize = true
-      ganttAg.config.highlight_critical_path = false
-
+      ganttAg.config.highlight_critical_path = true
+      ganttAg.templates.link_class = function(link) {
+        if (link.isCritical) {
+          return 'critical_path'
+        }
+      }
       ganttAg.config.editor_types.custom_datepicker_editor = {
         show: function(id, column, config, placeholder) {
           var html =
@@ -212,7 +218,7 @@ export default {
         focus: function(node) {},
         set_value: function(value, id, column, node) {
           // eslint-disable-next-line eqeqeq
-          var data = that.data.links
+          var data = ganttAg.getTableData().data.links
             .filter((p) => p.target === id)
             .map((p) => ganttAg.getWBSCode(ganttAg.getTask(p.source)))
           ganttAg.getWBSCode(ganttAg.getTask(id))
@@ -277,12 +283,11 @@ export default {
       // 删除连接后触发
       ganttAg.attachEvent('onAfterLinkDelete', function(id, item) {
         var target = ganttAg.getTask(item.target)
-        console.log(ganttAg, target)
         var targetLength = target.$target.length
         if (!targetLength) {
           var data = {
-            links: this.gantt.getTableData().data.links,
-            data: this.gantt.getTableData().data.data.map((p) => {
+            links: ganttAg.getTableData().data.links,
+            data: ganttAg.getTableData().data.data.map((p) => {
               delete p.end_date
               p.start_date = new Date(2007, 0, 1)
               return p
@@ -298,8 +303,75 @@ export default {
         }
         return true
       })
+      this.$nextTick(() => {
+        ganttAg.init(this.ganttElId)
+      })
+    },
+    export(mode) {
+      if (mode === 'png') {
+        this.gantt.exportToPNG({
+          locale: 'CN',
+          name: 'AG600.png'
+          // data: this.tasks
+        })
+      } else if (mode === 'pdf') {
+        this.gantt.exportToPDF({
+          name: 'AG600.pdf'
+        })
+      } else {
+        var dd = this.gantt.getTableData()
+        const tableData = dd.data.data.filter(p => !p.priority).map((p) => {
+          return {
+            index: p.index,
+            text: p.text,
+            duration: Math.round(p.duration),
+            predecessors: Object.values(p)
+              .filter((item) => item.toString().includes('<span>'))[0]
+              .replace('<span>', '')
+              .replace('</span>', '')
+          }
+        })
+        const header = ['节点', '站位号', '工期（天）', '前置']
+        CsvExportor.downloadCsv(tableData, { header }, '站位路线.csv')
+      }
+    },
+    save() {
+      const tasks = this.gantt.getTableData().data.data
+      const links = this.gantt.getTableData().data.links
+      const params = this.ganttData.map(item => {
+        const routes = item.extProcessExecutorRoutes.map(r => {
+          return {
+            id: r.id,
+            operator: 'REMOVE'
+          }
+        })
+        const task = tasks.find(r => r.id === item.id)
+        if (item.extProcessExecutorRoutes) {
+          const link = links.find(r => r.target === item.id)
+          if (link) {
+            routes.push({
+              operator: 'ADD',
+              subTypeName: 'ExtProcessExecutorRoute',
+              prevNodeIdType: 'ExtPosition',
+              currNodeIdType: 'ExtPosition',
+              currNodeId: Number(link.target),
+              prevNodeId: Number(link.source),
+              isCritical: link.isCritical
+            })
+          }
+        }
+        return {
+          id: item.id,
+          operator: 'MODIFY',
+          subTypeName: 'ExtPosition',
+          workHour: task && (task.duration * 8) || 0,
+          extProcessExecutorRoutes: routes
+        }
+      })
+      this.$api.recursion('ExtPosition', params, true).then(() => {
+        this.getData()
+      })
     }
-
   }
 }
 </script>