aboutsummaryrefslogtreecommitdiffstats
path: root/cds-ui/client/src/app/feature-modules/blueprint/test-template
diff options
context:
space:
mode:
authorArundathi Patil <arundpil@in.ibm.com>2019-02-26 15:57:07 +0530
committerIBM602-PC0F1E3C\Arundathi <arundpil@in.ibm.com>2019-02-26 15:57:28 +0530
commit47f21a59c471c60696efcd09f5fbd07dee6e8d37 (patch)
tree0a256d37921213c1db2cc4d7e3f8f59ebc36cf63 /cds-ui/client/src/app/feature-modules/blueprint/test-template
parenta9a51128e6197fbb4efb38b5cd73e247d7c1fa45 (diff)
Test component
Added test component changes as per the mockup Issue-ID: CCSDK-761 Change-Id: Ie0d86a00d6d0b0ae540bcd78a37dcac74ad903a8 Signed-off-by: Arundathi Patil <arundpil@in.ibm.com>
Diffstat (limited to 'cds-ui/client/src/app/feature-modules/blueprint/test-template')
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.html75
-rw-r--r--cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.ts35
2 files changed, 81 insertions, 29 deletions
diff --git a/cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.html b/cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.html
index 1fca8d1b7..7c225d285 100644
--- a/cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.html
+++ b/cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.html
@@ -19,34 +19,53 @@ limitations under the License.
============LICENSE_END============================================
-->
<div style="display: flex;flex-direction: row">
- <div style="width: 20%;margin: 2px">
- <mat-tree [dataSource]="dataSource" [treeControl]="treeControl">
- <!-- This is the tree node template for leaf nodes -->
- <mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding>
- <!-- use a disabled button to provide padding for tree leaf -->
- <button mat-icon-button disabled></button>
- <span (click)="fileClicked(node.name)">{{node.name}}</span>
- </mat-tree-node>
- <!-- This is the tree node template for expandable nodes -->
- <mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding>
- <button mat-icon-button matTreeNodeToggle
- [attr.aria-label]="'toggle ' + node.name">
- <mat-icon class="mat-icon-rtl-mirror">
- {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
- </mat-icon>
- </button>
- <span (click)="fileClicked(node.name)">{{node.name}}</span>
- </mat-tree-node>
- </mat-tree>
+
+ <div style="width: 12%; height: 553px;">
+
+ <mat-accordion>
+ <mat-expansion-panel>
+ <mat-expansion-panel-header style="background-color: #f1f1f1">
+ <mat-panel-title>
+ Workflows
+ </mat-panel-title>
+ </mat-expansion-panel-header>
+ <div class="flex-container">
+ <div style="cursor: pointer; padding: 2px" (click)="createRequest(workflow)" class="item-box" *ngFor="let workflow of workflows">{{workflow.name}}</div>
+ </div>
+ </mat-expansion-panel>
+ </mat-accordion>
+ </div>
+
+ <div style="width: 90%;display: flex;flex-direction: row; margin-left: 1em">
+ <div style="width: 50%; margin: 2px;">
+ <p>Request</p>
+ <textarea style=" width: 99%;
+ min-height: 27rem;
+ font-family: Lucida Console, Monaco, monospace;
+ font-size: 0.8rem;
+ line-height: 1.2;" cols="30" rows="10">{{request }}</textarea>
+ <div style="height: 10%">
+ <button style="margin: 1em;
+ background-color: #3f51b5;
+ color: white;
+ border-radius: 2em;
+ padding: 0.5em;min-width: 6em;">Submit</button>
+ <button style="margin: 1em;
+ background-color: #3f51b5;
+ color: white;
+ border-radius: 2em;
+ padding: 0.5em;min-width: 6em;">Clear</button>
+ </div>
+ </div>
+
+ <div style="width: 50%; margin: 2px;">
+ <p>Response</p>
+ <textarea style=" width: 99%;
+ min-height: 27rem;
+ font-family: Lucida Console, Monaco, monospace;
+ font-size: 0.8rem;
+ line-height: 1.2;" cols="30" rows="10"></textarea>
+ </div>
</div>
- <div style="width: 80%;background-color: gainsboro;height: 533px;"></div>
-</div>
-<div>
- <button style=" background-color: #3f51b5;
- color: white;
- border: 2px solid;
- width: 8em;
- height: 3em;
- border-radius: 2em;">Test</button>
</div>
diff --git a/cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.ts b/cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.ts
index 2c87e8739..ee33fd737 100644
--- a/cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.ts
+++ b/cds-ui/client/src/app/feature-modules/blueprint/test-template/test-template.component.ts
@@ -22,6 +22,14 @@ limitations under the License.
import { Component, OnInit } from '@angular/core';
import {FlatTreeControl} from '@angular/cdk/tree';
import {MatTreeFlatDataSource, MatTreeFlattener} from '@angular/material/tree';
+import { Observable, Subscription } from 'rxjs';
+import { Store } from '@ngrx/store';
+
+import { IAppState } from '../../../common/core/store/state/app.state';
+import { IBlueprintState } from 'src/app/common/core/store/models/blueprintState.model';
+import { IBlueprint } from 'src/app/common/core/store/models/blueprint.model';
+import { IMetaData } from '../../../common/core/store/models/metadata.model';
+import { LoadBlueprintSuccess } from 'src/app/common/core/store/actions/blueprint.action';
@@ -86,6 +94,9 @@ interface ExampleFlatNode {
styleUrls: ['./test-template.component.scss']
})
export class TestTemplateComponent implements OnInit {
+ private blueprintpState: Subscription;
+ private request ;
+ private workflows = [];
private transformer = (node: FoodNode, level: number) => {
return {
@@ -103,7 +114,15 @@ export class TestTemplateComponent implements OnInit {
dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener);
- constructor() {
+ constructor(private store: Store<IAppState>) {
+ this.blueprintpState = this.store.select('blueprint')
+ .subscribe((data: any)=>{
+ console.log(data);
+ if(data.blueprint.topology_template && data.blueprint.topology_template.workflows) {
+ this.buildWorkflowData(data.blueprint.topology_template.workflows);
+ // this.request = JSON.stringify(data.blueprint.topology_template.workflows[0], undefined, 4);
+ }
+ });
this.dataSource.data = TREE_DATA;
}
@@ -116,4 +135,18 @@ export class TestTemplateComponent implements OnInit {
console.log('selected file:' + file);
}
+ buildWorkflowData(data) {
+ this.workflows = [];
+ for (var property1 in data) {
+ data[property1].name = property1;
+ this.workflows.push(data[property1])
+ }
+ this.request = this.workflows[0];
+ }
+
+ createRequest(workflow) {
+ this.request = JSON.stringify(workflow, undefined, 4);
+
+ }
+
}