From e018d4f96172334a0cd2f41c977b5aa6991edeb0 Mon Sep 17 00:00:00 2001 From: Yubing325 <35515298+Yubing325@users.noreply.github.com> Date: Tue, 23 Jun 2020 15:14:07 -0500 Subject: [PATCH] sorting & filtering 1st version done --- .../number-filter.component.html | 58 +++++++++++++++++- .../number-filter/number-filter.component.ts | 30 ++++++++-- .../text-filter/text-filter.component.html | 27 ++++++--- .../text-filter/text-filter.component.ts | 53 ++++++++++------ .../lib/grid-sorting/grid-sorting.module.ts | 14 +++++ .../grid-sorting/grid-sorting.component.html | 4 ++ .../grid-sorting/grid-sorting.component.scss | 16 +++++ .../grid-sorting/grid-sorting.component.ts | 60 +++++++++++++++++++ .../ngx-bootstrap/src/public-api.ts | 4 +- .../src/lib/data-grid/data-grid.module.ts | 5 +- .../data-grid/data-grid.component.html | 29 ++++++--- .../data-grid/data-grid.component.scss | 8 +++ .../data-grid/data-grid.component.ts | 31 +++++++++- .../data-grid-col-sort.directive.ts | 10 ++++ .../directives/data-grid-col.directive.ts | 7 ++- .../poweredsoft/ngx-cdk-ui/src/public-api.ts | 3 +- src/app/app-routing.module.ts | 2 +- .../grid-filter-demo-routing.module.ts | 0 .../grid-filter-demo.module.ts | 5 +- .../grid-filter-demo.component.html | 12 +++- .../grid-filter-demo.component.scss | 0 .../grid-filter-demo.component.ts | 8 +-- 22 files changed, 327 insertions(+), 59 deletions(-) create mode 100644 projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting.module.ts create mode 100644 projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.html create mode 100644 projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.scss create mode 100644 projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.ts create mode 100644 projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-col-sort.directive.ts rename src/app/{grid-filter-demo => grid-filter&sorting-demo}/grid-filter-demo-routing.module.ts (100%) rename src/app/{grid-filter-demo => grid-filter&sorting-demo}/grid-filter-demo.module.ts (84%) rename src/app/{grid-filter-demo => grid-filter&sorting-demo}/grid-filter-demo/grid-filter-demo.component.html (78%) rename src/app/{grid-filter-demo => grid-filter&sorting-demo}/grid-filter-demo/grid-filter-demo.component.scss (100%) rename src/app/{grid-filter-demo => grid-filter&sorting-demo}/grid-filter-demo/grid-filter-demo.component.ts (82%) diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.html b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.html index 0b4e9b1..20d809a 100644 --- a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.html +++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.html @@ -1 +1,57 @@ -

number-filter works!

