diff options
Diffstat (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation')
20 files changed, 1261 insertions, 0 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.spec.ts new file mode 100644 index 000000000..896c7caf0 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.spec.ts @@ -0,0 +1,31 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { TestBed } from '@angular/core/testing'; + +import { DictionaryCreationService } from './dictionary-creation.service'; + +describe('DictionaryCreationService', () => { + beforeEach(() => TestBed.configureTestingModule({})); + + it('should be created', () => { + const service: DictionaryCreationService = TestBed.get(DictionaryCreationService); + expect(service).toBeTruthy(); + }); +}); diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.ts new file mode 100644 index 000000000..df90e6cd1 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.ts @@ -0,0 +1,37 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { Injectable } from '@angular/core'; +import { ResourceDictionaryURLs } from 'src/app/common/constants/app-constants'; +import { Observable } from 'rxjs'; +import { Sources } from '../model/sources.model'; +import { ApiService } from 'src/app/common/core/services/api.service'; + +@Injectable({ + providedIn: 'root' +}) +export class DictionaryCreationService { + + constructor(private api: ApiService) { } + + getSources() { + return this.api.get(ResourceDictionaryURLs.getSources); +} + +} diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.store.ts new file mode 100644 index 000000000..20cec7448 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.store.ts @@ -0,0 +1,53 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { Injectable } from '@angular/core'; +import { Store } from 'src/app/common/core/stores/Store'; +import { ResourceDictionary } from '../model/resource-dictionary.model'; +import { DictionaryCreationService } from './dictionary-creation.service'; +import { MetaData } from '../model/metaData.model'; +import { Sources } from '../model/sources.model'; +import { SourcesStore } from './sources-template/sources.store'; + +@Injectable({ + providedIn: 'root' +}) +export class DictionaryCreationStore extends Store<ResourceDictionary> { + constructor(private dictionaryCreationService: DictionaryCreationService, private sourcesStore: SourcesStore) { + super(new ResourceDictionary()); + } + + changeMetaData(metaDataObject: MetaData) { + console.log(metaDataObject); + this.setState({ + ...this.state, + metaData: metaDataObject + }); + } + + getSources() { + this.sourcesStore.state$.subscribe(data => { + console.log(data); + }); + } + + SaveResourceDictionary(resourceDictionary: ResourceDictionary) { + console.log(this.setState); + } +} diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.css new file mode 100644 index 000000000..f263c0086 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.css @@ -0,0 +1,19 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/
\ No newline at end of file diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.html new file mode 100644 index 000000000..93d7df7d1 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.html @@ -0,0 +1,22 @@ +<!--/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/--> +<ace-editor [(text)]="text" [mode]="'javascript'" [autoUpdateContent]="true" +[durationBeforeCallback]="1000" (textChanged)="textChanged($event)" [theme]="'tomorrow_night_bright'" #editor style="height:500px;"> +</ace-editor> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.spec.ts new file mode 100644 index 000000000..09dcdbd37 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.spec.ts @@ -0,0 +1,44 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DictionaryEditorComponent } from './dictionary-editor.component'; + +describe('DictionaryEditorComponent', () => { + let component: DictionaryEditorComponent; + let fixture: ComponentFixture<DictionaryEditorComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ DictionaryEditorComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DictionaryEditorComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); 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 new file mode 100644 index 000000000..92b27c24c --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.ts @@ -0,0 +1,38 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-dictionary-editor', + templateUrl: './dictionary-editor.component.html', + styleUrls: ['./dictionary-editor.component.css'] +}) +export class DictionaryEditorComponent implements OnInit { + constructor() { + } + + ngOnInit() { + } + + textChanged(event) { + console.log(event); + } +} + diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.css new file mode 100644 index 000000000..f263c0086 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.css @@ -0,0 +1,19 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/
\ 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.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html new file mode 100644 index 000000000..bea6081c0 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html @@ -0,0 +1,91 @@ +<!--/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/--> +<div class="card creat-card col-11"> + <div class="single-line-model"> + <label class="label-name">Name</label> + <div class="label-input"> + <input type="input" [(ngModel)]="metaDataTab.name" + placeholder="Topology name.vLB.CDS"> + </div> + <!-- <div class="model-note-container error-message"> + Package name already exists with this version. Please enter a different name or enter different version + number. + </div> --> + </div> + + <!-- <div class="single-line-model"> + <label class="label-name">Version <span>*</span></label> + <div class="label-input"> + <input type="input" [readOnly]="!packageNameAndVersionEnables" [(ngModel)]="metaDataTab.version" + (input)="validatePackageNameAndVersion()" placeholder="Example: 1.0.0"> + </div> + <div class="model-note-container error-message">{{errorMessage}}</div> + </div> --> + <div class="single-line-model"> + <label class="label-name">Entry Schema</label> + <div class="label-input"> + <input type="input" [(ngModel)]="metaDataTab.entrySchema" placeholder="Entry Schema"> + </div> + </div> + <div class="single-line-model"> + <label class="label-name">Data Type</label> + <div class="label-input"> + <input type="input" [(ngModel)]="metaDataTab.dataType" placeholder="Data Type"> + </div> + </div> + <div class="single-line-model"> + <label class="label-name">Description</label> + <div class="label-input"> + <input type="input" [(ngModel)]="metaDataTab.description" placeholder="Descripe the package"> + </div> + </div> + <div class="single-line-model"> + <label class="label-name">Required</label> + <div class="label-input"> + <input type="input" [(ngModel)]="metaDataTab.updatedBy" placeholder="required"> + </div> + </div> + <div class="single-line-model"> + <label class="label-name">Library Instance</label> + <div class="label-input"> + <input type="input" [(ngModel)]="metaDataTab.libraryInstance" placeholder="Library Instance"> + </div> + </div> + <div class="single-line-model"> + <label class="label-name">Derived From</label> + <div class="label-input"> + <input type="input" [(ngModel)]="metaDataTab.derivedFrom" placeholder="Derived From"> + </div> + </div> + + <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" + placeholder="Ex., vDNS-CDS"> + + </div> + <div class="model-note-container tag-notes">Seprate tags with comma or space</div> + <div class="model-note-container tages-container"> + <span *ngFor="let tag of tags" class="single-tage">{{tag}} <i (click)="removeTag(tag)" + class="fa fa-times-circle"></i></span> + </div> + </div> +</div> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.spec.ts new file mode 100644 index 000000000..ce9335ff9 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.spec.ts @@ -0,0 +1,44 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DictionaryMetadataComponent } from './dictionary-metadata.component'; + +describe('DictionaryMetadataComponent', () => { + let component: DictionaryMetadataComponent; + let fixture: ComponentFixture<DictionaryMetadataComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ DictionaryMetadataComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DictionaryMetadataComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); 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 new file mode 100644 index 000000000..d5c4a109b --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.ts @@ -0,0 +1,78 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { Component, OnInit } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; +import { DictionaryModel } from '../../model/dictionary.model'; +import { DictionaryCreationService } from '../dictionary-creation.service'; +import { DictionaryCreationStore } from '../dictionary-creation.store'; +import { MetaData } from '../../model/metaData.model'; + +@Component({ + selector: 'app-dictionary-metadata', + templateUrl: './dictionary-metadata.component.html', + styleUrls: ['./dictionary-metadata.component.css'] +}) +export class DictionaryMetadataComponent implements OnInit { + packageNameAndVersionEnables = true; + counter = 0; + tags = new Set<string>(); + private metaDataTab: MetaData = new MetaData(); + private errorMessage: string; + + constructor( + private route: ActivatedRoute, + private dictionaryCreationService: DictionaryCreationService, + private dictionaryCreationStore: DictionaryCreationStore + ) {} + + ngOnInit() { + this.dictionaryCreationStore.state$.subscribe(element => { + 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); + } + }); + console.log(this.metaDataTab.name); + } + + removeTag(value) { + this.tags.delete(value); + } + + addTag(event) { + const value = event.target.value; + console.log(value); + if (value && value.trim().length > 0) { + event.target.value = ''; + this.tags.add(value); + } + } + + saveMetaDataToStore() { + 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.css b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.css new file mode 100644 index 000000000..f02bd233d --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.css @@ -0,0 +1,37 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +.edit-button{ + color:white; + background:#1B3E6F; + margin-right: 60px; + border: none; + width: 80px; + height: 20px; + margin-top: 25px; + font-size: 10px; + padding-left:5px; + padding-top: 3px; + } + .ed{ + justify-content: space-between; + } + .single-line-model{ + margin:20px; + }
\ No newline at end of file diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.html new file mode 100644 index 000000000..bf183216d --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.html @@ -0,0 +1,122 @@ +<!--/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/--> +<app-header></app-header> + +<div class="new-wrapper"> + <div class="container-fluid main-container"> + <header class="page-title"> + <div class="row"> + <h2 class="col m-0 pb-0"> + <ul class="breadcrumb-header"> + <li><a routerLink="/resource-dictionary">Resource Dictionary</a></li> + <i class="fa fa-angle-right ml-2 mr-2"></i> + <li>Dictionary Name</li> + </ul> + </h2> + </div> + </header> + <div class="container-fluid body-container"> + <div class="container card creat-card col-11"> + <div class="single-line-model customKeyTitle"> + <h5 class="label-name w-100 "> + Dictionary Name + </h5> + <!-- <label class="label-name"></label> --> + <span>Last modified {{createDate}} by me</span> + </div> + </div> + </div> + <div class="container-fluid body-container"> + <div class="container"> + <div class="creat-action-container"> + <a class="action-button" (click)="saveDictionaryToStore()"> + <i class="icon-save-sm" aria-hidden="true"></i> + <span>Save</span> + </a> + <a href="#" class="action-button" (click)="goBackToDashBorad()"> + <i class="icon-discard-sm" aria-hidden="true"></i> + <span>Discard Changes</span> + </a> + <a href="#" class="action-button"> + <i class="icon-clone-sm" aria-hidden="true"></i> + <span>Clone</span> + </a> + <a href="#" class="action-button delete"> + <i class="icon-delete-sm" aria-hidden="true"></i> + <span>Delete</span> + </a> + </div> + <nav class="row"> + <!--Nav Tabs--> + <div class="col"> + <div class="nav nav-tabs ed" id="nav-tab" role="tablist"> + <a class="nav-item nav-link active" id="nav-metadata-tab" data-toggle="tab" + href="#nav-metadata" role="tab" aria-controls="nav-metadata" aria-selected="false" + autofocus #nameit (focusout)="test()">METADATA</a> + <a class="edit-button" id="nav-editor-tab" data-toggle="tab" href="#nav-editor" + role="tab" aria-controls="nav-editor" aria-selected="false">EDITOR MODE</a> + + </div> + </div> + </nav> + <div> + <div class="row mt-4"> + <div class="col"> + <div class="tab-content" id="nav-tabContent"> + <div class="tab-pane fade show active" id="nav-metadata" role="tabpanel" + aria-labelledby="nav-metadata-tab"> + <app-dictionary-metadata></app-dictionary-metadata> + <nav class="row"> + <!--Nav Tabs--> + <div class="col"> + <div class="nav nav-tabs " id="nav-tab" role="tablist"> + <a class="nav-item nav-link active" id="nav-source-tab" data-toggle="tab" + href="#nav-source" role="tab" aria-controls="nav-source" aria-selected="false" + >SOURCES</a> + </div> + </div> + </nav> + <div class="row mt-4"> + <div class="col"> + <div class="tab-content" id="nav-tabContent"> + <div class="tab-pane fade show active" id="nav-source" role="tabpanel" + aria-labelledby="nav-source-tab"> + <app-sources-template></app-sources-template> + </div> + </div> + </div> + </div> + </div> + <div class="tab-pane fade col-11" id="nav-editor" role="tabpanel" + aria-labelledby="nav-editor-tab"> + <div class="card creat-card"> + <div class="editor-container"> + <app-dictionary-editor></app-dictionary-editor> + </div></div> + </div> + </div> + </div> + </div> + + + </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/resource-dictionary-creation.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.spec.ts new file mode 100644 index 000000000..b1e6b6d24 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.spec.ts @@ -0,0 +1,44 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ResourceDictionaryCreationComponent } from './resource-dictionary-creation.component'; + +describe('ResourceDictionaryCreationComponent', () => { + let component: ResourceDictionaryCreationComponent; + let fixture: ComponentFixture<ResourceDictionaryCreationComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ResourceDictionaryCreationComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ResourceDictionaryCreationComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); 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 new file mode 100644 index 000000000..1a3484bae --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.ts @@ -0,0 +1,76 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { Component, OnInit, ViewChild, ElementRef } from '@angular/core'; +import { Router } from '@angular/router'; +import { DictionaryCreationStore } from './dictionary-creation.store'; +import { DictionaryModel } from '../model/dictionary.model'; +import { Definition } from '../model/definition.model'; +import { DictionaryMetadataComponent } from './dictionary-metadata/dictionary-metadata.component'; +import { SourcesTemplateComponent } from './sources-template/sources-template.component'; + +@Component({ + selector: 'app-resource-dictionary-creation', + templateUrl: './resource-dictionary-creation.component.html', + styleUrls: ['./resource-dictionary-creation.component.css'] +}) +export class ResourceDictionaryCreationComponent implements OnInit { + + constructor(private router: Router, private dictionaryCreationStore: DictionaryCreationStore) { + } + + modes: object[] = [ + {name: 'Designer Mode', style: 'mode-icon icon-designer-mode'}, + {name: 'Scripting Mode', style: 'mode-icon icon-scripting-mode'} + ]; + + private metaDataTab: DictionaryModel = new DictionaryModel(); + private definition: Definition = new Definition(); + + @ViewChild(DictionaryMetadataComponent, {static: false}) + private metadataTabComponent: DictionaryMetadataComponent; + + @ViewChild(SourcesTemplateComponent, {static: false}) + private sourcesTemplateComponent: SourcesTemplateComponent; + + @ViewChild('nameit', {static: true}) + private elementRef: ElementRef; + + ngOnInit() { + this.elementRef.nativeElement.focus(); + // this.elementRef2.nativeElement.focus(); + } + + saveDictionaryToStore() { + this.dictionaryCreationStore.getSources(); + this.dictionaryCreationStore.state$.subscribe(dd => { + console.log(dd); + }); + } + + test() { + this.metadataTabComponent.saveMetaDataToStore(); + this.sourcesTemplateComponent.saveSorcesDataToStore(); + } + + goBackToDashBorad() { + this.router.navigate(['/resource-dictionary']); + } + +} diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.css new file mode 100644 index 000000000..7799d915f --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.css @@ -0,0 +1,208 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +.source{ + left: 20px; + width: 72%; +} +.source1{ + width: 25%; + background-color:#F4F9FE; +} +h5{ + padding-top: 10px; + padding-left: 10px; + background-color:white; + height: 40px; + width: 100%; +} +.mat-form-field + .mat-form-field { + margin-left: 8px; +} +mat-expansion-panel-header{ + background-color:#E0E8F2; +} +mat-panel-title{ + color:#1B3E6F; +} +mat-expansion-panel{ + border-radius: 0px; + border-left: none; +} +.example-list .card{ + margin-bottom: 10px !important; +} +.expansion-panel{ + border: none; + background: white; + border-radius: 0px; + overflow: hidden; + display: block; + width: 100%; + color:#1B3E6F; + } +.example-container { + width: 230px; + max-width: 100%; + margin: 10px 10px 15px 0; + display: inline-block; + vertical-align: top; + border-radius: 2px; + height: 260px; + background-color:#F4F9FE; + } + .example-container2 { + width: 630px; + max-width: 100%; + margin: 10px 10px 5px 0; + display: inline-block; + vertical-align: top; + border-radius: 2px; + height: 300px; + background-color:#F4F9FE; + } + + .example-list { + min-height: 12px; + border-radius: 0px; + overflow: hidden; + display: block; + margin: 5px; + overflow-y:scroll; + overflow-x:hidden; + margin-left: 15px; + width: 195px; + margin-top: 15px; + } + + .example-list1 { + min-height: 12px; + border-radius: 0px; + overflow: hidden; + display: block; + margin: 5px; + overflow-y:hidden; + overflow-x:hidden; + } + + .checkbox{ + margin-left: 11%; + } + .example-box { + padding: 2px 1px; + display: flex; + flex-direction: row; + align-items: center; + justify-content: left; + box-sizing: border-box; + cursor: move; + font-size: 14px; + + } + .example-box1 { + padding: 1px 1px; + display: flex; + flex-direction: row; + align-items: center; + justify-content: left; + box-sizing: border-box; + cursor: move; + font-size: 14px; + border-radius: 0px !important; + } + + .cdk-drag-preview { + box-sizing: border-box; + border-radius: 4px; + box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), + 0 8px 10px 1px rgba(0, 0, 0, 0.14), + 0 3px 14px 2px rgba(0, 0, 0, 0.12); + } + + .cdk-drag-placeholder { + opacity: 0; + } + + .cdk-drag-animating { + transition: transform 250ms cubic-bezier(0, 0, 0.2, 1); + } + + .example-box:last-child { + border: none; + } + + .example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder) { + transition: transform 250ms cubic-bezier(0, 0, 0.2, 1); + } + +.searchText{ + width: 180px; + /* border-top: solid 2px #F4F9FE; */ + border: 0px; + color: #1B3E6F; + font-size: 13px; + margin-top: 2px; +} +.searchBox{ + position: relative; + top: 0%; + right: 0%; + height: 35px; + border-top: solid 2px #F4F9FE; + width: 100%; + margin-left:0px; + background-color:white; +} + +.searchButton1{ + float: left; + padding-left: 0 !important; + height: 30px; + width:30px; + background: url(src/assets/img/icon-search.svg) center center no-repeat; + border: 0 !important; + margin-right:0px; +} +.action-button1{ + margin-left:50px; + padding: 1px 6px; + box-shadow: none; + color:white; + font-size: 14px; + height: 25px; + background-color:#007bff; + border-radius:16px; + border:solid 0.5px #ededed; +} +.footer{ + margin: 1px 0px; +} +.delete{ + color: red; + font-size: 14px; + margin: 2px; +} +.footer input{ + margin: 6px 0px 1px 5px; +} +.select-button{ + color: #007bff; + font-size: 14px; + margin: 2px; +}
\ 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.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html new file mode 100644 index 000000000..b274ce95d --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html @@ -0,0 +1,85 @@ +<!--/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============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="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)"> + {{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> + </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> +</div> +</div> + diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.spec.ts new file mode 100644 index 000000000..e9bd4ff43 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.spec.ts @@ -0,0 +1,44 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SourcesTemplateComponent } from './sources-template.component'; + +describe('SourcesTemplateComponent', () => { + let component: SourcesTemplateComponent; + let fixture: ComponentFixture<SourcesTemplateComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SourcesTemplateComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SourcesTemplateComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); 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 new file mode 100644 index 000000000..4a4f215cd --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts @@ -0,0 +1,109 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { Component, OnInit} from '@angular/core'; +import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop'; +import { SourcesStore } from './sources.store'; + +@Component({ + selector: 'app-sources-template', + templateUrl: './sources-template.component.html', + styleUrls: ['./sources-template.component.css'] +}) +export class SourcesTemplateComponent implements OnInit { + private searchQuery = ''; + lang = 'json'; + sources = []; + option = []; + sourcesOptions = []; + textValue: any; + selectItem: boolean; + ddSource = []; + checked: boolean; + selectedArray = []; + constructor(private sourcesStore: SourcesStore) { + this.sourcesStore.state$.subscribe(sources => { + this.sources = sources.sources; + for (const key in this.sources) { + if (key) { + const sourceObj = { name: key, value: JSON.stringify(this.sources[key] )}; + this.option.push(sourceObj); + } + } + }); + } + + ngOnInit() { + this.sourcesStore.getAllSources(); + } + + saveSorcesDataToStore() { + this.sourcesStore.saveSources(this.ddSource); + } + + drop(event: CdkDragDrop<string[]>) { + this.ddSource = []; + if (event.previousContainer === event.container) { + moveItemInArray(event.container.data, event.previousIndex, event.currentIndex); + } else { + transferArrayItem(event.previousContainer.data, + event.container.data, + event.previousIndex, + event.currentIndex); + } + + for (const key2 in this.sources) { + if (key2) { + const originalSources = this.sourcesOptions; + for (const key of originalSources) { + if (key.name === key2) { + const obj = `{${key.name}: ${key.value}}`; + this.ddSource.push(obj); + } + } + } + } + } + + searchDictionary(event: any) { + this.searchQuery = event.target.value; + this.searchQuery = this.searchQuery.trim(); + console.log(this.searchQuery); + // this.dictionaryStore.search(this.searchQuery); + } + + onChange(item: string, isChecked: boolean) { + if (isChecked) { + this.selectedArray.push(item); + } + } + + 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); + } + +} diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources.store.ts new file mode 100644 index 000000000..7da8f03d3 --- /dev/null +++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources.store.ts @@ -0,0 +1,60 @@ +/* +* ============LICENSE_START======================================================= +* ONAP : CDS +* ================================================================================ +* Copyright (C) 2020 TechMahindra +*================================================================================= +* Licensed under the Apache License, Version 2.0 (the "License"); +* you may not use this file except in compliance with the License. +* You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, software +* distributed under the License is distributed on an "AS IS" BASIS, +* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +* See the License for the specific language governing permissions and +* limitations under the License. +* ============LICENSE_END========================================================= +*/ +import { Sources } from '../../model/sources.model'; +import { Store } from 'src/app/common/core/stores/Store'; +import { Injectable } from '@angular/core'; +import { DictionaryCreationService } from '../dictionary-creation.service'; +import { Definition } from '../../model/definition.model'; + +@Injectable({ + providedIn: 'root' +}) +export class SourcesStore extends Store<Sources> { + constructor(private dictionaryCreationService: DictionaryCreationService) { + super(new Sources()); + } + + public getAllSources() { + console.log('getting all sources...'); + this.getSources(); + } + + protected getSources() { + this.dictionaryCreationService.getSources() + .subscribe((sou) => { + console.log(sou); + this.setState({ + ...this.state, + sources: sou + }); + }); + } + + public changeSources(sou) { + this.setState({ + ...this.state, + sources: sou + }); + } + + public saveSources(sources) { + console.log(sources); + } +} |