diff options
Diffstat (limited to 'sdc-workflow-designer-ui/src/app/components/menus/microservice/microservice-detail')
2 files changed, 149 insertions, 0 deletions
diff --git a/sdc-workflow-designer-ui/src/app/components/menus/microservice/microservice-detail/microservice-detail.component.html b/sdc-workflow-designer-ui/src/app/components/menus/microservice/microservice-detail/microservice-detail.component.html new file mode 100644 index 00000000..d13895dd --- /dev/null +++ b/sdc-workflow-designer-ui/src/app/components/menus/microservice/microservice-detail/microservice-detail.component.html @@ -0,0 +1,49 @@ +<!-- +/** + * 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"> + <label class="col-md-2 form-control-label text-md-right">Name</label> + <div class="col-md-10"> + <input class="form-control" [(ngModel)]="microservice.name"> + </div> +</div> +<div class="form-group row"> + <label class="col-md-2 form-control-label text-md-right">version</label> + <div class="col-md-10"> + <input class="form-control" [(ngModel)]="microservice.version"> + </div> +</div> +<div class="form-group row"> + <label class="col-md-2 form-control-label text-md-right">Dynamic</label> + <div class="col-md-10"> + <p-radioButton name="dynamic" [value]=true label="true" (ngModelChange)="toggleDynamic($event)" [ngModel]="dynamic"></p-radioButton> + <p-radioButton name="dynamic" [value]=false label="false" (ngModelChange)="toggleDynamic($event)" [ngModel]="dynamic"></p-radioButton> + </div> +</div> +<div *ngIf="dynamic" class="form-group row"> + <label class="col-md-2 form-control-label text-md-right">Definition</label> + <div class="col-md-8" style="padding-right:0px"> + <input class="form-control" [(ngModel)]="microservice.url"> + </div> + <div class="col-md-2" style="padding-left:0px"> + <button class="btn" (click)="loadDynamicInfo()">load</button> + </div> +</div> + +<div class="form-group row"> + <label class="col-md-2 form-control-label text-md-right">Detail</label> + <div class="col-md-10"> + <textarea class="form-control" rows="8" [ngModel]="detail" [disabled]="dynamic" + (ngModelChange)="onDetailChanged($event)"></textarea> + </div> +</div> diff --git a/sdc-workflow-designer-ui/src/app/components/menus/microservice/microservice-detail/microservice-detail.component.ts b/sdc-workflow-designer-ui/src/app/components/menus/microservice/microservice-detail/microservice-detail.component.ts new file mode 100644 index 00000000..bffaef42 --- /dev/null +++ b/sdc-workflow-designer-ui/src/app/components/menus/microservice/microservice-detail/microservice-detail.component.ts @@ -0,0 +1,100 @@ +/** + * 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, ViewChild } from '@angular/core'; +import { ModalDirective } from 'ngx-bootstrap/modal'; + +import { Microservice } from '../../../../model/workflow/microservice'; +import { WorkflowConfigService } from '../../../../services/workflow-config.service'; +import { Swagger } from "../../../../model/swagger"; +import { RestConfig } from '../../../../model/rest-config'; + +/** + * toolbar component contains some basic operations(save) and all of the supported workflow nodes. + * The supported nodes can be dragged to container component. which will add a new node to the workflow. + */ +@Component({ + selector: 'b4t-microservice-detail', + templateUrl: 'microservice-detail.component.html', +}) +export class MicroserviceDetailComponent implements OnChanges { + @Input() microservice: RestConfig; + + public detail: string; + public dynamic = false; + + constructor(private configService: WorkflowConfigService) { + } + + public ngOnChanges() { + if(this.microservice == null) { + this.microservice = new RestConfig('', '', null, ''); + } + this.checkDynamic(); + this.parseSwagger2String(); + } + + private checkDynamic() { + if(this.microservice.url) { + this.dynamic = true; + } else { + this.dynamic = false; + } + } + + private parseSwagger2String() { + if (this.microservice.swagger) { + this.detail = JSON.stringify(this.microservice.swagger); + } else { + this.detail = ''; + } + } + + public onDetailChanged(detail: string) { + try { + if(detail) { + const swagger = new Swagger(JSON.parse(detail)); + this.detail = detail; + console.log(swagger); + this.microservice.swagger = swagger; + } else { + this.detail = ''; + this.microservice.swagger = null; + } + } catch (e) { + // if detail is not a json object, then not change the swagger + } + } + + public toggleDynamic(dynamic: boolean) { + this.dynamic = dynamic; + this.onDetailChanged(null); + + if(!dynamic) { + this.microservice.url = null; + } + } + + private loadDynamicInfo() { + this.configService.loadDynamicInfo(this.microservice.url) + .subscribe(response => { + try { + + this.microservice.swagger = response; + this.parseSwagger2String(); + } catch (e) { + console.log('detail transfer error'); + console.error(e); + } + }); + } +} |