Resource creation - save new resource to backend

Integrated UI with loopback to save new resource dictionary to backend

Issue-ID: CCSDK-1217
Change-Id: I200b7b53cd62910a6c3661ef86a62398c5ea8cfc
Signed-off-by: Arundathi Patil <arundpil@in.ibm.com>

3 files changed, 9 insertions, 7 deletions

diff --git a/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/existing-model/search-resource/search-resource.component.html b/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/existing-model/search-resource/search-resource.component.html
index d02cef429..a2e0a7c05 100644
--- a/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/existing-model/search-resource/search-resource.component.html
+++ b/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/existing-model/search-resource/search-resource.component.html
@@ -20,7 +20,7 @@
 
 <form class="example-form" [formGroup]="myControl">
   <mat-form-field class="example-full-width">
-    <input type="text" [(ngModel)]="searchText" placeholder="Search Resources" matInput [matAutocomplete]="auto" formControlName="search_input">
+    <input #resourceSelect type="text" [(ngModel)]="searchText" placeholder="Search Resources" matInput [matAutocomplete]="auto" formControlName="search_input">
     <button matSuffix mat-icon-button (click)="fetchResourceByName()"><mat-icon>search</mat-icon></button>
     <mat-autocomplete #auto="matAutocomplete">
       <mat-option (click)="selected(option)" *ngFor="let option of options | search : searchText" [value]="option.tags">
diff --git a/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/existing-model/search-resource/search-resource.component.ts b/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/existing-model/search-resource/search-resource.component.ts
index 1850549aa..5aac51bed 100644
--- a/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/existing-model/search-resource/search-resource.component.ts
+++ b/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/existing-model/search-resource/search-resource.component.ts
@@ -21,6 +21,7 @@
 import { Component, OnInit, ViewChild, EventEmitter, Output  } from '@angular/core';
 import {FormBuilder, FormGroup, Validators} from '@angular/forms';
 import { ExsistingModelService } from '../exsisting-model.service';
+import { MatAutocompleteTrigger } from '@angular/material'
 
 @Component({
   selector: 'app-search-resource',
@@ -31,8 +32,9 @@ export class SearchResourceComponent implements OnInit  {
 
   myControl: FormGroup;
   @Output() resourcesData = new EventEmitter();  
-  options: any[] = [] ;
-  // = ['One','One1', 'Two', 'Three'];
+  options: any[]   = ['One','One1', 'Two', 'Three'];
+  // @ViewChild('resourceSelect') resourceSelect;
+  @ViewChild('resourceSelect', { read: MatAutocompleteTrigger }) resourceSelect: MatAutocompleteTrigger;
 
   searchText: string = '';
   constructor(private _formBuilder: FormBuilder,
@@ -53,8 +55,8 @@ export class SearchResourceComponent implements OnInit  {
           console.log(data);
           data.forEach(element => {
             this.options.push(element)
-          });
-          // this.options = data.
+          });          
+        this.resourceSelect.openPanel();
       }, error=>{
         window.alert('error' + error);
       })
diff --git a/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/resource-creation.component.html b/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/resource-creation.component.html
index 9b4dbe5e1..afb2b9d55 100644
--- a/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/resource-creation.component.html
+++ b/cds-ui/client/src/app/feature-modules/resource-definition/resource-creation/resource-creation.component.html
@@ -29,10 +29,10 @@
     <app-resource-template-options (option)="selectedOption($event)"></app-resource-template-options>
     <br>
     <div>
-      <button mat-button matStepperNext class="matStepNextBtn">Proceed</button>
+      <button mat-button matStepperNext class="matStepNextBtn" *ngIf="selectedValue == 1 || selectedValue == 3">Proceed</button>
     </div>
   </mat-step>
-  <mat-step [stepControl]="step2FormGroup">
+  <mat-step [stepControl]="step2FormGroup" *ngIf="selectedValue == 1 || selectedValue == 3">
     <ng-template matStepLabel>Browse or Search Resources</ng-template>
   <app-upload-resource (fileData)=upload($event) *ngIf="selectedValue == 1"></app-upload-resource><br><br>
   <app-existing-model *ngIf="selectedValue == 3"></app-existing-model>