diff options
Diffstat (limited to 'sdc-workflow-designer-ui/src/app/components/node-parameters')
6 files changed, 306 insertions, 0 deletions
diff --git a/sdc-workflow-designer-ui/src/app/components/node-parameters/node-parameters.component.css b/sdc-workflow-designer-ui/src/app/components/node-parameters/node-parameters.component.css new file mode 100644 index 00000000..e69de29b --- /dev/null +++ b/sdc-workflow-designer-ui/src/app/components/node-parameters/node-parameters.component.css diff --git a/sdc-workflow-designer-ui/src/app/components/node-parameters/node-parameters.component.html b/sdc-workflow-designer-ui/src/app/components/node-parameters/node-parameters.component.html new file mode 100644 index 00000000..1b3e15c9 --- /dev/null +++ b/sdc-workflow-designer-ui/src/app/components/node-parameters/node-parameters.component.html @@ -0,0 +1,21 @@ +<!--
+/*******************************************************************************
+ * Copyright (c) 2017 ZTE Corporation.
+ * All rights reserved. This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v1.0
+ * and the Apache License 2.0 which both accompany this distribution,
+ * and are available at http://www.eclipse.org/legal/epl-v10.html
+ * and http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Contributors:
+ * ZTE - initial API and implementation and/or initial documentation
+ *******************************************************************************/
+-->
+<b4t-parameter *ngFor="let param of pathParams" [param]="param" [valueSource]= "inputSources" [planItems]="planItems"></b4t-parameter>
+<hr *ngIf="pathParams.length > 0">
+<b4t-parameter *ngFor="let param of queryParams" [param]="param" [valueSource]= "inputSources" [planItems]="planItems"></b4t-parameter>
+
+<b4t-parameter-tree [restConfigId]="restConfigId" [parameters]="inputParams" [valueSource]="inputSources"
+ [planItems]="planItems"></b4t-parameter-tree>
+<b4t-parameter-tree [restConfigId]="restConfigId" [parameters]="outputParams" [valueSource]="outputSources"
+ [planItems]="planItems"></b4t-parameter-tree>
diff --git a/sdc-workflow-designer-ui/src/app/components/node-parameters/node-parameters.component.ts b/sdc-workflow-designer-ui/src/app/components/node-parameters/node-parameters.component.ts new file mode 100644 index 00000000..79643d36 --- /dev/null +++ b/sdc-workflow-designer-ui/src/app/components/node-parameters/node-parameters.component.ts @@ -0,0 +1,94 @@ +/**
+ * Copyright (c) 2017 ZTE Corporation.
+ * All rights reserved. This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v1.0
+ * and the Apache License 2.0 which both accompany this distribution,
+ * and are available at http://www.eclipse.org/legal/epl-v10.html
+ * and http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Contributors:
+ * ZTE - initial API and implementation and/or initial documentation
+ */
+
+import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
+import { TreeNode } from 'primeng/primeng';
+
+import { PlanTreeviewItem } from '../../model/plan-treeview-item';
+import { Swagger, SwaggerResponse } from '../../model/swagger';
+import { ValueSource } from '../../model/value-source.enum';
+import { RestParameter } from '../../model/workflow/rest-parameter';
+import { BroadcastService } from '../../services/broadcast.service';
+import { SwaggerTreeConverterService } from '../../services/swagger-tree-converter.service';
+import { RestService } from "../../services/rest.service";
+
+/**
+ * property component presents information of a workflow node.
+ * the presented information can be edit in this component.
+ * it may load information dynamically. the content may be different for different node type.
+ */
+@Component({
+ selector: 'b4t-node-parameters',
+ styleUrls: ['./node-parameters.component.css'],
+ templateUrl: 'node-parameters.component.html',
+})
+export class NodeParametersComponent implements OnChanges {
+ @Input() public swaggerInput: RestParameter[];
+ @Input() public swaggerOutput: SwaggerResponse[];
+ @Input() public restConfigId: string;
+ @Input() public planItems: PlanTreeviewItem[];
+
+ public inputSources: ValueSource[] = [ValueSource.String, ValueSource.Variable, ValueSource.Topology, ValueSource.Plan];
+ public outputSources: ValueSource[] = [ValueSource.Topology, ValueSource.Plan];
+ public valueSource = ValueSource;
+ public pathParams: any[] = [];
+ public queryParams: any[] = [];
+ public inputParams: TreeNode[] = [];
+ public outputParams: TreeNode[] = [];
+
+ private index = 1;
+
+ constructor(private broadcastService: BroadcastService,
+ private restService: RestService,
+ private swaggerTreeConverterService: SwaggerTreeConverterService) {
+ }
+
+ public ngOnChanges(changes: SimpleChanges): void {
+ if (changes.swaggerInput && changes.swaggerInput.currentValue) {
+ this.resetRequestParams(changes.swaggerInput.currentValue);
+ }
+ if (changes.swaggerOutput && changes.swaggerOutput.currentValue) {
+ this.resetResponseParams(changes.swaggerOutput.currentValue);
+ }
+ }
+
+ public resetRequestParams(parameters: RestParameter[]) {
+ this.pathParams = [];
+ this.queryParams = [];
+ this.inputParams = [];
+
+ parameters.forEach(param => {
+ if (param.position === 'path') {
+ this.pathParams.push(param);
+ } else if (param.position === 'query') {
+ this.queryParams.push(param);
+ } else if (param.position === 'body') {
+ const requestTreeNode = this.swaggerTreeConverterService
+ .schema2TreeNode(this.restService.getSwaggerInfo(this.restConfigId), 'Request Param', param.schema, param.value);
+ param.value = requestTreeNode.value;
+ this.inputParams.push(requestTreeNode);
+ } else {
+ // TODO others param types not supported
+ console.log('Unsupport parameter position(in):' + param.position);
+ }
+ });
+ }
+
+ public resetResponseParams(responses: SwaggerResponse[]) {
+ this.outputParams = [];
+ if (0 < responses.length && responses[0].schema) {
+ const treeNode = this.swaggerTreeConverterService
+ .schema2TreeNode(this.restService.getSwaggerInfo(this.restConfigId), 'Response Params', responses[0].schema, {});
+ this.outputParams.push(treeNode);
+ }
+ }
+}
diff --git a/sdc-workflow-designer-ui/src/app/components/node-parameters/parameter-tree/parameter-tree.component.css b/sdc-workflow-designer-ui/src/app/components/node-parameters/parameter-tree/parameter-tree.component.css new file mode 100644 index 00000000..e69de29b --- /dev/null +++ b/sdc-workflow-designer-ui/src/app/components/node-parameters/parameter-tree/parameter-tree.component.css diff --git a/sdc-workflow-designer-ui/src/app/components/node-parameters/parameter-tree/parameter-tree.component.html b/sdc-workflow-designer-ui/src/app/components/node-parameters/parameter-tree/parameter-tree.component.html new file mode 100644 index 00000000..cc17916c --- /dev/null +++ b/sdc-workflow-designer-ui/src/app/components/node-parameters/parameter-tree/parameter-tree.component.html @@ -0,0 +1,23 @@ +<p-tree *ngIf="parameters.length > 0" [value]="parameters">
+ <ng-template let-node pTemplate="default">
+ <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]="valueSource" [planItems]="planItems"
+ [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)" (delete)="deleteTreeNode(node)"></b4t-parameter>
+ </ng-template>
+
+ <ng-template let-node pTemplate="array">
+ <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]="getObjectValueSource()" [planItems]="planItems"
+ [canInsert]="canInsert(node)" [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)"
+ (insert)="addChildNode4ObjectArray(node)" (delete)="deleteTreeNode(node)"></b4t-parameter>
+ </ng-template>
+
+ <ng-template let-node pTemplate="object">
+ <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]="getObjectValueSource()" [planItems]="planItems"
+ [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)" (delete)="deleteTreeNode(node)"></b4t-parameter>
+ </ng-template>
+
+ <ng-template let-node pTemplate="map">
+ <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]="getObjectValueSource()" [planItems]="planItems"
+ [canInsert]="canInsert(node)" [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)"
+ (insert)="addChildNode4DynamicObject(node)" (delete)="deleteTreeNode(node)"></b4t-parameter>
+ </ng-template>
+</p-tree>
diff --git a/sdc-workflow-designer-ui/src/app/components/node-parameters/parameter-tree/parameter-tree.component.ts b/sdc-workflow-designer-ui/src/app/components/node-parameters/parameter-tree/parameter-tree.component.ts new file mode 100644 index 00000000..1c74b707 --- /dev/null +++ b/sdc-workflow-designer-ui/src/app/components/node-parameters/parameter-tree/parameter-tree.component.ts @@ -0,0 +1,168 @@ +/**
+ * Copyright (c) 2017 ZTE Corporation.
+ * All rights reserved. This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v1.0
+ * and the Apache License 2.0 which both accompany this distribution,
+ * and are available at http://www.eclipse.org/legal/epl-v10.html
+ * and http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Contributors:
+ * ZTE - initial API and implementation and/or initial documentation
+ */
+
+import { ChangeDetectionStrategy, Component, Input, OnChanges, Output, SimpleChange, SimpleChanges } from '@angular/core';
+import { TreeNode } from 'primeng/primeng';
+
+import { PlanTreeviewItem } from '../../../model/plan-treeview-item';
+import { ValueSource } from '../../../model/value-source.enum';
+import { ValueType } from '../../../model/value-type.enum';
+import { Parameter } from '../../../model/workflow/parameter';
+import { SwaggerTreeConverterService } from '../../../services/swagger-tree-converter.service';
+import { WorkflowUtil } from '../../../util/workflow-util';
+import { Swagger } from "../../../model/swagger";
+import { RestService } from "../../../services/rest.service";
+
+/**
+ * parameter tree presents parameter of task node's input or output parameters.
+ */
+@Component({
+ selector: 'b4t-parameter-tree',
+ styleUrls: ['./parameter-tree.component.css'],
+ templateUrl: 'parameter-tree.component.html',
+ changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class ParameterTreeComponent implements OnChanges {
+ @Input() public parameters: TreeNode[];
+ @Input() public restConfigId: string;
+ @Input() public valueSource: ValueSource[];
+ @Input() public planItems: PlanTreeviewItem[];
+
+ constructor(private restService: RestService, private swaggerTreeConverterService: SwaggerTreeConverterService) { }
+
+ public ngOnChanges(changes: SimpleChanges) {
+ }
+
+ public getParameter(node: any): Parameter {
+ // console.log('Parameter init:' + node.label +'.'+ node.type+'.'+JSON.stringify(node.value.value)+'.'+node.value.valueSource);
+
+ return new Parameter(node.label, node.value.value, node.value.valueSource, node.definition.type, node.definition.reqquired);
+ }
+
+
+ public paramChange(param: Parameter, node: any) {
+ // console.log('Parameter change:' + param.name + ', Node label is:' + node.label);
+
+ node.value.valueSource = param.valueSource;
+ node.value.value = param.value;
+
+ this.objectParameterChange(node);
+
+ if (node.label !== param.name) {
+ delete node.parent.value.value[node.label];
+ node.label = param.name;
+ }
+ if (node.parent) {
+ node.parent.value.value[node.label] = node.value;
+ }else{
+ // this parameter is 'request param' or 'response param'
+ }
+
+ }
+
+ private objectParameterChange(node: any) {
+ if (node.value.valueSource === ValueSource[ValueSource.Definition]) { // value will be set by node defintion
+ const treeNode = this.swaggerTreeConverterService.schema2TreeNode(this.getSwagger(), node.label, node.definition, node.value);
+ node.value = treeNode.value;
+ node.children = treeNode.children;
+ } else { // parameter value will be set by param
+ node.children = [];
+ }
+ }
+
+ private getSwagger(): Swagger {
+ return this.restService.getSwaggerInfo(this.restConfigId);
+ }
+
+ public addChildNode4DynamicObject(node: any) {
+ const copyItem = WorkflowUtil.deepClone(node.definition.additionalProperties);
+ const key = Object.keys(node.value.value).length;
+
+ const childrenNode = this.swaggerTreeConverterService
+ .schema2TreeNode(this.getSwagger(), key, copyItem);
+
+ childrenNode.keyEditable = true;
+ node.value.value[key] = childrenNode.value;
+
+ node.children.push(childrenNode);
+ }
+
+ public addChildNode4ObjectArray(node: any) {
+ const copyItem = WorkflowUtil.deepClone(node.definition.items);
+
+ const childrenNode = this.swaggerTreeConverterService
+ .schema2TreeNode(
+ this.getSwagger(),
+ node.children.length,
+ copyItem);
+
+ node.value.value.push(childrenNode.value);
+ node.children.push(childrenNode);
+ }
+
+ public deleteTreeNode(node: any) {
+ if ('array' === node.parent.type) {
+ // delete data
+ node.parent.value.value.splice(node.label, 1);
+ node.parent.children.splice(node.label, 1);
+
+ // update node index
+ node.parent.children.forEach((childNode, index) => childNode.label = index);
+ } else if ('map' === node.parent.type) {
+ delete node.parent.value.value[node.label];
+ for (let index = 0; index < node.parent.children.length; index++) {
+ const element = node.parent.children[index];
+ if (element.label === node.label) {
+ node.parent.children.splice(index, 1);
+ break;
+ }
+ }
+ }
+ }
+
+ public canInsert(node: any) {
+ if (node.value.valueSource !== ValueSource[ValueSource.Definition]) {
+ return false;
+ } else {
+ return this.isArrayObject(node) || this.isDynamicObject(node);
+ }
+ }
+
+ public canDelete(node: any) {
+ const parent = node.parent;
+ if (parent &&
+ (this.isArrayObject(parent) || this.isDynamicObject(parent))) {
+ return true;
+ } else {
+ return false;
+ }
+ }
+
+ public getObjectValueSource(): ValueSource[] {
+ const result = [];
+ this.valueSource.forEach(source => {
+ if (ValueSource.String != source) {
+ result.push(source);
+ }
+ });
+ result.push(ValueSource.Definition);
+ return result;
+ }
+
+ private isArrayObject(node: any): boolean {
+ return node.type === 'array';
+ }
+
+ private isDynamicObject(node: any): boolean {
+ return node.type === 'map';
+ }
+}
|