diff options
Diffstat (limited to 'sdc-workflow-designer-ui/src/app/components/property')
-rw-r--r-- | sdc-workflow-designer-ui/src/app/components/property/properties.component.css | 4 | ||||
-rw-r--r-- | sdc-workflow-designer-ui/src/app/components/property/properties.component.html | 28 | ||||
-rw-r--r-- | sdc-workflow-designer-ui/src/app/components/property/properties.component.ts | 43 | ||||
-rw-r--r-- | sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task-parameters/rest-task-parameters.component.ts | 79 | ||||
-rw-r--r-- | sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.html | 13 | ||||
-rw-r--r-- | sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task.component.ts | 2 | ||||
-rw-r--r-- | sdc-workflow-designer-ui/src/app/components/property/start-event/start-event.component.html (renamed from sdc-workflow-designer-ui/src/app/components/property/rest-task/rest-task-parameters/rest-task-parameters.component.html) | 43 | ||||
-rw-r--r-- | sdc-workflow-designer-ui/src/app/components/property/start-event/start-event.component.ts | 36 |
8 files changed, 116 insertions, 132 deletions
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);
+ }
+}
|