diff options
Diffstat (limited to 'cds-ui')
3 files changed, 54 insertions, 24 deletions
diff --git a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.html b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.html index 903c6d319..91a22b8b4 100644 --- a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.html +++ b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.html @@ -24,15 +24,16 @@ [cdkDropListData]="sourcesOptions" class="sources-list" (cdkDropListDropped)="drop($event)"> - <div class="sources-box" *ngFor="let item of sourcesOptions" cdkDrag> + <div class="sources-box" *ngFor="let item of sourcesOptions;let i = index" cdkDrag> <mat-expansion-panel class="expansion-panel"> <mat-expansion-panel-header> <mat-panel-title> {{item}} </mat-panel-title> </mat-expansion-panel-header> - <json-editor [options]="options" [data]="selected(item)" on-change="onChange()"></json-editor> + <json-editor [options]="options" [data]="selected(item)" on-change="onChange(item,$event)"></json-editor> </mat-expansion-panel> + <button matSuffix mat-icon-button (click)="delete(item,i)"><mat-icon class="icon">delete</mat-icon></button> </div> </div> </div> @@ -52,5 +53,8 @@ (cdkDropListDropped)="drop($event)"> <div class="options-box" *ngFor="let item of option | search :searchText" cdkDrag>{{item}}</div> </div> - </div> + </div> + <div> + <button mat-button class="matStepNextBtn" (click)="UploadSourcesData()">Save Sources Data</button> + </div> </div>
\ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.scss b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.scss index a76b60aa8..5bec796e8 100644 --- a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.scss +++ b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.scss @@ -110,4 +110,14 @@ overflow: hidden;
display: block;
width: 100%;
- }
\ No newline at end of file + }
+ .matStepNextBtn{
+ color:white;
+ background:#3f51b5;
+ margin-top: 10px;
+ position: absolute;
+ border-radius: 1em;
+}
+.icon{
+color: red;
+}
\ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.ts b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.ts index c43d1debd..517add87b 100644 --- a/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.ts +++ b/cds-ui/client/src/app/feature-modules/resource-definition/resource-edit/sources-template/sources-template.component.ts @@ -18,7 +18,7 @@ * ============LICENSE_END========================================================= */ -import { Component, OnInit, ViewChild } from '@angular/core'; +import { Component, OnInit, ViewChild, EventEmitter, Output } from '@angular/core'; import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop'; import { IResources } from 'src/app/common/core/store/models/resources.model'; import { IResourcesState } from 'src/app/common/core/store/models/resourcesState.model'; @@ -36,52 +36,68 @@ import { JsonEditorComponent, JsonEditorOptions } from 'ang-jsoneditor'; styleUrls: ['./sources-template.component.scss'] }) export class SourcesTemplateComponent implements OnInit { -// rdState: Observable<IResourcesState>; -// resources: IResources; -// todo = []; -// sources:ISourcesData; -// sourcesOptions = []; @ViewChild(JsonEditorComponent) editor: JsonEditorComponent; - options = new JsonEditorOptions(); - + options = new JsonEditorOptions(); rdState: Observable<IResourcesState>; resources: IResources; option = ['mdsal','default']; sources:ISourcesData; sourcesOptions = []; sourcesData = []; - + @Output() resourcesData = new EventEmitter(); + constructor(private store: Store<IAppState>) { - this.rdState = this.store.select('resources'); - this.options.mode = 'text'; + this.rdState = this.store.select('resources'); + this.options.mode = 'text'; this.options.modes = [ 'text', 'tree', 'view']; - this.options.statusBar = false; - this.options.onChange = () => console.log(this.editor.get()); - + 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; this.sources = resourcesState.resources.sources; for (let key in this.sources) { this.sourcesOptions.push(key); } - //console.log(this.sourcesOptions); }) } - onChange() { - console.log(this.editor.get()) + onChange(item,$event) { + var editedData =JSON.parse($event.srcElement.value); + var originalSources = this.resources.sources; + for (let key in originalSources){ + if(key == item){ + originalSources[key] = editedData; + } + } + this.resources.sources = Object.assign({},originalSources); }; selected(value){ - console.log(value); - this.sourcesData=this.sources[value]; - return this.sourcesData; + this.sourcesData=this.sources[value]; + return this.sourcesData; } + + delete(item,i){ + if(confirm("Are sure you want to delete this source ?")) { + var originalSources = this.resources.sources; + for (let key in originalSources){ + if(key == item){ + delete originalSources[key]; + } + } + this.resources.sources = Object.assign({},originalSources); + this.sourcesOptions.splice(i,1); + } + } + + UploadSourcesData() { + this.resourcesData.emit(this.resources); + } drop(event: CdkDragDrop<string[]>) { if (event.previousContainer === event.container) { |