zcdsj
/
factory_web
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

gantt图问题修复

This commit is contained in:
shijing 2023-11-24 11:38:23 +08:00
parent 0f6ffb356b
commit a81eea91ca
2 changed files with 45 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/GanttComponent.vue
View File

@ -28,25 +28,43 @@
}, },
}, },
mounted: function () { mounted: function () {
gantt.i18n.setLocale('cn'); gantt.clearAll();// 清空之前的配置
gantt.i18n.setLocale('cn'); // 设置中文
gantt.config.date_format = "%Y-%m-%d"; gantt.config.date_format = "%Y-%m-%d";
gantt.config.date_grid = "%Y/%m/%d"; gantt.config.date_grid = "%Y/%m/%d";
gantt.config.readonly = true; gantt.config.readonly = true; // 设置中文
gantt.config.autosize = true; gantt.config.autosize = true;//自适应尺寸
gantt.plugins({tooltip: true}); gantt.plugins({tooltip: true});
gantt.config.bar_height = 20; //task高度
// gantt.config.start_date = new Date(2023, 9, 1); // gantt.config.start_date = new Date(2023, 9, 1);
// gantt.config.end_date = new Date(2023, 9, 10); // gantt.config.end_date = new Date(2023, 9, 10);
//更改父项图标
// gantt.templates.grid_folder = (item) => {
// return ""
// }
//更改子项图标
// gantt.templates.grid_file = (item) => {
// return ""
// }
gantt.config.columns = [ gantt.config.columns = [
{name: 'number',label: '任务编号',tree: true,width: '*',align: 'left'}, {name: 'number',label: '任务编号',tree: true,width: '*',align: 'left'},
{name: 'cate',label: '规格型号', width: '70',align: 'center'}, {name: 'cate',label: '规格型号', width: '70',align: 'center'},
{name: 'count',label: '完成量',width: '50', align: 'center'} {name: 'count',label: '完成量',width: '50', align: 'center'}
]; ];
gantt.attachEvent('onGanttReady', function () { gantt.attachEvent('onGanttReady', function () {
// var tooltips = gantt.ext.tooltips;
gantt.templates.tooltip_text = function (start, end, task) { gantt.templates.tooltip_text = function (start, end, task) {
return task.number + '<br/>计划产量：' + task.count + '<br/>当日产量：' + task.count + '<br/>完成产量：' + task.count + '<br/>开工时间：' + gantt.templates.tooltip_date_format(start) + '<br/>完工时间：' + gantt.templates.tooltip_date_format(end); return task.number +
'<br/>计划产量：' + task.count +
'<br/>当日产量：' + task.count_real +
'<br/>完成产量：' + task.count_ok +
'<br/>开工时间：' + gantt.templates.tooltip_date_format(start) +
'<br/>完工时间：' + gantt.templates.tooltip_date_format(start);
}; };
}); });
//自适应甘特图的尺寸大小, 使得在不出现滚动条的情况下, 显示全部任务
// gantt.config.autosize = true;
// gantt.config.open_split_tasks = true;
// gantt.config.scale_unit = "day"; // gantt.config.scale_unit = "day";
// gantt.config.step = 1; // gantt.config.step = 1;
// gantt.config.date_scale = " %Y/%m/%d"; // gantt.config.date_scale = " %Y/%m/%d";
@ -61,6 +79,8 @@
{ unit: 'year', step: 1, format: " %Y年", css: yearScaleCss }, { unit: 'year', step: 1, format: " %Y年", css: yearScaleCss },
{ unit: 'day', step: 1, format: " %m月%d日", css: monthScaleCss } { unit: 'day', step: 1, format: " %m月%d日", css: monthScaleCss }
]; ];
gantt.config.duration_step = 1;
// 初始化甘特图
gantt.init(this.$refs.ganttContainer); gantt.init(this.$refs.ganttContainer);
gantt.parse(this.$props.tasks); gantt.parse(this.$props.tasks);
} }

51
src/views/pm/mtask2.vue
View File

