2022-06-08 14:51:11 +08:00
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
<!-- saved from url=(0049)http://www.plusgantt.com/gantt/demo/ExtGantt.html -->
|
|
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml" class=" ext-strict x-viewport">
|
|
|
|
|
|
|
2022-11-10 09:18:38 +08:00
|
|
|
|
<head>
|
|
|
|
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
|
|
|
|
|
<title>Ext甘特图</title>
|
|
|
|
|
|
|
|
|
|
|
|
<meta name="keywords" content="extgantt,extjs,gantt,甘特图" />
|
|
|
|
|
|
<meta name="description" content="普加甘特图可以与ExtJS无缝集成" />
|
|
|
|
|
|
<!--extjs css-->
|
|
|
|
|
|
<link href="./Ext甘特图_files/ext-all.css" rel="stylesheet" type="text/css" />
|
|
|
|
|
|
<link href="./Ext甘特图_files/icons.css" rel="stylesheet" type="text/css" />
|
|
|
|
|
|
<link href="./Ext甘特图_files/miniui.css" rel="stylesheet" type="text/css" />
|
|
|
|
|
|
<link href="./Ext甘特图_files/skin.css" rel="stylesheet" type="text/css" />
|
|
|
|
|
|
<!-- <link href="./Ext甘特图_files/skin.css" rel="stylesheet" type="text/css"> -->
|
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
|
|
<body class="ext-webkit ext-chrome ext-mac x-border-layout-ct" id="ext-gen3">
|
|
|
|
|
|
<!--引入ExtJS-->
|
|
|
|
|
|
<script type="text/javascript" src="./Ext甘特图_files/ext-base.js"></script>
|
|
|
|
|
|
<script type="text/javascript" src="./Ext甘特图_files/ext-all.js"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/boot.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/jquery.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/miniui.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/zh_CN.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/CalendarWindow.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/ProjectMenu.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/StatusColumn.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/TaskWindow.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/ResourcesWindow.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/ProjectServices.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/swfobject.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/GanttService.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/GanttMenu.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/GanttSchedule.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/RGanttMenu.js" type="text/javascript"></script>
|
|
|
|
|
|
<script src="./Ext甘特图_files/RGanttSchedule.js" type="text/javascript"></script>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 引入axios -->
|
|
|
|
|
|
<!-- <script src="https://unpkg.com/axios/dist/axios.min.js"></script> -->
|
|
|
|
|
|
<script src="./http-axios.js"></script>
|
|
|
|
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
|
// 父级传过来的参数
|
|
|
|
|
|
window.addEventListener('message', function (e) {
|
|
|
|
|
|
console.log(e.data, '父级页面传来的数据')
|
|
|
|
|
|
localStorage.setItem('id', e.data)
|
|
|
|
|
|
})
|
|
|
|
|
|
//页面加载就绪
|
|
|
|
|
|
window.onload = () => {
|
|
|
|
|
|
console.log("window.onload");
|
|
|
|
|
|
|
|
|
|
|
|
//创建PlusGantt之后,
|
|
|
|
|
|
var gantt = new CreateGantt();
|
|
|
|
|
|
|
|
|
|
|
|
var parentUrl = getParentUrl();
|
|
|
|
|
|
console.log("parentUrl", parentUrl);
|
|
|
|
|
|
if (parentUrl.indexOf("dataBoard") != -1) {
|
|
|
|
|
|
document.getElementById("ext-gen3").classList.add("greyBox");
|
|
|
|
|
|
} else {
|
|
|
|
|
|
document.getElementById("ext-gen3").classList.remove("greyBox");
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
//获取请求地址
|
|
|
|
|
|
let url = window.parent.document.getElementById("iframe").contentWindow
|
|
|
|
|
|
.location.search;
|
|
|
|
|
|
var parameter = url.split("="); //所有参数
|
|
|
|
|
|
var requestUrl = parameter[1].split("&")[0]; //请求服务器的地址
|
|
|
|
|
|
var projectSn = parameter[2].split("&")[0]; //projectSn
|
|
|
|
|
|
var token = parameter[3];
|
|
|
|
|
|
var listData = [];
|
|
|
|
|
|
|
|
|
|
|
|
//转换时间戳
|
|
|
|
|
|
// function formatDateTime(inputTime) {
|
|
|
|
|
|
// var date = new Date(inputTime);
|
|
|
|
|
|
// var y = date.getFullYear();
|
|
|
|
|
|
// var m = date.getMonth() + 1;
|
|
|
|
|
|
// m = m < 10 ? ('0' + m) : m;
|
|
|
|
|
|
// var d = date.getDate();
|
|
|
|
|
|
// d = d < 10 ? ('0' + d) : d;
|
|
|
|
|
|
// var h = date.getHours();
|
|
|
|
|
|
// h = h < 10 ? ('0' + h) : h;
|
|
|
|
|
|
// var minute = date.getMinutes();
|
|
|
|
|
|
// var second = date.getSeconds();
|
|
|
|
|
|
// minute = minute < 10 ? ('0' + minute) : minute;
|
|
|
|
|
|
// second = second < 10 ? ('0' + second) : second;
|
|
|
|
|
|
// return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
|
|
|
|
|
|
// };
|
|
|
|
|
|
function formatDateTime(inputTime) {
|
|
|
|
|
|
var date = new Date(inputTime);
|
|
|
|
|
|
var y = date.getFullYear();
|
|
|
|
|
|
var m = date.getMonth() + 1;
|
|
|
|
|
|
m = m < 10 ? "0" + m : m;
|
|
|
|
|
|
var d = date.getDate();
|
|
|
|
|
|
d = d < 10 ? "0" + d : d;
|
|
|
|
|
|
return y + "-" + m + "-" + d;
|
|
|
|
|
|
}
|
|
|
|
|
|
getListData = () => {
|
|
|
|
|
|
console.log('-------------------------------');
|
|
|
|
|
|
axios.defaults.headers.common["Authorization"] =
|
|
|
|
|
|
"Bearer" + " " + token;
|
|
|
|
|
|
axios
|
|
|
|
|
|
.get(requestUrl + "xmgl/progressTask/getParentChildList", {
|
|
|
|
|
|
params: { projectSn: projectSn },
|
|
|
|
|
|
})
|
|
|
|
|
|
.then((res) => {
|
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
|
console.log("查询结果", res.data.result);
|
|
|
|
|
|
let dataArr = res.data.result;
|
|
|
|
|
|
let number = 0;
|
|
|
|
|
|
let type = false;
|
|
|
|
|
|
for (let i = 0; i < dataArr.length; i++) {
|
|
|
|
|
|
let data = {
|
|
|
|
|
|
id: dataArr[i].id,
|
|
|
|
|
|
// "UID": dataArr[i].id, //任务唯一标识符
|
|
|
|
|
|
taskName: dataArr[i].taskName, //任务名称
|
|
|
|
|
|
PercentComplete: dataArr[i].progressRatio, //完成百分比
|
|
|
|
|
|
duration: dataArr[i].duration, //工期
|
|
|
|
|
|
Start: dataArr[i].startDate, //计划开始日期
|
|
|
|
|
|
Finish: dataArr[i].finishDate, //计划完成日期
|
|
|
|
|
|
actualStartDate: dataArr[i].actualStartDate, //实际开始日期
|
|
|
|
|
|
actualFinishDate: dataArr[i].actualFinishDate, //实际完成日期
|
|
|
|
|
|
children: [], //子级
|
|
|
|
|
|
remark: dataArr[i].remark, //备注
|
|
|
|
|
|
// "PredecessorLink":dataArr[i].predecessorIds,
|
|
|
|
|
|
// PredecessorLink: [
|
|
|
|
|
|
// {
|
|
|
|
|
|
// Type: 1,
|
|
|
|
|
|
// PredecessorUID: number-1
|
|
|
|
|
|
// },
|
|
|
|
|
|
// ],
|
|
|
|
|
|
};
|
2022-11-07 13:41:54 +08:00
|
|
|
|
// console.log("参数传进去了吗", data.PredecessorLink);
|
2022-11-10 09:18:38 +08:00
|
|
|
|
if (dataArr[i].children.length > 0) {
|
|
|
|
|
|
let threeData = dataArr[i].children;
|
|
|
|
|
|
let threeNum = 0;
|
|
|
|
|
|
for (let j = 0; j < dataArr[i].children.length; j++) {
|
2022-11-07 13:41:54 +08:00
|
|
|
|
// console.log(
|
|
|
|
|
|
// "有关联的前置任务嘛",
|
|
|
|
|
|
// dataArr[i].children[j].predecessorIds
|
|
|
|
|
|
// );
|
2022-11-10 09:18:38 +08:00
|
|
|
|
number++;
|
|
|
|
|
|
let children = {
|
|
|
|
|
|
id: dataArr[i].children[j].id,
|
|
|
|
|
|
UID: number, //任务唯一标识符
|
|
|
|
|
|
taskName: dataArr[i].children[j].taskName, //任务名称
|
|
|
|
|
|
PercentComplete: dataArr[i].children[j].progressRatio, //完成百分比
|
|
|
|
|
|
duration: dataArr[i].children[j].duration, //工期
|
|
|
|
|
|
Start: dataArr[i].children[j].startDate, //计划开始日期
|
|
|
|
|
|
Finish: dataArr[i].children[j].finishDate, //计划完成日期
|
|
|
|
|
|
actualStartDate: dataArr[i].children[j].actualStartDate, //实际开始日期
|
|
|
|
|
|
actualFinishDate:
|
|
|
|
|
|
dataArr[i].children[j].actualFinishDate, //实际完成日期
|
|
|
|
|
|
children: [], //子级
|
|
|
|
|
|
remark: dataArr[i].children[j].remark, //备注
|
|
|
|
|
|
// "PredecessorLink":dataArr[i].children[j].predecessorIds,
|
|
|
|
|
|
// PredecessorLink: [
|
|
|
|
|
|
// //前置任务字段
|
|
|
|
|
|
// {
|
|
|
|
|
|
// Type: 1,
|
|
|
|
|
|
// PredecessorUID:number-1
|
|
|
|
|
|
// },
|
|
|
|
|
|
// ],
|
|
|
|
|
|
};
|
|
|
|
|
|
console.log(
|
|
|
|
|
|
"参数传进去了吗2222",
|
|
|
|
|
|
children.PredecessorLink
|
|
|
|
|
|
);
|
|
|
|
|
|
data.children.push(children);
|
|
|
|
|
|
if (threeData[j].children.length > 0) {
|
|
|
|
|
|
for (let k = 0; k < threeData[j].children.length; k++) {
|
|
|
|
|
|
number++;
|
|
|
|
|
|
console.log(
|
|
|
|
|
|
"threeData[j].children",
|
|
|
|
|
|
threeData[j].children[k]
|
|
|
|
|
|
);
|
|
|
|
|
|
let children2 = {
|
|
|
|
|
|
id: threeData[j].children[k].id,
|
|
|
|
|
|
UID: number,
|
|
|
|
|
|
taskName: threeData[j].children[k].taskName, //任务名称
|
|
|
|
|
|
PercentComplete:
|
|
|
|
|
|
threeData[j].children[k].progressRatio, //完成百分比
|
|
|
|
|
|
duration: threeData[j].children[k].duration, //工期
|
|
|
|
|
|
Start: threeData[j].children[k].startDate, //计划开始日期
|
|
|
|
|
|
Finish: threeData[j].children[k].finishDate, //计划完成日期
|
|
|
|
|
|
actualStartDate:
|
|
|
|
|
|
threeData[j].children[k].actualStartDate, //实际开始日期
|
|
|
|
|
|
actualFinishDate:
|
|
|
|
|
|
threeData[j].children[k].actualFinishDate, //实际完成日期
|
|
|
|
|
|
children: [], //子级
|
|
|
|
|
|
remark: threeData[j].children[k].remark, //备注
|
|
|
|
|
|
// "PredecessorLink":threeData[j].children[k].predecessorIds,
|
|
|
|
|
|
PredecessorLink: [
|
|
|
|
|
|
//前置任务字段
|
|
|
|
|
|
{
|
|
|
|
|
|
Type: 1,
|
|
|
|
|
|
PredecessorUID: number - 1
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
};
|
|
|
|
|
|
data.children[0].children.push(children2);
|
2022-11-05 16:45:14 +08:00
|
|
|
|
}
|
2022-06-08 14:51:11 +08:00
|
|
|
|
}
|
2022-11-05 16:45:14 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
2022-11-10 09:18:38 +08:00
|
|
|
|
console.log("此时递归后的data数据", data);
|
|
|
|
|
|
number++;
|
|
|
|
|
|
listData.push(data);
|
2022-11-05 16:45:14 +08:00
|
|
|
|
}
|
2022-11-10 09:18:38 +08:00
|
|
|
|
} else {
|
|
|
|
|
|
alert(res.data.message);
|
|
|
|
|
|
}
|
|
|
|
|
|
gantt.loadTasks(listData);
|
|
|
|
|
|
gantt.unmask();
|
|
|
|
|
|
});
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
getListData();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//创建ext面板
|
|
|
|
|
|
var viewport = new Ext.Viewport({
|
|
|
|
|
|
layout: "border",
|
|
|
|
|
|
items: [
|
|
|
|
|
|
new Ext.BoxComponent({
|
|
|
|
|
|
region: "north",
|
|
|
|
|
|
height: 0,
|
|
|
|
|
|
// autoEl: {
|
|
|
|
|
|
// tag: 'div',
|
|
|
|
|
|
// html: '<b style="padding:8px;">Ext甘特图集成示例</b>'
|
|
|
|
|
|
// }
|
|
|
|
|
|
}),
|
|
|
|
|
|
{
|
|
|
|
|
|
region: "west",
|
|
|
|
|
|
id: "west-panel",
|
|
|
|
|
|
title: "West",
|
|
|
|
|
|
split: false,
|
|
|
|
|
|
width: 0,
|
|
|
|
|
|
minSize: 175,
|
|
|
|
|
|
maxSize: 400,
|
|
|
|
|
|
collapsible: true,
|
|
|
|
|
|
margins: "0 0 0 0",
|
|
|
|
|
|
layout: {
|
|
|
|
|
|
type: "accordion",
|
|
|
|
|
|
animate: true,
|
2022-11-05 16:45:14 +08:00
|
|
|
|
},
|
2022-11-10 09:18:38 +08:00
|
|
|
|
items: [
|
|
|
|
|
|
{
|
|
|
|
|
|
title: "Navigation",
|
|
|
|
|
|
border: false,
|
|
|
|
|
|
iconCls: "nav",
|
2022-11-05 16:45:14 +08:00
|
|
|
|
},
|
2022-11-10 09:18:38 +08:00
|
|
|
|
{
|
|
|
|
|
|
title: "Settings",
|
|
|
|
|
|
html: "<p>Some settings in here.</p>",
|
|
|
|
|
|
border: false,
|
|
|
|
|
|
iconCls: "settings",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
2022-11-05 16:45:14 +08:00
|
|
|
|
},
|
2022-11-10 09:18:38 +08:00
|
|
|
|
new Ext.TabPanel({
|
|
|
|
|
|
region: "center", //部署的区域，参考上图，center是中间显示页面区域
|
|
|
|
|
|
autoScroll: true,
|
|
|
|
|
|
animScroll: true,
|
|
|
|
|
|
resizTabs: true,
|
|
|
|
|
|
enableTabScroll: true,
|
|
|
|
|
|
activeTab: 0,
|
|
|
|
|
|
deferredRender: false,
|
|
|
|
|
|
defaults: {
|
|
|
|
|
|
autoScroll: true,
|
|
|
|
|
|
},
|
|
|
|
|
|
tabMargin: 0,
|
|
|
|
|
|
items: [
|
|
|
|
|
|
new Ext.BoxComponent({
|
|
|
|
|
|
id: "extwrap",
|
|
|
|
|
|
title: "甘特图",
|
|
|
|
|
|
region: "center",
|
|
|
|
|
|
}),
|
|
|
|
|
|
],
|
|
|
|
|
|
}),
|
|
|
|
|
|
],
|
|
|
|
|
|
});
|
|
|
|
|
|
////////////////////////////////////////////
|
|
|
|
|
|
var extControl = Ext.get("extwrap");
|
2022-06-08 14:51:11 +08:00
|
|
|
|
|
2022-11-10 09:18:38 +08:00
|
|
|
|
// 移到最顶部 init
|
|
|
|
|
|
// //创建PlusGantt之后,
|
|
|
|
|
|
// var gantt = new CreateGantt();
|
|
|
|
|
|
gantt.setStyle("width:100%;height:100%");
|
|
|
|
|
|
gantt.render(extControl.dom);
|
2022-11-05 16:45:14 +08:00
|
|
|
|
|
2022-11-10 09:18:38 +08:00
|
|
|
|
// 左侧的列
|
|
|
|
|
|
var columns = [];
|
|
|
|
|
|
var idColumn = {
|
|
|
|
|
|
name: "id",
|
|
|
|
|
|
field: "id",
|
|
|
|
|
|
header: "ID<br/>String",
|
|
|
|
|
|
width: 50,
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "textbox",
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
columns.push(idColumn);
|
|
|
|
|
|
var stringColumn = {
|
|
|
|
|
|
name: "name",
|
|
|
|
|
|
header: "任务名称<br/>String",
|
|
|
|
|
|
field: "taskName",
|
|
|
|
|
|
width: 150,
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "textbox",
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
columns.push(stringColumn);
|
|
|
|
|
|
var linkColumn = {
|
|
|
|
|
|
name: "predecessorLink",
|
|
|
|
|
|
header: "前置任务<br/>Array",
|
|
|
|
|
|
field: "predecessorLink",
|
|
|
|
|
|
width: 150,
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "textbox",
|
|
|
|
|
|
},
|
|
|
|
|
|
// renderer: function (e) {
|
|
|
|
|
|
// console.log('前置任务',e)
|
|
|
|
|
|
// console.log('====e.value',e.value)
|
|
|
|
|
|
// if (!e.value) return "";
|
|
|
|
|
|
// },
|
|
|
|
|
|
};
|
|
|
|
|
|
columns.push(linkColumn);
|
|
|
|
|
|
var dateColumn1 = {
|
|
|
|
|
|
header: "计划开始日期<br/>Date",
|
|
|
|
|
|
field: "Start",
|
|
|
|
|
|
width: 100,
|
|
|
|
|
|
renderer: function (e) {
|
|
|
|
|
|
var date = e.value;
|
|
|
|
|
|
if (!date) return "";
|
|
|
|
|
|
return formatDateTime(e.value);
|
|
|
|
|
|
},
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "datepicker",
|
|
|
|
|
|
},
|
2022-11-05 16:45:14 +08:00
|
|
|
|
};
|
2022-11-10 09:18:38 +08:00
|
|
|
|
columns.push(dateColumn1);
|
|
|
|
|
|
var dateColumn2 = {
|
|
|
|
|
|
header: "计划完成日期<br/>Date",
|
|
|
|
|
|
field: "Finish",
|
|
|
|
|
|
width: 100,
|
|
|
|
|
|
renderer: function (e) {
|
|
|
|
|
|
var date = e.value;
|
|
|
|
|
|
if (!date) return "";
|
|
|
|
|
|
return formatDateTime(e.value);
|
|
|
|
|
|
},
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "datepicker",
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
columns.push(dateColumn2);
|
|
|
|
|
|
var dateColumn3 = {
|
|
|
|
|
|
header: "实际开始日期<br/>Date",
|
|
|
|
|
|
field: "actualStartDate",
|
|
|
|
|
|
width: 100,
|
|
|
|
|
|
renderer: function (e) {
|
|
|
|
|
|
var date = e.value;
|
|
|
|
|
|
if (!date) return "";
|
|
|
|
|
|
return formatDateTime(e.value);
|
|
|
|
|
|
},
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "datepicker",
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
columns.push(dateColumn3);
|
|
|
|
|
|
var dateColumn4 = {
|
|
|
|
|
|
header: "实际完成日期<br/>Date",
|
|
|
|
|
|
field: "actualFinishDate",
|
|
|
|
|
|
width: 100,
|
|
|
|
|
|
renderer: function (e) {
|
|
|
|
|
|
var date = e.value;
|
|
|
|
|
|
if (!date) return "";
|
|
|
|
|
|
return formatDateTime(e.value);
|
|
|
|
|
|
},
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "datepicker",
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
columns.push(dateColumn4);
|
|
|
|
|
|
var durationColumn = {
|
|
|
|
|
|
name: "duration",
|
|
|
|
|
|
header: "工期<br/>String",
|
|
|
|
|
|
field: "duration",
|
|
|
|
|
|
width: 60,
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "textbox",
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
columns.push(durationColumn);
|
|
|
|
|
|
var proColumn = {
|
|
|
|
|
|
name: "percentComplete",
|
|
|
|
|
|
header: "进度比例<br/>String",
|
|
|
|
|
|
field: "PercentComplete",
|
|
|
|
|
|
width: 60,
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "textbox",
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
columns.push(proColumn);
|
|
|
|
|
|
var remarkColumn = {
|
|
|
|
|
|
name: "remark",
|
|
|
|
|
|
header: "备注<br/>String",
|
|
|
|
|
|
field: "remark",
|
|
|
|
|
|
width: 150,
|
|
|
|
|
|
editor: {
|
|
|
|
|
|
type: "textbox",
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
columns.push(remarkColumn);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//将列集合数组设置给甘特图
|
|
|
|
|
|
gantt.setColumns(columns);
|
|
|
|
|
|
gantt.setTreeColumn("name");
|
|
|
|
|
|
|
|
|
|
|
|
//右键菜单
|
|
|
|
|
|
var ganttMenu = new GanttMenu();
|
|
|
|
|
|
gantt.setContextMenu(ganttMenu);
|
|
|
|
|
|
gantt.loading();
|
|
|
|
|
|
//渲染
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
|
var data = listData;
|
|
|
|
|
|
gantt.loadTasks(data);
|
|
|
|
|
|
gantt.unmask();
|
|
|
|
|
|
}, 3000);
|
|
|
|
|
|
|
|
|
|
|
|
|
2022-11-05 16:45:14 +08:00
|
|
|
|
function getParentUrl() {
|
|
|
|
|
|
var url = "";
|
|
|
|
|
|
try {
|
|
|
|
|
|
url = window.top.document.location.href;
|
|
|
|
|
|
} catch (M) {
|
|
|
|
|
|
if (window.parent) {
|
2022-11-05 13:35:16 +08:00
|
|
|
|
try {
|
2022-11-05 16:45:14 +08:00
|
|
|
|
url = window.parent.document.location.href;
|
|
|
|
|
|
} catch (L) {
|
|
|
|
|
|
url = "";
|
2022-11-05 13:35:16 +08:00
|
|
|
|
}
|
2022-11-05 16:45:14 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if (url === "") {
|
|
|
|
|
|
url = document.location.href;
|
|
|
|
|
|
}
|
|
|
|
|
|
return url;
|
|
|
|
|
|
}
|
2022-11-10 09:18:38 +08:00
|
|
|
|
|
|
|
|
|
|
// 编辑
|
|
|
|
|
|
var cellCommitEdit = (e) => {
|
|
|
|
|
|
console.log("当前点击行信息", e);
|
|
|
|
|
|
var data = {
|
|
|
|
|
|
taskName: e.task.taskName,
|
|
|
|
|
|
Start: e.task.Start,
|
|
|
|
|
|
Finish: e.task.Finish,
|
|
|
|
|
|
actualStartDate: e.task.actualStartDate,
|
|
|
|
|
|
actualFinishDate: e.task.actualFinishDate,
|
|
|
|
|
|
duration: e.task.duration,
|
|
|
|
|
|
progressRatio: e.task.progressRatio,
|
|
|
|
|
|
remark: e.task.remark,
|
|
|
|
|
|
id: e.task.id,
|
|
|
|
|
|
projectSn: projectSn,
|
|
|
|
|
|
};
|
|
|
|
|
|
data[e.field] = e.value;
|
|
|
|
|
|
let data2 = {};
|
|
|
|
|
|
for (let d in data) {
|
|
|
|
|
|
if (d == "Start" || d == "Finish" || d == "PercentComplete") {
|
|
|
|
|
|
if (d == "Start") {
|
|
|
|
|
|
data2.startDate = data[d];
|
|
|
|
|
|
} else if (d == "Finish") {
|
|
|
|
|
|
data2.finishDate = data[d];
|
|
|
|
|
|
} else if (d == "PercentComplete") {
|
|
|
|
|
|
data2.progressRatio = data[d];
|
|
|
|
|
|
}
|
|
|
|
|
|
} else {
|
|
|
|
|
|
data2[d] = data[d];
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// // 请求接口的参数
|
|
|
|
|
|
console.log("参数", data2);
|
|
|
|
|
|
if (e.task.hasOwnProperty("id")) {
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
|
axios
|
|
|
|
|
|
.post(
|
|
|
|
|
|
requestUrl + "xmgl/progressTask/updateProgressTask",
|
|
|
|
|
|
data2
|
|
|
|
|
|
)
|
|
|
|
|
|
.then((res) => {
|
|
|
|
|
|
console.log("修改返回", res);
|
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
|
alert("编辑成功！");
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
}, 500);
|
|
|
|
|
|
}
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
//右侧 拖拽
|
|
|
|
|
|
var itemdragcomplete = (e) => {
|
|
|
|
|
|
let requestData = {
|
|
|
|
|
|
id: e.item.id,
|
|
|
|
|
|
projectSn: projectSn,
|
|
|
|
|
|
taskName: e.item.taskName,
|
|
|
|
|
|
progressRatio: e.item.PercentComplete
|
|
|
|
|
|
};
|
|
|
|
|
|
let startTime = formatDateTime(e.item.Start).substring(0, 10);
|
|
|
|
|
|
let endTime = formatDateTime(e.item.Finish).substring(0, 10);
|
|
|
|
|
|
requestData.startDate = startTime;
|
|
|
|
|
|
requestData.finishDate = endTime;
|
|
|
|
|
|
axios
|
|
|
|
|
|
.post(requestUrl + "xmgl/progressTask/updateProgressTask", requestData)
|
|
|
|
|
|
.then((res) => {
|
|
|
|
|
|
// console.log('=======',res)
|
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
// var project = e.source;
|
|
|
|
|
|
// var task = e.task;
|
|
|
|
|
|
//e是事件对象, 具体请看每个事件的"参数类型"
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
gantt.on("CellCommitEdit", cellCommitEdit);
|
|
|
|
|
|
gantt.on("itemdragcomplete", itemdragcomplete);
|
|
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="x-layout-split x-layout-split-west x-splitbar-h" id="west-panel-xsplit"
|
|
|
|
|
|
style="left: 205px; top: 32px; height: 889px;">
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div id="ext-gen9" class="x-unselectable x-splitbar-proxy x-splitbar-proxy-h"></div>
|
|
|
|
|
|
<div class="mini-supergrid-editwrap"
|
|
|
|
|
|
style="position: absolute; z-index: 1006; display: none; top: 580px; left: 802px; width: 100px;"></div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="addDiv" id="addDiv">
|
|
|
|
|
|
<div class="addbox">
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<p>任务名称:</p><input id="taskName" type="input">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<p>工期:</p><input id="duration" type="input">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<p>前置任务:</p><input id="predecessorIds" type="input">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<p>进度比例:</p><input id="progressRatio" type="input">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<p>计划开始日期:</p><input id="startDate" type="text" placeholder="yyyy-MM-dd格式">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<p>计划完成日期:</p><input id="finishDate" type="text" placeholder="yyyy-MM-dd格式">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<p>实际开始时间:</p><input id="actualStartDate" type="text" placeholder="yyyy-MM-dd格式">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<p>实际完成时间:</p><input id="actualFinishDate" type="text" placeholder="yyyy-MM-dd格式">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<p>备注:</p><input id="remark" type="input">
|
|
|
|
|
|
</div>
|
2022-11-05 16:45:14 +08:00
|
|
|
|
</div>
|
2022-11-10 09:18:38 +08:00
|
|
|
|
<button id="cancel" class="btn cancel">取消</button>
|
|
|
|
|
|
<button id="submit" class="btn submit">确定</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
<style>
|
|
|
|
|
|
.addDiv {
|
|
|
|
|
|
display: none;
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 20%;
|
|
|
|
|
|
left: 30%;
|
|
|
|
|
|
z-index: 999;
|
|
|
|
|
|
width: 400px;
|
|
|
|
|
|
height: 400px;
|
|
|
|
|
|
border: 1px solid #000;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.addbox {
|
|
|
|
|
|
margin: 20px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.row {
|
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
p {
|
|
|
|
|
|
display: inline-block;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.btn {
|
|
|
|
|
|
width: 80px;
|
|
|
|
|
|
height: 30px;
|
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
|
margin-left: 80px;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|
|
|
</html>
|
