<div class="accordion" id="accordionExample">
<div class="card">
<div class="card-header row" id="headingOne">
- <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" data-target="#collapseOne"
+ aria-expanded="true" aria-controls="collapseOne">
Interfaces
</button>
</div>
- <div id="collapseOne" class="collapse show" aria-labelledby="headingOne"
- data-parent="#accordionExample">
+ <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample">
<div class="card-body">
<!--Inputs & Outputs Tabs-->
<ul class="nav nav-pills nav-fill mb-3" id="pills-tab" role="tablist">
<li class="nav-item" role="presentation">
- <a class="nav-link active" id="pills-home-tab" data-toggle="pill"
- href="#pills-home" role="tab" aria-controls="pills-home"
- aria-selected="true">Inputs</a>
+ <a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home"
+ role="tab" aria-controls="pills-home" aria-selected="true">Inputs</a>
</li>
<li class="nav-item" role="presentation">
- <a class="nav-link" id="pills-profile-tab" data-toggle="pill"
- href="#pills-profile" role="tab" aria-controls="pills-profile"
- aria-selected="false">Outputs</a>
+ <a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile"
+ role="tab" aria-controls="pills-profile" aria-selected="false">Outputs</a>
</li>
</ul>
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-home" role="tabpanel"
- aria-labelledby="pills-home-tab">
+ aria-labelledby="pills-home-tab">
<div class="row">
<div class="col">
<!--list-->
<div class="attribute-wrap">
<div class="form-group">
- <label
- for="exampleFormControlTextarea1">artifact-prefix-names
+ <label for="exampleFormControlTextarea1">artifact-prefix-names
<i class="icon-required-star" type="button"
- aria-hidden="true"></i></label>
+ aria-hidden="true"></i></label>
</div>
- <div
- class="custom-control custom-radio custom-control-inline">
- <input type="radio" id="customRadioInline1"
- name="customRadioInline1"
- class="custom-control-input">
- <label class="custom-control-label"
- for="customRadioInline1">Pre-defined
+ <div class="custom-control custom-radio custom-control-inline">
+ <input type="radio" id="customRadioInline1" name="customRadioInline1"
+ class="custom-control-input">
+ <label class="custom-control-label" for="customRadioInline1">Pre-defined
Template</label>
</div>
- <div
- class="custom-control custom-radio custom-control-inline">
- <input type="radio" id="customRadioInline2"
- name="customRadioInline1"
- class="custom-control-input">
- <label class="custom-control-label"
- for="customRadioInline2">Input Drivin
+ <div class="custom-control custom-radio custom-control-inline">
+ <input type="radio" id="customRadioInline2" name="customRadioInline1"
+ class="custom-control-input">
+ <label class="custom-control-label" for="customRadioInline2">Input Drivin
Template</label>
</div>
<br />
- <button type="button" class="btn btn-select-template"><i
- class="icon-add-circle" type="button"
+ <button type="button" data-toggle="modal" data-target="#templateModal"
+ class="btn btn-select-template"><i class="icon-add-circle" type="button"
aria-hidden="true"></i> Select Template</button>
</div>
<!--string-->
<div class="attribute-wrap">
<div class="form-group">
- <label for="exampleInputEmail1">resoluton-key <i
- class="icon-required-star" type="button"
- aria-hidden="true"></i></label>
+ <label for="exampleInputEmail1">resoluton-key <i class="icon-required-star"
+ type="button" aria-hidden="true"></i></label>
<input type="text" class="form-control">
</div>
</div>
<!--integer-->
<div class="attribute-wrap">
<div class="form-group">
- <label for="exampleInputEmail1">request-id <i
- class="icon-required-star" type="button"
- aria-hidden="true"></i></label>
- <input type="number" class="form-control" placeholder=""
- value="356">
+ <label for="exampleInputEmail1">request-id <i class="icon-required-star"
+ type="button" aria-hidden="true"></i></label>
+ <input type="number" class="form-control" placeholder="" value="356">
</div>
</div>
<!--boolean-->
<div class="attribute-wrap">
<div class="form-group">
- <label
- for="exampleFormControlTextarea1">resolution-summary
- <i class="icon-required-star optional-attribute"
- type="button" aria-hidden="true"></i></label>
+ <label for="exampleFormControlTextarea1">resolution-summary
+ <i class="icon-required-star optional-attribute" type="button"
+ aria-hidden="true"></i></label>
</div>
- <div
- class="custom-control custom-radio custom-control-inline">
- <input type="radio" id="customRadioInline1"
- name="customRadioInline1"
- class="custom-control-input">
- <label class="custom-control-label"
- for="customRadioInline1">True</label>
+ <div class="custom-control custom-radio custom-control-inline">
+ <input type="radio" id="customRadioInline1" name="customRadioInline1"
+ class="custom-control-input">
+ <label class="custom-control-label" for="customRadioInline1">True</label>
</div>
- <div
- class="custom-control custom-radio custom-control-inline">
- <input type="radio" id="customRadioInline2"
- name="customRadioInline1"
- class="custom-control-input">
- <label class="custom-control-label"
- for="customRadioInline2">False</label>
+ <div class="custom-control custom-radio custom-control-inline">
+ <input type="radio" id="customRadioInline2" name="customRadioInline1"
+ class="custom-control-input">
+ <label class="custom-control-label" for="customRadioInline2">False</label>
</div>
</div>
<!-- Add Optional Attributes button -->
</div>
</div>
<div class="tab-pane fade" id="pills-profile" role="tabpanel"
- aria-labelledby="pills-profile-tab">2</div>
+ aria-labelledby="pills-profile-tab">2</div>
</div>
</div>
</div>
<div class="accordion" id="accordionExample1">
<div class="card">
<div class="card-header row" id="headingOne">
- <button class="btn btn-link" type="button" data-toggle="collapse"
- data-target="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
+ <button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseTwo"
+ aria-expanded="true" aria-controls="collapseTwo">
Artifacts
</button>
</div>
- <div id="collapseTwo" class="collapse show" aria-labelledby="headingOne"
- data-parent="#accordionExample1">
+ <div id="collapseTwo" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample1">
<div class="card-body">
<div class="row">
- <div class="col-12">
+ <div class="col-12" *ngFor="let file of getKeys(selectedTemplates)">
<a class="template-mapping-list">
- <p>baseconfig</p>
- <span>Mapping</span>
- <span>Template</span>
+ <p>{{file}}</p>
+ <span *ngIf="getValue(file).isMapping">Mapping</span>
+ <span *ngIf="getValue(file).isTemplate">Template</span>
- <a data-toggle="modal"
- data-target="#templateDeletionModal"
- class="accordion-delete deleteTemplate"
- title="Delete Template"><i class="icon-delete-sm"></i></a>
+ <a data-toggle="modal" (click)="fileToDelete = file"
+ data-target="#templateDeletionModal" class="accordion-delete deleteTemplate"
+ title="Delete Template"><i class="icon-delete-sm"></i></a>
</a>
</div>
- <div class="col-12">
- <a class="template-mapping-list">
- <p>vpkg</p>
- <span>Mapping</span>
- <span>Template</span>
- <a data-toggle="modal"
- data-target="#templateDeletionModal"
- class="accordion-delete deleteTemplate"
- title="Delete Template"><i class="icon-delete-sm"></i></a>
- </a>
- </div>
</div>
</div>
</div>
</div>
</div>
</div>
+
+<!--function - Select Template - Modal-->
+<div class="modal fade" id="templateModal" tabindex="-1" role="dialog" aria-labelledby="templateModalTitle"
+ aria-hidden="true">
+ <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h5 class="modal-title" id="templateModalTitle">
+ Select Pre-defined Tempalte Name</h5>
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+ <img src="assets/img/icon-close.svg" />
+ </button>
+ </div>
+ <div class="modal-body createAttributeTabs">
+ <div class="col-4" *ngFor="let file of getKeys(templateAndMappingMap)">
+ <a class="template-mapping-list float" [ngClass]="{'active':selectedTemplates.has(file)}">
+ <p (click)="setTemplate(file)">{{file}}</p>
+ <span *ngIf="getValue(file).isMapping">Mapping</span>
+ <span *ngIf="getValue(file).isTemplate">Template</span>
+ </a>
+
+ </div>
+
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
+ <button type="button" class="btn btn-primary" data-dismiss="modal" (click)="addTemplates()">Add
+ Templates</button>
+ </div>
+ </div>
+ </div>
+</div>
+
+<!-- Delete Modal -->
+<div class="modal fade" id="templateDeletionModal" tabindex="-1" role="dialog"
+ aria-labelledby="templateDeletionModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h5 class="modal-title" id="templateDeletionModalLabel">Delete Script</h5>
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+ <img src="assets/img/icon-close.svg" />
+ </button>
+ </div>
+ <div class="modal-body">
+ <p>Are you sure you want to delete Template file
+ <span>{{fileToDelete}}</span>?</p>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
+ <button type="button" (click)="setTemplate(fileToDelete)" data-dismiss="modal"
+ class="btn btn-primary">Delete</button>
+ </div>
+ </div>
+ </div>
+</div>
\ No newline at end of file
-import {Component, OnDestroy, OnInit} from '@angular/core';
-import {DesignerStore} from '../designer.store';
-import {PackageCreationStore} from '../../package-creation/package-creation.store';
-import {Subject} from 'rxjs';
-import {distinctUntilChanged, takeUntil} from 'rxjs/operators';
-import {CBAPackage} from '../../package-creation/mapping-models/CBAPacakge.model';
+import { Component, OnDestroy, OnInit } from '@angular/core';
+import { DesignerStore } from '../designer.store';
+import { PackageCreationStore } from '../../package-creation/package-creation.store';
+import { Subject } from 'rxjs';
+import { distinctUntilChanged, takeUntil } from 'rxjs/operators';
+import { CBAPackage } from '../../package-creation/mapping-models/CBAPacakge.model';
+import { TemplateAndMapping } from '../../package-creation/template-mapping/TemplateAndMapping';
@Component({
selector: 'app-functions-attribute',
export class FunctionsAttributeComponent implements OnInit, OnDestroy {
ngUnsubscribe = new Subject();
- private designerDashboardState: DecodeSuccessCallback;
- private cbaPackage: CBAPackage;
+ designerDashboardState: DecodeSuccessCallback;
+ cbaPackage: CBAPackage;
+ templateAndMappingMap = new Map<string, TemplateAndMapping>();
+ selectedTemplates = new Map<string, TemplateAndMapping>();
+ fileToDelete: string;
- constructor(private designerStore: DesignerStore,
- private packageCreationStore: PackageCreationStore) {
+ constructor(
+ private designerStore: DesignerStore,
+ private packageCreationStore: PackageCreationStore
+ ) {
}
ngOnInit() {
takeUntil(this.ngUnsubscribe))
.subscribe(cbaPackage => {
this.cbaPackage = cbaPackage;
+ console.log('File name =>================== ');
+ console.log(this.cbaPackage.templates.files);
+ this.cbaPackage.templates.files.forEach((value, key) => {
+ console.log('File name => ' + key);
+ const templateAndMapping = new TemplateAndMapping();
+ templateAndMapping.isTemplate = true;
+ const isFromTemplate = true;
+ this.setIsMappingOrTemplate(key, templateAndMapping, isFromTemplate);
+ });
+
+ this.cbaPackage.mapping.files.forEach((value, key) => {
+ const templateAndMapping = new TemplateAndMapping();
+ templateAndMapping.isMapping = true;
+ const isFromTemplate = false;
+ this.setIsMappingOrTemplate(key, templateAndMapping, isFromTemplate);
+ });
});
}
this.ngUnsubscribe.next();
this.ngUnsubscribe.complete();
}
+ // Template logic
+
+ private setIsMappingOrTemplate(key: string, templateAndMapping: TemplateAndMapping, isFromTemplate: boolean) {
+ const nameOfFile = isFromTemplate ?
+ key.split('/')[1].split('.')[0].split('-template')[0]
+ : key.split('/')[1].split('.')[0].split('-mapping')[0];
+ // const fullName = nameOfFile + ',' + key.split('.');
+ if (this.templateAndMappingMap.has(nameOfFile)) {
+ const templateAndMappingExisted = this.templateAndMappingMap.get(nameOfFile);
+ !isFromTemplate ? templateAndMappingExisted.isMapping = true : templateAndMappingExisted.isTemplate = true;
+ this.templateAndMappingMap.set(nameOfFile, templateAndMappingExisted);
+ } else {
+ this.templateAndMappingMap.set(nameOfFile, templateAndMapping);
+ }
+
+ }
+
+ addTemplates() { }
+
+ setTemplate(file: string) {
+ if (this.selectedTemplates.has(file)) {
+ this.selectedTemplates.delete(file);
+ } else {
+ this.selectedTemplates.set(file, this.templateAndMappingMap.get(file));
+ }
+ console.log(this.selectedTemplates);
+ }
+
+ getKeys(templateAndMappingMap: Map<string, TemplateAndMapping>) {
+ return Array.from(templateAndMappingMap.keys());
+ }
+ getValue(file: string) {
+ return this.templateAndMappingMap.get(file);
+ }
}
Code Review / ccsdk / cds.git / commitdiff