aboutsummaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser
diff options
context:
space:
mode:
Diffstat (limited to 'catalog-ui/src/app/ng2/components/logic/generic-artifact-browser')
-rw-r--r--catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.html16
-rw-r--r--catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.less14
-rw-r--r--catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.ts25
3 files changed, 54 insertions, 1 deletions
diff --git a/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.html b/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.html
index a94f0cafa0..1abd68db50 100644
--- a/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.html
+++ b/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.html
@@ -31,6 +31,20 @@
[selected]="selectedRows"
[selectionType]="'cell'"
>
- Loading...
+ <ngx-datatable-column [prop]="col.prop" *ngFor="let col of columns">
+ <template let-column="column" ngx-datatable-header-template>
+ <span style="height:10px">
+ <b>{{col.name}}</b>
+ </span>
+ <br/>
+ <input
+ type='text'
+ class="datatable-input-filter"
+ placeholder='Filter column...'
+ (keyup)='updateColumnFilter($event, col.prop)'
+ />
+ </template>
+ </ngx-datatable-column>
+
</ngx-datatable>
</div> \ No newline at end of file
diff --git a/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.less b/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.less
index 288cfd9619..57da199ef2 100644
--- a/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.less
+++ b/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.less
@@ -49,6 +49,20 @@
.break-all-words();
}
+.datatable-input-filter{
+ &[placeholder] {
+ color: #009fdb;
+ font-style: italic;
+ }
+ height: 23px;
+ margin: 2px auto;
+ border: none;
+ border-bottom: solid 3px #009fdb;
+ border-radius: 15px;
+ color: #009fdb;
+ outline: none;
+}
+
.datatable-header-cell {
color: rgb(51, 51, 51);
font-weight: bold;
diff --git a/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.ts b/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.ts
index c87fb51162..695d782a15 100644
--- a/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.ts
+++ b/catalog-ui/src/app/ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component.ts
@@ -40,9 +40,11 @@ export class GenericArtifactBrowserComponent {
columns: ColumnDefinition[];
rows: any[];
+ originRows: any[];
selectedRows: any[];
isLoading: boolean;
ready: boolean;
+ columnsFilters: Map<string, string>;
constructor(private gabService: GabService) {
}
@@ -51,6 +53,7 @@ export class GenericArtifactBrowserComponent {
this.ready = false;
this.isLoading = true;
this.columns = [];
+ this.columnsFilters = new Map<string,string>();
let paths: string[] = this.pathsandnames.map(item => item.path);
this.gabService.getArtifact(this.artifactid, this.resourceid, paths)
.subscribe(
@@ -66,9 +69,30 @@ export class GenericArtifactBrowserComponent {
);
}
+ updateColumnFilter(event, column) {
+ const val = event.target.value.toLowerCase();
+ this.columnsFilters.set(column, val);
+ let temp_rows = [...this.originRows];
+
+ this.columnsFilters.forEach((value: string, key: string) => {
+ temp_rows = this.updateSingleColumnFilter(value, key, temp_rows);
+ });
+
+ // update the rows
+ this.rows = temp_rows
+ }
+
+ private updateSingleColumnFilter(value, column, rows) {
+ return rows.filter(function(obj) {
+ const row = obj[column];
+ return row !== undefined && row.toLowerCase().indexOf(value) !== -1 || !value;
+ });
+ }
+
private normalizeDataForNgxDatatable(data: [{ [key: string]: string }]) {
let result: NormalizationResult = this.getNormalizationResult(data, this.pathsandnames);
this.rows = result.rows;
+ this.originRows = result.rows;
this.columns = result.columns;
}
@@ -111,6 +135,7 @@ export class GenericArtifactBrowserComponent {
}
arrayOfRows.push(row);
});
+
return arrayOfRows;
}
}