From 50b86c6a59e2a65c4a2ff5c97997bba21da6a98b Mon Sep 17 00:00:00 2001 From: Ahmedeldeeb50 Date: Wed, 13 Jan 2021 19:50:20 +0200 Subject: [PATCH] enable 2-way binding between metadata and editor tabs Issue-ID: CCSDK-3083 Signed-off-by: Ahmedeldeeb50 Change-Id: I9073e6c9a50e5d2ba34ab60666135cead718e059 --- .../resource-dictionary/model/metaData.model.ts | 49 ++++++++++++++++++---- .../dictionary-editor.component.ts | 9 +++- .../dictionary-metadata.component.html | 24 +++++------ .../dictionary-metadata.component.ts | 33 ++++++++++----- .../resource-dictionary-creation.component.ts | 1 + .../sources-template/sources-template.component.ts | 36 +++++++++++----- 6 files changed, 109 insertions(+), 43 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 26420882c..92e6bce43 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 @@ -1,3 +1,5 @@ +import { JsonObject, JsonProperty } from 'json2typescript'; + /* * ============LICENSE_START======================================================= * ONAP : CDS @@ -17,17 +19,46 @@ * limitations under the License. * ============LICENSE_END========================================================= */ - +@JsonObject() export class MetaData { + @JsonProperty('name') public name: string; - public dataType: string; - public description: string; - public entrySchema: string; - public updatedBy: string; public tags: string; - public required: string; + @JsonProperty('updated-by') + public updatedBy: string; + public property: Property; - public createdDate: string; - public libraryInstance: string; - public derivedFrom: string; + constructor() { + this.name = ''; + this.tags = ''; + this.updatedBy = ''; + this.property = new Property(); + } +} + +@JsonObject() +export class Property { + public description: string; + type: string; + required: boolean; + @JsonProperty('entry_schema') + // tslint:disable-next-line: variable-name + entry_schema: EntrySchema = new EntrySchema(); + + constructor() { + this.description = ''; + this.type = ''; + this.entry_schema = new EntrySchema(); + this.required = false; + } + +} +@JsonObject() +export class EntrySchema { + type: string; + constraints: []; + constructor() { + this.type = ''; + this.constraints = []; + } } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.ts index 63725a228..a55159ad5 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.ts @@ -17,6 +17,7 @@ * limitations under the License. * ============LICENSE_END========================================================= */ +import { JsonPipe } from '@angular/common'; import { Component, OnInit } from '@angular/core'; import { DictionaryCreationService } from '../dictionary-creation.service'; import { DictionaryCreationStore } from '../dictionary-creation.store'; @@ -30,11 +31,17 @@ export class DictionaryEditorComponent implements OnInit { text = ''; constructor( private dictionaryStore: DictionaryCreationStore, - private dictionaryService: DictionaryCreationService + private dictionaryService: DictionaryCreationService, + private pipe: JsonPipe ) { } ngOnInit() { + this.dictionaryStore.state$.subscribe(element => { + if (element && element.metaData) { + this.text = this.pipe.transform(element.metaData); + } + }); } textChanged(event) { 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 bea6081c0..add21e9e1 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 @@ -21,10 +21,9 @@
- +
- @@ -41,39 +40,40 @@
- +
- +
- +
- +
-
+ +
@@ -88,4 +88,4 @@ class="fa fa-times-circle">
-
+ \ No newline at end of file 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 caeac83f1..631a0fffd 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 @@ -44,36 +44,47 @@ export class DictionaryMetadataComponent implements OnInit { ngOnInit() { this.dictionaryCreationStore.state$.subscribe(element => { + console.log(this.metaDataTab); if (element && element.metaData) { - this.metaDataTab.name = element.metaData.name; - this.metaDataTab.description = element.metaData.description; - this.metaDataTab.dataType = element.metaData.dataType; - this.metaDataTab.tags = element.metaData.tags; - this.metaDataTab.entrySchema = element.metaData.entrySchema; - this.metaDataTab.required = element.metaData.required; - this.metaDataTab.libraryInstance = element.metaData.libraryInstance; - this.metaDataTab.derivedFrom = element.metaData.derivedFrom; - console.log(element); + this.metaDataTab = element.metaData; + this.metaDataTab.property.entry_schema = element.metaData.property.entry_schema; + this.tags = new Set(element.metaData.tags.split(',')); + this.tags.delete(''); + this.tags.delete(' '); + + // console.log(element); + // console.log(element.metaData.property['entry_schema']); } }); - console.log(this.metaDataTab.name); + } + // getSources() { + // this.dictionaryCreationService.getSources().subscribe(res => { + // console.log(res); + // }); + // } + removeTag(value) { this.tags.delete(value); } + addTag(event) { 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 + ', '; + }); } } saveMetaDataToStore() { console.log(this.metaDataTab); - // this.dictionaryCreationStore.changeMetaData(this.metaDataTab); + this.dictionaryCreationStore.changeMetaData(this.metaDataTab); } } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.ts index fb454ed1f..8eb126d21 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.ts @@ -66,6 +66,7 @@ export class ResourceDictionaryCreationComponent implements OnInit { } saveDictionaryToStore() { + this.metadataTabComponent.saveMetaDataToStore(); // console.log('00000000000'); // this.dictionaryCreationStore.getSources(); // this.dictionaryCreationStore.state$.subscribe(dd => { 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 1b70a17ef..bec8c4bf3 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 @@ -20,6 +20,7 @@ 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'; @Component({ selector: 'app-sources-template', @@ -29,7 +30,7 @@ import { SourcesStore } from './sources.store'; export class SourcesTemplateComponent implements OnInit { private searchQuery = ''; lang = 'json'; - sources = []; + sources = {}; option = []; sourcesOptions = []; textValue: any; @@ -39,20 +40,32 @@ export class SourcesTemplateComponent implements OnInit { searchText = ''; text = ''; selectedArray = []; - constructor(private sourcesStore: SourcesStore) { - this.sourcesStore.state$.subscribe(sources => { - this.sources = sources.sources; + constructor( + private sourcesStore: SourcesStore, + private dictionaryCreationService: DictionaryCreationService + ) { + + } + + ngOnInit() { + // this.sourcesStore.getAllSources(); + this.dictionaryCreationService.getSources().subscribe(sources => { + // console.log(sources); + this.sources = sources[0]; + // this.sources = { + // "input": "source-input", "rest": "source-rest", "default":"source-default", "capability": "source-capability", + // "sdnc": "source-rest", "vault-data": "source-rest", "processor-db": "source-db", "aai-data": "source-rest", + // "script": "source-capability" + // }; for (const key in this.sources) { if (key) { - const sourceObj = { name: key, value: JSON.stringify(this.sources[key]) }; + console.log(key + ' - ' + this.sources[key]); + const sourceObj = { name: key, value: this.sources[key] }; this.option.push(sourceObj); } } - }); - } - ngOnInit() { - this.sourcesStore.getAllSources(); + }); } saveSorcesDataToStore() { @@ -60,6 +73,8 @@ export class SourcesTemplateComponent implements OnInit { } drop(event: CdkDragDrop) { + console.log('-------------'); + console.log(event); this.ddSource = []; if (event.previousContainer === event.container) { moveItemInArray(event.container.data, event.previousIndex, event.currentIndex); @@ -74,7 +89,8 @@ export class SourcesTemplateComponent implements OnInit { if (key2) { const originalSources = this.sourcesOptions; for (const key of originalSources) { - if (key.name === key2) { + /* tslint:disable:no-string-literal */ + if (key.name === key2['name']) { const obj = `{${key.name}: ${key.value}}`; this.ddSource.push(obj); } -- 2.16.6