Available only in PRO Edition

Gruppierung von Aufgaben

Dieses Feature ist ausschließlich in der PRO-Edition verfügbar.

Die Bibliothek enthält eine Gruppierungs-Erweiterung, mit der Sie Aufgaben basierend auf jedem Attribut der Aufgabe organisieren können.

Um mit dieser Erweiterung zu beginnen, stellen Sie sicher, dass Sie sie mit der Methode gantt.plugins aktivieren.

<!DOCTYPE html>
<html>
<head>
   <script src="codebase/dhtmlxgantt.js"></script>   
   <link href="codebase/dhtmlxgantt.css" rel="stylesheet">   
</head>
<body>
    gantt.plugins({
        grouping: true
    });
    //Ihr Code wird hier sein
</body>
</html>

Related sample: Tasks grouping

Gruppierung von Aufgaben

Um Aufgaben basierend auf einem bestimmten Kriterium zu gruppieren, verwenden Sie die Methode groupBy:

var data =  {
    tasks:[{id:1, priority:1, start_date:"02-04-2020 00:00", ...}, ...] 
};
 
gantt.groupBy({
    relation_property: "priority",
    groups: [{key:1, label: "High"},{key:2, label: "Normal"},{key:3, label: "Low"}],
    group_id: "key",
    group_text: "label"
});

Hier ist eine Aufschlüsselung der Parameter:

relation_property - (erforderlich) Dies ist das Attribut des Aufgabenobjekts, das als Grundlage für die Gruppierung dient. Zum Beispiel:

var data =  {
    tasks:[{id:1, priority:1, start_date:"02-04-2020 00:00", ...}, ...] };
gantt.groupBy({
    relation_property: "priority",     ...
});

Diese Eigenschaft kann auch verwendet werden, um eine mehrstufige Gruppierungsstruktur zu erstellen:

gantt.groupBy({
    relation_property: "priority",
    groups: [
        {key:0, label: "High"},
        {key:4, label: "Normal"},
        {key:5, label: "Low"},
        //mehrstufige Gruppen
        {key:1, label: "Give High Attention", "priority":0},
        {key:2, label: "Resolve Immediately", "priority":0},
        {key:3, label: "Keep For Next Release", "priority":5}
    ],
    group_id: "key",
    group_text: "label"
});

groups - (erforderlich) Ein Array von Gruppen (Zusammenfassungs-)Elementen.

gantt.groupBy({
    groups: [
        {key:1, label: "High"}, 
        {key:2, label: "Normal"},
        {key:3, label: "Low"}
    ],
    group_id: "key",
    group_text: "label"
});

Einige wichtige Hinweise:

1. Jedes Gruppenobjekt sollte mindestens zwei Eigenschaften haben (kann aber mehr enthalten): eine ID und ein Textlabel, die durch 'group_id' und 'group_text' definiert sind. Standardmäßig sind diese auf key und label gesetzt. Sie können diese Parameter anpassen (außer "id"), solange sie im Gruppenarray definiert sind.

Vermeiden Sie die Verwendung von "id" als Wert, da Gantt während der Gruppierung virtuelle Gruppenaufgaben erstellt und ihnen 'group_id' und 'group_text' zuweist. Gruppierte Aufgaben haben standardmäßig 'key' und 'value' Eigenschaften. Eine Änderung der Standardaufgaben-IDs kann die Baumstruktur stören.

2. Gruppenelemente werden als 'Projekt'-Typ-Elemente mit aktiviertem 'readonly'-Eigenschaft zum Datensatz hinzugefügt. Sie können durch die '$virtual'-Eigenschaft identifiziert und wie reguläre Datenelemente behandelt werden:

gantt.templates.task_class=function(start, end, task){
    if(task.$virtual)
    return "summary-bar";
};

3. Ursprüngliche 'Projekt'-Aufgaben werden im Gruppierungsmodus nicht angezeigt, sind aber weiterhin über die API zugänglich.

group_id - (optional) Die ID der Gruppe. Standardmäßig 'key'.
group_text - (optional) Das Label der Gruppe. Standardmäßig 'label'.
delimiter - (optional) Wird für die automatische Erstellung von Gruppen für Aufgaben mit mehreren Ressourcen verwendet. Standard ist ",".
default_group_label - (string) Das Label für die Standardgruppe. Optional. Standardmäßig 'None'.
save_tree_structure - (boolean) Bestimmt, ob die Gantt-Baumstruktur innerhalb von Gruppen beibehalten wird. Wenn nicht angegeben oder auf false gesetzt, werden Aufgaben in einer flachen Liste angezeigt.

Beachten Sie, dass die Standardgruppe Aufgaben enthält, die nicht in andere Gruppen passen. Sie schließt jedoch keine Aufgaben mit einer relation_property als string|number Wert ein.

Aufgaben entgruppieren

Um die Gruppierung zu entfernen, rufen Sie die Methode groupBy mit false als Argument auf:

Zurücksetzen der aktuellen Gruppierung

gantt.groupBy(false);

Verwendung von Sammlungen zur Spezifizierung von Gruppen

Wenn Gruppen über mehrere Elemente auf einer Seite hinweg verwendet werden, können Sie Wiederholungen vermeiden, indem Sie Gruppen als benannte Sammlung definieren.

gantt.serverList("priority", [
    {key:1, label: "High"},
    {key:2, label: "Normal"},
    {key:3, label: "Low"}
]);
gantt.groupBy({
    groups: gantt.serverList("priority"),
    relation_property: "priority",
    group_id: "key",
    group_text: "label"
});

Beibehaltung der ursprünglichen Aufgabenhierarchie in Gruppen

Standardmäßig wird die ursprüngliche Struktur des Gantt-Baums im Gruppenmodus ausgeblendet, und alle Aufgaben werden als erste Ebene der jeweiligen Gruppen behandelt.

Um die ursprüngliche Unteraufgabenstruktur innerhalb von Gruppen beizubehalten, aktivieren Sie die Einstellung save_tree_structure:

gantt.groupBy({
    groups: [
        { key: 1, label: "Ilona" },
        { key: 2, label: "John" },
        { key: 3, label: "Mike" }
    ],
    relation_property: "owner",
    group_id: "key",
    group_text: "label",
    default_group_label: "Not Assigned",
    save_tree_structure: true /* ! */
});

Zurück nach oben