temp commit for spinner

2020-06-15 15:02:27 -05:00
parent 49a647c88e
commit 7ffcc93769
13 changed files with 96 additions and 30 deletions
@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { SpinnerComponent } from './spinner/spinner.component';
+
+
+
+@NgModule({
+  declarations: [SpinnerComponent],
+  imports: [
+    CommonModule
+  ],
+  exports:[SpinnerComponent]
+})
+export class SpinnerModule { }
@@ -0,0 +1,3 @@
+<div class="spinner-border" role="status">
+    <span class="sr-only">Loading...</span>
+</div>
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'psbx-spinner',
+  templateUrl: './spinner.component.html',
+  styleUrls: ['./spinner.component.scss']
+})
+export class SpinnerComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}
@@ -9,4 +9,6 @@ export * from './lib/form-group-command-modal/directives/form-group-command-moda
 export * from './lib/pagination/psbxPagination.module';
 export * from './lib/pagination/data-source-pagination/data-source-pagination.component';
 export * from './lib/confirm-modal/confirm-modal.module';
-export * from './lib/confirm-modal/confirm-modal.service';
+export * from './lib/confirm-modal/confirm-modal.service';
+export * from './lib/spinner/spinner.module';
+export * from './lib/spinner/spinner/spinner.component';
@@ -6,18 +6,19 @@ import { DataGridColHeaderDirective } from './directives/data-grid-col-header.di
 import { DataGridCellDirective } from './directives/data-grid-cell.directive';
 import { DataGridFooterDirective } from './directives/data-grid-footer.directive';
 import { DataGridHeaderDirective } from './directives/data-grid-header.directive';
+import { DataGridLoaderDirective } from './directives/data-grid-loader.directive';





@NgModule({
-  declarations: [DataGridComponent,DataGridColDirective,DataGridColHeaderDirective,DataGridCellDirective, DataGridFooterDirective, DataGridHeaderDirective,
+  declarations: [DataGridComponent,DataGridColDirective,DataGridColHeaderDirective,DataGridCellDirective, DataGridFooterDirective, DataGridHeaderDirective, DataGridLoaderDirective,
    
  ],
  imports: [
    CommonModule
  ],
-  exports: [DataGridComponent,DataGridColDirective,DataGridColHeaderDirective,DataGridCellDirective,DataGridFooterDirective, DataGridHeaderDirective]
+  exports: [DataGridComponent,DataGridColDirective,DataGridColHeaderDirective,DataGridCellDirective,DataGridFooterDirective, DataGridHeaderDirective,DataGridLoaderDirective]
 })
 export class DataGridModule { }
@@ -15,8 +15,12 @@
      </th>
    </tr>
  </thead>
-
-  <tbody *ngIf="latestResult">
+  <tbody *ngIf="loading">
+    <tr>
+      <td [attr.colspan]="columns.length"><ng-content select="psDataGridLoader"></ng-content></td>
+    </tr>
+  </tbody>
+  <tbody *ngIf="latestResult&&!loading">
    <tr *ngFor="let rowModel of latestResult.data; let i = index">
      <td *ngFor="let column of columns">
        <ng-container *ngIf="hasCellTemplate(column)">
@@ -21,7 +21,7 @@ export class DataGridComponent implements OnInit {
  @Input() dataSource: IDataSource<any>;
  @Input() tableClasses: any;
  private _columns: string[];
-  
+  loading:boolean;
  @Input() set columns(value: string[]) {
    this._columns = value;
    this.columnsChange.emit(value);
@@ -35,8 +35,10 @@ export class DataGridComponent implements OnInit {
  constructor() { }

  ngOnInit(): void {
+    this.loading = true;
    console.log(this.columnDefinitions);
    this.dataSource.data$.subscribe(newData => {
+      this.loading=false;
      this.latestResult = newData;
    });
  }
@@ -0,0 +1,10 @@
+import { Directive } from '@angular/core';
+
+@Directive({
+  selector: '[psDataGridLoader]'
+})
+export class DataGridLoaderDirective {
+
+  constructor() { }
+
+}
@@ -8,4 +8,5 @@ export * from './lib/data-grid/directives/data-grid-cell.directive';
 export * from './lib/data-grid/directives/data-grid-col.directive';
 export * from './lib/data-grid/directives/data-grid-col-header.directive';
 export * from './lib/data-grid/directives/data-grid-header.directive';
-export * from './lib/data-grid/directives/data-grid-footer.directive';
+export * from './lib/data-grid/directives/data-grid-footer.directive';
+export * from './lib/data-grid/directives/data-grid-loader.directive';