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

fix:生产管理6、7、10车间gantt随着上面的表格数据变动

This commit is contained in:
shijing 2024-03-26 09:31:58 +08:00
parent 70df6c3837
commit 149f985707
4 changed files with 205 additions and 164 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

340
src/components/GanttComponent.vue
View File

@ -1,164 +1,200 @@
<template>
<div ref="ganttContainer"></div>
<div ref="ganttContainer"></div>
</template>
<script>
import { gantt } from 'dhtmlx-gantt';
import { gantt } from "dhtmlx-gantt";
export default {
props: {
tasks: {
type: Object,
default() {
return {
data: [],
links: [],
}
}
},
start_date: {
type: String,
default() {
return ''
}
},
end_date: {
type: String,
default() {
return ''
}
},
},
mounted: function () {
let that = this;
gantt.clearAll();// 清空之前的配置
gantt.i18n.setLocale('cn'); // 设置中文
gantt.config.date_format = "%Y-%m-%d";
gantt.config.date_grid = "%Y/%m/%d";
gantt.config.readonly = true; // 设置中文
gantt.config.autosize = true;//自适应尺寸
gantt.plugins({ tooltip: true });
gantt.config.bar_height = 20; //task高度
gantt.config.duration_unit = "day";// 设置时间单位为天
//今天标志
// gantt.plugins({marker: true});
// gantt.addMarker({start_date: new Date(),text: '今日'});
props: {
tasks: {
type: Object,
default() {
return {
data: [],
links: [],
};
},
},
start_date: {
type: String,
default() {
return "";
},
},
end_date: {
type: String,
default() {
return "";
},
},
},
mounted: function () {
let that = this;
gantt.clearAll(); // 清空之前的配置
gantt.i18n.setLocale("cn"); // 设置中文
gantt.config.date_format = "%Y-%m-%d";
gantt.config.date_grid = "%Y/%m/%d";
gantt.config.readonly = true; // 设置中文
gantt.config.autosize = true; //自适应尺寸
gantt.plugins({ tooltip: true });
gantt.config.bar_height = 20; //task高度
gantt.config.duration_unit = "day"; // 设置时间单位为天
//今天标志
// gantt.plugins({marker: true});
// gantt.addMarker({start_date: new Date(),text: '今日'});
//工作日设置
// gantt.config.work_time = true;
// gantt.setWorkTime({ hours:["20:00-20:00"] });
// gantt.setWorkTime({ day:7, hours:false });
// gantt.setWorkTime({ hours:["0-24"] });
// gantt.config.start_date = new Date(2023, 9, 1);
// gantt.config.end_date = new Date(2023, 9, 10);
//更改父项图标
// gantt.templates.grid_folder = (item) => { return "" }
//更改子项图标
// gantt.templates.grid_file = (item) => { return "" }
gantt.config.columns = [
{ name: 'number', label: '任务编号', tree: true, width: '200', align: 'left' },
{ name: 'material_name', label: '产品名称', width: '70', align: 'left' },
{ name: 'material_specification', label: '规格', width: '70', align: 'left' },
{ name: 'material_model', label: '型号', width: '70', align: 'left' },
{ name: 'count', label: '任务量', width: '50', align: 'center' }
];
gantt.attachEvent('onGanttReady', function () {
gantt.templates.tooltip_text = function (start, end, task) {
let endTime = end.getTime()-24*60*60*1000;
let end_date = new Date(endTime);
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(end_date);
};
});
gantt.attachEvent("onTaskClick", async function(id, e) {
var task = gantt.getTask(id);
console.log(task)
if(task.type=="utask"){
that.$API.pm.mtask.list.req({ utask: id, page: 0, ordering: 'start_date,mgroup__process__sort' }).then(res => {
let data = [];
res.forEach(item => {
let obj = {};
obj.id = item.id;
obj.type = 'task';
obj.parent = id;
obj.number = item.number;
obj.text = item.mgroup_name;
obj.state = item.state;
obj.start = item.start_date;
obj.start_date = item.start_date;
obj.duration = 1;
obj.progress = item.count_real / item.count;
obj.count = item.count;
obj.count_ok = item.count_ok;
obj.count_real = item.count_real;
obj.count_notok = item.count_notok;
obj.state = item.state;
obj.utask = item.utask;
obj.mgroup_name = item.mgroup_name;
data.push(obj)
})
// 数据解析:将数据解析到gantt列数据中
let childTasks = data
gantt.parse({ data: childTasks });
// 刷新数据
gantt.refreshData();
})
}
//工作日设置
// gantt.config.work_time = true;
// gantt.setWorkTime({ hours:["20:00-20:00"] });
// gantt.setWorkTime({ day:7, hours:false });
// gantt.setWorkTime({ hours:["0-24"] });
// gantt.config.start_date = new Date(2023, 9, 1);
// gantt.config.end_date = new Date(2023, 9, 10);
//更改父项图标
// gantt.templates.grid_folder = (item) => { return "" }
//更改子项图标
// gantt.templates.grid_file = (item) => { return "" }
gantt.config.columns = [
{
name: "number",
label: "任务编号",
tree: true,
width: "200",
align: "left",
},
{
name: "material_name",
label: "产品名称",
width: "70",
align: "left",
},
{
name: "material_specification",
label: "规格",
width: "70",
align: "left",
},
{
name: "material_model",
label: "型号",
width: "70",
align: "left",
},
{ name: "count", label: "任务量", width: "50", align: "center" },
];
gantt.attachEvent("onGanttReady", function () {
gantt.templates.tooltip_text = function (start, end, task) {
let endTime = end.getTime() - 24 * 60 * 60 * 1000;
let end_date = new Date(endTime);
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(end_date)
);
};
});
gantt.attachEvent("onTaskClick", async function (id, e) {
var task = gantt.getTask(id);
console.log(task);
if (task.type == "utask") {
that.$API.pm.mtask.list
.req({
utask: id,
page: 0,
ordering: "start_date,mgroup__process__sort",
})
.then((res) => {
let data = [];
res.forEach((item) => {
let obj = {};
obj.id = item.id;
obj.type = "task";
obj.parent = id;
obj.number = item.number;
obj.text = item.mgroup_name;
obj.state = item.state;
obj.start = item.start_date;
obj.start_date = item.start_date;
obj.duration = 1;
obj.progress = item.count_real / item.count;
obj.count = item.count;
obj.count_ok = item.count_ok;
obj.count_real = item.count_real;
obj.count_notok = item.count_notok;
obj.state = item.state;
obj.utask = item.utask;
obj.mgroup_name = item.mgroup_name;
data.push(obj);
});
// 数据解析:将数据解析到gantt列数据中
})
//自适应甘特图的尺寸大小, 使得在不出现滚动条的情况下, 显示全部任务
// gantt.config.autosize = true;
// gantt.config.open_split_tasks = true;
let childTasks = data;
gantt.parse({ data: childTasks });
// 刷新数据
gantt.refreshData();
});
}
});
//自适应甘特图的尺寸大小, 使得在不出现滚动条的情况下, 显示全部任务
// gantt.config.autosize = true;
// gantt.config.open_split_tasks = true;
// gantt.config.scale_unit = "day";
// gantt.config.step = 1;
// gantt.config.date_scale = " %Y/%m/%d";
//时间轴样式
var yearScaleCss = function () {
return 'yearScaleStyle';
};
var monthScaleCss = function () {
return 'monthScaleStyle';
};
gantt.config.scales = [
{ unit: 'year', step: 1, format: " %Y年", css: yearScaleCss },
{ unit: 'day', step: 1, format: " %m月%d日", css: monthScaleCss }
];
gantt.config.duration_step = 1;
// 初始化甘特图
gantt.init(this.$refs.ganttContainer);
gantt.parse(this.$props.tasks);
},
// methods:{
// setBarColor() {
// this.tasks.map(v => {
// var newObj = {};
// if (v.status === "CJ") {
// newObj = Object.assign(v, {
// 'color': '#aaa8eb'
// });
// } else if (v.status === "SX") {
// newObj = Object.assign(v, {
// 'color': '#7cbbff'
// });
// }
// return newObj;
// });
// },
// },
}
// gantt.config.scale_unit = "day";
// gantt.config.step = 1;
// gantt.config.date_scale = " %Y/%m/%d";
//时间轴样式
var yearScaleCss = function () {
return "yearScaleStyle";
};
var monthScaleCss = function () {
return "monthScaleStyle";
};
gantt.config.scales = [
{ unit: "year", step: 1, format: " %Y年", css: yearScaleCss },
{ unit: "day", step: 1, format: " %m月%d日", css: monthScaleCss },
];
gantt.config.duration_step = 1;
// 初始化甘特图
gantt.init(this.$refs.ganttContainer);
gantt.parse(this.$props.tasks);
},
beforeDestoryed: function () {
console.log("beforeDestroyed");
gantt.clearAll();
},
// methods:{
// setBarColor() {
// this.tasks.map(v => {
// var newObj = {};
// if (v.status === "CJ") {
// newObj = Object.assign(v, {
// 'color': '#aaa8eb'
// });
// } else if (v.status === "SX") {
// newObj = Object.assign(v, {
// 'color': '#7cbbff'
// });
// }
// return newObj;
// });
// },
// },
};
</script>
<style>
@import "~dhtmlx-gantt/codebase/dhtmlxgantt.css";
.gantt_task_line{
background-color: #c7c9c9;
border: 1px solid #adb1b2;
.gantt_task_line {
background-color: #c7c9c9;
border: 1px solid #adb1b2;
}
.gantt_task_progress{
color: #148dff;
.gantt_task_progress {
color: #148dff;
}
</style>
</style>

6
src/views/pm/utask_dept10.vue
View File

@ -201,6 +201,7 @@
class="left-container"
v-if="ganntVisit"
:tasks="tasks"
:key="timeStamp"
:start_date="start_date"
>
</GanttComponent>
@ -247,6 +248,7 @@ export default {
dateValue: "",
apiUtask: null,
apiObj: null,
timeStamp: "",
ganntVisit: true,
visibleRecord: false,
currentDept: { id: 0 },
@ -289,7 +291,8 @@ export default {
let data = [];
that.ganntVisit = false;
that.tasks.data = [];
console.log("tableData", tableData);
let date = new Date();
that.timeStamp = date.getTime();
if (tableData.length > 0) {
tableData.forEach((item) => {
let start_date = item.start_date;
@ -328,7 +331,6 @@ export default {
that.tasks.data = data;
that.ganntVisit = true;
gantt.parse(that.tasks);
// 刷新数据
gantt.refreshData();
},
getGantt() {

8
src/views/pm/utask_dept6.vue
View File

@ -212,6 +212,7 @@
class="left-container"
v-if="ganntVisit"
:tasks="tasks"
:key="timeStamp"
:start_date="start_date"
>
</GanttComponent>
@ -258,6 +259,7 @@ export default {
start_date: "",
end_date: "",
},
timeStamp: "",
ganntVisit: true,
dateValue: "",
apiUtask: null,
@ -304,7 +306,8 @@ export default {
let data = [];
that.ganntVisit = false;
that.tasks.data = [];
console.log("tableData", tableData);
let date = new Date();
that.timeStamp = date.getTime();
if (tableData.length > 0) {
tableData.forEach((item) => {
let start_date = item.start_date;
@ -341,9 +344,8 @@ export default {
});
}
that.tasks.data = data;
that.ganntVisit = true;
gantt.parse(that.tasks);
// 刷新数据
that.ganntVisit = true;
gantt.refreshData();
},
getGantt() {

15
src/views/pm/utask_dept7.vue
View File

@ -45,7 +45,6 @@
stripe
:params="paramsUtask"
:query="queryUtask"
@row-click="rowclick"
@selection-change="handleSelectionChange"
@dataChange="updateCount"
>
@ -233,6 +232,7 @@
<GanttComponent
class="left-container"
:tasks="tasks"
:key="timeStamp"
v-if="ganntVisit"
:start_date="start_date"
>
@ -277,6 +277,7 @@ export default {
tasks: {
data: [],
},
timeStamp: "",
ganntVisit: true,
dateValue: [],
apiUtask: null,
@ -300,6 +301,8 @@ export default {
},
mounted() {
this.initDept();
let date = new Date();
this.timeStamp = date.getTime();
},
methods: {
initDept() {
@ -310,9 +313,7 @@ export default {
if (res.length == 1) {
that.currentDept = res[0];
that.paramsUtask.belong_dept = that.currentDept.id;
// that.paramsObj.belong_dept = that.currentDept.id;
that.apiUtask = that.$API.pm.utask.list;
// that.getGantt();
} else {
that.$message.error("未找到车间");
}
@ -322,9 +323,10 @@ export default {
let that = this;
this.count = res.count;
let data = [];
that.ganntVisit = false;
that.tasks.data = [];
console.log("tableData", tableData);
that.ganntVisit = false;
let date = new Date();
that.timeStamp = date.getTime();
if (tableData.length > 0) {
tableData.forEach((item) => {
let start_date = item.start_date;
@ -361,9 +363,8 @@ export default {
});
}
that.tasks.data = data;
that.ganntVisit = true;
gantt.parse(that.tasks);
// 刷新数据
that.ganntVisit = true;
gantt.refreshData();
},
utaskDepuse() {