Change demo
Added cleared state for project-planner and gantt-chart
This commit is contained in:
Ray
parent
2d7e645d94
commit
4fe9947552
272
demo.html
272
demo.html
@ -37,6 +37,16 @@ body {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
textarea {
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-color: #000000;
|
||||
min-height: calc(100vh - 600px);
|
||||
padding: 0px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@ -52,23 +62,74 @@ body {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="column left">
|
||||
<p>
|
||||
<textarea id="memoBox1" readonly></textarea>
|
||||
</p>
|
||||
</div>
|
||||
<div class="column right">
|
||||
<div style="margin-left: 10px;">
|
||||
|
||||
<p><b>Project (Engine)</b></p>
|
||||
<p>
|
||||
<button onclick="Clear()">Clear</button>
|
||||
<button onclick="LoadProject()">Load Project</button>
|
||||
<button onclick="LoadProjectRand()">Load Project (with random tasks)</button>
|
||||
</p>
|
||||
<p>
|
||||
<button onclick="GetTasks()">Get Tasks</button>
|
||||
<button onclick="GetRawTasks()">Get Raw Tasks</button>
|
||||
</p>
|
||||
|
||||
<p><b>Project Planner</b></p>
|
||||
<p>
|
||||
<button onclick="ClearPlanner()">Clear</button>
|
||||
<button onclick="LoadPlanner()">Load</button>
|
||||
</p>
|
||||
|
||||
<p><b>Gantt Chart</b></p>
|
||||
<p>
|
||||
<button onclick="ClearGantt()">Clear</button>
|
||||
<button onclick="InvalidateGantt()">Invalidate</button>
|
||||
<button onclick="ToggleDebugGantt()">Toggle Debug</button>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
Document.ready = async function(fn) {
|
||||
(async function() {
|
||||
(document.readyState !== 'loading') ?
|
||||
fn() : document.addEventListener('DOMContentLoaded',
|
||||
function() {
|
||||
fn();
|
||||
Document.ready(async function() {
|
||||
window.project1 = new LiteRyzJS.Project({ Name: "New Project 1" });
|
||||
window.projectPlanner1 = null;
|
||||
window.ganttChart1 = null;
|
||||
|
||||
LoadProject();
|
||||
|
||||
});
|
||||
})();
|
||||
|
||||
|
||||
function LogInfo(value)
|
||||
{
|
||||
document.getElementById("memoBox1").value += value + "\n\n";
|
||||
}
|
||||
|
||||
function Clear()
|
||||
{
|
||||
window.project1.Clear();
|
||||
window.ganttChart1.Invalidate();
|
||||
}
|
||||
|
||||
Document.ready(async function() {
|
||||
var project1 = new LiteRyzJS.Project({ Name: "New Project 1" });
|
||||
var taskGrid1 = null;
|
||||
var ganttChart1 = null;
|
||||
function LoadProject()
|
||||
{
|
||||
if (window.project1 == null) {
|
||||
window.project1 = new LiteRyzJS.Project({ Name: "New Project 1" });
|
||||
}
|
||||
|
||||
window.project1.Clear();
|
||||
|
||||
var tasks = [
|
||||
{"Order":1,"ID":1,"Name":"Task A","Description":"","Tag":null,"StartDate":"2024-08-11T23:00:00.000Z","FinishDate":"2024-08-14T23:00:00.000Z","StartDelay":0,"Duration":3,"PredecessorTaskID":null,"IsCollated":false,"CollatedTaskID":null,"CalcWorkHours":22.5,"ActuWorkHours":null,"Progress":0,"Resources":[],"Level":0,"PredecessorTaskNo":null},
|
||||
@ -79,126 +140,119 @@ body {
|
||||
{"Order":6,"ID":8,"Name":"Task E","Description":"","Tag":null,"StartDate":"2024-08-11T23:00:00.000Z","FinishDate":"2024-08-26T23:00:00.000Z","StartDelay":0,"Duration":15,"PredecessorTaskID":null,"IsCollated":true,"CollatedTaskID":null,"CalcWorkHours":112.5,"ActuWorkHours":null,"Progress":0,"Resources":[],"Level":0,"PredecessorTaskNo":null},
|
||||
{"Order":7,"ID":3,"Name":"Task C","Description":"","Tag":null,"StartDate":"2024-08-26T23:00:00.000Z","FinishDate":"2024-09-13T23:00:00.000Z","StartDelay":0,"Duration":18,"PredecessorTaskID":8,"IsCollated":false,"CollatedTaskID":null,"CalcWorkHours":135,"ActuWorkHours":null,"Progress":0,"Resources":[],"Level":0,"PredecessorTaskNo":6},
|
||||
{"Order":8,"ID":4,"Name":"Task D","Description":"","Tag":null,"StartDate":"2024-09-14T23:00:00.000Z","FinishDate":"2024-09-24T23:00:00.000Z","StartDelay":1,"Duration":10,"PredecessorTaskID":3,"IsCollated":false,"CollatedTaskID":null,"CalcWorkHours":0,"ActuWorkHours":null,"Progress":0,"Resources":[],"Level":0,"PredecessorTaskNo":7},
|
||||
{"Order":9,"ID":9,"Name":"Task E1","Description":"","Tag":null,"StartDate":"2024-08-14T23:00:00.000Z","FinishDate":"2024-08-26T23:00:00.000Z","StartDelay":3,"Duration":12,"PredecessorTaskID":null,"IsCollated":false,"CollatedTaskID":8,"CalcWorkHours":90,"ActuWorkHours":null,"Progress":0,"Resources":[],"Level":1,"PredecessorTaskNo":null}]
|
||||
;
|
||||
{"Order":9,"ID":9,"Name":"Task E1","Description":"","Tag":null,"StartDate":"2024-08-14T23:00:00.000Z","FinishDate":"2024-08-26T23:00:00.000Z","StartDelay":3,"Duration":12,"PredecessorTaskID":null,"IsCollated":false,"CollatedTaskID":8,"CalcWorkHours":90,"ActuWorkHours":null,"Progress":0,"Resources":[],"Level":1,"PredecessorTaskNo":null}
|
||||
];
|
||||
|
||||
tasks.forEach((e, i) => {
|
||||
project1.AddTask(e);
|
||||
window.project1.AddTask(e);
|
||||
});
|
||||
|
||||
// project1.AddTask({
|
||||
// ID: 1,
|
||||
// Name: "Task A",
|
||||
// StartDelay: 0,
|
||||
// Duration: Math.randomN(0, 28),
|
||||
// PredecessorTaskID: null,
|
||||
// IsCollated: false,
|
||||
// CollatedTaskID: null
|
||||
// });
|
||||
window.project1.Invalidate();
|
||||
|
||||
// project1.AddTask({
|
||||
// ID: 2,
|
||||
// Name: "Task B",
|
||||
// StartDelay: Math.randomN(0, 5),
|
||||
// Duration: Math.randomN(0, 28),
|
||||
// PredecessorTaskID: 1,
|
||||
// IsCollated: false,
|
||||
// CollatedTaskID: null
|
||||
// });
|
||||
LogInfo("New Project " + new Date(window.project1.StartDate).toLocaleDateString() + " - " + new Date(window.project1.FinishDate).toLocaleDateString() + " [" + window.project1.Duration + "]");
|
||||
|
||||
// project1.AddTask({
|
||||
// ID: 5,
|
||||
// Name: "Task B1",
|
||||
// StartDelay: Math.randomN(0, 5),
|
||||
// Duration: Math.randomN(0, 28),
|
||||
// PredecessorTaskID: 2,
|
||||
// IsCollated: true,
|
||||
// CollatedTaskID: null
|
||||
// });
|
||||
if (window.projectPlanner1 == null) {
|
||||
window.projectPlanner1 = new LiteRyzJS.ProjectPlanner(document.getElementById("projectPlanner1"));
|
||||
}
|
||||
|
||||
// project1.AddTask({
|
||||
// ID: 6,
|
||||
// Name: "Task B11",
|
||||
// StartDelay: Math.randomN(0, 5),
|
||||
// Duration: Math.randomN(0, 28),
|
||||
// PredecessorTaskID: null,
|
||||
// IsCollated: false,
|
||||
// CollatedTaskID: 5
|
||||
// });
|
||||
const taskData = window.project1.ExportTasks();
|
||||
// LogInfo(taskData);
|
||||
|
||||
// project1.AddTask({
|
||||
// ID: 7,
|
||||
// Name: "Task B12",
|
||||
// StartDelay: Math.randomN(0, 5),
|
||||
// Duration: Math.randomN(0, 28),
|
||||
// PredecessorTaskID: null,
|
||||
// IsCollated: false,
|
||||
// CollatedTaskID: 5,
|
||||
// Progress: 50
|
||||
// });
|
||||
window.projectPlanner1.Load(taskData);
|
||||
|
||||
// project1.AddTask({
|
||||
// ID: 8,
|
||||
// Name: "Task E",
|
||||
// StartDelay: Math.randomN(0, 5),
|
||||
// Duration: Math.randomN(0, 28),
|
||||
// PredecessorTaskID: null,
|
||||
// IsCollated: true,
|
||||
// CollatedTaskID: null
|
||||
// });
|
||||
if (window.ganttChart1 == null) {
|
||||
window.ganttChart1 = new LiteRyzJS.GanttChart(document.getElementById("ganttChart1"), { AutoSize: true });
|
||||
}
|
||||
|
||||
// project1.AddTask({
|
||||
// ID: 9,
|
||||
// Name: "Task E1",
|
||||
// StartDelay: Math.randomN(0, 5),
|
||||
// Duration: Math.randomN(0, 28),
|
||||
// PredecessorTaskID: null,
|
||||
// IsCollated: false,
|
||||
// CollatedTaskID: 8
|
||||
// });
|
||||
window.ganttChart1.Load(window.project1);
|
||||
}
|
||||
|
||||
// project1.AddTask({
|
||||
// ID: 3,
|
||||
// Name: "Task C",
|
||||
// StartDelay: Math.randomN(0, 5),
|
||||
// Duration: Math.randomN(0, 28),
|
||||
// PredecessorTaskID: 8,
|
||||
// IsCollated: false,
|
||||
// CollatedTaskID: null
|
||||
// });
|
||||
function LoadProjectRand()
|
||||
{
|
||||
if (window.project1 == null) {
|
||||
window.project1 = new LiteRyzJS.Project({ Name: "New Project 1" });
|
||||
}
|
||||
|
||||
// project1.AddTask({
|
||||
// ID: 4,
|
||||
// Name: "Task D",
|
||||
// StartDelay: Math.randomN(0, 5),
|
||||
// Duration: Math.randomN(0, 28),
|
||||
// PredecessorTaskID: 3,
|
||||
// IsCollated: false,
|
||||
// CollatedTaskID: null
|
||||
// });
|
||||
window.project1.Clear();
|
||||
|
||||
project1.Invalidate();
|
||||
console.log(new Date(project1.StartDate).toLocaleDateString() + " - " + new Date(project1.FinishDate).toLocaleDateString() + " [" + project1.Duration + "]");
|
||||
var tasks = [
|
||||
{"ID": 1, "Name": "task a","StartDelay": 0,"Duration": Math.randomN(0, 28),"PredecessorTaskID": null,"IsCollated": false,"CollatedTaskID": null},
|
||||
{"ID": 2,"Name": "task b","StartDelay": Math.randomN(0, 5),"Duration": Math.randomN(0, 28),"PredecessorTaskID": 1,"IsCollated": false,"CollatedTaskID": null},
|
||||
{"ID": 5,"Name": "task b1","StartDelay": Math.randomN(0, 5),"Duration": Math.randomN(0, 28),"PredecessorTaskID": 2,"IsCollated": true,"CollatedTaskID": null},
|
||||
{"ID": 6,"Name": "task b11","StartDelay": Math.randomN(0, 5),"Duration": Math.randomN(0, 28),"PredecessorTaskID": null,"IsCollated": false,"CollatedTaskID": 5},
|
||||
{"ID": 7,"Name": "task b12","StartDelay": Math.randomN(0, 5),"Duration": Math.randomN(0, 28),"PredecessorTaskID": null,"IsCollated": false,"CollatedTaskID": 5,progress: 50},
|
||||
{"ID": 8,"Name": "task e","StartDelay": Math.randomN(0, 5),"Duration": Math.randomN(0, 28),"PredecessorTaskID": null,"IsCollated": true,"CollatedTaskID": null},
|
||||
{"ID": 9,"Name": "task e1","StartDelay": Math.randomN(0, 5),"Duration": Math.randomN(0, 28),"PredecessorTaskID": null,"IsCollated": false,"CollatedTaskID": 8},
|
||||
{"ID": 3,"Name": "task c","StartDelay": Math.randomN(0, 5),"Duration": Math.randomN(0, 28),"PredecessorTaskID": 8,"IsCollated": false,"CollatedTaskID": null},
|
||||
{"ID": 4,"Name": "task d","StartDelay": Math.randomN(0, 5),"Duration": Math.randomN(0, 28),"PredecessorTaskID": 3,"IsCollated": false,"CollatedTaskID": null}
|
||||
];
|
||||
|
||||
tasks.forEach((e, i) => {
|
||||
window.project1.AddTask(e);
|
||||
});
|
||||
|
||||
window.project1.Invalidate();
|
||||
|
||||
LogInfo("New Project " + new Date(window.project1.StartDate).toLocaleDateString() + " - " + new Date(window.project1.FinishDate).toLocaleDateString() + " [" + window.project1.Duration + "]");
|
||||
|
||||
if (window.projectPlanner1 == null) {
|
||||
window.projectPlanner1 = new LiteRyzJS.ProjectPlanner(document.getElementById("projectPlanner1"));
|
||||
}
|
||||
|
||||
const taskData = window.project1.ExportTasks();
|
||||
|
||||
window.projectPlanner1.Load(taskData);
|
||||
|
||||
if (window.ganttChart1 == null) {
|
||||
window.ganttChart1 = new LiteRyzJS.GanttChart(document.getElementById("ganttChart1"), { AutoSize: true });
|
||||
}
|
||||
|
||||
window.ganttChart1.Load(window.project1);
|
||||
}
|
||||
|
||||
function GetTasks()
|
||||
{
|
||||
const taskData = window.project1.ExportTasks();
|
||||
|
||||
LogInfo(JSON.stringify(taskData));
|
||||
|
||||
const taskData = project1.ExportTasks();
|
||||
console.log(taskData);
|
||||
|
||||
if (taskGrid1 == null) {
|
||||
taskGrid1 = new LiteRyzJS.ProjectPlanner(document.getElementById("projectPlanner1"));
|
||||
}
|
||||
|
||||
taskGrid1.Load(taskData);
|
||||
function GetRawTasks()
|
||||
{
|
||||
LogInfo(JSON.stringify(window.project1.Tasks));
|
||||
|
||||
if (ganttChart1 == null) {
|
||||
ganttChart1 = new LiteRyzJS.GanttChart(document.getElementById("ganttChart1"), { AutoSize: true });
|
||||
console.log(window.project1.Tasks);
|
||||
}
|
||||
|
||||
ganttChart1.Load(project1);
|
||||
function InvalidateGantt()
|
||||
{
|
||||
window.ganttChart1.Invalidate();
|
||||
}
|
||||
|
||||
// console.log(JSON.stringify(taskData));
|
||||
// console.log(JSON.stringify(project1.Tasks));
|
||||
function ToggleDebugGantt()
|
||||
{
|
||||
window.ganttChart1.Debug = !window.ganttChart1.Debug;
|
||||
window.ganttChart1.Invalidate();
|
||||
}
|
||||
|
||||
function ClearGantt()
|
||||
{
|
||||
window.ganttChart1.Clear();
|
||||
}
|
||||
|
||||
});
|
||||
function ClearPlanner()
|
||||
{
|
||||
window.projectPlanner1.Clear();
|
||||
}
|
||||
|
||||
function LoadPlanner()
|
||||
{
|
||||
const taskData = window.project1.ExportTasks();
|
||||
|
||||
window.projectPlanner1.Load(taskData);
|
||||
}
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
||||
@ -11,9 +11,10 @@ class GanttChart {
|
||||
a.Options = Object.assign(a.DefaultOptions, options);
|
||||
|
||||
a.Debug = false;
|
||||
a.Project = null;
|
||||
|
||||
a.Tasks = [];
|
||||
a.StartDate = null;
|
||||
a.Duration = 30;
|
||||
a.StartOfWeek = 1;
|
||||
|
||||
a.#initialiseComponents();
|
||||
}
|
||||
@ -40,7 +41,7 @@ class GanttChart {
|
||||
return {
|
||||
DayWidth: 24,
|
||||
HeaderRow: {
|
||||
Height: [ 19, 20 ]
|
||||
Height: [ 20, 21 ]
|
||||
},
|
||||
Row: {
|
||||
Height: 28,
|
||||
@ -75,6 +76,7 @@ class GanttChart {
|
||||
BorderWidth: 1,
|
||||
BorderColour: "#B8B8B8",
|
||||
BorderDashPattern: [1, 1],
|
||||
MinimumRowCount: 6,
|
||||
ShowDateLines: true,
|
||||
ShowStartDayOfWeekLine: true,
|
||||
ShowRowLines: true,
|
||||
@ -109,28 +111,36 @@ class GanttChart {
|
||||
}
|
||||
|
||||
|
||||
Clear() {
|
||||
const a = this;
|
||||
|
||||
a.Canvas.Clear();
|
||||
|
||||
a.StartDate = new Date();
|
||||
a.Duration = 30;
|
||||
a.StartOfWeek = 1; // 1 = Monday
|
||||
a.Tasks = [];
|
||||
|
||||
a.Invalidate();
|
||||
}
|
||||
|
||||
Invalidate() {
|
||||
const a = this;
|
||||
|
||||
a.Canvas.Clear();
|
||||
|
||||
if (a.Project == null) {
|
||||
return;
|
||||
}
|
||||
|
||||
const tasks = a.Project.ExportTasks();
|
||||
const width = ((a.Project.Duration + 2) * a.Options.DayWidth);
|
||||
const height = (tasks.length * a.Options.Row.Height) + a.HeaderHeight;
|
||||
const width = ((a.Duration + 2) * a.Options.DayWidth);
|
||||
const height = (Math.max(a.Tasks.length, a.Options.MinimumRowCount) * a.Options.Row.Height) + a.HeaderHeight;
|
||||
|
||||
a.Canvas.Size = { W: width, H: height };
|
||||
|
||||
a.Canvas.Invalidate();
|
||||
|
||||
a.#drawChartHeader(a.Project.Duration);
|
||||
a.#drawColumnLayout(a.Project.Duration, a.Project.Project.StartOfWeek);
|
||||
a.#drawRowLayout(tasks);
|
||||
a.#drawTasks(tasks);
|
||||
a.#drawConnectorLines(tasks);
|
||||
a.#drawChartHeader();
|
||||
a.#drawColumnLayout();
|
||||
a.#drawRowLayout();
|
||||
a.#drawTasks();
|
||||
a.#drawConnectorLines();
|
||||
}
|
||||
|
||||
Load(project) {
|
||||
@ -142,16 +152,18 @@ class GanttChart {
|
||||
return;
|
||||
}
|
||||
|
||||
a.Project = project;
|
||||
a.StartDate = new Date(project.StartDate);
|
||||
a.Duration = project.Duration;
|
||||
a.StartOfWeek = project.Project.StartOfWeek;
|
||||
a.Tasks = project.ExportTasks();
|
||||
|
||||
a.Invalidate();
|
||||
}
|
||||
|
||||
#drawChartHeader(projectDuration) {
|
||||
#drawChartHeader() {
|
||||
const a = this;
|
||||
|
||||
const displayDays = projectDuration + 2;
|
||||
const displayDays = a.Duration + 2;
|
||||
|
||||
if (a.Debug) {
|
||||
a.Canvas.DrawRectangle(a.HeaderRow1Rectangle, "red", {});
|
||||
@ -205,11 +217,11 @@ class GanttChart {
|
||||
}
|
||||
}
|
||||
|
||||
#drawColumnLayout(projectDuration, startOfWeek) {
|
||||
#drawColumnLayout() {
|
||||
const a = this;
|
||||
|
||||
const height = a.Canvas.Height;
|
||||
const displayDays = projectDuration + 2;
|
||||
const displayDays = a.Duration + 2;
|
||||
|
||||
let startDate = new Date(a.StartDate);
|
||||
startDate.addDays(-1);
|
||||
@ -234,7 +246,7 @@ class GanttChart {
|
||||
}
|
||||
|
||||
// Draw vertical date lines
|
||||
if (startOfWeek == date.getDay()) {
|
||||
if (a.StartOfWeek == date.getDay()) {
|
||||
if (a.Options.ShowStartDayOfWeekLine) {
|
||||
a.Canvas.DrawVerticalLine(dateRectangle.X, a.HeaderHeight, dateRectangle.H, a.Options.BorderColour, {});
|
||||
}
|
||||
@ -247,10 +259,10 @@ class GanttChart {
|
||||
}
|
||||
}
|
||||
|
||||
#drawRowLayout(tasks) {
|
||||
#drawRowLayout() {
|
||||
const a = this;
|
||||
|
||||
for (let i=0; i<tasks.length; i++) {
|
||||
for (let i=0; i<a.Tasks.length; i++) {
|
||||
const rowRectangle = {
|
||||
X: 0,
|
||||
Y: (a.HeaderHeight + (a.Options.Row.Height * i)),
|
||||
@ -271,21 +283,21 @@ class GanttChart {
|
||||
}
|
||||
}
|
||||
|
||||
#drawTasks(tasks) {
|
||||
#drawTasks() {
|
||||
const a = this;
|
||||
|
||||
for (let i=0; i<tasks.length; i++) {
|
||||
for (let i=0; i<a.Tasks.length; i++) {
|
||||
let style = a.Options.Row.Task;
|
||||
|
||||
if (tasks[i].IsCollated == true) {
|
||||
if (a.Tasks[i].IsCollated == true) {
|
||||
style = a.Options.Row.CollatedTask;
|
||||
} else if (tasks[i].PredecessorTaskNo == null) {
|
||||
} else if (a.Tasks[i].PredecessorTaskNo == null) {
|
||||
style = a.Options.Row.OrphanTask;
|
||||
}
|
||||
|
||||
const rectangle = a.#getTaskRectangle(tasks[i], style);
|
||||
const rectangle = a.#getTaskRectangle(a.Tasks[i], style);
|
||||
|
||||
if (tasks[i].Duration <= 0) {
|
||||
if (a.Tasks[i].Duration <= 0) {
|
||||
a.Canvas.DrawDiamond(rectangle, style.BorderColour, { FillColour: style.FillColour });
|
||||
} else {
|
||||
a.Canvas.DrawRectangle(rectangle, style.BorderColour, { FillColour: style.FillColour });
|
||||
@ -293,24 +305,24 @@ class GanttChart {
|
||||
}
|
||||
}
|
||||
|
||||
#drawConnectorLines(tasks) {
|
||||
#drawConnectorLines() {
|
||||
const a = this;
|
||||
|
||||
for (let i=0; i<tasks.length; i++) {
|
||||
if (tasks[i].PredecessorTaskID == null) {
|
||||
for (let i=0; i<a.Tasks.length; i++) {
|
||||
if (a.Tasks[i].PredecessorTaskID == null) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if (tasks[i].PredecessorTaskNo == null) {
|
||||
if (a.Tasks[i].PredecessorTaskNo == null) {
|
||||
continue;
|
||||
}
|
||||
|
||||
const style = ((tasks[i].IsCollated == true) ? a.Options.Row.CollatedTask : a.Options.Row.Task);
|
||||
const rectangle = a.#getTaskRectangle(tasks[i], style);
|
||||
const style = ((a.Tasks[i].IsCollated == true) ? a.Options.Row.CollatedTask : a.Options.Row.Task);
|
||||
const rectangle = a.#getTaskRectangle(a.Tasks[i], style);
|
||||
const paddingX = (a.Options.Row.CollatedTask.Height + a.Options.BorderWidth);
|
||||
const offsetX = (rectangle.X + paddingX);
|
||||
|
||||
const predecessorTask = tasks.first("Order", tasks[i].PredecessorTaskNo);
|
||||
const predecessorTask = a.Tasks.first("Order", a.Tasks[i].PredecessorTaskNo);
|
||||
if (predecessorTask == null) {
|
||||
continue;
|
||||
}
|
||||
|
||||
@ -43,7 +43,13 @@ class ProjectPlanner {
|
||||
}
|
||||
|
||||
|
||||
Load(model) {
|
||||
Clear() {
|
||||
const a = this;
|
||||
|
||||
a.Load([]);
|
||||
}
|
||||
|
||||
Load(tasks) {
|
||||
const a = this;
|
||||
|
||||
if (!a.Container.classList.contains("literyzjs-project")) {
|
||||
@ -55,7 +61,7 @@ class ProjectPlanner {
|
||||
htmlContent += a.#renderTHead();
|
||||
htmlContent += "<tbody>";
|
||||
|
||||
model.forEach(e => {
|
||||
tasks.forEach(e => {
|
||||
htmlContent += a.#renderRow(e);
|
||||
});
|
||||
|
||||
@ -95,31 +101,31 @@ class ProjectPlanner {
|
||||
return htmlContent;
|
||||
}
|
||||
|
||||
#renderRow(e) {
|
||||
#renderRow(task) {
|
||||
const a = this;
|
||||
|
||||
let htmlContent = "";
|
||||
|
||||
if (e.IsCollated == true) {
|
||||
if (task.IsCollated == true) {
|
||||
htmlContent += "<tr class='b'>";
|
||||
} else {
|
||||
htmlContent += "<tr>";
|
||||
}
|
||||
|
||||
htmlContent += "<td class='c'>" + e.Order + "</td>";
|
||||
htmlContent += "<td class='c'>" + task.Order + "</td>";
|
||||
htmlContent += "<td></td>";
|
||||
htmlContent += "<td>";
|
||||
|
||||
for (let i=0; i<e.Level; i++) {
|
||||
for (let i=0; i<task.Level; i++) {
|
||||
htmlContent += "<span class='i'></span>";
|
||||
}
|
||||
|
||||
htmlContent += "<input type='text' value='" + e.Name + "'>";
|
||||
htmlContent += "<input type='text' value='" + task.Name + "'>";
|
||||
htmlContent += "</td>";
|
||||
htmlContent += "<td>" + e.Duration + " day" + (parseInt(e.Duration) == 1 ? "" : "s") + "</td>";
|
||||
htmlContent += "<td class='c'>" + new Date(e.StartDate).toLocaleDateString() + "</td>";
|
||||
htmlContent += "<td class='c'>" + new Date(e.FinishDate).toLocaleDateString() + "</td>";
|
||||
htmlContent += "<td class='c'>" + (e.PredecessorTaskNo ?? "") + "</td>";
|
||||
htmlContent += "<td>" + task.Duration + " day" + (parseInt(task.Duration) == 1 ? "" : "s") + "</td>";
|
||||
htmlContent += "<td class='c'>" + new Date(task.StartDate).toLocaleDateString() + "</td>";
|
||||
htmlContent += "<td class='c'>" + new Date(task.FinishDate).toLocaleDateString() + "</td>";
|
||||
htmlContent += "<td class='c'>" + (task.PredecessorTaskNo ?? "") + "</td>";
|
||||
htmlContent += "<td></td>";
|
||||
htmlContent += "<td></td>";
|
||||
htmlContent += "</tr>";
|
||||
|
||||
@ -6,6 +6,7 @@ class Project {
|
||||
const a = this;
|
||||
const _options = Object.assign(a.DefaultOptions, options);
|
||||
|
||||
a.Debug = false;
|
||||
a.Project = _options;
|
||||
a.Tasks = [];
|
||||
}
|
||||
@ -124,7 +125,7 @@ class Project {
|
||||
}
|
||||
}
|
||||
|
||||
ClearTasks() {
|
||||
Clear() {
|
||||
const a = this;
|
||||
|
||||
a.Tasks = [];
|
||||
@ -342,8 +343,12 @@ class Project {
|
||||
}
|
||||
|
||||
#log(message) {
|
||||
const a = this;
|
||||
|
||||
if (a.Debug) {
|
||||
console.log(message);
|
||||
}
|
||||
}
|
||||
|
||||
#recalculateWorkHours(array) {
|
||||
const a = this;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user