@ -25,7 +25,7 @@
</el-table-column> </el-table-column>
<el-table-column label="任务状态" prop="state"> <el-table-column label="任务状态" prop="state">
<template #default="scope"> <template #default="scope">
<el-tag v-if="scope.row.state!==40" type="primary"> <el-tag v-if="scope.row.state!==40">
{{ state_[scope.row.state] }} {{ state_[scope.row.state] }}
</el-tag> </el-tag>
<el-tag v-else type="success"> <el-tag v-else type="success">
@ -70,7 +70,7 @@
</div> </div>
<el-tabs v-model="activeNameSub" class="demo-tabs" @tab-click="handleClick"> <el-tabs v-model="activeNameSub" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="生产进度" name="rate"> <el-tab-pane label="生产进度" name="rate">
<GanttComponent class="left-container" :tasks="tasks"></GanttComponent> <GanttComponent class="left-container" :tasks="tasks" :start_date="start_date" :end_date="end_date"></GanttComponent>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</el-main> </el-main>
@ -155,7 +155,7 @@
</el-table-column> </el-table-column>
<el-table-column label="状态" prop="state" show-overflow-tooltip> <el-table-column label="状态" prop="state" show-overflow-tooltip>
<template #default="scope"> <template #default="scope">
<el-tag v-if="scope.row.state!==40" type="primary"> <el-tag v-if="scope.row.state!==40">
{{ state_[scope.row.state] }} {{ state_[scope.row.state] }}
</el-tag> </el-tag>
<el-tag v-else type="success"> <el-tag v-else type="success">
@ -190,7 +190,6 @@ export default {
ganttLoading: false, ganttLoading: false,
projectId: '', projectId: '',
orderitems: [], orderitems: [],
form:{ form:{
orderitems:[], orderitems:[],
start_date:'', start_date:'',
@ -226,23 +225,11 @@ export default {
selectedIds:[], selectedIds:[],
utaskDetail:[], utaskDetail:[],
tasks: { tasks: {
data: [ data: []
// {
// id:'2023101800',
// number:'GZ20231012',
// model:'GB2',
// cate:'100*50*2',
// count:300,
// text: "一天任务",
// start_date: "2023-11-2",
// duration: 2,
// progress: 1
// },
// {number:'GZ20231013',model:'GB2',cate:'100*50*2',count:300,text: "一天任务",start_date: "2023-11-3",id:'2023101801',duration: 1,progress: 1},
// {number:'GZ20231014',model:'GB2',cate:'100*50*2',count:200, text: "一天任务",start_date: "2023-11-4",id:'2023101802',duration: 1,progress: 0.8},
]
}, },
loading:false, loading:false,
end_date:'',
start_date:'',
}; };
}, },
created() { created() {
@ -326,6 +313,8 @@ export default {
//获取 mtask //获取 mtask
let that = this; let that = this;
that.tasks.data = []; that.tasks.data = [];
that.start_date = row.start_date;
that.end_date = row.end_date;
let objItem = {}; let objItem = {};
objItem.id=row.id; objItem.id=row.id;
objItem.type='utask'; objItem.type='utask';
@ -333,8 +322,6 @@ export default {
objItem.count=row.count; objItem.count=row.count;
objItem.text =row.number, objItem.text =row.number,
objItem.cate='', objItem.cate='',
objItem.duration = 10;
objItem.progress = 1; objItem.progress = 1;
objItem.count_ok=row.count_ok; objItem.count_ok=row.count_ok;
objItem.count_real=row.count_real; objItem.count_real=row.count_real;
@ -344,22 +331,24 @@ export default {
objItem.mgroup_name = ''; objItem.mgroup_name = '';
objItem.material_name = ''; objItem.material_name = '';
objItem.specification = ''; objItem.specification = '';
objItem.open=true;
that.tasks.data.push(objItem) that.tasks.data.push(objItem)
this.$API.pm.mtask.list.req({utask:row.id}).then(res=>{ this.$API.pm.mtask.list.req({utask:row.id,page:0,ordering:'start_date,mgroup__process__sort'}).then(res=>{
// console.log(res.results)//获取甘特图数据 console.log('获取甘特图数据',res)//获取甘特图数据
let data = res.results; res.forEach(item=>{
data.forEach(item=>{
let obj = {}; let obj = {};
obj.id=item.id; obj.id=item.id;
obj.type='mtask'; obj.type='task';
obj.parent=row.id; obj.parent=row.id;
obj.number=item.number; obj.number=item.number;
obj.count=item.count; obj.text =item.mgroup_name,
obj.text = "一天任务",
obj.cate='100*50*2', obj.cate='100*50*2',
obj.state =item.state;
obj.start = item.start_date;
obj.start_date = item.start_date; obj.start_date = item.start_date;
obj.duration = 1; obj.duration = 1;
obj.progress = 1; obj.progress = item.count_real/item.count;
obj.count=item.count;
obj.count_ok=item.count_ok; obj.count_ok=item.count_ok;
obj.count_real=item.count_real; obj.count_real=item.count_real;
obj.count_notok=item.count_notok; obj.count_notok=item.count_notok;
@ -371,8 +360,8 @@ export default {
console.log(obj) console.log(obj)
that.tasks.data.push(obj) that.tasks.data.push(obj)
}) })
console.log(that.tasks.data) // console.log(that.tasks.data)
console.log('tasks:',that.tasks) // console.log('tasks:',that.tasks)
// 数据解析:将数据解析到gantt列数据中 // 数据解析:将数据解析到gantt列数据中
gantt.parse(that.tasks); gantt.parse(that.tasks);
// 刷新数据 // 刷新数据