summaryrefslogtreecommitdiffstats
path: root/cds-ui/designer-client
diff options
context:
space:
mode:
authorAhmedeldeeb50 <ahmed.eldeeb.ext@orange.com>2021-01-24 13:30:30 +0200
committerAhmedeldeeb50 <ahmed.eldeeb.ext@orange.com>2021-01-24 13:30:30 +0200
commit0923429c15660d6244b9fecd7ef7ef2877cba5c1 (patch)
treea898b6290767a04df3696b2c0f6be16f4af8c480 /cds-ui/designer-client
parentadcd4f2bc695840e9ecbc05003bc52c675f22fec (diff)
enable user to add sources to the Dictionary
Issue-ID: CCSDK-3083 Signed-off-by: Ahmedeldeeb50 <ahmed.eldeeb.ext@orange.com> Change-Id: Ia8365cbad47d40849a65162829cee1c812bf433b
Diffstat (limited to 'cds-ui/designer-client')
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html13
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.html2
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html77
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts120
4 files changed, 122 insertions, 90 deletions
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 943707e6e..b60bc328a 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,7 +21,7 @@
<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">
+ <input type="input" [(ngModel)]="metaDataTab.name" placeholder="Dictionary Name">
</div>
<!-- <div class="model-note-container error-message">
Package name already exists with this version. Please enter a different name or enter different version
@@ -74,18 +74,17 @@
<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="single-line-model">
+ <label class="label-name">Updated By</label>
<div class="label-input">
- <input type="input" [(ngModel)]="metaDataTab.derivedFrom" placeholder="Derived From">
+ <input type="input" [(ngModel)]="metaDataTab['updated-by']" placeholder="Updated By">
</div>
- </div> -->
+ </div>
<div class="single-line-model">
<label class="label-name">Tags</label>
<div class="label-input">
- <input type="input" (keyup.enter)="addTag($event)"
- placeholder="Ex., vDNS-CDS">
+ <input type="input" (keyup.enter)="addTag($event)" placeholder="Ex., vDNS-CDS">
</div>
<div class="model-note-container tag-notes">Seprate tags with comma or space</div>
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
index 26857e600..00d6e31d3 100644
--- 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
@@ -115,7 +115,7 @@
autofocus #nameit (focusout)="saveDictionaryToStore()">METADATA</a>
<a class="nav-item nav-link" id="nav-source-tab" data-toggle="tab" href="#nav-source"
role="tab" aria-controls="nav-source" aria-selected="false">SOURCES</a>
- <a class="nav-item nav-link edit-button" id="nav-editor-tab" data-toggle="tab"
+ <a class="nav-item nav-link edit-button" (click)="saveDictionaryToStore()" id="nav-editor-tab" data-toggle="tab"
href="#nav-editor" role="tab" aria-controls="nav-editor" aria-selected="false">EDITOR
MODE</a>
</div>
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 14a0b6668..3eddaa79a 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
@@ -32,18 +32,20 @@
(change)="onChange(item, $event.target.checked)">
{{item.name}} -->
<div class="custom-control custom-checkbox">
- <input type="checkbox" class="custom-control-input" id="customControlValidation1" required>
- <label class="custom-control-label" for="customControlValidation1">{{item.name}}</label>
+ <input [disabled]="sourcesOptions.has(item.name)" [checked]="tempSources.has(item.name)"
+ (change)="setTempSources($event,item)" type="checkbox" class="custom-control-input"
+ id="input-{{item.name}}">
+ <label class="custom-control-label" for="input-{{item.name}}">{{item.name}}</label>
</div>
</div>
</div>
</div>
<div class="row sourceOptionActions">
- <div class="col">
+ <div (click)="selectAll()" class="col">
<a>Select all</a>
</div>
<div class="col">
- <button class="btn">Add to list</button>
+ <button (click)="addSources()" class="btn">Add to list</button>
</div>
</div>
</div>
@@ -54,71 +56,30 @@
<h5>Sources List</h5>
<div class="accordion sourceListItems" id="accordionExample">
- <div class="card">
+ <div class="card" *ngFor="let item of sourcesOptions | keyvalue; let i=index">
<div class="card-header" id="headingOne">
<h2 class="mb-0">
- <button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseOne"
- aria-expanded="true" aria-controls="collapseOne">
+ <button class="btn btn-link" type="button" data-toggle="collapse" attr.data-target="#collapse-{{item.key}}"
+ aria-expanded="true" attr.aria-controls="collapse-{{item.key}}">
<div class="custom-control custom-checkbox">
- <input type="checkbox" class="custom-control-input" id="customControlValidation1" required>
- <label class="custom-control-label" for="customControlValidation1"></label>
+ <input (change)="setToDeleteSources($event,item)" type="checkbox" class="custom-control-input"
+ id="current-{{item.key}}" required>
+ <label class="custom-control-label" for="current-{{item.key}}"></label>
</div>
- Collapsible Group Item #1
+ {{item.key}}
</button>
</h2>
</div>
- <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample">
- <div class="card-body">
- Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf
- moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
- Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda
- shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea
- proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim
- aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
- </div>
- </div>
- </div>
- <div class="card">
- <div class="card-header" id="headingTwo">
- <h2 class="mb-0">
- <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo"
- aria-expanded="false" aria-controls="collapseTwo">
- Collapsible Group Item #2
- </button>
- </h2>
- </div>
- <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
+ <div id="collapse-{{item.key}}" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample">
<div class="card-body">
- Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf
- moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
- Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda
- shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea
- proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim
- aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
- </div>
- </div>
- </div>
- <div class="card">
- <div class="card-header" id="headingThree">
- <h2 class="mb-0">
- <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseThree"
- aria-expanded="false" aria-controls="collapseThree">
- Collapsible Group Item #3
- </button>
- </h2>
- </div>
- <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
- <div class="card-body">
- Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf
- moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod.
- Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda
- shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea
- proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim
- aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
+ <ace-editor [mode]="'json'" [autoUpdateContent]="true" [durationBeforeCallback]="1000"
+ [theme]="'tomorrow_night_bright'" #editor style="height:300px;">
+ </ace-editor>
</div>
</div>
</div>
+
</div>
<!-- <div cdkDropList #doneList="cdkDropList" [cdkDropListData]="sourcesOptions" [cdkDropListConnectedTo]="[todoList]"
@@ -141,7 +102,7 @@
</div> -->
<div class="row deleteSource">
<div class="col">
- <a type="submit" class="">Delete Source</a>
+ <a type="button" (click)="deleteSource()" class="">Delete Source</a>
</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.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts
index 1a950163e..25b81994a 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
@@ -34,16 +34,19 @@ export class SourcesTemplateComponent implements OnInit {
lang = 'json';
sources = {};
option = [];
- sourcesOptions = [];
textValue: any;
selectItem: boolean;
- ddSource = [];
+ // ddSource = [];
checked: boolean;
searchText = '';
text = '';
selectedArray = [];
metaDataTab: MetaData = new MetaData();
+ tempSources = new Map();
+ toDeleteSource = new Map<string, any>();
+ sourcesOptions = new Map<string, any>();
+
constructor(
private sourcesStore: SourcesStore,
private dictionaryCreationService: DictionaryCreationService,
@@ -58,9 +61,9 @@ export class SourcesTemplateComponent implements OnInit {
// 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"
+ // "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) {
@@ -95,9 +98,13 @@ export class SourcesTemplateComponent implements OnInit {
}
saveSorcesDataToStore() {
- console.log(this.ddSource);
+ const ddSource = [];
+ for (const key of this.sourcesOptions.keys()) {
+ ddSource.push(this.sourcesOptions.get(key));
+ }
+ console.log(ddSource);
this.metaDataTab.sources = {};
- for (const obj of this.ddSource) {
+ for (const obj of ddSource) {
this.metaDataTab.sources = { ...this.metaDataTab.sources, ...obj };
}
// this.metaDataTab.sources = { ...this.ddSource }
@@ -105,39 +112,104 @@ export class SourcesTemplateComponent implements OnInit {
this.dictionaryCreationStore.changeMetaData(this.metaDataTab);
}
- drop(event: CdkDragDrop<string[]>) {
- console.log('-------------');
- // console.log(event);
+ setTempSources(event, item) {
+ console.log(event.target.checked);
+ if (event.target.checked) {
+ this.tempSources.set(item.name, item);
+ } else {
+ this.tempSources.delete(item.name);
+ }
+ console.log(this.tempSources);
+ }
- if (event.previousContainer === event.container) {
- moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
+ selectAll() {
+ if (this.tempSources.size === 0) {
+ for (const option of this.option) {
+ if (!this.sourcesOptions.has(option.name)) {
+ this.tempSources.set(option.name, option);
+ }
+ }
} else {
- transferArrayItem(event.previousContainer.data,
- event.container.data,
- event.previousIndex,
- event.currentIndex);
+ this.tempSources = new Map<string, any>();
}
+ }
- console.log(this.sourcesOptions);
- console.log(this.sources);
+ setToDeleteSources(event, item) {
+ console.log(event.target.checked);
+ if (event.target.checked) {
+ this.toDeleteSource.set(item.key, item);
+ } else {
+ this.toDeleteSource.delete(item.key);
+ }
- this.ddSource = [];
+ }
- const originalSources = this.sourcesOptions;
- for (const key of originalSources) {
+ addSources() {
+ // this.tempSources
+ const originalSources = this.tempSources;
+ for (const key of originalSources.keys()) {
/* tslint:disable:no-string-literal */
- this.ddSource.push({
- [key.name]: {
- type: key.value,
+ this.sourcesOptions.set(key, {
+ [key]: {
+ type: originalSources.get(key).value,
properties: {}
}
});
}
+ console.log(this.sourcesOptions);
+ this.tempSources.clear();
+ this.saveSorcesDataToStore();
+ }
+
+ deleteSource() {
+ console.log(this.toDeleteSource);
+ for (const key of this.toDeleteSource.keys()) {
+ console.log(key);
+ this.sourcesOptions.delete(key);
+ }
+ this.toDeleteSource = new Map<string, any>();
this.saveSorcesDataToStore();
}
+ // drop(event: CdkDragDrop<string[]>) {
+ // console.log('-------------');
+ // // console.log(event);
+
+ // 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);
+ // }
+
+ // 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();
+ // }
+
+ getMapKey(map) {
+ return Object.assign({}, map.keys());
+ }
+
searchDictionary(event: any) {
this.searchQuery = event.target.value;
this.searchQuery = this.searchQuery.trim();