diff options
Diffstat (limited to 'cds-ui/designer-client')
5 files changed, 128 insertions, 85 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/model/metaData.model.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/model/metaData.model.ts index 92e6bce43..89a83a1ea 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/model/metaData.model.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/model/metaData.model.ts @@ -27,12 +27,14 @@ export class MetaData { @JsonProperty('updated-by') public updatedBy: string; public property: Property; + public sources: any; constructor() { this.name = ''; this.tags = ''; this.updatedBy = ''; this.property = new Property(); + this.sources = {}; } } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html index add21e9e1..8e355449b 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html @@ -78,7 +78,7 @@ <div class="single-line-model"> <label class="label-name">Tags</label> <div class="label-input"> - <input type="input" (keyup.enter)="addTag($event)" [(ngModel)]="metaDataTab.tags" + <input type="input" (keyup.enter)="addTag($event)" placeholder="Ex., vDNS-CDS"> </div> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.ts index 631a0fffd..01df118d2 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.ts @@ -37,8 +37,6 @@ export class DictionaryMetadataComponent implements OnInit { errorMessage: string; constructor( - private route: ActivatedRoute, - private dictionaryCreationService: DictionaryCreationService, private dictionaryCreationStore: DictionaryCreationStore ) { } @@ -67,6 +65,7 @@ export class DictionaryMetadataComponent implements OnInit { removeTag(value) { this.tags.delete(value); + this.mergeTags(); } @@ -74,15 +73,22 @@ export class DictionaryMetadataComponent implements OnInit { const value = event.target.value; console.log(value); if (value && value.trim().length > 0) { - let tag = ''; event.target.value = ''; this.tags.add(value); - this.tags.forEach(val => { - tag += val + ', '; - }); + // merge + this.mergeTags(); } } + mergeTags() { + let tag = ''; + this.tags.forEach((val, index) => { + tag += val + ', '; + }); + this.metaDataTab.tags = tag.trim(); + this.saveMetaDataToStore(); + } + saveMetaDataToStore() { console.log(this.metaDataTab); this.dictionaryCreationStore.changeMetaData(this.metaDataTab); diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html index b274ce95d..f6150c95b 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html @@ -18,68 +18,59 @@ * ============LICENSE_END========================================================= */--> <div class="col-11"> - <div class= "row "> - <div class="card creat-card source1"> - <h5 class="label-name"> Sources Options</h5> - <div class="searchBox row"><i class="searchButton1 col-1" aria-hidden="true"></i> - <input class="searchText col-8" [(ngModel)]="searchText" type="input" placeholder="filter sources"> - </div> - - <div class="example-container"> - <div - cdkDropList - #todoList="cdkDropList" - [cdkDropListData]="option" - [cdkDropListConnectedTo]="[doneList]" - class="example-list" - (cdkDropListDropped)="drop($event)"> + <div class="row "> + <div class="card creat-card source1"> + <h5 class="label-name"> Sources Options</h5> + <div class="searchBox row"><i class="searchButton1 col-1" aria-hidden="true"></i> + <input class="searchText col-8" [(ngModel)]="searchText" type="input" placeholder="filter sources"> + </div> + + <div class="example-container"> + <div cdkDropList #todoList="cdkDropList" [cdkDropListData]="option" [cdkDropListConnectedTo]="[doneList]" + class="example-list" (cdkDropListDropped)="drop($event)"> <div class="example-box card creat-card" *ngFor="let item of option| search :searchText" cdkDrag> - <input type="checkbox" class="checkbox" [(ngModel)]="checked" (change)="onChange(item, $event.target.checked)"> + <input type="checkbox" class="checkbox" [(ngModel)]="checked" + (change)="onChange(item, $event.target.checked)"> {{item.name}} </div> - + </div> - + </div> <div class="footer row"> <a class="select-button col-sm-05">Select all</a> - <button class="action-button1 col-sm-04" >Add to list</button> + <button class="action-button1 col-sm-04">Add to list</button> </div> - </div> - - <div class="card creat-card source"> - <h5 class="label-name">Sources List</h5> - <div class="example-container2 card creat-card"> - <div - cdkDropList - #doneList="cdkDropList" - [cdkDropListData]="sourcesOptions" - [cdkDropListConnectedTo]="[todoList]" - class="example-list1" - (cdkDropListDropped)="drop($event)"> - - <div class="example-box1" *ngFor="let item of sourcesOptions" cdkDrag> - <input type="checkbox" value="item.name"> - <mat-expansion-panel class="expansion-panel"> - <mat-expansion-panel-header [collapsedHeight]="'23px'" [expandedHeight]="'23px'"> - <mat-panel-title> - {{item.name}} - </mat-panel-title> - </mat-expansion-panel-header> - <br> - <ace-editor [(text)]=item.value [mode]="'javascript'" [autoUpdateContent]="true" - [durationBeforeCallback]="1000" (textChanged)="textChanged($event,item)" [theme]="'tomorrow_night_bright'" #editor style="height:300px;"> - </ace-editor> - </mat-expansion-panel> - </div> - - </div> - - </div> - <div> - <a type="submit" class="delete">Delete</a> + </div> + + <div class="card creat-card source"> + <h5 class="label-name">Sources List</h5> + <div class="example-container2 card creat-card"> + <div cdkDropList #doneList="cdkDropList" [cdkDropListData]="sourcesOptions" + [cdkDropListConnectedTo]="[todoList]" class="example-list1" (cdkDropListDropped)="drop($event)"> + + <div class="example-box1" *ngFor="let item of sourcesOptions" cdkDrag> + <input type="checkbox" value="item.name"> + <mat-expansion-panel class="expansion-panel"> + <mat-expansion-panel-header [collapsedHeight]="'23px'" [expandedHeight]="'23px'"> + <mat-panel-title> + {{item.name}} + </mat-panel-title> + </mat-expansion-panel-header> + <br> + <ace-editor [mode]="'json'" [autoUpdateContent]="true" [durationBeforeCallback]="1000" + (textChanged)="textChanged($event,item)" [theme]="'tomorrow_night_bright'" #editor + style="height:300px;"> + </ace-editor> + </mat-expansion-panel> </div> - </div> -</div> -</div> + </div> + + </div> + <div> + <a type="submit" class="delete">Delete</a> + </div> + </div> + </div> +</div>
\ No newline at end of file diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts index bec8c4bf3..1a950163e 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts @@ -21,6 +21,8 @@ import { Component, OnInit } from '@angular/core'; import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop'; import { SourcesStore } from './sources.store'; import { DictionaryCreationService } from '../dictionary-creation.service'; +import { DictionaryCreationStore } from '../dictionary-creation.store'; +import { MetaData } from '../../model/metaData.model'; @Component({ selector: 'app-sources-template', @@ -40,9 +42,12 @@ export class SourcesTemplateComponent implements OnInit { searchText = ''; text = ''; selectedArray = []; + metaDataTab: MetaData = new MetaData(); + constructor( private sourcesStore: SourcesStore, - private dictionaryCreationService: DictionaryCreationService + private dictionaryCreationService: DictionaryCreationService, + private dictionaryCreationStore: DictionaryCreationStore ) { } @@ -66,16 +71,44 @@ export class SourcesTemplateComponent implements OnInit { } }); + + this.dictionaryCreationStore.state$.subscribe(element => { + console.log('################'); + console.log(this.metaDataTab); + if (element && element.metaData) { + this.metaDataTab = element.metaData; + this.addSourcesInUI(); + } + }); + } + + addSourcesInUI() { + // add sources from json to UI + const originalSources = this.sourcesOptions; + // for (const key of this.sourcesOptions) { + // this.sourcesOptions; + for (const source in this.metaDataTab.sources) { + if (source) { + console.log(source); + } + } } saveSorcesDataToStore() { - this.sourcesStore.saveSources(this.ddSource); + console.log(this.ddSource); + this.metaDataTab.sources = {}; + for (const obj of this.ddSource) { + this.metaDataTab.sources = { ...this.metaDataTab.sources, ...obj }; + } + // this.metaDataTab.sources = { ...this.ddSource } + console.log(this.metaDataTab.sources); + this.dictionaryCreationStore.changeMetaData(this.metaDataTab); } drop(event: CdkDragDrop<string[]>) { console.log('-------------'); - console.log(event); - this.ddSource = []; + // console.log(event); + if (event.previousContainer === event.container) { moveItemInArray(event.container.data, event.previousIndex, event.currentIndex); } else { @@ -85,18 +118,24 @@ export class SourcesTemplateComponent implements OnInit { event.currentIndex); } - for (const key2 in this.sources) { - if (key2) { - const originalSources = this.sourcesOptions; - for (const key of originalSources) { - /* tslint:disable:no-string-literal */ - if (key.name === key2['name']) { - const obj = `{${key.name}: ${key.value}}`; - this.ddSource.push(obj); - } + console.log(this.sourcesOptions); + console.log(this.sources); + + this.ddSource = []; + + const originalSources = this.sourcesOptions; + for (const key of originalSources) { + /* tslint:disable:no-string-literal */ + this.ddSource.push({ + [key.name]: { + type: key.value, + properties: {} } - } + }); + } + + this.saveSorcesDataToStore(); } searchDictionary(event: any) { @@ -113,15 +152,20 @@ export class SourcesTemplateComponent implements OnInit { } textChanged(event, item) { - const editedData = JSON.parse(event); - const originalSources = this.sources; - for (const key in originalSources) { - if (key === item.name) { - this.sources[key] = editedData; - } - } - this.option = []; - this.sourcesStore.changeSources(this.sources); + // const editedData = JSON.parse(event); + // const originalSources = this.sources; + // for (const key in originalSources) { + // if (key === item.name) { + // this.sources[key] = editedData; + // } + // } + // this.option = []; + // this.sourcesStore.changeSources(this.sources); + + console.log(item); + console.log(event); + + // this.metaDataTab.sources[item.name].properties = editedData; } } |