feat: Update Gantt chart integration with new task styles and data structure

This commit is contained in:
2025-04-12 10:13:02 +02:00
parent 9e3811cf7a
commit ebfc82095d
5 changed files with 144 additions and 128 deletions

View File

@@ -139,8 +139,8 @@
},
"class.Tasks.php": {
"type": "-",
"size": 17068,
"lmtime": 1744321917674,
"size": 18282,
"lmtime": 1744416198811,
"modified": false
},
"class.Users.php": {
@@ -293,6 +293,62 @@
"lmtime": 1744323096250,
"modified": false
}
},
"Simple-Gant-master": {
"frappe-gantt.css": {
"type": "-",
"size": 4631,
"lmtime": 1744416274241,
"modified": false
},
"frappe-gantt.js": {
"type": "-",
"size": 78780,
"lmtime": 1744416131313,
"modified": false
},
"frappe-gantt.js.map": {
"type": "-",
"size": 101071,
"lmtime": 0,
"modified": false
},
"frappe-gantt.min.js": {
"type": "-",
"size": 26394,
"lmtime": 0,
"modified": false
},
"frappe-gantt.min.js.map": {
"type": "-",
"size": 324375,
"lmtime": 0,
"modified": false
},
"index.html": {
"type": "-",
"size": 2027,
"lmtime": 0,
"modified": false
},
"LICENSE": {
"type": "-",
"size": 1128,
"lmtime": 0,
"modified": false
},
"names.txt": {
"type": "-",
"size": 341,
"lmtime": 0,
"modified": false
},
"README.md": {
"type": "-",
"size": 32,
"lmtime": 0,
"modified": false
}
}
},
"robots.txt": {
@@ -318,8 +374,8 @@
},
"main_view.php": {
"type": "-",
"size": 29690,
"lmtime": 1744323939813,
"size": 32482,
"lmtime": 1744416116971,
"modified": false
},
"task_edit.php": {

View File

@@ -36,6 +36,10 @@ class Tasks
// custom class
if ( $task['date_start'] <= date( 'Y-m-d H:i:s' ) )
$task_json['custom_class'] = 'gantt-task-backlog';
if ( $task['status'] == 6 )
$task_json['custom_class'] = 'gantt-task-faktura';
// progress
$task_json['progress'] = 0;

View File

@@ -228,6 +228,14 @@
fill: #640808;
}
.gantt .bar.gantt-task-faktura {
fill: #a1277d;
}
.gantt .bar-wrapper:hover .bar.gantt-task-faktura {
fill: #a1277d;
}
.gantt .bar-progress {
fill: #a71e1e;
}

View File

