甘特图排产

src/views/mes/pro/schedule/ganttedit.vue

@@ -1,14 +1,47 @@
 <template>
+    <div class="app-container">
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1"></el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          @click="handleUpdate"
+          v-hasPermi="['mes:pro:schedule:edit']"
+        >保存</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          @click="handleClose"
+        >关闭</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-refresh"
+          size="mini"
+          @click="handleRefresh"
+        >重新加载</el-button>
+      </el-col>
+    </el-row>
     <div class="wrapper">
       <div class="container">
-        <GanttChar class="left-container" ref="ganttChar" optType="edit" :tasks="tasks"></GanttChar>
+        <GanttChar class="left-container" ref="ganttChar" optType="edit" :ids="changedTaskIds" :tasks="tasks"></GanttChar>
       </div>      
     </div> 
+    </div>
 </template>
 
 <script>
 import GanttChar from "./ganttx.vue";
-import {listGanttTaskList} from "@/api/mes/pro/protask";
+import {listGanttTaskList,updateProtask} from "@/api/mes/pro/protask";
 export default {
     name:'',
     components:{GanttChar},
@@ -18,6 +51,7 @@ export default {
                 data: [],
                 links: []
             },
+            changedTaskIds:[],
             optType:'edit',
             // 查询参数
             queryParams: {
@@ -42,6 +76,17 @@ export default {
                 ancestors: null,
                 status: null,
             },
+            form:{
+                taskId: null,                              
+                startTime: null,
+                duration: null,
+                endTime: null            
+            }
+        }
+    },
+    watch: {
+        tasks(){
+            console.log("TaskChanged");
         }
     },
     created(){
@@ -50,12 +95,51 @@ export default {
     methods: {
         getGanttTasks(){
             listGanttTaskList(this.queryParams).then(response =>{
-                debugger;
                 this.tasks.data = response.data.data;
                 this.tasks.links = response.data.links;
                 this.$refs.ganttChar.reload();
             });
         },
+        handleUpdate(){
+            debugger;
+            if(this.changedTaskIds.length>0){
+                this.reset();
+                this.changedTaskIds.forEach(id => {
+                    debugger;
+                    let nTask = this.tasks.data.filter(task => task.id == id)[0];
+                    let startDate = new Date(nTask.start_date);
+                    let endDate = new Date(nTask.end_date);
+                    this.form.taskId = nTask.id;
+                    this.form.startTime = startDate.getFullYear()+'-'+(startDate.getMonth()+1)+'-'+startDate.getDate()+' '+startDate.getHours()+':'+startDate.getMinutes()+':'+startDate.getSeconds();
+                    this.form.duration = nTask.duration;
+                    this.form.endTime = endDate.getFullYear()+'-'+(endDate.getMonth()+1)+'-'+endDate.getDate()+' '+endDate.getHours()+':'+endDate.getMinutes()+':'+endDate.getSeconds();
+                    updateProtask(this.form).then(response =>{
+                        console.log("update success:"+id);
+                    },err =>{
+                        debugger;
+                        console.log("update failed:"+err.msg);
+                    });
+                });
+                this.changedTaskIds =[];                
+                this.$modal.msgSuccess("保存成功");
+            }            
+        },
+        handleRefresh(){
+            this.$refs.ganttChar.reload();
+        },
+        handleClose(){
+            const obj = { path: "/mes/pro/proschedule" };
+            this.$tab.closeOpenPage(obj);
+        },
+        reset() {
+            this.form = {
+                taskId: null,
+                startTime: null,
+                duration: null,
+                endTime: null,
+            };
+        },
+
     }
 }
 </script>

src/views/mes/pro/schedule/ganttx.vue

@@ -23,6 +23,12 @@ export default {
       default (){
         return 'view'
       }
+    },
+    ids: {
+      type: Array,
+      default (){
+        return []
+      }
     }
   },
 
@@ -168,6 +174,16 @@ export default {
       // 3.7 双击显示明细
       gantt.config.details_on_dblclick = true;
 
+      let t = this.$props.tasks;
+      let c = this.$props.ids;
+      gantt.attachEvent("onAfterTaskUpdate",function(id,obj){
+        debugger;
+        let tt = t.data.filter( item=> item.id == id);
+        tt=obj;  
+        c.push(id);              
+      });
+
+
     }
   }
 }