diff --git a/angular.json b/angular.json
index c28fc2e..fad436f 100644
--- a/angular.json
+++ b/angular.json
@@ -28,6 +28,7 @@
"src/assets"
],
"styles": [
+ "node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/styles.scss"
],
"scripts": []
diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.html b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.html
new file mode 100644
index 0000000..0d17cb1
--- /dev/null
+++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.html
@@ -0,0 +1,24 @@
+
+
+
\ No newline at end of file
diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.scss b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.ts b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.ts
new file mode 100644
index 0000000..13ddad5
--- /dev/null
+++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.ts
@@ -0,0 +1,19 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'psbx-datetime-filter',
+ templateUrl: './datetime-filter.component.html',
+ styleUrls: ['./datetime-filter.component.scss']
+})
+export class DatetimeFilterComponent {
+
+ bsInlineValue = new Date();
+ bsInlineRangeValue: Date[];
+ maxDate = new Date();
+
+ constructor() {
+ this.maxDate.setDate(this.maxDate.getDate() + 7);
+ this.bsInlineRangeValue = [this.bsInlineValue, this.maxDate];
+ }
+
+}
diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/grid-filter.module.ts b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/grid-filter.module.ts
index da07370..2bb50c9 100644
--- a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/grid-filter.module.ts
+++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/grid-filter.module.ts
@@ -1,14 +1,23 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { TextFilterComponent } from './text-filter/text-filter.component';
+import { FormsModule } from '@angular/forms';
+import { NumberFilterComponent } from './number-filter/number-filter.component';
+import { DatetimeFilterComponent } from './datetime-filter/datetime-filter.component';
+import { BsDatepickerModule } from 'ngx-bootstrap/datepicker';
+
+
+
@NgModule({
- declarations: [TextFilterComponent],
+ declarations: [TextFilterComponent, NumberFilterComponent,DatetimeFilterComponent],
imports: [
- CommonModule
+ CommonModule,
+ FormsModule,
+ BsDatepickerModule.forRoot(),
],
- exports: [TextFilterComponent]
+ exports: [TextFilterComponent, NumberFilterComponent,DatetimeFilterComponent]
})
export class GridFilterModule { }
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
new file mode 100644
index 0000000..0b4e9b1
--- /dev/null
+++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.html
@@ -0,0 +1 @@
+number-filter works!
diff --git a/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.scss b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.scss
new file mode 100644
index 0000000..e69de29
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
new file mode 100644
index 0000000..003cc8f
--- /dev/null
+++ b/projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'psbx-number-filter',
+ templateUrl: './number-filter.component.html',
+ styleUrls: ['./number-filter.component.scss']
+})
+export class NumberFilterComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit(): void {
+ }
+
+}
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 edfdfde..8fd50e4 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 +1,6 @@
-text-filter works!
+
+
+
+
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 581c269..5db9f84 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,18 +1,46 @@
-import { Component, OnInit, Input } from '@angular/core';
-import { IDataSource } from '@poweredsoft/data';
+import { Component, OnInit, Input, OnDestroy, Output,EventEmitter } from '@angular/core';
+import { IDataSource, IQueryExecutionResult, IQueryExecutionGroupResult } from '@poweredsoft/data';
+import { Subscription } from 'rxjs';
+
@Component({
selector: 'psbx-ds-text-filter',
templateUrl: './text-filter.component.html',
styleUrls: ['./text-filter.component.scss']
})
-export class TextFilterComponent implements OnInit {
+export class TextFilterComponent implements OnInit, OnDestroy {
- @Input() dataSource : IDataSource;
+ @Input() dataSource : IDataSource;
+ @Output() filteredResults: EventEmitter = new EventEmitter();
+ latestResult: IQueryExecutionResult & IQueryExecutionGroupResult;
+
+ private _dataSubscription: Subscription;
+ private _searchTerm: string;
+
+
+ get searchTerm(): string {
+ return this._searchTerm;
+ }
+
+ set searchTerm(value: string) {
+ this._searchTerm = value;
+ //this.filteredResults.emit(this.dataFilter(value));
+ }
+
+ // dataFilter(searchString: string) {
+ // return this.latestResult.data.filter(x =>
+ // x.name.toLowerCase().indexOf(searchString.toLowerCase()) !== -1);
+ // }
constructor() { }
+ ngOnDestroy(): void {
+ this._dataSubscription.unsubscribe();
+ }
ngOnInit(): void {
+ this._dataSubscription = this.dataSource.data$.subscribe(newData => {
+ this.latestResult = newData;
+ });
}
}
diff --git a/projects/poweredsoft/ngx-bootstrap/src/public-api.ts b/projects/poweredsoft/ngx-bootstrap/src/public-api.ts
index 9f1849a..ec44aff 100644
--- a/projects/poweredsoft/ngx-bootstrap/src/public-api.ts
+++ b/projects/poweredsoft/ngx-bootstrap/src/public-api.ts
@@ -14,4 +14,6 @@ export * from './lib/confirm-modal/confirm-modal.directive';
export * from './lib/spinner/spinner.module';
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';
\ No newline at end of file
+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
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 f2fc2b8..fb03c9e 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
@@ -7,6 +7,7 @@ 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';
+import { DataGridCellFilterDirective } from './directives/data-grid-cell-filter.directive';
@@ -16,7 +17,7 @@ import { DataGridLoaderDirective } from './directives/data-grid-loader.directive
declarations: [
DataGridComponent,DataGridColDirective,DataGridColHeaderDirective,
DataGridCellDirective, DataGridFooterDirective, DataGridHeaderDirective,
- DataGridLoaderDirective,
+ DataGridLoaderDirective, DataGridCellFilterDirective,
],
imports: [
@@ -25,6 +26,6 @@ import { DataGridLoaderDirective } from './directives/data-grid-loader.directive
exports: [
DataGridComponent,DataGridColDirective,DataGridColHeaderDirective,
DataGridCellDirective,DataGridFooterDirective, DataGridHeaderDirective,
- DataGridLoaderDirective]
+ DataGridLoaderDirective,DataGridCellFilterDirective]
})
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 28017fa..3748a69 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
@@ -5,6 +5,9 @@
+
+
+
|
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 1022f05..f8a492c 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
@@ -5,6 +5,7 @@ import { DataGridHeaderDirective } from '../directives/data-grid-header.directiv
import { DataGridFooterDirective } from '../directives/data-grid-footer.directive';
import { DataGridLoaderDirective } from '../directives/data-grid-loader.directive';
import { Subscription } from 'rxjs';
+import { DataGridCellFilterDirective } from '../directives/data-grid-cell-filter.directive';
@Component({
selector: 'ps-data-grid',
@@ -20,9 +21,11 @@ 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;
+ @Input() headerClasses: any;
@Input() noRecordsText: string;
private _columns: string[];
@@ -69,8 +72,7 @@ export class DataGridComponent implements OnInit, OnDestroy {
this.loading = isLoading;
this.cdr.detectChanges();
});
-
- console.log(this.loaders);
+
}
getColumn(columnName: string) {
diff --git a/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-cell-filter.directive.ts b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-cell-filter.directive.ts
new file mode 100644
index 0000000..5b77b36
--- /dev/null
+++ b/projects/poweredsoft/ngx-cdk-ui/src/lib/data-grid/directives/data-grid-cell-filter.directive.ts
@@ -0,0 +1,10 @@
+import { Directive, TemplateRef } from '@angular/core';
+
+@Directive({
+ selector: '[psDataGridCellFilter]'
+})
+export class DataGridCellFilterDirective {
+
+ constructor(public template: TemplateRef) { }
+
+}
diff --git a/projects/poweredsoft/ngx-cdk-ui/src/public-api.ts b/projects/poweredsoft/ngx-cdk-ui/src/public-api.ts
index 6b98962..8560298 100644
--- a/projects/poweredsoft/ngx-cdk-ui/src/public-api.ts
+++ b/projects/poweredsoft/ngx-cdk-ui/src/public-api.ts
@@ -9,4 +9,5 @@ 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-loader.directive';
\ No newline at end of file
+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
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 07accdd..d4f35bf 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -10,6 +10,7 @@ import { HttpLink, HttpLinkModule } from 'apollo-angular-link-http';
import { DefaultOptions } from 'apollo-client';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { HttpClientModule } from '@angular/common/http';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
export function app_Init(apollo: Apollo, httpLink: HttpLink) {
return async () => {
@@ -56,7 +57,8 @@ export function app_Init(apollo: Apollo, httpLink: HttpLink) {
AppRoutingModule,
HttpClientModule,
ApolloModule,
- HttpLinkModule
+ HttpLinkModule,
+ BrowserAnimationsModule
],
providers: [
{
diff --git a/src/app/grid-filter-demo/grid-filter-demo.module.ts b/src/app/grid-filter-demo/grid-filter-demo.module.ts
index bb0c762..011dc30 100644
--- a/src/app/grid-filter-demo/grid-filter-demo.module.ts
+++ b/src/app/grid-filter-demo/grid-filter-demo.module.ts
@@ -3,14 +3,22 @@ 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 } from '@poweredsoft/ngx-bootstrap';
+import { GridFilterModule, psbxPaginationModule, CommandModalModule, ConfirmModalModule, SpinnerModule } from '@poweredsoft/ngx-bootstrap';
+import { DataGridModule } from '@poweredsoft/ngx-cdk-ui';
+import { FormsModule } from '@angular/forms';
@NgModule({
declarations: [GridFilterDemoComponent],
imports: [
CommonModule,
GridFilterDemoRoutingModule,
- GridFilterModule,
+ GridFilterModule,
+ psbxPaginationModule,
+ DataGridModule,
+ CommandModalModule,
+ ConfirmModalModule,
+ FormsModule,
+ SpinnerModule
]
})
export class GridFilterDemoModule { }
diff --git a/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.html b/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.html
index 9025aa2..7b0595a 100644
--- a/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.html
+++ b/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.html
@@ -1,2 +1,74 @@
-grid-filter-demo works!
-
\ No newline at end of file
+grid-filter-demo works!
+
+
+
+
+
+
+
+
+
+
+
+
+ ID
+ {{model.id}}
+
+
+
+
+
+
+ Name
+ {{model.name}}
+
+
+
+ Address
+ {{model.address}}
+
+
+ Actions
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Do you want to confirm?
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.ts b/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.ts
index 0fbec20..01fdc7c 100644
--- a/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.ts
+++ b/src/app/grid-filter-demo/grid-filter-demo/grid-filter-demo.component.ts
@@ -1,4 +1,8 @@
import { Component, OnInit } from '@angular/core';
+import { IDataSource } 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';
@Component({
selector: 'ps-grid-filter-demo',
@@ -7,9 +11,26 @@ import { Component, OnInit } from '@angular/core';
})
export class GridFilterDemoComponent implements OnInit {
- constructor() { }
-
- ngOnInit(): void {
+ columns = ['id','name', 'address','commands']
+ merchantDataSource: IDataSource;
+ constructor(private merchantService: MerchantService){
+ this.merchantDataSource = this.createDataSource();
+ console.log(this.merchantDataSource);
}
+ pages:any;
+ filteredResults:any;
+
+ createDataSource(): IDataSource {
+ return this.merchantService.createDataSource();
+
+ }
+
+ ngOnInit() {
+ this.merchantDataSource.refresh();
+ }
+
+ test(){
+ console.log(this.filteredResults);
+ }
}
diff --git a/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.html b/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.html
index fad970a..b7610a2 100644
--- a/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.html
+++ b/src/app/pagination-demo/pagination-demo/pagination/pagination-demo.component.html
@@ -63,7 +63,6 @@
-
{
- // if(result){
- // this.merchantDataSource.executeCommandByName('removeMerchant', {
- // id: id
- // }).subscribe(
- // res => {
- // this.merchantDataSource.refresh();
- // },
- // err => {
- // console.log(err);
- // alert('failed');
- // }
- // );
- // }
- // })
- // }
-
createDataSource(): IDataSource {
return this.merchantService.createDataSource();
diff --git a/src/styles.scss b/src/styles.scss
index 5a3eeda..9d53205 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -1,2 +1,3 @@
/* You can add global styles to this file, and also import other style files */
-@import '~bootstrap/scss/bootstrap';
\ No newline at end of file
+@import '~bootstrap/scss/bootstrap';
+@import '~ngx-bootstrap/datepicker/bs-datepicker.css';
\ No newline at end of file