@JsonProperty('updated-by')
public updatedBy: string;
public property: Property;
+ public sources: any;
constructor() {
this.name = '';
this.tags = '';
this.updatedBy = '';
this.property = new Property();
+ this.sources = {};
}
}
<div class="single-line-model">
<label class="label-name">Tags</label>
<div class="label-input">
- <input type="input" (keyup.enter)="addTag($event)" [(ngModel)]="metaDataTab.tags"
+ <input type="input" (keyup.enter)="addTag($event)"
placeholder="Ex., vDNS-CDS">
</div>
errorMessage: string;
constructor(
- private route: ActivatedRoute,
- private dictionaryCreationService: DictionaryCreationService,
private dictionaryCreationStore: DictionaryCreationStore
) { }
removeTag(value) {
this.tags.delete(value);
+ this.mergeTags();
}
const value = event.target.value;
console.log(value);
if (value && value.trim().length > 0) {
- let tag = '';
event.target.value = '';
this.tags.add(value);
- this.tags.forEach(val => {
- tag += val + ', ';
- });
+ // merge
+ this.mergeTags();
}
}
+ mergeTags() {
+ let tag = '';
+ this.tags.forEach((val, index) => {
+ tag += val + ', ';
+ });
+ this.metaDataTab.tags = tag.trim();
+ this.saveMetaDataToStore();
+ }
+
saveMetaDataToStore() {
console.log(this.metaDataTab);
this.dictionaryCreationStore.changeMetaData(this.metaDataTab);
* ============LICENSE_END=========================================================
*/-->
<div class="col-11">
- <div class= "row ">
- <div class="card creat-card source1">
- <h5 class="label-name"> Sources Options</h5>
- <div class="searchBox row"><i class="searchButton1 col-1" aria-hidden="true"></i>
- <input class="searchText col-8" [(ngModel)]="searchText" type="input" placeholder="filter sources">
- </div>
-
- <div class="example-container">
- <div
- cdkDropList
- #todoList="cdkDropList"
- [cdkDropListData]="option"
- [cdkDropListConnectedTo]="[doneList]"
- class="example-list"
- (cdkDropListDropped)="drop($event)">
+ <div class="row ">
+ <div class="card creat-card source1">
+ <h5 class="label-name"> Sources Options</h5>
+ <div class="searchBox row"><i class="searchButton1 col-1" aria-hidden="true"></i>
+ <input class="searchText col-8" [(ngModel)]="searchText" type="input" placeholder="filter sources">
+ </div>
+
+ <div class="example-container">
+ <div cdkDropList #todoList="cdkDropList" [cdkDropListData]="option" [cdkDropListConnectedTo]="[doneList]"
+ class="example-list" (cdkDropListDropped)="drop($event)">
<div class="example-box card creat-card" *ngFor="let item of option| search :searchText" cdkDrag>
- <input type="checkbox" class="checkbox" [(ngModel)]="checked" (change)="onChange(item, $event.target.checked)">
+ <input type="checkbox" class="checkbox" [(ngModel)]="checked"
+ (change)="onChange(item, $event.target.checked)">
{{item.name}}
</div>
-
+
</div>
-
+
</div>
<div class="footer row">
<a class="select-button col-sm-05">Select all</a>
- <button class="action-button1 col-sm-04" >Add to list</button>
+ <button class="action-button1 col-sm-04">Add to list</button>
</div>
- </div>
-
- <div class="card creat-card source">
- <h5 class="label-name">Sources List</h5>
- <div class="example-container2 card creat-card">
- <div
- cdkDropList
- #doneList="cdkDropList"
- [cdkDropListData]="sourcesOptions"
- [cdkDropListConnectedTo]="[todoList]"
- class="example-list1"
- (cdkDropListDropped)="drop($event)">
-
- <div class="example-box1" *ngFor="let item of sourcesOptions" cdkDrag>
- <input type="checkbox" value="item.name">
- <mat-expansion-panel class="expansion-panel">
- <mat-expansion-panel-header [collapsedHeight]="'23px'" [expandedHeight]="'23px'">
- <mat-panel-title>
- {{item.name}}
- </mat-panel-title>
- </mat-expansion-panel-header>
- <br>
- <ace-editor [(text)]=item.value [mode]="'javascript'" [autoUpdateContent]="true"
- [durationBeforeCallback]="1000" (textChanged)="textChanged($event,item)" [theme]="'tomorrow_night_bright'" #editor style="height:300px;">
- </ace-editor>
- </mat-expansion-panel>
- </div>
-
- </div>
-
- </div>
- <div>
- <a type="submit" class="delete">Delete</a>
+ </div>
+
+ <div class="card creat-card source">
+ <h5 class="label-name">Sources List</h5>
+ <div class="example-container2 card creat-card">
+ <div cdkDropList #doneList="cdkDropList" [cdkDropListData]="sourcesOptions"
+ [cdkDropListConnectedTo]="[todoList]" class="example-list1" (cdkDropListDropped)="drop($event)">
+
+ <div class="example-box1" *ngFor="let item of sourcesOptions" cdkDrag>
+ <input type="checkbox" value="item.name">
+ <mat-expansion-panel class="expansion-panel">
+ <mat-expansion-panel-header [collapsedHeight]="'23px'" [expandedHeight]="'23px'">
+ <mat-panel-title>
+ {{item.name}}
+ </mat-panel-title>
+ </mat-expansion-panel-header>
+ <br>
+ <ace-editor [mode]="'json'" [autoUpdateContent]="true" [durationBeforeCallback]="1000"
+ (textChanged)="textChanged($event,item)" [theme]="'tomorrow_night_bright'" #editor
+ style="height:300px;">
+ </ace-editor>
+ </mat-expansion-panel>
</div>
- </div>
-</div>
-</div>
+ </div>
+
+ </div>
+ <div>
+ <a type="submit" class="delete">Delete</a>
+ </div>
+ </div>
+ </div>
+</div>
\ No newline at end of file
import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
import { SourcesStore } from './sources.store';
import { DictionaryCreationService } from '../dictionary-creation.service';
+import { DictionaryCreationStore } from '../dictionary-creation.store';
+import { MetaData } from '../../model/metaData.model';
@Component({
selector: 'app-sources-template',
searchText = '';
text = '';
selectedArray = [];
+ metaDataTab: MetaData = new MetaData();
+
constructor(
private sourcesStore: SourcesStore,
- private dictionaryCreationService: DictionaryCreationService
+ private dictionaryCreationService: DictionaryCreationService,
+ private dictionaryCreationStore: DictionaryCreationStore
) {
}
}
});
+
+ this.dictionaryCreationStore.state$.subscribe(element => {
+ console.log('################');
+ console.log(this.metaDataTab);
+ if (element && element.metaData) {
+ this.metaDataTab = element.metaData;
+ this.addSourcesInUI();
+ }
+ });
+ }
+
+ addSourcesInUI() {
+ // add sources from json to UI
+ const originalSources = this.sourcesOptions;
+ // for (const key of this.sourcesOptions) {
+ // this.sourcesOptions;
+ for (const source in this.metaDataTab.sources) {
+ if (source) {
+ console.log(source);
+ }
+ }
}
saveSorcesDataToStore() {
- this.sourcesStore.saveSources(this.ddSource);
+ console.log(this.ddSource);
+ this.metaDataTab.sources = {};
+ for (const obj of this.ddSource) {
+ this.metaDataTab.sources = { ...this.metaDataTab.sources, ...obj };
+ }
+ // this.metaDataTab.sources = { ...this.ddSource }
+ console.log(this.metaDataTab.sources);
+ this.dictionaryCreationStore.changeMetaData(this.metaDataTab);
}
drop(event: CdkDragDrop<string[]>) {
console.log('-------------');
- console.log(event);
- this.ddSource = [];
+ // console.log(event);
+
if (event.previousContainer === event.container) {
moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
} else {
event.currentIndex);
}
- for (const key2 in this.sources) {
- if (key2) {
- const originalSources = this.sourcesOptions;
- for (const key of originalSources) {
- /* tslint:disable:no-string-literal */
- if (key.name === key2['name']) {
- const obj = `{${key.name}: ${key.value}}`;
- this.ddSource.push(obj);
- }
+ console.log(this.sourcesOptions);
+ console.log(this.sources);
+
+ this.ddSource = [];
+
+ const originalSources = this.sourcesOptions;
+ for (const key of originalSources) {
+ /* tslint:disable:no-string-literal */
+ this.ddSource.push({
+ [key.name]: {
+ type: key.value,
+ properties: {}
}
- }
+ });
+
}
+
+ this.saveSorcesDataToStore();
}
searchDictionary(event: any) {
}
textChanged(event, item) {
- const editedData = JSON.parse(event);
- const originalSources = this.sources;
- for (const key in originalSources) {
- if (key === item.name) {
- this.sources[key] = editedData;
- }
- }
- this.option = [];
- this.sourcesStore.changeSources(this.sources);
+ // const editedData = JSON.parse(event);
+ // const originalSources = this.sources;
+ // for (const key in originalSources) {
+ // if (key === item.name) {
+ // this.sources[key] = editedData;
+ // }
+ // }
+ // this.option = [];
+ // this.sourcesStore.changeSources(this.sources);
+
+ console.log(item);
+ console.log(event);
+
+ // this.metaDataTab.sources[item.name].properties = editedData;
}
}
Code Review / ccsdk / cds.git / commitdiff