Resource Dictionary Creation

Adding Resource Dictionary Creation

Change-Id: Ic53018f406ba2cc1f8c878017c816bfce316a362
Issue-ID: CCSDK-1280
Signed-off-by: swapnalipode <sp00501638@techmahindra.com>

4 files changed, 232 insertions, 0 deletions

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);
+    }
+}