@worktile/gantt 15.1.2 → 15.2.0-next.0

package/gantt-dom.service.d.ts

@@ -23,6 +23,8 @@ export declare class GanttDomService implements OnDestroy {
     mainItems: Element;
     calendarOverlay: Element;
     linksOverlay: Element;
+    private mainFooter;
+    private mainScrollbar;
     private unsubscribe$;
     constructor(ngZone: NgZone, platformId: string);
     private monitorScrollChange;

package/gantt.component.d.ts

@@ -26,6 +26,7 @@ export declare class NgxGanttComponent extends GanttUpper implements OnInit, OnC
     columns: QueryList<NgxGanttTableColumnComponent>;
     tableEmptyTemplate: TemplateRef<any>;
     ganttRoot: NgxGanttRootComponent;
+    footerTemplate: TemplateRef<any>;
     virtualScroll: CdkVirtualScrollViewport;
     get loading(): boolean;
     flatItems: (GanttGroupInternal | GanttItemInternal)[];
@@ -50,5 +51,5 @@ export declare class NgxGanttComponent extends GanttUpper implements OnInit, OnC
     expandGroups(expanded: boolean): void;
     expandGroup(group: GanttGroupInternal): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgxGanttComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgxGanttComponent, "ngx-gantt", never, { "maxLevel": "maxLevel"; "async": "async"; "childrenResolve": "childrenResolve"; "linkable": "linkable"; "loading": "loading"; "virtualScrollEnabled": "virtualScrollEnabled"; "loadingDelay": "loadingDelay"; }, { "linkDragStarted": "linkDragStarted"; "linkDragEnded": "linkDragEnded"; "lineClick": "lineClick"; "selectedChange": "selectedChange"; }, ["table", "tableEmptyTemplate", "columns"], never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgxGanttComponent, "ngx-gantt", never, { "maxLevel": "maxLevel"; "async": "async"; "childrenResolve": "childrenResolve"; "linkable": "linkable"; "loading": "loading"; "virtualScrollEnabled": "virtualScrollEnabled"; "loadingDelay": "loadingDelay"; }, { "linkDragStarted": "linkDragStarted"; "linkDragEnded": "linkDragEnded"; "lineClick": "lineClick"; "selectedChange": "selectedChange"; }, ["table", "tableEmptyTemplate", "footerTemplate", "columns"], never, false, never>;
 }

package/gantt.component.scss

@@ -18,7 +18,6 @@
     border-right: 1px solid variables.$gantt-border-color;
     position: relative;
     z-index: 3;
-    // overflow-x: scroll;
     box-shadow: variables.$gantt-side-shadow;
 
     .gantt-side-header {
@@ -49,6 +48,25 @@
     background-color: variables.$gantt-container-background-color;
   }
 
+  .gantt-scrollbar {
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    z-index: 3;
+    display: flex;
+    .gantt-table-scrollbar {
+      &.with-scrollbar {
+        overflow-x: scroll;
+      }
+    }
+    .gantt-main-scrollbar {
+      flex: 1;
+      overflow-x: auto;
+      overflow-y: hidden;
+    }
+  }
+
   .gantt-main-container {
     width: 100%;
     height: calc(100% - #{variables.$gantt-header-height});
@@ -58,7 +76,6 @@
     bottom: 0;
     left: 0;
     right: 0;
-    // 兼容火狐浏览器
     overflow: auto;
     background-color: variables.$gantt-container-background-color;
 
@@ -97,8 +114,17 @@
     right: 0;
     bottom: 0;
     z-index: 2;
-    // 兼容火狐浏览器
     overflow: auto;
+
+    &.with-footer {
+      .gantt-table-body {
+        padding-bottom: variables.$gantt-footer-height;
+      }
+      .gantt-main-groups,
+      .gantt-main-items {
+        padding-bottom: variables.$gantt-footer-height;
+      }
+    }
     .cdk-virtual-scroll-content-wrapper {
       width: 100%;
       min-width: unset;
@@ -139,3 +165,29 @@
     background-color: #fafafa;
   }
 }
+
+.gantt-footer {
+  display: flex;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 2;
+  background-color: white;
+  border-top: 1px solid variables.$gantt-border-color;
+
+  .gantt-table-footer {
+    height: variables.$gantt-footer-height;
+    border-right: 1px solid variables.$gantt-border-color;
+    box-shadow: variables.$gantt-side-shadow;
+  }
+  .gantt-container-footer {
+    height: variables.$gantt-footer-height;
+    overflow-x: auto;
+    overflow-y: hidden;
+    flex: 1;
+    &::-webkit-scrollbar {
+      display: none;
+    }
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@worktile/gantt",
-  "version": "15.1.2",
+  "version": "15.2.0-next.0",
   "schematics": "./schematics/collection.json",
   "exports": {
     ".": {

package/styles/variables.scss

@@ -56,3 +56,6 @@ $gantt-toolbar-view-active-color: $gantt-primary-color !default;
 
 // loader
 $gantt-loader-loading-color: $gantt-primary-color !default;
+
+// footer
+$gantt-footer-height: 44px !default;

package/table/gantt-table.component.d.ts

@@ -10,6 +10,8 @@ export declare class NgxGanttTableComponent {
     columnChanges: EventEmitter<GanttTableEvent>;
     rowBeforeTemplate: TemplateRef<any>;
     rowAfterTemplate: TemplateRef<any>;
+    tableEmptyTemplate: TemplateRef<any>;
+    tableFooterTemplate: TemplateRef<any>;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgxGanttTableComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgxGanttTableComponent, "ngx-gantt-table", never, { "draggable": "draggable"; "dropEnterPredicate": "dropEnterPredicate"; }, { "dragDropped": "dragDropped"; "dragStarted": "dragStarted"; "dragEnded": "dragEnded"; "columnChanges": "columnChanges"; }, ["rowBeforeTemplate", "rowAfterTemplate"], never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgxGanttTableComponent, "ngx-gantt-table", never, { "draggable": "draggable"; "dropEnterPredicate": "dropEnterPredicate"; }, { "dragDropped": "dragDropped"; "dragStarted": "dragStarted"; "dragEnded": "dragEnded"; "columnChanges": "columnChanges"; }, ["rowBeforeTemplate", "rowAfterTemplate", "tableEmptyTemplate", "tableFooterTemplate"], never, false, never>;
 }