summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorAhmedEldeeb50 <ahmed.eldeeb.ext@orange.com>2020-05-02 18:06:36 +0200
committerAhmedEldeeb50 <ahmed.eldeeb.ext@orange.com>2020-05-02 18:06:36 +0200
commit1882380466bbdefeff8ce51da825f16cb21ce184 (patch)
treef45db4328466df626b4827430fa30eaa864d0043
parent6b6ac70007ba2b52c6beb8c0d22453a628c891f3 (diff)
Package > Temp&Mapp: View
Issue-ID: CCSDK-2324 Signed-off-by: AhmedEldeeb50 <ahmed.eldeeb.ext@orange.com> Change-Id: I39b3a84893d048a6186f6daf4195c20dbcdb98b9
-rw-r--r--cds-ui/designer-client/angular.json14
-rw-r--r--cds-ui/designer-client/package-lock.json8
-rw-r--r--cds-ui/designer-client/package.json1
-rw-r--r--cds-ui/designer-client/src/app/app.module.ts2
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts4
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.css4
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html25
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts59
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html6
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.ts2
10 files changed, 87 insertions, 38 deletions
diff --git a/cds-ui/designer-client/angular.json b/cds-ui/designer-client/angular.json
index 256c35c1e..e503c1535 100644
--- a/cds-ui/designer-client/angular.json
+++ b/cds-ui/designer-client/angular.json
@@ -25,6 +25,7 @@
],
"styles": [
"src/styles.css",
+ "node_modules/ngx-toastr/toastr.css",
"./node_modules/datatables.net-dt/css/jquery.dataTables.css",
"./node_modules/bootstrap/dist/css/bootstrap.min.css",
"./node_modules/@angular/material/prebuilt-themes/purple-green.css",
@@ -61,12 +62,10 @@
},
"configurations": {
"production": {
- "fileReplacements": [
- {
- "replace": "src/environments/environment.ts",
- "with": "src/environments/environment.prod.ts"
- }
- ],
+ "fileReplacements": [{
+ "replace": "src/environments/environment.ts",
+ "with": "src/environments/environment.prod.ts"
+ }],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
@@ -76,8 +75,7 @@
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
- "budgets": [
- {
+ "budgets": [{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
diff --git a/cds-ui/designer-client/package-lock.json b/cds-ui/designer-client/package-lock.json
index 46997c4ab..89d9c064c 100644
--- a/cds-ui/designer-client/package-lock.json
+++ b/cds-ui/designer-client/package-lock.json
@@ -8101,6 +8101,14 @@
"tslib": "^1.9.0"
}
},
+ "ngx-toastr": {
+ "version": "11.3.3",
+ "resolved": "https://registry.npmjs.org/ngx-toastr/-/ngx-toastr-11.3.3.tgz",
+ "integrity": "sha512-DbLFkSZHsVPuuIIrsY1ziEhdkFUQ0V1yG1N0+1nKXGI5QBVesEDxLUVtntjzxJcWw/uUV+bKApo//tGHHORabQ==",
+ "requires": {
+ "tslib": "^1.9.0"
+ }
+ },
"nice-try": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
diff --git a/cds-ui/designer-client/package.json b/cds-ui/designer-client/package.json
index ec968ba7a..1e5128111 100644
--- a/cds-ui/designer-client/package.json
+++ b/cds-ui/designer-client/package.json
@@ -43,6 +43,7 @@
"ng2-ace-editor": "^0.3.9",
"ngx-bootstrap": "^5.6.1",
"ngx-file-drop": "^8.0.8",
+ "ngx-toastr": "^11.3.3",
"rxjs": "~6.4.0",
"stream": "0.0.2",
"tslib": "^1.10.0",
diff --git a/cds-ui/designer-client/src/app/app.module.ts b/cds-ui/designer-client/src/app/app.module.ts
index da7ddfbd0..fd07d34c0 100644
--- a/cds-ui/designer-client/src/app/app.module.ts
+++ b/cds-ui/designer-client/src/app/app.module.ts
@@ -34,6 +34,7 @@ import {SidebarModule} from 'ng-sidebar';
import {SharedModulesModule} from './modules/shared-modules/shared-modules.module';
import {NgxFileDropModule} from 'ngx-file-drop';
import {ResourceDictionaryModule} from './modules/feature-modules/resource-dictionary/resource-dictionary.module';
+import { ToastrModule } from 'ngx-toastr';
@NgModule({
@@ -53,6 +54,7 @@ import {ResourceDictionaryModule} from './modules/feature-modules/resource-dicti
NgxFileDropModule,
ResourceDictionaryModule,
SidebarModule,
+ ToastrModule.forRoot() // ToastrModule added
],
providers: [ApiService],
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts
index 0808223cd..8302697fe 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts
@@ -84,6 +84,10 @@ export class PackageCreationStore extends Store<CBAPackage> {
this.state.scripts.files.delete(name);
}
+ fileExist(key: string) {
+ return this.state.templates.files.has(key);
+ }
+
removeFileFromDefinition(filename) {
this.state.definitions.imports.delete(filename);
}
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.css
index e69de29bb..7273b9c27 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.css
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.css
@@ -0,0 +1,4 @@
+.accordian-title {
+ color: #a09e9e;
+ font-size: .9em;
+} \ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
index 16c3101f2..e6149c883 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
@@ -12,13 +12,13 @@
</div>
<div class="template-mapping-accordion">
- <div id="accordion">
+ <div class="accordion" id="accordion">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0 d-flex justify-content-between">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true"
aria-controls="collapseOne">
- 1. Create Template
+ 1. Template <span class="accordian-title">{{currentTemplate?.fileName?.split('/')[1]}}</span>
</button>
</h5>
@@ -70,7 +70,8 @@
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo"
aria-expanded="false" aria-controls="collapseTwo">
- 2. Manage Mapping
+ 2. Manage Mapping <span
+ class="accordian-title">{{currentMapping?.fileName?.split('/')[1]}}</span>
</button>
</h5>
</div>
@@ -119,8 +120,10 @@
<tbody>
<tr *ngFor="let dict of resourceDictionaryRes">
<td>
- <img *ngIf="dict.definition?.property?.required" src="/assets/img/icon-required-yes.svg">
- <img *ngIf="!dict.definition?.property?.required" src="/assets/img/icon-required-no.svg">
+ <img *ngIf="dict.definition?.property?.required"
+ src="/assets/img/icon-required-yes.svg">
+ <img *ngIf="!dict.definition?.property?.required"
+ src="/assets/img/icon-required-no.svg">
</td>
<td>{{ dict.name }}</td>
<td>{{ dict.name }}</td>
@@ -166,8 +169,10 @@
<tbody>
<tr *ngFor="let dict of mappingRes">
<td>
- <img *ngIf="dict.definition?.property?.required" src="/assets/img/icon-required-yes.svg">
- <img *ngIf="!dict.definition?.property?.required" src="/assets/img/icon-required-no.svg">
+ <img *ngIf="dict.definition?.property?.required"
+ src="/assets/img/icon-required-yes.svg">
+ <img *ngIf="!dict.definition?.property?.required"
+ src="/assets/img/icon-required-no.svg">
</td>
<td>{{ dict['name'] }}</td>
<td>{{ dict['name'] }}</td>
@@ -194,7 +199,7 @@
</div>
<div class="template-mapping-action">
- <button class="btn btn-outline-secondary">Cancel</button>
+ <button (click)="cancel()" class="btn btn-outline-secondary">Cancel</button>
<button (click)="saveToStore()" class="btn btn-primary">Submit</button>
</div>
</div>
@@ -212,8 +217,8 @@
</button>
</div>
<div class="modal-body">
- <ngx-file-drop [multiple]="false" [accept]="allowedExt" dropZoneLabel="Drop files here" (onFileDrop)="dropped($event)"
- (onFileOver)="fileOver($event)" (onFileLeave)="fileLeave($event)">
+ <ngx-file-drop [multiple]="false" [accept]="allowedExt" dropZoneLabel="Drop files here"
+ (onFileDrop)="dropped($event)" (onFileOver)="fileOver($event)" (onFileLeave)="fileLeave($event)">
<ng-template ngx-file-drop-content-tmp let-openFileSelector="openFileSelector">
<div class="folder-upload">
<img src="assets/img/folder-upload.svg" />
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts
index 628d963ce..7d4705d69 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts
@@ -7,7 +7,8 @@ import { ResourceDictionary } from '../../mapping-models/ResourceDictionary.mode
import { DataTableDirective } from 'angular-datatables';
import { Mapping, MappingAdapter } from '../../mapping-models/mappingAdapter.model';
import { PackageCreationUtils } from '../../package-creation.utils';
-import { JsonConvert } from 'json2typescript';
+import { JsonConvert, Any } from 'json2typescript';
+import { ToastrService } from 'ngx-toastr';
@Component({
selector: 'app-templ-mapp-creation',
@@ -40,13 +41,16 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy {
dependancies = new Map<string, Array<string>>();
dependanciesSource = new Map<string, string>();
mappingRes = [];
+ currentTemplate: any;
+ currentMapping: any;
constructor(
private packageCreationStore: PackageCreationStore,
private templateStore: TemplateStore,
- private packageCreationUtils: PackageCreationUtils
+ private packageCreationUtils: PackageCreationUtils,
+ private toastr: ToastrService
) {
}
@@ -56,13 +60,18 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy {
console.log(templateInfo);
this.templateInfo = templateInfo;
this.fileName = templateInfo.fileName.split('/')[1];
+ if (this.fileName) {
+ this.fileName = this.fileName.split('-')[0];
+ }
if (templateInfo.type === 'mapping') {
this.mappingRes = templateInfo.mapping;
+ this.currentMapping = templateInfo;
this.resourceDictionaryRes = [];
this.resTableDtTrigger.next();
} else {
this.templateFileContent = templateInfo.fileContent;
+ this.currentTemplate = templateInfo;
}
});
@@ -224,28 +233,44 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy {
}
return map.key;
}
+ cancel() {
+ this.fileName = '';
+ this.templateFileContent = '';
+ this.resourceDictionaryRes = [];
+ this.mappingRes = [];
+ this.currentMapping = {};
+ this.currentTemplate = {};
+ }
saveToStore() {
- console.log(this.dependancies);
- console.log(this.dependanciesSource);
if (this.fileName) {
- // Save Mapping to Store
- if (this.resourceDictionaryRes && this.resourceDictionaryRes.length > 0) {
- const mapArray = this.convertDictionaryToMap(this.resourceDictionaryRes);
- this.packageCreationStore.addMapping('Templates/' + this.fileName + '-mapping.json',
- this.packageCreationUtils.transformToJson(this.jsonConvert.serialize(mapArray)));
- this.resourceDictionaryRes = [];
- }
- // Save Template to store
- if (this.templateFileContent) {
- this.packageCreationStore.addTemplate('Templates/' + this.fileName + '-template' + this.getFileExtension(),
- this.templateFileContent);
- this.templateFileContent = '';
+ // check file duplication
+ if (!(this.packageCreationStore.fileExist('Templates/' + this.fileName + '-mapping.json')
+ || this.packageCreationStore.fileExist('Templates/' + this.fileName + '-template' + this.getFileExtension()))) {
+ // Save Mapping to Store
+ if (this.resourceDictionaryRes && this.resourceDictionaryRes.length > 0) {
+ const mapArray = this.convertDictionaryToMap(this.resourceDictionaryRes);
+ this.packageCreationStore.addMapping('Templates/' + this.fileName + '-mapping.json',
+ this.packageCreationUtils.transformToJson(this.jsonConvert.serialize(mapArray)));
+ this.resourceDictionaryRes = [];
+ }
+ // Save Template to store
+ if (this.templateFileContent) {
+ this.packageCreationStore.addTemplate('Templates/' + this.fileName + '-template' + this.getFileExtension(),
+ this.templateFileContent);
+ this.templateFileContent = '';
+ }
+ this.fileName = '';
+ this.toastr.success('File is created', 'success');
+ } else {
+ console.log('this file already exist');
+ this.toastr.error('File name already exist', 'Error');
}
} else {
-
+ this.toastr.error('Add the file name', 'Error');
}
}
+
selectSource(dict, e) {
const source = e.target.value;
let keyDepend = null;
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html
index f5e683f28..a47963a72 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html
@@ -4,7 +4,7 @@
<div class="template-mapping-accordion">
- <div id="accordion">
+ <div class="accordion" id="listAccordion">
<div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0 d-flex justify-content-between">
@@ -16,12 +16,12 @@
</h5>
</div>
- <div id="collapseThree" class="collapse show" aria-labelledby="headingThree" data-parent="#accordion">
+ <div id="collapseThree" class="collapse show" aria-labelledby="headingThree" data-parent="#listAccordion">
<div class="card-body max-height-list">
<div class="row">
<!-- <div class="col-4" style="color:white" *ngFor="let file of templates.files | keyvalue; let mapIndex = index">-->
<div class="col-4" *ngFor="let file of getKeys(templateAndMappingMap)">
- <a (click)="setSourceCodeEditor(file)" class="template-mapping-list active">{{file}}
+ <a (click)="setSourceCodeEditor(file)" class="template-mapping-list" [ngClass]="{'active':currentFile == file}">{{file}}
<span *ngIf="getValue(file).isMapping">Mapping</span>
<span *ngIf="getValue(file).isTemplate">Template</span>
</a>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.ts
index 372fbca03..448899019 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.ts
@@ -17,6 +17,7 @@ export class TemplMappListingComponent implements OnInit {
private templates: Template;
private mapping: Mapping;
isCreate = true;
+ currentFile: string;
constructor(
private packageCreationStore: PackageCreationStore,
@@ -72,6 +73,7 @@ export class TemplMappListingComponent implements OnInit {
}
setSourceCodeEditor(key: string) {
+ this.currentFile = key;
const templateKey = 'Templates/' + key + '-template.vtl';
this.packageCreationStore.state$.subscribe(cba => {
console.log('cba ------');