gantt: fixed minstart date max endDate to grid on all days

This commit is contained in:
STEINNI
2026-09-01 15:51:15 +00:00
parent 4625067352
commit d027002cb9
2 changed files with 11 additions and 8 deletions
+10 -7
View File
@@ -134,18 +134,21 @@ class BZgantt extends Buildoz {
} }
buildFlow(){ buildFlow(){
const firstDate = new Date(this.tasks[0].start) let firstDate = new Date(this.tasks[0].start)
let lastDate = new Date(this.tasks[0].end)
for(const task of this.tasks){ for(const task of this.tasks){
const startDate = new Date(task.start) const startDate = new Date(task.start)
const endDate = new Date(task.end)
if(startDate < firstDate) firstDate = startDate if(startDate < firstDate) firstDate = startDate
if(endDate > lastDate) lastDate = endDate
} }
const flow = { "nodes": [], "links": [] } const flow = { "nodes": [], "links": [] }
let curY = 0 let curY = 0
let endIdx = 0 const endIdx = this.getDayIndex(firstDate, lastDate)
for(const task of this.tasks){ for(const task of this.tasks){
const startIdx = this.getDayIndex(firstDate, new Date(task.start)) const startIdx = this.getDayIndex(firstDate, new Date(task.start))
endIdx = this.getDayIndex(firstDate, new Date(task.end)) const taskEndIdx = this.getDayIndex(firstDate, new Date(task.end))
flow.nodes.push({ flow.nodes.push({
"nodeType": "bar", "nodeType": "bar",
"id": task.id, "id": task.id,
@@ -156,7 +159,7 @@ class BZgantt extends Buildoz {
"markup": { "markup": {
"task": task.name, "task": task.name,
"color": task.color || '#CCC', "color": task.color || '#CCC',
"width": (startIdx<endIdx) ? (endIdx-startIdx) * this.dayWidth : this.dayWidth, "width": (startIdx<taskEndIdx) ? (taskEndIdx-startIdx) * this.dayWidth : this.dayWidth,
} }
}) })
for(const dep of task.dependsOn ?? []){ for(const dep of task.dependsOn ?? []){
@@ -164,7 +167,7 @@ class BZgantt extends Buildoz {
} }
curY += this.rowHeight curY += this.rowHeight
} }
return([flow, endIdx]) return([flow, firstDate, endIdx])
} }
refresh(){ refresh(){
@@ -188,9 +191,9 @@ class BZgantt extends Buildoz {
} }
this.style.setProperty('--tasks-width', Math.ceil(maxWidth) + 'px') this.style.setProperty('--tasks-width', Math.ceil(maxWidth) + 'px')
const [flow, endIdx] = this.buildFlow() const [flow, firstDate, endIdx] = this.buildFlow()
let dayDate = new Date(this.tasks[0].start) let dayDate = new Date(firstDate)
for(let idx=0; idx<=endIdx; idx++){ for(let idx=0; idx<=endIdx; idx++){
const dayDiv = document.createElement('div') const dayDiv = document.createElement('div')
dayDiv.classList.add('day') dayDiv.classList.add('day')
+1 -1
View File
@@ -38,7 +38,7 @@
{ "id": "t7", "name": "Task 7", "start": "2026-08-29", "end":"2026-09-01", "color": "#88F", "dependsOn": ["t1"] }, { "id": "t7", "name": "Task 7", "start": "2026-08-29", "end":"2026-09-01", "color": "#88F", "dependsOn": ["t1"] },
{ "id": "t8", "name": "Task 8 which is quite long", "start": "2026-09-01", "end":"2026-09-08", "color": "#8F8", "dependsOn": ["t6"] }, { "id": "t8", "name": "Task 8 which is quite long", "start": "2026-09-01", "end":"2026-09-08", "color": "#8F8", "dependsOn": ["t6"] },
{ "id": "t9", "name": "Task 9", "start": "2026-09-08", "end":"2026-09-11", "color": "#F8F", "dependsOn": ["t8"] }, { "id": "t9", "name": "Task 9", "start": "2026-09-08", "end":"2026-09-11", "color": "#F8F", "dependsOn": ["t8"] },
], "color": "#8F8" ]
} }
window.addEventListener('load',()=>{ window.addEventListener('load',()=>{