+ + + + + + + + +{{columnName}} \ No newline at end of file diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.ts b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.ts index 003cc8f..1e46f80 100644 --- a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.ts +++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.ts @@ -1,4 +1,6 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; +import { IDataSource,IFilter } from '@poweredsoft/data'; +import { ISimpleFilter } from '../../models/IFilter'; @Component({ selector: 'psbx-number-filter', @@ -6,10 +8,30 @@ import { Component, OnInit } from '@angular/core'; styleUrls: ['./number-filter.component.scss'] }) export class NumberFilterComponent implements OnInit { + @Input() dataSource : IDataSource; + @Output() onFilter: EventEmitter = new EventEmitter(); + @Input() columnName:string; + + filterType: string = 'Contains'; + filterValue: string = null; - constructor() { } - - ngOnInit(): void { + get filterTypes(){ + return ["contains","equals","startsWith","GreaterThan","LessThan"] } + constructor() { } + + + ngOnInit(): void { + + } + + applyFilter(){ + this.onFilter.emit({ + path: this.columnName, + value: this.filterValue, + type: this.filterType, + and: true + }); + } } diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.html b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.html index 1a3b870..db9be7e 100644 --- a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.html +++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.html @@ -1,15 +1,24 @@ - - - +
+ +
+ +
+ - +
+ + + + - - + \ No newline at end of file diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.ts b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.ts index 643eb8f..11c8fd8 100644 --- a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.ts +++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.ts @@ -1,7 +1,6 @@ -import { Component, OnInit, Input, OnDestroy, Output,EventEmitter } from '@angular/core'; -import { IDataSource, IQueryExecutionResult, IQueryExecutionGroupResult } from '@poweredsoft/data'; -import { Subscription } from 'rxjs'; -import { IFilter, ISimpleFilter } from '../../models/IFilter'; +import { Component, OnInit, Input } from '@angular/core'; +import { IDataSource} from '@poweredsoft/data'; +import { ISimpleFilter } from '../../models/IFilter'; @Component({ @@ -12,18 +11,11 @@ import { IFilter, ISimpleFilter } from '../../models/IFilter'; export class TextFilterComponent implements OnInit { @Input() dataSource : IDataSource; - @Output() onFilter: EventEmitter = new EventEmitter(); - title = 'Welcome word'; - content = 'Vivamus sagittis lacus vel augue laoreet rutrum faucibus.'; - - private _searchTerm: string; + @Input() path:string; filterType: string = 'Contains'; filterValue: string = null; - - get filterTypes(){ - return ["contains","equals","startsWith"] - } + filterTypes = ['contains', 'equal', 'startsWith','endsWith']; constructor() { } @@ -32,12 +24,35 @@ export class TextFilterComponent implements OnInit { } + clearFilter() { + const existingFilter = this.dataSource.filters.find(t => (t as ISimpleFilter).path == this.path) as ISimpleFilter; + if (existingFilter) { + this.dataSource.query({ + page: 1, + filters: this.dataSource.filters.filter(t => t != existingFilter) + }) + } + } + applyFilter(){ - this.onFilter.emit({ - path: "name", - value: this.filterValue, - type: this.filterType, - and: true - }); + + const filters = this.dataSource.filters; + const existingFilter = filters.find(t => (t as ISimpleFilter).path == this.path) as ISimpleFilter; + if (existingFilter) { + existingFilter.type = this.filterType; + existingFilter.value = this.filterValue; + } else { + filters.push({ + and: true, + type: this.filterType, + path: this.path, + value: this.filterValue + }) + } + + this.dataSource.query({ + filters: filters, + page: 1 + }) } } diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting.module.ts b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting.module.ts new file mode 100644 index 0000000..91a05d8 --- /dev/null +++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting.module.ts @@ -0,0 +1,14 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { GridSortingComponent } from './grid-sorting/grid-sorting.component'; + + + +@NgModule({ + declarations: [GridSortingComponent], + imports: [ + CommonModule + ], + exports:[GridSortingComponent] +}) +export class GridSortingModule { } diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.html b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.html new file mode 100644 index 0000000..197c9a4 --- /dev/null +++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.html @@ -0,0 +1,4 @@ +
+ + +
\ No newline at end of file diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.scss b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.scss new file mode 100644 index 0000000..57d27df --- /dev/null +++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.scss @@ -0,0 +1,16 @@ +:host span.dropdown-toggle.sort-asc{ + transform: rotate(180deg); + display: inline-block; +} + +:host span{ + margin: 10px; +} + +:host .not-sorting-state{ + opacity: 0.3; +} + +:host .not-sorting-state:hover{ + opacity: 1; +} \ No newline at end of file diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.ts b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.ts new file mode 100644 index 0000000..bba0f38 --- /dev/null +++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.ts @@ -0,0 +1,60 @@ +import { Component, OnInit, Input } from '@angular/core'; +import { IDataSource } from '@poweredsoft/data'; + +@Component({ + selector: 'psbx-grid-sorting', + templateUrl: './grid-sorting.component.html', + styleUrls: ['./grid-sorting.component.scss'] +}) +export class GridSortingComponent implements OnInit { + + @Input() dataSource : IDataSource; + @Input() path:string; + isAscending:boolean; + isDescending:boolean; + constructor() { } + + ngOnInit(): void { + } + + ascending(){ + this.isAscending = true; + console.log("ascending result...") + const existingSort = this.dataSource.sorts.find(t => t.path == this.path); + if (existingSort){ + existingSort.ascending = true; + }else{ + this.dataSource.sorts.push({ + path: this.path, + ascending:true + }) + } + + this.dataSource.query({ + sorts: this.dataSource.sorts, + page: 1 + }) + this.isDescending = false; + } + + descending(){ + this.isDescending = true; + console.log("descending result...") + const existingSort = this.dataSource.sorts.find(t => t.path == this.path); + if (existingSort){ + existingSort.ascending = false; + }else{ + this.dataSource.sorts.push({ + path: this.path, + ascending:false + }) + } + + this.dataSource.query({ + sorts: this.dataSource.sorts, + page: 1 + }) + this.isAscending = false; + } + +} diff --git a/projects/poweredsoft/ngx-bootstrap/src/public-api.ts b/projects/poweredsoft/ngx-bootstrap/src/public-api.ts index ec44aff..3089598 100644 --- a/projects/poweredsoft/ngx-bootstrap/src/public-api.ts +++ b/projects/poweredsoft/ngx-bootstrap/src/public-api.ts @@ -16,4 +16,6 @@ export * from './lib/spinner/spinner/spinner.component'; export * from './lib/grid-filter/grid-filter.module'; export * from './lib/grid-filter/text-filter/text-filter.component'; export * from './lib/grid-filter/number-filter/number-filter.component'; -export * from './lib/grid-filter/datetime-filter/datetime-filter.component'; \ No newline at end of file +export * from './lib/grid-filter/datetime-filter/datetime-filter.component'; +export * from './lib/grid-sorting/grid-sorting.module'; +export * from './lib/grid-sorting/grid-sorting/grid-sorting.component'; \ No newline at end of file diff --git a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid.module.ts b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid.module.ts index fb03c9e..40e579a 100644 --- a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid.module.ts +++ b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid.module.ts @@ -8,6 +8,7 @@ import { DataGridFooterDirective } from './directives/data-grid-footer.directive import { DataGridHeaderDirective } from './directives/data-grid-header.directive'; import { DataGridLoaderDirective } from './directives/data-grid-loader.directive'; import { DataGridCellFilterDirective } from './directives/data-grid-cell-filter.directive'; +import { DataGridColSortDirective } from './directives/data-grid-col-sort.directive'; @@ -17,7 +18,7 @@ import { DataGridCellFilterDirective } from './directives/data-grid-cell-filter. declarations: [ DataGridComponent,DataGridColDirective,DataGridColHeaderDirective, DataGridCellDirective, DataGridFooterDirective, DataGridHeaderDirective, - DataGridLoaderDirective, DataGridCellFilterDirective, + DataGridLoaderDirective, DataGridCellFilterDirective, DataGridColSortDirective, ], imports: [ @@ -26,6 +27,6 @@ import { DataGridCellFilterDirective } from './directives/data-grid-cell-filter. exports: [ DataGridComponent,DataGridColDirective,DataGridColHeaderDirective, DataGridCellDirective,DataGridFooterDirective, DataGridHeaderDirective, - DataGridLoaderDirective,DataGridCellFilterDirective] + DataGridLoaderDirective,DataGridCellFilterDirective,DataGridColSortDirective] }) export class DataGridModule { } diff --git a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.html b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.html index 4dec174..977b8f0 100644 --- a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.html +++ b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.html @@ -9,14 +9,27 @@ - - - - - - +
+
+ + + +
+ +
+ + + +
+ +
+ + + +
+
diff --git a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.scss b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.scss index e69de29..e83d8bf 100644 --- a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.scss +++ b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.scss @@ -0,0 +1,8 @@ +:host .flex-container{ + display: flex; + justify-content: flex-start; +} + +:host .flex-item{ + margin-right: 1px; +} \ No newline at end of file diff --git a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.ts b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.ts index f8a492c..7d9124f 100644 --- a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.ts +++ b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/data-grid/data-grid.component.ts @@ -6,6 +6,7 @@ import { DataGridFooterDirective } from '../directives/data-grid-footer.directiv import { DataGridLoaderDirective } from '../directives/data-grid-loader.directive'; import { Subscription } from 'rxjs'; import { DataGridCellFilterDirective } from '../directives/data-grid-cell-filter.directive'; +import { DataGridColSortDirective } from '../directives/data-grid-col-sort.directive'; @Component({ selector: 'ps-data-grid', @@ -21,7 +22,6 @@ export class DataGridComponent implements OnInit, OnDestroy { @ContentChildren(DataGridHeaderDirective) gridHeaders: QueryList; @ContentChildren(DataGridFooterDirective) gridFooters: QueryList; @ContentChildren(DataGridLoaderDirective) loaders: QueryList; - @ContentChildren(DataGridCellFilterDirective) filters: QueryList; @Input() dataSource: IDataSource; @Input() tableClasses: any; @@ -32,6 +32,8 @@ export class DataGridComponent implements OnInit, OnDestroy { private _dataSubscription: Subscription; private _loadingSubscription: Subscription; + _fiters:any + @Input() set columns(value: string[]) { this._columns = value; this.columnsChange.emit(value); @@ -75,8 +77,24 @@ export class DataGridComponent implements OnInit, OnDestroy { } + getSortingTemplate(columnName){ + const ret = this.getColumn(columnName); + if (ret && ret.sortTemplate) + return ret.sortTemplate.template; + + return null; + } + + getFilterTemplate(columnName){ + const ret = this.getColumn(columnName); + if (ret && ret.filterTemplate) + return ret.filterTemplate.template; + + return null; + } + getColumn(columnName: string) { - + if (!this.columnDefinitions) return null; @@ -88,6 +106,7 @@ export class DataGridComponent implements OnInit, OnDestroy { return ret; } + getColumnHeaderTemplate(columnName: string) { const ret = this.getColumn(columnName); if (ret && ret.headerTemplate) @@ -112,5 +131,13 @@ export class DataGridComponent implements OnInit, OnDestroy { return this.getColumnCellTemplate(columnName) ? true :false; } + hasFilterTemplate(columnName: string) { + return this.getFilterTemplate(columnName) ? true :false; + } + + hasSortingTemplate(columnName: string) { + return this.getSortingTemplate(columnName) ? true :false; + } + } diff --git a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-col-sort.directive.ts b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-col-sort.directive.ts new file mode 100644 index 0000000..c3eac1b --- /dev/null +++ b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-col-sort.directive.ts @@ -0,0 +1,10 @@ +import { Directive, TemplateRef } from '@angular/core'; + +@Directive({ + selector: '[psDataGridColSort]' +}) +export class DataGridColSortDirective { + + constructor(public template: TemplateRef) { } + +} diff --git a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-col.directive.ts b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-col.directive.ts index 545a5fb..a7e15c8 100644 --- a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-col.directive.ts +++ b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-col.directive.ts @@ -1,6 +1,9 @@ -import { Directive, Input, ContentChild } from '@angular/core'; +import { Directive, Input, ContentChild, ContentChildren } from '@angular/core'; import { DataGridColHeaderDirective } from './data-grid-col-header.directive'; import { DataGridCellDirective } from './data-grid-cell.directive'; +import { DataGridCellFilterDirective } from './data-grid-cell-filter.directive'; +import { DataGridColSortDirective } from './data-grid-col-sort.directive'; + @Directive({ selector: '[psDataGridCol]' @@ -10,6 +13,8 @@ export class DataGridColDirective { @Input('psDataGridCol') columnName:string; @ContentChild(DataGridColHeaderDirective) headerTemplate:DataGridColHeaderDirective; @ContentChild(DataGridCellDirective) cellTemplate:DataGridCellDirective; + @ContentChild(DataGridCellFilterDirective) filterTemplate: DataGridCellFilterDirective; + @ContentChild(DataGridColSortDirective) sortTemplate: DataGridColSortDirective; constructor() { } diff --git a/projects/poweredsoft/ngx-cdk-ui/src/public-api.ts b/projects/poweredsoft/ngx-cdk-ui/src/public-api.ts index 8560298..1a748a8 100644 --- a/projects/poweredsoft/ngx-cdk-ui/src/public-api.ts +++ b/projects/poweredsoft/ngx-cdk-ui/src/public-api.ts @@ -10,4 +10,5 @@ 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-loader.directive'; -export * from './lib/data-grid/directives/data-grid-cell-filter.directive'; \ No newline at end of file +export * from './lib/data-grid/directives/data-grid-cell-filter.directive'; +export * from './lib/data-grid/directives/data-grid-col-sort.directive'; \ No newline at end of file diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 35a9564..5544c4f 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -30,7 +30,7 @@ const routes: Routes = [ }, { path: 'grid-filter', - loadChildren: ()=> import('./grid-filter-demo/grid-filter-demo.module').then(m => m.GridFilterDemoModule) + loadChildren: ()=> import('./grid-filter&sorting-demo/grid-filter-demo.module').then(m => m.GridFilterDemoModule) } ]; diff --git a/src/app/grid-filter-demo/grid-filter-demo-routing.module.ts b/src/app/grid-filter&sorting-demo/grid-filter-demo-routing.module.ts similarity index 100% rename from src/app/grid-filter-demo/grid-filter-demo-routing.module.ts rename to src/app/grid-filter&sorting-demo/grid-filter-demo-routing.module.ts diff --git a/src/app/grid-filter-demo/grid-filter-demo.module.ts b/src/app/grid-filter&sorting-demo/grid-filter-demo.module.ts similarity index 84% rename from src/app/grid-filter-demo/grid-filter-demo.module.ts rename to src/app/grid-filter&sorting-demo/grid-filter-demo.module.ts index 011dc30..e3b3dc5 100644 --- a/src/app/grid-filter-demo/grid-filter-demo.module.ts +++ b/src/app/grid-filter&sorting-demo/grid-filter-demo.module.ts @@ -3,7 +3,7 @@ import { CommonModule } from '@angular/common'; import { GridFilterDemoRoutingModule } from './grid-filter-demo-routing.module'; import { GridFilterDemoComponent } from './grid-filter-demo/grid-filter-demo.component'; -import { GridFilterModule, psbxPaginationModule, CommandModalModule, ConfirmModalModule, SpinnerModule } from '@poweredsoft/ngx-bootstrap'; +import { GridFilterModule, psbxPaginationModule, CommandModalModule, ConfirmModalModule, SpinnerModule, GridSortingModule } from '@poweredsoft/ngx-bootstrap'; import { DataGridModule } from '@poweredsoft/ngx-cdk-ui'; import { FormsModule } from '@angular/forms'; @@ -18,7 +18,8 @@ import { FormsModule } from '@angular/forms'; CommandModalModule, ConfirmModalModule, FormsModule, - SpinnerModule + SpinnerModule, + GridSortingModule ] }) export class GridFilterDemoModule { } diff --git a/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.html b/src/app/grid-filter&sorting-demo/grid-filter-demo/grid-filter-demo.component.html similarity index 78% rename from src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.html rename to src/app/grid-filter&sorting-demo/grid-filter-demo/grid-filter-demo.component.html index 5d9b044..e567004 100644 --- a/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.html +++ b/src/app/grid-filter&sorting-demo/grid-filter-demo/grid-filter-demo.component.html @@ -14,8 +14,11 @@
ID
+ +
{{model.id}}
- + + @@ -31,12 +34,16 @@
Name
-
{{model.name}}
+ + +
{{model.name}}
Address
{{model.address}}
+ + Actions @@ -54,6 +61,7 @@ +

