fix: add class in GanttGroup

worktile · Jan 4, 2021 · a32dd04 · a32dd04
1 parent cf0d647
commit a32dd04
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 17 deletions.
diff --git a/example/src/app/gantt/mocks.ts b/example/src/app/gantt/mocks.ts
@@ -1,7 +1,8 @@
 export const mockGroups = [
     {
         id: '00001',
-        title: 'Project 1'
+        title: 'Project 1',
+        class: 'test'
     },
     {
         id: '00002',

diff --git a/packages/gantt/src/class/group.ts b/packages/gantt/src/class/group.ts
@@ -5,6 +5,7 @@ export interface GanttGroup<T = unknown> {
     title: string;
     expanded?: boolean;
     origin?: T;
+    class?: string;
 }
 
 export class GanttGroupInternal {
@@ -17,13 +18,15 @@ export class GanttGroupInternal {
     refs?: {
         height?: number;
     } = {};
+    class?: string;
     constructor(group: GanttGroup) {
         this.id = group.id;
         this.origin = group;
         this.title = group.title;
         this.expanded = group.expanded === undefined ? true : group.expanded;
         this.items = [];
         this.mergedItems = [[]];
+        this.class = group.class || '';
     }
 
     setExpand(expanded: boolean) {

diff --git a/packages/gantt/src/components/main/gantt-main.component.html b/packages/gantt/src/components/main/gantt-main.component.html
@@ -1,12 +1,8 @@
-<gantt-links-overlay
-  [groups]="groups"
-  [items]="items"
-  (lineClick)="lineClick.emit($event)"
-></gantt-links-overlay>
+<gantt-links-overlay [groups]="groups" [items]="items" (lineClick)="lineClick.emit($event)"></gantt-links-overlay>
 <!-- groups -->
 <div class="gantt-main-groups" *ngIf="groups && groups.length > 0; else itemsTemplate" [style.width.px]="ganttUpper.view.width">
   <ng-container *ngFor="let group of groups; trackBy: trackBy">
-    <div class="gantt-group">
+    <div class="gantt-group" [ngClass]="group.class">
       <ng-template [ngTemplateOutlet]="groupHeaderTemplate" [ngTemplateOutletContext]="{ group: group }"></ng-template>
     </div>
     <div *ngIf="group.expanded" class="gantt-items">
@@ -28,12 +24,7 @@
         <ng-template [ngTemplateOutlet]="itemTemplate" [ngTemplateOutletContext]="{ item: item.origin, refs: item.refs }"></ng-template>
       </ng-container>
       <gantt-range *ngIf="item.type | isGanttRangeItem" [template]="rangeTemplate" [item]="item"></gantt-range>
-      <gantt-bar
-        *ngIf="item.type | isGanttBarItem"
-        [item]="item"
-        [template]="barTemplate"
-        (barClick)="barClick.emit($event)"
-      ></gantt-bar>
+      <gantt-bar *ngIf="item.type | isGanttBarItem" [item]="item" [template]="barTemplate" (barClick)="barClick.emit($event)"></gantt-bar>
     </div>
     <ng-template
       *ngIf="item.children && item.expanded"

diff --git a/packages/gantt/src/components/table/gantt-table.component.html b/packages/gantt/src/components/table/gantt-table.component.html
@@ -19,7 +19,7 @@
 <div class="gantt-table-body">
   <ng-container *ngIf="groups && groups.length > 0; else itemsTemplate">
     <ng-container *ngFor="let group of groups">
-      <div class="gantt-table-group">
+      <div class="gantt-table-group" [ngClass]="group.class">
         <div class="gantt-table-group-title" [class.expanded]="group.expanded" (click)="expandGroup(group)">
           <gantt-icon class="expand-icon" [iconName]="group.expanded ? 'angle-down' : 'angle-right'"></gantt-icon>
           <ng-container *ngIf="groupTemplate; else default">

diff --git a/packages/gantt/src/flat/gantt-flat.component.html b/packages/gantt/src/flat/gantt-flat.component.html
@@ -1,8 +1,6 @@
 <ngx-gantt-root [sideWidth]="300">
   <ng-template #sideTemplate>
-    <div class="gantt-flat-side-header">
-      项目
-    </div>
+    <div class="gantt-flat-side-header">项目</div>
     <div class="gantt-flat-side-body">
       <div class="gantt-group" *ngFor="let group of groups; trackBy: trackBy">
         <div class="gantt-group-title" [class.expanded]="group.expanded" (click)="group.expanded = !group.expanded">