@@ -479,11 +479,11 @@ class Bar {
}
draw() {
this.draw_bar();
this.draw_triangle();
this.draw_progress_bar();
this.draw_label();
this.draw_resize_handles();
this.draw_bar();
this.draw_triangle();
this.draw_progress_bar();
this.draw_label();
this.draw_resize_handles();
// this.draw_circle();
}
@@ -653,26 +653,23 @@ class Bar {
}
setup_click_event() {
$.on(this.bar_group, 'focus ' + this.gantt.options.popup_trigger, e => {
if (this.action_completed || this.gantt.bar_being_dragged) {
// Jeżeli jest przeciąganie, nie reagujemy na kliknięcia
return;
}
$.on(this.bar_group, 'focus ' + this.gantt.options.popup_trigger, e => {
if (this.action_completed) {
// just finished a move action, wait for a few seconds
return;
}
if (e.type === 'click') {
this.gantt.trigger_event('click', [this.task]);
}
this.gantt.unselect_all();
this.group.classList.toggle('active');
this.show_popup();
});
if (e.type === 'click') {
this.gantt.trigger_event('click', [this.task]);
}
this.gantt.unselect_all();
this.group.classList.toggle('active');
this.show_popup();
});
}
triangle_event(){
if(!this.$triangle)
return;
@@ -1407,11 +1404,11 @@ class Gantt {
this.setup_options(options);
this.setup_tasks(tasks);
// initialize with default view mode
this.synchronizing_date(tasks);
this.setup_tasks(tasks);
this.our_menu();
this.change_view_mode();
this.bind_events();
this.synchronizing_date(tasks);
this.setup_tasks(tasks);
// this.our_menu();
this.change_view_mode();
this.bind_events();
}
synchronizing_date(tasks){
@@ -1870,32 +1867,27 @@ class Gantt {
this.bind_bar_events();
let y=0,x=0;
this.$container.addEventListener('contextmenu',ev=>{
ev.preventDefault();
if(!isOpen)
this.clear_menu();
if(this.tasks.length)
this.add_sub.classList.remove("disabled");
else
this.add_sub.classList.add("disabled");
this.contextmenu.style.display="block";
x=ev.offsetX;y=ev.offsetY;
this.contextmenu.style.top=ev.offsetY+'px';
this.contextmenu.style.left=ev.offsetX+'px';
});
this.$container.addEventListener('click',ev=>{
this.contextmenu.style.display="none";
});
/*this.$container.addEventListener('contextmenu',ev=>{
ev.preventDefault();
if(!isOpen)
this.clear_menu();
if(this.tasks.length)
this.add_sub.classList.remove("disabled");
else
this.add_sub.classList.add("disabled");
this.contextmenu.style.display="block";
x=ev.offsetX;y=ev.offsetY;
this.contextmenu.style.top=ev.offsetY+'px';
this.contextmenu.style.left=ev.offsetX+'px';
});
this.$container.addEventListener('click',ev=>{
this.contextmenu.style.display="none";
});
this.add_task.addEventListener('click',ev=>{
@@ -2023,7 +2015,7 @@ class Gantt {
}
});
});*/
}
update_sub_task(task){
@@ -2088,7 +2080,7 @@ class Gantt {
});
$.attr(this.$svg, {
height: grid_height + this.options.padding + 100,
height: grid_height + this.options.padding,
width: '100%'
});
}
@@ -2285,11 +2277,9 @@ class Gantt {
? date_utils.format(date, 'D MMM', this.options.language)
: '',
'Half Day_upper':
date.getDate() !== last_date.getDate()
? date.getMonth() !== last_date.getMonth()
? date_utils.format(date, 'D MMM', this.options.language)
: date_utils.format(date, 'D', this.options.language)
: '',
date.getDate() !== last_date.getDate()
? `${date_utils.format(date, 'D', this.options.language)}, ${['nd', 'pn', 'wt', 'śr', 'cz', 'pt', 'sb'][date.getDay()]}`
: '',
Day_upper:
date.getMonth() !== last_date.getMonth()
? date_utils.format(date, 'MMMM', this.options.language)
@@ -2441,43 +2431,41 @@ class Gantt {
}
$.on(this.$svg, 'mousedown', '.bar-wrapper, .handle', (e, element) => {
const bar_wrapper = $.closest('.bar-wrapper', element);
const bar_wrapper = $.closest('.bar-wrapper', element);
this.hide_popup();
if (element.classList.contains('left')) {
is_resizing_left = true;
} else if (element.classList.contains('right')) {
is_resizing_right = true;
} else if (element.classList.contains('bar-wrapper')) {
is_dragging = true;
}
this.hide_popup();
if (element.classList.contains('left')) {
is_resizing_left = true;
} else if (element.classList.contains('right')) {
is_resizing_right = true;
} else if (element.classList.contains('bar-wrapper')) {
is_dragging = true;
}
bar_wrapper.classList.add('active');
bar_wrapper.classList.add('active');
x_on_start = e.offsetX;
y_on_start = e.offsetY;
x_on_start = e.offsetX;
y_on_start = e.offsetY;
parent_bar_id = bar_wrapper.getAttribute('data-id');
parent_bar_id = bar_wrapper.getAttribute('data-id');
const ids = [
parent_bar_id,
...this.get_all_dependent_tasks(parent_bar_id)
];
const ids = [
parent_bar_id,
...this.get_all_dependent_tasks(parent_bar_id)
];
bars = ids.map(id => this.get_bar(id));
bars = ids.map(id => this.get_bar(id));
this.bar_being_dragged = parent_bar_id;
bars.forEach(bar => {
const $bar = bar.$bar;
$bar.ox = $bar.getX();
$bar.oy = $bar.getY();
$bar.owidth = $bar.getWidth();
$bar.finaldx = 0;
});
});
this.bar_being_dragged = parent_bar_id;
bars.forEach(bar => {
const $bar = bar.$bar;
$bar.ox = $bar.getX();
$bar.oy = $bar.getY();
$bar.owidth = $bar.getWidth();
$bar.finaldx = 0;
});
});
$.on(this.$svg, 'mousemove', e => {
if (!action_in_progress()) return;

View File

@@ -194,47 +194,7 @@
id: "Task 1",
progress: 55,
dependencies: 'Task 0'
},
{
start: '2018-10-04',
end: '2018-10-08',
name: 'Apply new styles',
id: "Task 2",
progress: 40,
dependencies: 'Task 1'
},
{
start: '2018-10-08',
end: '2018-10-09',
name: 'Review',
id: "Task 3",
progress: 20,
dependencies: 'Task 2'
},
{
start: '2018-10-08',
end: '2018-10-10',
name: 'Deploy',
id: "Task 4",
progress: 50,
dependencies: 'Task 2'
},
{
start: '2018-10-11',
end: '2018-10-11',
name: 'Go Live!',
id: "Task 5",
progress: 10,
dependencies: 'Task 4',
custom_class: 'bar-milestone'
},
// {
// start: '2014-01-05',
// end: '2019-10-12',
// name: 'Long term task',
// id: "Task 6",
// progress: 0
// }*/
},*/
]
var gantt_chart = new Gantt(".gantt-target", tasks, {
on_click: function (task) {