Open-Harbor/ngx-data-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

demo commit

Browse Source
This commit is contained in:
Yubing325
2020-07-07 16:36:18 -05:00
parent f4cec5c48f
commit bc4bd55efc
27 changed files with 181 additions and 135 deletions
Download Patch File Download Diff File Expand all files Collapse all files
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.html → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/datetime-filter/datetime-filter.component.html
View File
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.scss → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/datetime-filter/datetime-filter.component.scss
View File
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/datetime-filter/datetime-filter.component.ts → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/datetime-filter/datetime-filter.component.ts
View File
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/grid-filter.module.ts → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/grid-filter.module.ts
+1 -1
View File
@@ -24,4 +24,4 @@ import { TooltipModule } from 'ngx-bootstrap/tooltip';
],
exports: [TextFilterComponent, NumberFilterComponent,DatetimeFilterComponent]
})
export class GridFilterModule { }
export class GridFilterModule { } //DS Filter
projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/number-filter/number-filter.component.html
+64
View File
@@ -0,0 +1,64 @@
<ng-template #popTemplate>
<form (ngSubmit)="applyFilter()">
<div class="container" >
<div class="row">
<select class="custom-select" title="Choose one of the following..." [(ngModel)]="filterType" [ngModelOptions]="{standalone: true}">
<option *ngFor="let filter of filterTypes" [value]="filter.value">{{filter.key}}</option>
</select>
</div>
<div class="row mt-1 mb-1">
<input type="number" class="form-control" placeholder="column value" aria-label="number"
aria-describedby="basic-addon1" [(ngModel)]="filterValue" [ngModelOptions]="{standalone: true}">
</div>
<button class="btn btn-primary mr-1">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>
</form>
</ng-template>
<button [popover]="popTemplate" class="btn btn-default" [(isOpen)]="filterIsOpenned" [outsideClick]="true" #pop="bs-popover">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 477.875 477.875" style="enable-background:new 0 0 477.875 477.875;" xml:space="preserve" fill-opacity="0.5" [tooltip]="showTooltip()" [tooltipEnable]="!filterIsOpenned" width="13px" height="13px" [ngStyle]="{'fill': isFiltering ? 'red': 'black', 'fill-opacity': isFiltering ? '1': '0.5'}">
<g>
<g>
<path d="M460.804,0H17.071C7.645,0,0.004,7.641,0.004,17.067V102.4c-0.004,4.842,2.05,9.458,5.649,12.698l165.018,148.514V460.8
c-0.004,9.426,7.633,17.07,17.059,17.075c2.651,0.001,5.266-0.615,7.637-1.8l102.4-51.2c5.786-2.891,9.441-8.806,9.438-15.275
V263.612l165.018-148.48c3.608-3.247,5.662-7.878,5.649-12.732V17.067C477.871,7.641,470.23,0,460.804,0z"/>
</g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
</button>
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.scss → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/number-filter/number-filter.component.scss
View File
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.ts → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/number-filter/number-filter.component.ts
+2 -1
View File
@@ -3,7 +3,7 @@ import { IDataSource,IFilter } from '@poweredsoft/data';
import { ISimpleFilter } from '../../models/IFilter';
@Component({
selector: 'psbx-number-filter',
selector: 'psbx-ds-number-filter',
templateUrl: './number-filter.component.html',
styleUrls: ['./number-filter.component.scss']
})
@@ -32,6 +32,7 @@ export class NumberFilterComponent implements OnInit {
}
clearFilter() {
this.filterValue = 0;
this.isFiltering = false;
const existingFilter = this.dataSource.filters.find(t => (t as ISimpleFilter).path == this.path) as ISimpleFilter;
if (existingFilter) {
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/number-filter/number-filter.component.html → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/text-filter/text-filter.component.html
+19 -15
View File
@@ -1,21 +1,25 @@
<ng-template #popTemplate>
<div class="container" >
<div class="row">
<select class="custom-select" title="Choose one of the following..." [(ngModel)]="filterType">
<option *ngFor="let filter of filterTypes" [value]="filter.value">{{filter.key}}</option>
</select>
</div>
<div class="row mt-1 mb-1">
<input type="number" class="form-control" placeholder="column value" aria-label="number"
aria-describedby="basic-addon1" [(ngModel)]="filterValue">
</div>
<form (ngSubmit)="applyFilter(pop)">
<button class="btn btn-primary mr-1" (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 class="container" >
<div class="row">
<select class="custom-select" title="Choose one of the following..." [(ngModel)]="filterType" [ngModelOptions]="{standalone: true}">
<option *ngFor="let filter of filterTypes" [value]="filter.value">{{filter.key}}</option>
</select>
</div>
</div>
<div class="row mt-1 mb-1">
<input type="text" class="form-control" placeholder="column value" aria-label="Username"
aria-describedby="basic-addon1" [(ngModel)]="filterValue" [ngModelOptions]="{standalone: true}" >
</div>
<button class="btn btn-primary mr-1" type="submit">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>
</form>
</ng-template>
<button [popover]="popTemplate" class="btn btn-default" [(isOpen)]="filterIsOpenned" [outsideClick]="true" #pop="bs-popover">
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.scss → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/text-filter/text-filter.component.scss
View File
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.ts → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-filter/text-filter/text-filter.component.ts
+6 -1
View File
@@ -1,6 +1,7 @@
import { Component, OnInit, Input } from '@angular/core';
import { IDataSource} from '@poweredsoft/data';
import { ISimpleFilter } from '../../models/IFilter';
import { PopoverDirective } from 'ngx-bootstrap/popover';
@Component({
@@ -32,6 +33,7 @@ export class TextFilterComponent implements OnInit {
}
clearFilter() {
this.filterValue = '';
this.isFiltering = false;
const existingFilter = this.dataSource.filters.find(t => (t as ISimpleFilter).path == this.path) as ISimpleFilter;
if (existingFilter) {
@@ -42,7 +44,7 @@ export class TextFilterComponent implements OnInit {
}
}
applyFilter(){
applyFilter(pop: PopoverDirective = null){
this.isFiltering = true;
const filters = this.dataSource.filters;
const existingFilter = filters.find(t => (t as ISimpleFilter).path == this.path) as ISimpleFilter;
@@ -62,6 +64,9 @@ export class TextFilterComponent implements OnInit {
filters: filters,
page: 1
})
if (pop)
pop.hide();
}
showTooltip(){
projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting.module.ts → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-sorting/ds-sorting.module.ts
+3 -3
View File
@@ -1,14 +1,14 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { GridSortingComponent } from './grid-sorting/grid-sorting.component';
import { DataSourceSortingComponent } from './ds-sorting/ds-sorting.component';
@NgModule({
declarations: [GridSortingComponent],
declarations: [DataSourceSortingComponent],
imports: [
CommonModule
],
exports:[GridSortingComponent]
exports:[DataSourceSortingComponent]
})
export class GridSortingModule { }
projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.html → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-sorting/ds-sorting/ds-sorting.component.html
View File
projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.scss → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-sorting/ds-sorting/ds-sorting.component.scss
View File
projects/poweredsoft/ngx-bootstrap/src/lib/grid-sorting/grid-sorting/grid-sorting.component.ts → projects/poweredsoft/ngx-bootstrap/src/lib/dataSource-sorting/ds-sorting/ds-sorting.component.ts
+5 -5
View File
@@ -2,11 +2,11 @@ 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']
selector: 'psbx-ds-sorting',
templateUrl: './ds-sorting.component.html',
styleUrls: ['./ds-sorting.component.scss']
})
export class GridSortingComponent implements OnInit {
export class DataSourceSortingComponent implements OnInit {
@Input() dataSource : IDataSource<any>;
@Input() path:string;
@@ -16,7 +16,7 @@ export class GridSortingComponent implements OnInit {
ngOnInit(): void {
}
sorting(){
this.isSorting = true;
this.isAscending = !this.isAscending;
projects/poweredsoft/ngx-bootstrap/src/lib/grid-filter/text-filter/text-filter.component.html
-62
View File
@@ -1,62 +0,0 @@
<ng-template #popTemplate>
<div class="container" >
<div class="row">
<select class="custom-select" title="Choose one of the following..." [(ngModel)]="filterType">
<option *ngFor="let filter of filterTypes" [value]="filter.value">{{filter.key}}</option>
</select>
</div>
<div class="row mt-1 mb-1">
<input type="text" class="form-control" placeholder="column value" aria-label="Username"
aria-describedby="basic-addon1" [(ngModel)]="filterValue">
</div>
<button class="btn btn-primary mr-1" (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>
</ng-template>
<button [popover]="popTemplate" class="btn btn-default" [(isOpen)]="filterIsOpenned" [outsideClick]="true" #pop="bs-popover">
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 477.875 477.875" style="enable-background:new 0 0 477.875 477.875;" xml:space="preserve" fill-opacity="0.5" [tooltip]="showTooltip()" [tooltipEnable]="!filterIsOpenned" width="13px" height="13px" [ngStyle]="{'fill': isFiltering ? 'red': 'black', 'fill-opacity': isFiltering ? '1': '0.5'}">
<g>
<g>
<path d="M460.804,0H17.071C7.645,0,0.004,7.641,0.004,17.067V102.4c-0.004,4.842,2.05,9.458,5.649,12.698l165.018,148.514V460.8
c-0.004,9.426,7.633,17.07,17.059,17.075c2.651,0.001,5.266-0.615,7.637-1.8l102.4-51.2c5.786-2.891,9.441-8.806,9.438-15.275
V263.612l165.018-148.48c3.608-3.247,5.662-7.878,5.649-12.732V17.067C477.871,7.641,470.23,0,460.804,0z"/>
</g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
</button>
projects/poweredsoft/ngx-bootstrap/src/public-api.ts
+6 -6
View File
@@ -13,9 +13,9 @@ export * from './lib/confirm-modal/confirm-modal.service';
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';
export * from './lib/grid-filter/number-filter/number-filter.component';
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';
export * from './lib/dataSource-filter/grid-filter.module';
export * from './lib/dataSource-filter/text-filter/text-filter.component';
export * from './lib/dataSource-filter/number-filter/number-filter.component';
export * from './lib/dataSource-filter/datetime-filter/datetime-filter.component';
export * from './lib/dataSource-sorting/ds-sorting.module';
export * from './lib/dataSource-sorting/ds-sorting/ds-sorting.component';