diff options
author | 2018-01-10 17:29:26 +0800 | |
---|---|---|
committer | 2018-01-10 17:29:26 +0800 | |
commit | 32222a4010ebdc739ee1586b09da6758136d9813 (patch) | |
tree | 769985a62592636ee578595d5514b536bcf48a24 /sdc-workflow-designer-ui/src/app/components | |
parent | 38dfd59a8b5d05266e5567f79dcf30fd10ef7c54 (diff) |
support edit rest task properties
modify rest taks config info, and enable edit rest task properties.component.css
Issue-ID: SDC-897
Change-Id: Icad8c1ee60d7572f311d5cba97cda6b2144a7469
Signed-off-by: Lvbo163 <lv.bo163@zte.com.cn>
Diffstat (limited to 'sdc-workflow-designer-ui/src/app/components')
21 files changed, 549 insertions, 501 deletions
diff --git a/sdc-workflow-designer-ui/src/app/components/menu/menus.component.html b/sdc-workflow-designer-ui/src/app/components/menu/menus.component.html index 8cf9dc57..7e043829 100644 --- a/sdc-workflow-designer-ui/src/app/components/menu/menus.component.html +++ b/sdc-workflow-designer-ui/src/app/components/menu/menus.component.html @@ -13,7 +13,7 @@ --> <div class="btn-left"> - <p-splitButton [label]="currentWorkflow" icon="fa-arrows" (onClick)="showWorkflows()" [model]="getWorkflows()"></p-splitButton> + <p-splitButton [label]="getCurrentPlanName()" icon="fa-arrows" (onClick)="showWorkflows()" [model]="workflows"></p-splitButton> </div> <div class="btn-right"> <button type="button" class="btn white" (click)="save()"> diff --git a/sdc-workflow-designer-ui/src/app/components/menu/menus.component.ts b/sdc-workflow-designer-ui/src/app/components/menu/menus.component.ts index 6932e764..e5f68ad1 100644 --- a/sdc-workflow-designer-ui/src/app/components/menu/menus.component.ts +++ b/sdc-workflow-designer-ui/src/app/components/menu/menus.component.ts @@ -25,7 +25,7 @@ import { PlanModel } from "../../model/workflow/plan-model"; export class MenusComponent { @ViewChild(MicroserviceComponent) public microserviceComponent: MicroserviceComponent; @ViewChild(WorkflowsComponent) public workflowsComponent: WorkflowsComponent; - public currentWorkflow = 'Workflows'; + public currentWorkflowId : number; public workflows = []; constructor(private broadcastService: BroadcastService, private workflowService: WorkflowService) { @@ -34,7 +34,7 @@ export class MenusComponent { if(wfs) { wfs.forEach((value, key, map) => { this.workflows.push({label: value.planName, command: () => { - this.workflowSelected(value.planName, value.plan); + this.workflowSelected(key, value.plan); }}); }); } @@ -56,29 +56,19 @@ export class MenusComponent { this.workflowsComponent.show(); } - public getWorkflows() { - const workflows = this.workflowService.getWorkflows(); - if(workflows) { - const options = []; - workflows.forEach((value, key, map) => { - options.push({label: value.planName, command: () => { - console.log(`${value.planName} selected`); - this.workflowSelected(value.planName, value.plan); - }}); - }); - return options; - } else { - return []; - } + public workflowSelected(planId: number, planModel: PlanModel) { + + this.broadcastService.broadcast(this.broadcastService.planModel, planModel); + this.broadcastService.broadcast(this.broadcastService.planId, planId); } - public workflowSelected(planName: string, workflow: PlanModel) { - this.currentWorkflow = planName; - this.broadcastService.broadcast(this.broadcastService.planModel, workflow); + public getCurrentPlanName() { + let planName = this.workflowService.getPlanName(this.currentWorkflowId); + return planName ? planName : 'Workflows' } public download() { - const filename = this.currentWorkflow + '.json'; + const filename = this.getCurrentPlanName() + '.json'; const content = JSON.stringify(this.workflowService.planModel); var eleLink = document.createElement('a'); eleLink.download = filename; 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';
+ }
+}
diff --git a/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.html b/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.html deleted file mode 100644 index 42715629..00000000 --- a/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.html +++ /dev/null @@ -1,52 +0,0 @@ - -<p-tree *ngIf="parameters.length > 0" [value]="parameters"> - <ng-template let-node pTemplate="default"> - <div class="row"> - <div class="col-md-11"> - - <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]="valueSource" [planItems]="planItems" - [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)" (delete)="deleteTreeNode(node)"></b4t-parameter> - </div> - </div> - </ng-template> - - <ng-template let-node pTemplate="array"> - <div class="row"> - <div class="col-md-11"> - <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]= "getObjectValueSource()" - [planItems]="planItems" [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)" - (delete)="deleteTreeNode(node)"></b4t-parameter> - </div> - <div class="col-md-1"> - <i class="fa fa-plus-square-o" (click)="addChildNode4ObjectArray(node)"></i> - </div> - </div> - </ng-template> - - <ng-template let-node pTemplate="object"> - <div class="row"> - <div class="col-md-11"> - <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]= "getObjectValueSource()" - [planItems]="planItems" [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)" - (delete)="deleteTreeNode(node)"></b4t-parameter> - </div> - <div *ngIf="canAdd(node)" class="col-md-1"> - <i class="fa fa-plus-square-o" (click)="addChildNode4DynamicObject(node)"></i> - </div> - </div> - - </ng-template> - - <ng-template let-node pTemplate="map"> - <div class="row"> - <div class="col-md-11"> - <b4t-parameter [param]="getParameter(node)" [canEditName]="node.keyEditable" [valueSource]= "getObjectValueSource()" - [planItems]="planItems" [canDelete]="canDelete(node)" (paramChange)="paramChange($event, node)" - (delete)="deleteTreeNode(node)"></b4t-parameter> - </div> - <div *ngIf="canAdd(node)" class="col-md-1"> - <i *ngIf="canAdd(node)" class="fa fa-plus-square-o" (click)="addChildNode4DynamicObject(node)"></i> - </div> - </div> - </ng-template> - </p-tree> diff --git a/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.ts b/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.ts deleted file mode 100644 index 77da46b7..00000000 --- a/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.ts +++ /dev/null @@ -1,250 +0,0 @@ -/** - * 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, 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 { RestTask } from '../../model/workflow/rest-task'; -import { SwaggerTreeConverterService } from '../../services/swagger-tree-converter.service'; -import { WorkflowUtil } from '../../util/workflow-util'; -import { Swagger } from "../../model/swagger"; -import { WorkflowConfigService } from "../../services/workflow-config.service"; -import { RestService } from '../../services/rest.service'; - -/** - * parameter tree presents parameter of task node's input and output parameters. - */ -@Component({ - selector: 'b4t-parameter-tree', - styleUrls: ['./parameter-tree.component.css'], - templateUrl: 'parameter-tree.component.html', -}) -export class ParameterTreeComponent implements OnChanges { - @Input() public parameters: TreeNode[]; - @Input() public task: RestTask; - @Input() public defaultValueSource: string; - @Input() public valueSource: ValueSource[]; - @Input() public planItems: PlanTreeviewItem[]; - @Input() public restConfigId: string; - - constructor(private restService: RestService, private swaggerTreeConverterService: SwaggerTreeConverterService) { } - - public ngOnChanges(changes: SimpleChanges) { - // const changeParameters = changes['parameters']; - // if (changeParameters && 0 < changeParameters.currentValue.length) { - // this.formatParam(changeParameters.currentValue); - // } - } - - public getParameter(node: any): Parameter { - return new Parameter(node.label,node.value.value, node.value.valueSource, node.definition.type); - } - - - public paramChange(param: Parameter, node: any) { - 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 { - console.warn('Node.parent does not exists!' + JSON.stringify(node)); - } - - } - - 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 getKeyParameter(node: any) { - return new Parameter('key', node.label, ValueSource[ValueSource.String], ValueType[ValueType.String]); - } - - public keyParameterChange(node: any, parameter: Parameter) { - node.label = parameter.value; - this.propertyKeyChanged(node, parameter.value); - } - - public getValueParameter(node: any, key: string) { - const nodeValue = node[key] ? node[key] : { - value: '', - valueSource: ValueSource[ValueSource.String], - }; - node[key] = nodeValue; - return nodeValue; - } - - public valueParameterChange(node: any, key: string, parameter: Parameter) { - node[key].value = parameter.value; - node[key].valueSource = parameter.valueSource; - } - - 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 propertyKeyChanged(node: any, newKey: string) { - const value = node.parent.value.value[node.label]; - node.parent.value.value[newKey] = value; - delete node.parent.value.value[node.label]; - - node.label = newKey; - } - - 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 canEditValue(node: any): boolean { - return node.children.length === 0; - } - - public editNode(node: any) { - node.editing = true; - } - - public editComplete(node: any) { - node.editing = false; - - const newValueObj = JSON.parse(node.tempValue); - for (const key in node.value.value) { - delete node.value.value[key]; - } - - for (const key in newValueObj) { - node.value.value[key] = newValueObj[key]; - } - - // delete all children nodes - - // add new nodes by new value - - } - - - - public canDelete(node: any) { - const parent = node.parent; - if (parent && - (this.isArrayObject(parent) || this.isDynamicObject(parent))) { - return true; - } else { - return false; - } - } - - public updateObjectValue(node: any, value: string) { - node.tempValue = value; - // const newValueObj = JSON.parse(value); - // for (const key in node.parameter.value) { - // delete node.parameter.value[key]; - // } - - // for (const key in newValueObj) { - // node.parameter.value[key] = newValueObj[key]; - // } - } - - public getObjectValue(node) { - return JSON.stringify(node.value.value); - } - - public getObjectValueSource(): ValueSource[] { - const result = []; - result.push(ValueSource.Definition); - this.valueSource.forEach(source => result.push(source)); - return result; - } - - public canAdd(node: any) { - return this.isArrayObject(node) || this.isDynamicObject(node); - } - - private isArrayObject(node: any): boolean { - return node.type === 'array'; - } - - private isDynamicObject(node: any): boolean { - return node.type === 'map'; - } - - public getWidth(node: any) { - if(this.canAdd(node)) { - return { - 'col-md-11': true - }; - } else { - return { - 'col-md-12': true - }; - } - } -} diff --git a/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.css b/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.css index cda8b0cc..fdcd38d7 100644 --- a/sdc-workflow-designer-ui/src/app/components/parameter-tree/parameter-tree.component.css +++ b/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.css @@ -9,6 +9,30 @@ * Contributors:
* ZTE - initial API and implementation and/or initial documentation
*/
-.ui-treenode-label {
- width: calc(100% - 32px) !important;
+ .form-control-label{
+ margin-bottom: 0;
+ width: 100px;
+ vertical-align: middle;
+}
+
+.parameter-item{
+ display: inline;
+ margin-left: 5px;
+ vertical-align: middle;
+}
+
+.form-control-required{
+ color: red;
+ height: 30px;
+ line-height: 30px;
+}
+
+.form-control-input{
+ width: 120px;
+ vertical-align: middle;
+}
+
+.form-control-value{
+ width: 160px;
+ display: inline-block;
}
diff --git a/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.html b/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.html index 3c9f1858..72e77990 100644 --- a/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.html +++ b/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.html @@ -12,29 +12,37 @@ */
-->
-<div class="form-group row">
- <div *ngIf="showLabel" class="col-md-3 text-md-right">
- <input *ngIf="canEditName" class="form-control" type="text" [(ngModel)]="param.name">
+<div class="form-group">
+ <div *ngIf="showLabel" class="parameter-item" style="margin:0;">
+ <label *ngIf="true === param.required" class="form-control-required">*</label>
+ <input *ngIf="canEditName" class="form-control form-control-input" type="text" [ngModel]="param.name" (ngModelChange)="keyChange($event)">
<label *ngIf="!canEditName" class="form-control-label">{{param.name}}</label>
</div>
- <div [ngClass]="valueGroupClass">
- <div [ngSwitch]="param.valueSource">
- <input *ngSwitchCase="sourceEnum[sourceEnum.String]" [ngClass]="valueClass" class="form-control"
- type="text" [ngModel]="param.value" (ngModelChange)="valueChange($event)">
- <input *ngSwitchCase="sourceEnum[sourceEnum.Variable]" [ngClass]="valueClass" class="form-control"
- type="text" [ngModel]="param.value" (ngModelChange)="valueChange($event)">
- <!-- TODO add plan and Top parameters -->
- <tree-select *ngSwitchCase="sourceEnum[sourceEnum.Plan]" name="simpleSelect" [items]="planOptions"
- childrenField="children" #simpleSelect="ngModel" [ngClass]="valueClass" class="tree-select-class"
- [ngModel]="planValue" (ngModelChange)="valueChange($event)"></tree-select>
+ <div class="parameter-item">
+ <div *ngIf="showValue" [ngSwitch]="param.valueSource" class="parameter-item">
+ <input *ngSwitchCase="sourceEnum[sourceEnum.String]" class="form-control form-control-value" type="text" [ngModel]="param.value"
+ (ngModelChange)="valueChange($event)">
+ <input *ngSwitchCase="sourceEnum[sourceEnum.Variable]" class="form-control form-control-value" type="text" [ngModel]="param.value"
+ (ngModelChange)="valueChange($event)">
+ <tree-select *ngSwitchCase="sourceEnum[sourceEnum.Plan]" name="simpleSelect" style="vertical-align:top;" [items]="planOptions" childrenField="children"
+ #simpleSelect="ngModel" class="form-control-value" [ngModel]="planValue" (ngModelChange)="valueChange($event)"></tree-select>
+ <select *ngSwitchCase="sourceEnum[sourceEnum.Topology]" class="form-control form-control-value" type="text" [ngModel]="param.value"
+ (ngModelChange)="valueChange($event)">
+ <option *ngFor="let topology of topologyOptions" value="{{topology.value}}">{{topology.name}}</option>
+ </select>
</div>
- <select *ngIf="showValueSource" class="form-control col-md-4" type="text" [ngModel]="param.valueSource"
+ <select *ngIf="showValueSource" class="form-control parameter-item" style="width:auto;" type="text" [ngModel]="param.valueSource"
(ngModelChange)="valueSourceChange($event)">
<option *ngFor="let sourceType of valueSource" value="{{sourceEnum[sourceType]}}">{{sourceEnum[sourceType]}}</option>
</select>
</div>
- <div *ngIf="canDelete" class="col-md-2">
- <button type="button" class="btn oes-red-bg pull-right" (click)="deleteParam()">
+ <div *ngIf="canInsert" class="parameter-item">
+ <button type="button" class="btn blue1" (click)="insertParam()">
+ <i class="fa fa-plus"></i>
+ </button>
+ </div>
+ <div *ngIf="canDelete" class="parameter-item">
+ <button type="button" class="btn oes-red-bg" (click)="deleteParam()">
<i class="fa fa-minus"></i>
</button>
</div>
diff --git a/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.ts b/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.ts index 9f4c6d1e..35dfbf1e 100644 --- a/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.ts +++ b/sdc-workflow-designer-ui/src/app/components/parameter/parameter.component.ts @@ -10,12 +10,11 @@ * ZTE - initial API and implementation and/or initial documentation
*/
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
+import { PlanTreeviewItem } from '../../model/plan-treeview-item';
import { ValueSource } from '../../model/value-source.enum';
import { Parameter } from '../../model/workflow/parameter';
-import { DataAccessService } from "../../services/data-access/data-access.service";
-import { PlanTreeviewItem } from "../../model/plan-treeview-item";
/**
* this component contains in property component if the corresponding node has parameter properties
@@ -23,41 +22,53 @@ import { PlanTreeviewItem } from "../../model/plan-treeview-item"; */
@Component({
selector: 'b4t-parameter',
+ styleUrls: ['./parameter.component.css'],
templateUrl: 'parameter.component.html',
})
-export class ParameterComponent implements OnInit {
+export class ParameterComponent implements OnChanges, OnInit {
@Input() public param: Parameter;
@Input() public valueSource: ValueSource[];
@Input() public canEditName: boolean;
@Input() public showLabel = true;
+ @Input() public canInsert: boolean;
@Input() public canDelete: boolean;
@Input() public planItems: PlanTreeviewItem[];
@Output() public paramChange = new EventEmitter<Parameter>();
+ @Output() insert: EventEmitter<Parameter> = new EventEmitter<Parameter>();
@Output() delete: EventEmitter<Parameter> = new EventEmitter<Parameter>();
public sourceEnum = ValueSource;
public valueGroupClass;
public valueClass;
- public showValueSource: boolean = true;
- public planValue: any = {};
+ public valueSourceClass;
public planOptions = [];
+ public topologyOptions: { name: string, value: string }[] = [];
+ public showValue = true;
+ public showValueSource = true;
+ public planValue: any = {};
- constructor(private dataAccessService: DataAccessService) { }
+ constructor() { }
+
+ public ngOnChanges(changes: SimpleChanges): void {
+ // if (changes.canInsert && !changes.canInsert.isFirstChange()) {
+ // this.resetValueGroupClass(changes.canInsert.currentValue, this.canDelete);
+ // }
+ // if (changes.canDelete && !changes.canDelete.isFirstChange()) {
+ // this.resetValueGroupClass(this.canInsert, changes.canDelete.currentValue);
+ // }
+ }
public ngOnInit(): void {
+ // console.warn('Parameter OnInit, parameter name is:' + this.param.name);
if (1 === this.valueSource.length) {
this.showValueSource = false;
}
- this.valueClass = {
- 'col-md-8': this.showValueSource,
- 'col-md-12': !this.showValueSource
- };
-
- this.valueGroupClass = {
- 'col-md-7': this.canDelete,
- 'col-md-9': !this.canDelete
- };
-
+ // this.valueClass = {
+ // 'col-md-7': this.showValueSource,
+ // 'col-md-12': !this.showValueSource
+ // };
+ // this.resetValueGroupClass(this.canInsert, this.canDelete);
+ this.updateValueSource(this.param.valueSource);
// trans plan options to tree view items.
this.initPlanTreeviewItems(this.planItems);
if (ValueSource[ValueSource.Plan] === this.param.valueSource) {
@@ -65,29 +76,57 @@ export class ParameterComponent implements OnInit { }
}
- public deleteParam(): void {
- this.delete.emit();
- }
-
- public valueSourceChange(valueSource: string) {
- this.param.valueSource = valueSource;
- this.valueChange(null);
+ public keyChange(key: string) {
+ this.param.name = key;
+ this.paramChange.emit(this.param);
}
public valueChange(value: any) {
if (ValueSource[ValueSource.Plan] === this.param.valueSource) {
- if (value !== null && 'object' === typeof (value)) {
+ if ('object' === typeof (value)) {
this.planValue = value;
+ this.param.value = value.id;
} else {
- this.planValue = {};
+ this.planValue = { id: '' };
+ this.param.value = '';
}
- this.param.value = this.planValue.id;
} else {
this.param.value = value;
}
this.paramChange.emit(this.param);
}
+ public valueSourceChange(valueSource: string) {
+ this.updateValueSource(valueSource);
+ this.param.valueSource = valueSource;
+ this.valueChange('');
+ }
+
+ public insertParam(): void {
+ this.insert.emit();
+ }
+
+ public deleteParam(): void {
+ this.delete.emit();
+ }
+
+ private updateValueSource(valueSource: string):void{
+ if(ValueSource[ValueSource.Definition] === valueSource){
+ this.showValue = false;
+ }else{
+ this.showValue = true;
+ }
+ // this.resetValueSourceClass(this.showValue);
+ }
+
+ private resetValueGroupClass(canInsert: boolean, canDelete: boolean): void {
+ // this.valueGroupClass = {
+ // 'col-md-5': canInsert && canDelete,
+ // 'col-md-7': (canInsert && !canDelete) || (!canInsert && canDelete),
+ // 'col-md-9': !canInsert && !canDelete
+ // };
+ }
+
private initPlanTreeviewItems(planTreeviewItems: PlanTreeviewItem[]): void {
this.planOptions = this.getTreeviewChild(planTreeviewItems);
}
@@ -110,5 +149,4 @@ export class ParameterComponent implements OnInit { });
return treeviewItems;
}
-
}
diff --git a/sdc-workflow-designer-ui/src/app/components/property/properties.component.css b/sdc-workflow-designer-ui/src/app/components/property/properties.component.css index b5c07531..4487e0b3 100644 --- a/sdc-workflow-designer-ui/src/app/components/property/properties.component.css +++ b/sdc-workflow-designer-ui/src/app/components/property/properties.component.css @@ -10,7 +10,7 @@ * ZTE - initial API and implementation and/or initial documentation */ -.wm-properties-wrapper { + .wm-properties-wrapper { background-color: white; position: fixed; width: 500px; @@ -27,7 +27,7 @@ -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5); box-shadow: 0 0 6px rgba(0, 0, 0, 0.5); border-radius: 0; - overflow-y: scroll; + overflow: auto; } .edit { diff --git a/sdc-workflow-designer-ui/src/app/components/property/properties.component.html b/sdc-workflow-designer-ui/src/app/components/property/properties.component.html index 19d0dce1..99f14b56 100644 --- a/sdc-workflow-designer-ui/src/app/components/property/properties.component.html +++ b/sdc-workflow-designer-ui/src/app/components/property/properties.component.html @@ -12,7 +12,7 @@ */ --> -<div class="wm-properties-wrapper" *ngIf="show"> + <div class="wm-properties-wrapper" *ngIf="show"> <div class="form-group row"> <b4t-editable-property class="col-md-10" [(name)]="node.name"></b4t-editable-property> <div class="col-md-2"> @@ -21,19 +21,21 @@ </button> </div> </div> - <hr> - + <!-- <hr> <div class="form-group row"> - <label class="col-md-2 form-control-label text-md-right" for="nodeType">Type</label> - <div class="col-md-10"> - <input class="form-control" name="nodeType" disabled type="text" value="{{node.type}}"/> + <label class="col-md-3 form-control-label text-md-right" for="nodeType">{{'WORKFLOW.NODE_TYPE' | translate}}</label> + <div class="col-md-9"> + <select class="form-control" id="nodeType" [(ngModel)]="node.type"> + <option *ngFor="let t of nodeTypes" value="{{t}}">{{t}}</option> + </select> </div> - </div> + </div> --> - <!-- TODO add property for different node types --> - - <b4t-start-event-parameters *ngIf="'startEvent' == node.type" [node]="node"></b4t-start-event-parameters> - <b4t-rest-task *ngIf="node.type == 'restTask'" [node]="node" [planItems]="planItems"></b4t-rest-task> - <b4t-intermediate-catch-event *ngIf="'intermediateCatchEvent' == node.type" [node]="node"></b4t-intermediate-catch-event> - <b4t-script-task *ngIf="node.type == 'scriptTask'" [node]="node"></b4t-script-task> + <hr> + <div [ngSwitch]="node.type"> + <b4t-start-event *ngSwitchCase="nodeType[nodeType.startEvent]" [node]="node"></b4t-start-event> + <b4t-rest-task *ngSwitchCase="nodeType[nodeType.restTask]" [node]="node" [planItems]="planTreeviewItems"></b4t-rest-task> + <b4t-intermediate-catch-event *ngSwitchCase="nodeType[nodeType.intermediateCatchEvent]" [node]="node"></b4t-intermediate-catch-event> + <b4t-script-task *ngSwitchCase="nodeType[nodeType.scriptTask]" [node]="node"></b4t-script-task> + </div> </div> diff --git a/sdc-workflow-designer-ui/src/app/components/property/properties.component.ts b/sdc-workflow-designer-ui/src/app/components/property/properties.component.ts index d3a6a416..c49b4661 100644 --- a/sdc-workflow-designer-ui/src/app/components/property/properties.component.ts +++ b/sdc-workflow-designer-ui/src/app/components/property/properties.component.ts @@ -10,13 +10,17 @@ * ZTE - initial API and implementation and/or initial documentation */ -import { AfterViewInit, Component } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; +import { TreeNode } from 'primeng/primeng'; +import { PlanTreeviewItem } from '../../model/plan-treeview-item'; +import { ValueSource } from '../../model/value-source.enum'; +import { NodeType } from '../../model/workflow/node-type.enum'; +import { Parameter } from '../../model/workflow/parameter'; import { WorkflowNode } from '../../model/workflow/workflow-node'; import { BroadcastService } from '../../services/broadcast.service'; import { JsPlumbService } from '../../services/jsplumb.service'; -import { PlanTreeviewItem } from "../../model/plan-treeview-item"; -import { ModelService } from "../../services/model.service"; +import { ModelService } from '../../services/model.service'; /** * property component presents information of a workflow node. @@ -28,23 +32,38 @@ import { ModelService } from "../../services/model.service"; styleUrls: ['./properties.component.css'], templateUrl: 'properties.component.html', }) -export class PropertiesComponent implements AfterViewInit { +export class PropertiesComponent implements OnInit { public node: WorkflowNode; + public planTreeviewItems: PlanTreeviewItem[]; + public nodeType = NodeType; + // public nodeTypes: string[] = WorkflowNodeType; public show = false; public titleEditing = false; - public planItems: PlanTreeviewItem[]; + public valueSource = [ValueSource.String]; constructor(private broadcastService: BroadcastService, - private jsPlumbService: JsPlumbService, - private modelService: ModelService) { + private modelService: ModelService, + private jsPlumbService: JsPlumbService) { } - public ngAfterViewInit() { - this.broadcastService.showProperty$.subscribe(show => this.show = show); - this.broadcastService.nodeProperty$.subscribe(node => { - this.node = node; - this.planItems = this.modelService.getPlanParameters(this.node.id); + public ngOnInit() { + this.broadcastService.showProperty$.subscribe(element => { + if (element && this.modelService.isNode(element)) { + this.node = element as WorkflowNode; + // temporarily, if config info not exists then close the property panel + // TODOS: 1) save config info in case config info no exists on a different environment. + // 2) display property panel even if config info not exists for it may be adjust. + try { + this.planTreeviewItems = this.modelService.getPlanParameters(this.node.id); + this.show = true; + } catch (error) { + this.show = false; + console.log(error); + } + } else { + this.show = false; + } }); } diff --git a/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task-parameters/rest-task-parameters.component.ts b/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task-parameters/rest-task-parameters.component.ts deleted file mode 100644 index 8e8cc94f..00000000 --- a/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task-parameters/rest-task-parameters.component.ts +++ /dev/null @@ -1,79 +0,0 @@ -/** - * 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, OnInit, Output } from '@angular/core'; -import { TreeNode } from 'primeng/primeng'; - -import { Swagger } from '../../../../model/swagger'; -import { RestTask } from '../../../../model/workflow/rest-task'; -import { BroadcastService } from '../../../../services/broadcast.service'; -import { RestParameter } from "../../../../model/workflow/rest-parameter"; -import { ValueSource } from "../../../../model/value-source.enum"; -import { SwaggerTreeConverterService } from "../../../../services/swagger-tree-converter.service"; -import { PlanTreeviewItem } from "../../../../model/plan-treeview-item"; -import { WorkflowConfigService } from "../../../../services/workflow-config.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-rest-task-parameters', - templateUrl: 'rest-task-parameters.component.html', -}) -export class RestTaskParametersComponent implements OnInit { - @Input() public task: RestTask; - @Input() public planItems: PlanTreeviewItem[]; - - public inputSources: ValueSource[] = [ValueSource.String, ValueSource.Variable, ValueSource.Plan]; - public requestParameters: RestParameter[] = []; // not include body parameter - public bodyParameter: TreeNode[] = []; - public responseParameter: TreeNode[] = []; - public valueSource = ValueSource; - - private index = 1; - - constructor(private broadcastService: BroadcastService, - private restService: RestService, - private swaggerTreeConverterService: SwaggerTreeConverterService) { - } - - public ngOnInit() { - this.broadcastService.nodeTaskChange$.subscribe(() => { - this.resetRequestParams(); - this.resetResponseParams(); - }); - } - - public resetRequestParams() { - this.requestParameters = []; - this.bodyParameter = []; - - this.task.parameters.forEach(param => { - if (param.position === 'body') { - const requestTreeNode = this.swaggerTreeConverterService - .schema2TreeNode(this.restService.getSwaggerInfo(this.task.restConfigId), 'Request Param', param.schema, param.value); - param.value = requestTreeNode.value; - param.value = param.schema.value; - this.bodyParameter.push(requestTreeNode); - } else { - this.requestParameters.push(param); - } - }); - } - - public resetResponseParams() { - // TODO add response body handler - } -} diff --git a/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.html b/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.html index 332811b5..99b8a0f4 100644 --- a/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.html +++ b/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.html @@ -15,9 +15,8 @@ <div class="form-group row"> <label class="col-md-3 form-control-label text-md-right">Service</label> <div class="col-md-9"> - <select class="form-control" [ngModel]="selectedMicroservice" - (ngModelChange)="serviceChanged($event)"> - <option *ngFor="let microservice of microservices" [ngValue]=microservice>{{getText4Microservice(microservice)}}</option> + <select class="form-control" [ngModel]="node.restConfigId" (ngModelChange)="serviceChanged($event)"> + <option *ngFor="let restConfig of restService.getRestConfigs()" value="{{restConfig.id}}">{{restConfig.id}}</option> </select> </div> </div> @@ -25,8 +24,7 @@ <div class="form-group row"> <label class="col-md-3 form-control-label text-md-right">Path</label> <div class="col-md-9"> - <select class="form-control" [ngModel]="node.url" - (ngModelChange)="urlChanged($event)"> + <select class="form-control" [ngModel]="node.path" (ngModelChange)="pathChanged($event)"> <option *ngFor="let interface of restInterfaces" value="{{interface}}">{{interface}}</option> </select> </div> @@ -35,8 +33,7 @@ <div class="form-group row"> <label class="col-md-3 form-control-label text-md-right">Method</label> <div class="col-md-9"> - <select class="form-control" [ngModel]="node.method" - (ngModelChange)="methodChanged($event)"> + <select class="form-control" [ngModel]="node.method" (ngModelChange)="methodChanged($event)"> <option *ngFor="let operation of restOperations" value="{{operation}}">{{operation}}</option> </select> </div> @@ -44,5 +41,5 @@ <hr> <div class="ui-fluid"> - <b4t-rest-task-parameters [task]="node" [planItems]="planItems"></b4t-rest-task-parameters> + <b4t-node-parameters [restConfigId]="this.node.restConfigId" [swaggerInput]="this.node.parameters" [swaggerOutput]="this.node.responses" [planItems]="planItems"></b4t-node-parameters> </div> diff --git a/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.ts b/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.ts index eb1c81bd..dfb2f0f3 100644 --- a/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.ts +++ b/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.ts @@ -71,6 +71,8 @@ export class RestTaskComponent implements OnInit { this.restInterfaces.push(key); } this.loadOperations(); + } else { + console.log('swagger not exist'); } } } diff --git a/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task-parameters/rest-task-parameters.component.html b/sdc-workflow-designer-ui/src/app/components/property/start-event/start-event.component.html index d13a2623..d10128c7 100644 --- a/sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task-parameters/rest-task-parameters.component.html +++ b/sdc-workflow-designer-ui/src/app/components/property/start-event/start-event.component.html @@ -1,18 +1,25 @@ -<!-- -/******************************************************************************* - * 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 requestParameters" [param]="param" [valueSource]= "inputSources" [planItems]="planItems"></b4t-parameter> - -<!-- body parameter --> -<b4t-parameter-tree [task]="task" [parameters]="bodyParameter" [valueSource]="inputSources" - [planItems]="planItems" [defaultValueSource]="valueSource[valueSource.String]"></b4t-parameter-tree> +<!--
+/*******************************************************************************
+ * 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
+ *******************************************************************************/
+-->
+
+<div class="form-group row">
+ <div class="col-md-10"></div>
+ <div class="col-md-2">
+ <button (click)="create();" type="button" class="btn blue1 pull-right">
+ <i class="fa fa-plus"></i>
+ </button>
+ </div>
+</div>
+
+<b4t-parameter *ngFor="let param of node.parameters; let i = index;" [param]="param" [canEditName]="true"
+ [valueSource]="sources" [canDelete]="true" (delete)="delete(i)"></b4t-parameter>
diff --git a/sdc-workflow-designer-ui/src/app/components/property/start-event/start-event.component.ts b/sdc-workflow-designer-ui/src/app/components/property/start-event/start-event.component.ts new file mode 100644 index 00000000..96701625 --- /dev/null +++ b/sdc-workflow-designer-ui/src/app/components/property/start-event/start-event.component.ts @@ -0,0 +1,36 @@ +/*******************************************************************************
+ * 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, Input } from '@angular/core';
+import { Subscription } from 'rxjs/Subscription';
+
+import { ValueSource } from '../../../model/value-source.enum';
+import { Parameter } from '../../../model/workflow/parameter';
+import { StartEvent } from '../../../model/workflow/start-event';
+import { BroadcastService } from '../../../services/broadcast.service';
+import { WorkflowUtil } from '../../../util/workflow-util';
+
+@Component({
+ selector: 'b4t-start-event',
+ templateUrl: 'start-event.component.html',
+})
+export class StartEventComponent {
+ @Input() public node: StartEvent;
+ public sources: ValueSource[] = [ValueSource.String];
+
+ public create(): void {
+ this.node.parameters.push(new Parameter('', '', ValueSource[ValueSource.String]));
+ }
+
+ public delete(index: number): void {
+ this.node.parameters.splice(index, 1);
+ }
+}
|