Added Simple Search
This commit is contained in:
parent
77031ffe82
commit
5b6a18668e
|
@ -9,6 +9,14 @@
|
|||
<mat-icon>post_add</mat-icon>
|
||||
Add category
|
||||
</button>
|
||||
<form class="form-inline">
|
||||
<div class="form-group">
|
||||
<input type="search"
|
||||
class="form-control"
|
||||
placeholder="Enter search string"
|
||||
[formControl]="searchField">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<mat-drawer-container class="example-container" autosize>
|
||||
<mat-drawer #drawer class="example-sidenav" mode="side" opened="true">
|
||||
|
@ -25,6 +33,8 @@
|
|||
<mat-divider></mat-divider>
|
||||
|
||||
<ng-container *ngFor="let cat of workflowSpecsByCategory">
|
||||
|
||||
<div *ngIf="!(searchField.value && cat.workflow_specs.length === 0)">
|
||||
<ng-container *ngIf="!(cat.id === null && cat.workflow_specs.length === 0)">
|
||||
<div class="category" fxLayout="row" fxLayoutGap="10px" fxLayoutAlign="start center">
|
||||
<h4>{{cat.display_name}} ({{cat.name}})</h4>
|
||||
|
@ -87,6 +97,7 @@
|
|||
|
||||
<div *ngIf="cat.workflow_specs.length === 0">No workflow specs in this category</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
</ng-container>
|
||||
</mat-drawer>
|
||||
|
||||
|
|
|
@ -23,9 +23,10 @@ import {
|
|||
} from '../_interfaces/dialog-data';
|
||||
import {ApiErrorsComponent} from 'sartography-workflow-lib';
|
||||
import {ActivatedRoute} from '@angular/router';
|
||||
import {map} from 'rxjs/operators';
|
||||
import {debounceTime, distinctUntilChanged, map, switchMap, tap} from 'rxjs/operators';
|
||||
import {Location} from '@angular/common';
|
||||
import {environment} from '../../environments/environment.runtime';
|
||||
import { FormControl } from '@angular/forms';
|
||||
|
||||
|
||||
export interface WorkflowSpecCategoryGroup {
|
||||
|
@ -50,6 +51,7 @@ export class WorkflowSpecListComponent implements OnInit {
|
|||
categories: WorkflowSpecCategory[];
|
||||
moveUp = moveArrayElementUp;
|
||||
moveDown = moveArrayElementDown;
|
||||
private searchField: FormControl;
|
||||
|
||||
constructor(
|
||||
private api: ApiService,
|
||||
|
@ -69,6 +71,11 @@ export class WorkflowSpecListComponent implements OnInit {
|
|||
this._loadWorkflowSpecCategories();
|
||||
}
|
||||
});
|
||||
this.searchField = new FormControl();
|
||||
this.searchField.valueChanges.subscribe(value => {
|
||||
this._loadWorkflowSpecs(null,value);
|
||||
console.log(value);
|
||||
});
|
||||
}
|
||||
|
||||
validateWorkflowSpec(wfs: WorkflowSpec) {
|
||||
|
@ -196,9 +203,9 @@ export class WorkflowSpecListComponent implements OnInit {
|
|||
|
||||
this._loadWorkflowSpecs(selectedSpecName);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
private _loadWorkflowSpecs(selectedSpecName: String = null) {
|
||||
private _loadWorkflowSpecs(selectedSpecName: String = null, searchSpecName: String = null) {
|
||||
|
||||
this.api.getWorkflowSpecList().subscribe(wfs => {
|
||||
this.workflowSpecs = wfs;
|
||||
|
@ -209,7 +216,12 @@ export class WorkflowSpecListComponent implements OnInit {
|
|||
if (wf.is_master_spec) {
|
||||
this.masterStatusSpec = wf;
|
||||
} else {
|
||||
return wf.category_id === cat.id;
|
||||
if (searchSpecName){
|
||||
return (wf.category_id === cat.id) && wf.display_name.toLowerCase().includes(searchSpecName.toLowerCase());
|
||||
}
|
||||
else {
|
||||
return wf.category_id === cat.id;
|
||||
}
|
||||
}
|
||||
})
|
||||
.sort(this.sortByDisplayOrder);
|
||||
|
|
Loading…
Reference in New Issue