You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@streampipes.apache.org by ze...@apache.org on 2020/03/12 20:47:10 UTC
[incubator-streampipes] 04/04: Add component for property selector
This is an automated email from the ASF dual-hosted git repository.
zehnder pushed a commit to branch STREAMPIPES-79
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
commit 7547f86f00b084101e5947c73c6b514f1cf35e29
Author: Philipp Zehnder <ze...@fzi.de>
AuthorDate: Thu Mar 12 21:45:24 2020 +0100
Add component for property selector
---
.../widgets/base/base-data-explorer-widget.ts | 9 ++++---
.../line-chart/line-chart-widget.component.html | 9 +------
.../widgets/table/table-widget.component.html | 9 +------
.../utils/select-keys/select-keys.component.css | 0
.../utils/select-keys/select-keys.component.html | 8 ++++++
.../utils/select-keys/select-keys.component.ts | 30 ++++++++++++++++++++++
.../data-explorer-v2/data-explorer-v2.module.ts | 4 ++-
7 files changed, 48 insertions(+), 21 deletions(-)
diff --git a/ui/src/app/data-explorer-v2/components/widgets/base/base-data-explorer-widget.ts b/ui/src/app/data-explorer-v2/components/widgets/base/base-data-explorer-widget.ts
index 3589308..a534f7e 100644
--- a/ui/src/app/data-explorer-v2/components/widgets/base/base-data-explorer-widget.ts
+++ b/ui/src/app/data-explorer-v2/components/widgets/base/base-data-explorer-widget.ts
@@ -24,6 +24,7 @@ import { IDataViewDashboardItem } from '../../../models/dataview-dashboard.model
import { EventSchema } from '../../../../connect/schema-editor/model/EventSchema';
import { EventPropertyPrimitive } from '../../../../connect/schema-editor/model/EventPropertyPrimitive';
import { EventPropertyComponent } from '../../../../connect/schema-editor/event-property/event-property.component';
+import { EventProperty } from '../../../../connect/schema-editor/model/EventProperty';
export abstract class BaseDataExplorerWidget implements OnChanges {
@@ -104,10 +105,10 @@ export abstract class BaseDataExplorerWidget implements OnChanges {
isNumber(p: EventProperty): boolean {
return (p instanceof EventPropertyPrimitive &&
- (p.runtimeType === 'http://www.w3.org/2001/XMLSchema#number') ||
- (p.runtimeType === 'http://www.w3.org/2001/XMLSchema#float') ||
- (p.runtimeType === 'http://www.w3.org/2001/XMLSchema#double') ||
- (p.runtimeType === 'http://www.w3.org/2001/XMLSchema#integer'))
+ ((p as EventPropertyPrimitive).runtimeType === 'http://www.w3.org/2001/XMLSchema#number') ||
+ (p as EventPropertyPrimitive).runtimeType === 'http://www.w3.org/2001/XMLSchema#float') ||
+ ((p as EventPropertyPrimitive).runtimeType === 'http://www.w3.org/2001/XMLSchema#double') ||
+ ((p as EventPropertyPrimitive).runtimeType === 'http://www.w3.org/2001/XMLSchema#integer')
? true : false;
}
diff --git a/ui/src/app/data-explorer-v2/components/widgets/line-chart/line-chart-widget.component.html b/ui/src/app/data-explorer-v2/components/widgets/line-chart/line-chart-widget.component.html
index 9ceede3..7393197 100644
--- a/ui/src/app/data-explorer-v2/components/widgets/line-chart/line-chart-widget.component.html
+++ b/ui/src/app/data-explorer-v2/components/widgets/line-chart/line-chart-widget.component.html
@@ -19,14 +19,7 @@
<div fxLayout="column" fxLayoutAlign="stretch">
<div class="assemblyOptions sp-blue-bg m-0 row header h-40" style="margin-left: 0px;margin-right: 0px;">
<div fxFlex="100" layout="row" fxLayoutAlign="end center" style="margin-left: 0px;margin-right: 0px;">
- <mat-form-field appearance="outline">
- <mat-label>Select Columns</mat-label>
- <mat-select [ngModel]="this.yKeys" (selectionChange)="setSelectedColumn($event.value)" multiple>
- <mat-option *ngFor="let column of availableColumns" [value]="column" style="background-color: #FFFFFF">
- {{column}}
- </mat-option>
- </mat-select>
- </mat-form-field>
+ <sp-select-keys (changeSelectedKeys)="setSelectedColumn($event)" [availableKeys]="availableColumns" [selectedKeys]="yKeys"></sp-select-keys>
<button mat-button mat-icon-button color="white" (click)="removeWidget()">
<i class="material-icons">clear</i>
</button>
diff --git a/ui/src/app/data-explorer-v2/components/widgets/table/table-widget.component.html b/ui/src/app/data-explorer-v2/components/widgets/table/table-widget.component.html
index ab1a7dc..d0d068a 100644
--- a/ui/src/app/data-explorer-v2/components/widgets/table/table-widget.component.html
+++ b/ui/src/app/data-explorer-v2/components/widgets/table/table-widget.component.html
@@ -21,14 +21,7 @@
<div fxLayout="column" fxLayoutAlign="stretch">
<div class="assemblyOptionsDataExplorer sp-blue-bg m-0 row header h-40" style="margin-left: 0px;margin-right: 0px;">
<div fxFlex="100" layout="row" fxLayoutAlign="end center" style="margin-left: 0px;margin-right: 0px;">
- <mat-form-field appearance="outline">
- <mat-label>Select Columns</mat-label>
- <mat-select [ngModel]="this.selectedColumns" (selectionChange)="setSelectedColumn($event.value)" multiple>
- <mat-option *ngFor="let column of availableColumns" [value]="column" style="background-color: #FFFFFF">
- {{column}}
- </mat-option>
- </mat-select>
- </mat-form-field>
+ <sp-select-keys (changeSelectedKeys)="setSelectedColumn($event)" [availableKeys]="availableColumns" [selectedKeys]="selectedColumns"></sp-select-keys>
<button mat-button mat-icon-button color="white" (click)="removeWidget()">
<i class="material-icons">clear</i>
</button>
diff --git a/ui/src/app/data-explorer-v2/components/widgets/utils/select-keys/select-keys.component.css b/ui/src/app/data-explorer-v2/components/widgets/utils/select-keys/select-keys.component.css
new file mode 100644
index 0000000..e69de29
diff --git a/ui/src/app/data-explorer-v2/components/widgets/utils/select-keys/select-keys.component.html b/ui/src/app/data-explorer-v2/components/widgets/utils/select-keys/select-keys.component.html
new file mode 100644
index 0000000..8e4acc2
--- /dev/null
+++ b/ui/src/app/data-explorer-v2/components/widgets/utils/select-keys/select-keys.component.html
@@ -0,0 +1,8 @@
+<mat-form-field appearance="outline">
+ <mat-label>Select Columns</mat-label>
+ <mat-select [ngModel]="this.selectedKeys" (selectionChange)="triggerSelectedKeys($event.value)" multiple>
+ <mat-option *ngFor="let column of availableKeys" [value]="column" style="background-color: #FFFFFF">
+ {{column}}
+ </mat-option>
+ </mat-select>
+</mat-form-field>
diff --git a/ui/src/app/data-explorer-v2/components/widgets/utils/select-keys/select-keys.component.ts b/ui/src/app/data-explorer-v2/components/widgets/utils/select-keys/select-keys.component.ts
new file mode 100644
index 0000000..e8d58ec
--- /dev/null
+++ b/ui/src/app/data-explorer-v2/components/widgets/utils/select-keys/select-keys.component.ts
@@ -0,0 +1,30 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { GridsterItem } from 'angular-gridster2';
+
+@Component({
+ selector: 'sp-select-keys',
+ templateUrl: './select-keys.component.html',
+ styleUrls: ['./select-keys.component.css']
+})
+export class SelectKeysComponent implements OnInit {
+
+ @Output()
+ changeSelectedKeys: EventEmitter<string[]> = new EventEmitter();
+
+ @Input()
+ availableKeys: string[];
+
+ @Input()
+ selectedKeys: string[];
+
+
+ constructor() { }
+
+ ngOnInit(): void {
+ }
+
+ triggerSelectedKeys(keys: string[]) {
+ this.changeSelectedKeys.emit(keys);
+ }
+
+}
diff --git a/ui/src/app/data-explorer-v2/data-explorer-v2.module.ts b/ui/src/app/data-explorer-v2/data-explorer-v2.module.ts
index 18eb0f1..0f369d1 100644
--- a/ui/src/app/data-explorer-v2/data-explorer-v2.module.ts
+++ b/ui/src/app/data-explorer-v2/data-explorer-v2.module.ts
@@ -56,6 +56,7 @@ import { DataLakeService } from './services/data-lake.service';
import { DataViewDataExplorerService } from './services/data-view-data-explorer.service';
import { RefreshDashboardService } from './services/refresh-dashboard.service';
import { ResizeService } from './services/resize.service';
+import { SelectKeysComponent } from './components/widgets/utils/select-keys/select-keys.component';
const dashboardWidgets = [
@@ -111,7 +112,8 @@ export const MY_NATIVE_FORMATS = {
TimeRangeSelectorComponent,
OldExplorerComponent,
NoDataInDateRangeComponent,
- LoadDataSpinnerComponent
+ LoadDataSpinnerComponent,
+ SelectKeysComponent
],
providers: [
SharedDatalakeRestService,