From 8c409761dbb9e12c8784b9ff8347d6bd8f20c33c Mon Sep 17 00:00:00 2001 From: Swapnali Shadanan Pode Date: Fri, 29 Mar 2019 16:02:20 +0530 Subject: Resource edit changes Change-Id: Id588f474468655cb995ed44cd8178ef2dc1e44ed Issue-ID: CCSDK-804 Signed-off-by: sp00501638 --- .../resource-edit/resource-edit.component.html | 37 +++++++----- .../resource-edit/resource-edit.component.scss | 29 ++++++++-- .../resource-edit/resource-edit.component.ts | 65 +++++++++++++++++++++- 3 files changed, 109 insertions(+), 22 deletions(-) (limited to 'cds-ui/client/src/app/feature-modules') diff --git a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.html b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.html index 7df509221..de81e2394 100644 --- a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.html +++ b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.html @@ -19,27 +19,36 @@ */--> - + +

+
+ Resource Metadata - + - + - - + + Sources - - - - - + + + + + +
- - - - \ No newline at end of file +
+ +
+ +
+
+
+ +
diff --git a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.scss b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.scss index 7c60cf3e6..280645e3d 100644 --- a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.scss +++ b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.scss @@ -25,6 +25,7 @@ margin: 20px 0; box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important; height: auto; + min-height:340px; } .sources-card { width: 100%; @@ -33,13 +34,14 @@ margin: 20px 0; box-shadow: 0 2px 2px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)!important; height: auto; + min-height:300px; } -.mat-raised-button{ - border: 1px solid grey; - background-color: #3f51b5; - padding: 1px; - color: white; - border-radius: 1em; +.mat-button{ + color:white; + background:#3f51b5; + margin-top: 10px; + position: absolute; + border-radius: 1em; } .mat-card-title{ padding-top: 7px; @@ -53,3 +55,18 @@ padding: 8px 8px; word-wrap: break-word; } +.btn{ + width: 50px; + max-width: 100%; + margin: 0 25px 25px 0; + display: inline-block; + vertical-align: top; +} +.toggle-view-btn{ + color:white; + background:#3f51b5; + border-radius: 1em; + margin-top: 10px; + padding:0.6em; + border: 1px solid #3f51b5; +} diff --git a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.ts b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.ts index 5b567034a..55b80628d 100644 --- a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.ts +++ b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/resource-edit.component.ts @@ -18,7 +18,15 @@ * ============LICENSE_END========================================================= */ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, ViewChild } from '@angular/core'; +import { IResources } from 'src/app/common/core/store/models/resources.model'; +import { IResourcesState } from 'src/app/common/core/store/models/resourcesState.model'; +import { LoadResourcesSuccess,UpdateResources,SetResourcesState } from 'src/app/common/core/store/actions/resources.action'; +import { Store } from '@ngrx/store'; +import { IAppState } from '../../../common/core/store/state/app.state'; +import { JsonEditorComponent, JsonEditorOptions } from 'ang-jsoneditor'; +import { Observable } from 'rxjs'; +import { A11yModule } from '@angular/cdk/a11y'; @Component({ selector: 'app-resource-edit', @@ -27,9 +35,62 @@ import { Component, OnInit } from '@angular/core'; }) export class ResourceEditComponent implements OnInit { - constructor() { } + resources:IResources; + data:IResources; + rdState: Observable; + designerMode: boolean = true; + editorMode: boolean = false; + viewText: string = "Open in Editor Mode"; + @ViewChild(JsonEditorComponent) editor: JsonEditorComponent; + options = new JsonEditorOptions(); + + constructor(private store: Store) { + this.rdState = this.store.select('resources'); + this.options.mode = 'text'; + this.options.modes = [ 'text', 'tree', 'view']; + this.options.statusBar = false; + } ngOnInit() { + this.rdState.subscribe( + resourcesdata => { + var resourcesState: IResourcesState = { resources: resourcesdata.resources, isLoadSuccess: resourcesdata.isLoadSuccess, isSaveSuccess: resourcesdata.isSaveSuccess, isUpdateSuccess: resourcesdata.isUpdateSuccess }; + this.resources=resourcesState.resources; + }) } + metaDataDetail(data: IResources) { + this.data=data; + } + + sourcesDetails(data: IResources) { + this.data=data; + } + + onChange($event) { + this.data=JSON.parse($event.srcElement.value); + }; + + updateResourcesState(){ + console.log(this.data); + let resourcesState = { + resources: this.data, + isLoadSuccess: true, + isUpdateSuccess:true, + isSaveSuccess:true + } + this.store.dispatch(new SetResourcesState(resourcesState)); + } + + changeView() { + if(this.viewText == 'Open in Editor Mode') { + this.editorMode = true; + this.designerMode = false; + this.viewText = 'Open in Form Mode' + } else { + this.editorMode = false; + this.designerMode = true; + this.viewText = 'Open in Editor Mode' + } + } } -- cgit 1.2.3-korg