Do you want to confirm?

diff --git a/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.scss b/src/app/grid-filter&sorting-demo/grid-filter-demo/grid-filter-demo.component.scss similarity index 100% rename from src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.scss rename to src/app/grid-filter&sorting-demo/grid-filter-demo/grid-filter-demo.component.scss diff --git a/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.ts b/src/app/grid-filter&sorting-demo/grid-filter-demo/grid-filter-demo.component.ts similarity index 82% rename from src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.ts rename to src/app/grid-filter&sorting-demo/grid-filter-demo/grid-filter-demo.component.ts index a232ed8..30b4e00 100644 --- a/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.ts +++ b/src/app/grid-filter&sorting-demo/grid-filter-demo/grid-filter-demo.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; -import { IDataSource } from '@poweredsoft/data'; +import { IDataSource, ISimpleFilter } from '@poweredsoft/data'; import { IMerchant } from 'src/app/data/services/IMerchant'; import { MerchantService } from 'src/app/data/services/merchant.service'; import { ConfirmModalService } from '@poweredsoft/ngx-bootstrap'; @@ -32,9 +32,5 @@ export class GridFilterDemoComponent implements OnInit { } - filterMerchants(event){ - this.somefilter = event; - this.merchantDataSource.filters[0]=this.somefilter; - this.merchantDataSource.refresh(); - } + }