fixed dataTime range bug & clean code

This commit is contained in:
Yubing325 2020-07-10 15:46:12 -05:00
parent a0445f2474
commit bf6280aa1c
8 changed files with 55 additions and 64 deletions

12
package-lock.json generated
View File

@ -1676,9 +1676,9 @@
}
},
"@poweredsoft/data": {
"version": "0.0.26",
"resolved": "https://registry.npmjs.org/@poweredsoft/data/-/data-0.0.26.tgz",
"integrity": "sha512-JogKJQ01w4hTQr4EDSoYp2KfJzBbzC8trc7iHCxw7tjF6kB9nqWxu8gvRxX5pqzDK6ORz0Ieuw7i0hEZusW+ww==",
"version": "0.0.30",
"resolved": "https://registry.npmjs.org/@poweredsoft/data/-/data-0.0.30.tgz",
"integrity": "sha512-lKojW+yCKPSrdohqhuoEUTo196Z1cHs+SkOZ9N43N7MUcbIR0SA6Uz6k4QZtbmbXmR5AvDKPrDp37nqPXGZFYA==",
"requires": {
"tslib": "^1.9.0"
}
@ -1692,9 +1692,9 @@
}
},
"@poweredsoft/ngx-data-apollo": {
"version": "0.0.8",
"resolved": "https://registry.npmjs.org/@poweredsoft/ngx-data-apollo/-/ngx-data-apollo-0.0.8.tgz",
"integrity": "sha512-8nIlvHTnbLyG9aNxkSYOHIbNBBSjj92v0BeFTq4xkttp3UmYzhOO7lkgo1cEIDUuYo+ITAYoZbKwrd4CbnBgcA==",
"version": "0.0.10",
"resolved": "https://registry.npmjs.org/@poweredsoft/ngx-data-apollo/-/ngx-data-apollo-0.0.10.tgz",
"integrity": "sha512-0HjJthjXstNXS/T9u6t9VTWtQO/LUzGsbT/m0tjj8y0YuivMzfK76EyQldvjGXDYGfIL12kEhsKEbiOPXyCXcA==",
"requires": {
"tslib": "^1.9.0"
}

View File

@ -24,9 +24,9 @@
"@angular/platform-browser-dynamic": "~9.1.4",
"@angular/router": "~9.1.4",
"@ng-select/ng-select": "^4.0.1",
"@poweredsoft/data": "0.0.27",
"@poweredsoft/data": "0.0.30",
"@poweredsoft/ngx-data": "0.0.13",
"@poweredsoft/ngx-data-apollo": "0.0.8",
"@poweredsoft/ngx-data-apollo": "0.0.10",
"apollo-angular": "^1.8.0",
"apollo-angular-link-http": "^1.9.0",
"apollo-cache-inmemory": "^1.6.0",

View File

@ -49,6 +49,18 @@ export class NgSelectComponent implements OnInit,OnDestroy {
this.trackFn = this.trackBy.bind(this);
}
ngOnInit(): void {
this.dataFetching();
this.detectLoading();
if(this.serverFiltering){
this.searchOnServer();
}else{
this.refreshDataSource();
}
}
valueChanged(event) {
this.changeEvent.emit(event);
@ -76,16 +88,6 @@ export class NgSelectComponent implements OnInit,OnDestroy {
this._loadingSubscription.unsubscribe();
}
ngOnInit(): void {
this.dataFetching();
this.detectLoading();
if(this.serverFiltering){
this.searchOnServer();
}else{
this.refreshDataSource();
}
}
dataFetching(){
this.data$ = this.dataSource.data$.pipe(

View File

@ -1,6 +1,6 @@
{
"name": "@poweredsoft/ngx-bootstrap",
"version": "0.0.1",
"version": "0.0.2",
"peerDependencies": {
"@angular/common": "^9.1.9",
"@angular/core": "^9.1.9",

View File

@ -1,5 +1,5 @@
<ng-template #popTemplate>
<form (ngSubmit)="applyFilter(pop)" novalidate>
<form (ngSubmit)="applyFilter()" novalidate>
<div class="container" >
<div class="row">
<select class="custom-select" title="Choose one of the following..." [(ngModel)]="filterType" [ngModelOptions]="{standalone: true}">
@ -7,7 +7,7 @@
</select>
</div>
<div class="row mt-1 mb-1">
<input *ngIf="filterType !='Range'"
<input *ngIf="!isRangeFilter"
type="text"
placeholder="Datepicker"
class="form-control"
@ -15,7 +15,7 @@
</div>
<div class="row mt-1 mb-1">
<input *ngIf="filterType =='Range'" type="text"
<input *ngIf="isRangeFilter" type="text"
placeholder="Daterangepicker"
class="form-control"
bsDaterangepicker [(ngModel)]="filterValue" [ngModelOptions]="{standalone: true}">
@ -29,33 +29,7 @@
</div>
</form>
<!-- <div class="container" >
<div class="row">
<select class="custom-select" title="Choose one of the following..." >
<option *ngFor="let filter of filterTypes" [value]="filter.value">{{filter.key}}</option>
</select>
</div>
<div class="row mt-1 mb-1">
<input *ngIf="filterType !='Range'"
type="text"
placeholder="Datepicker"
class="form-control"
bsDatepicker [(ngModel)]="filterValue" >
</div>
<div class="row mt-1 mb-1">
<input *ngIf="filterType =='Range'" type="text"
placeholder="Daterangepicker"
class="form-control"
bsDaterangepicker [(ngModel)]="filterValue">
</div>
<div class="row mt-2">
<button class="btn btn-primary mr-1" type="submit" (click)="applyFilter()">Filter</button>
<button type="button" class="btn btn-warning" *ngIf="!isFiltering" (click)="pop.hide()">Hide</button>
<button type="button" class="btn btn-dark" *ngIf="isFiltering" (click)="clearFilter()">Clear</button>
</div>
</div> -->
</ng-template>
<button [popover]="popTemplate" class="btn btn-default" [(isOpen)]="filterPopUpOpened" [outsideClick]="true" #pop="bs-popover">

View File

@ -1,6 +1,7 @@
import { Component, OnInit, Input, Output, EventEmitter} from '@angular/core';
import { IDataSource, ISimpleFilter, ICompositeFilter, IFilter } from '@poweredsoft/data';
import { PopoverDirective } from 'ngx-bootstrap/popover';
import { IDataSource, ISimpleFilter, ICompositeFilter, IFilter,FilterType } from '@poweredsoft/data';
@Component({
selector: 'psbx-ds-datetime-filter',
@ -23,7 +24,7 @@ export class DataSourceDatetimeFilterComponent implements OnInit {
{key:'Less Than', value: 'LessThan'},
{key:'Greater Than Equal', value: 'GreaterThanOrEqual'},
{key:'Less Than Equal', value: 'LessThanOrEqual'},
{key:'Range', value: 'Range' }
{key:'Range', value: FilterType.COMPOSITE }
];
@ -35,6 +36,11 @@ export class DataSourceDatetimeFilterComponent implements OnInit {
this.maxDate.setDate(this.maxDate.getDate() + 7);
this.bsInlineRangeValue = [this.bsInlineValue, this.maxDate];
}
get isRangeFilter() {
return this.filterType == FilterType.COMPOSITE;
}
ngOnInit(): void {
if (!this.filterType)
this.filterType = 'Equal';
@ -43,17 +49,27 @@ export class DataSourceDatetimeFilterComponent implements OnInit {
return "Filter by "+ this.path;
}
clearFilter() {
this.filterValue = null;
this.isFiltering = false;
const existingFilter = this.dataSource.filters.find(t => (t as ISimpleFilter).path == this.path) as ISimpleFilter;
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)
})
}
if (this.isRangeFilter){
let existingFilter2 = this.dataSource.filters.find(t=> t.type == 'Composite');
this.dataSource.query({
page: 1,
filters: this.dataSource.filters.filter(t => t != existingFilter2)
})
}
}
applyFilter(pop: PopoverDirective = null){
applyFilter(){
this.isFiltering = true;
const filters = this.dataSource.filters;
@ -61,17 +77,18 @@ export class DataSourceDatetimeFilterComponent implements OnInit {
let freshFilter: ISimpleFilter = null;
let startDate:Date;
let endDate:Date;
debugger;
if(Array.isArray(this.filterValue)){
// TODO create filter here.
if(Array.isArray(this.filterValue)){ //check if it's a dateRange value
startDate = this.filterValue[0];
endDate = this.filterValue[1];
compositeF = {
type: 'Composite',
type: FilterType.COMPOSITE,
filters: [
{
path: this.path,
type: 'GREATERTHANOREQUAL',
value: startDate, // check if this string works
value: startDate,
},
{
and: true,
@ -89,19 +106,15 @@ debugger;
path: this.path,
value: this.filterValue
}
if (pop)
pop.hide();
}
// TODO???
// set this for gql better handling of variant.
//(freshFilter as IGraphQLFilter).__gqlVariantType = 'DATETIME';
// TODO create filter here.
const existingFilterIndex = filters.findIndex(t => {
if (t.type == 'Composite') {
if (t.type == 'COMPOSITE') {
const compositeFilter = t as ICompositeFilter;
return compositeFilter.filters && compositeFilter.filters.length
&& compositeFilter[0].path == this.path;

View File

@ -1,6 +1,6 @@
{
"name": "@poweredsoft/ngx-cdk-ui",
"version": "0.0.1",
"version": "0.0.2",
"peerDependencies": {
"@angular/common": "^9.1.9",
"@angular/core": "^9.1.9"

View File

@ -15,12 +15,14 @@ export class DataGridDemoHomeComponent implements OnInit, OnDestroy {
columns = ['id','name', 'address', 'commands']
merchantDataSource: IDataSource<IMerchant>;
private _dataSubscription: Subscription;
private _loading: Subscription;
constructor(private merchantService: MerchantService){
this.merchantDataSource = this.createDataSource();
}
ngOnDestroy(): void {
this._dataSubscription.unsubscribe();
this._loading.unsubscribe();
}
@ -46,7 +48,7 @@ export class DataGridDemoHomeComponent implements OnInit, OnDestroy {
}
ngOnInit() {
this.merchantDataSource.loading$.subscribe(isLoading => {
this._loading = this.merchantDataSource.loading$.subscribe(isLoading => {
console.log('merchant data source event loading', isLoading);
});