diff options
Diffstat (limited to 'cds-ui/designer-client')
16 files changed, 243 insertions, 181 deletions
diff --git a/cds-ui/designer-client/package.json b/cds-ui/designer-client/package.json index 517b2dab1..df6b02b4a 100644 --- a/cds-ui/designer-client/package.json +++ b/cds-ui/designer-client/package.json @@ -3,7 +3,7 @@ "version": "0.0.0", "scripts": { "ng": "ng", - "start": "npm run lint && ng build --prod --aot && ng serve --proxy-config proxy.conf.json", + "start": "npm run lint && ng serve --proxy-config proxy.conf.json && ng build --prod --aot ", "build": "npm run lint && ng build --prod --aot ", "test": "ng test", "lint": "ng lint", diff --git a/cds-ui/designer-client/pom.xml b/cds-ui/designer-client/pom.xml index 0d3331d92..9a1ba2627 100644 --- a/cds-ui/designer-client/pom.xml +++ b/cds-ui/designer-client/pom.xml @@ -20,77 +20,77 @@ limitations under the License. ============LICENSE_END============================================ --> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> - <modelVersion>4.0.0</modelVersion> + <modelVersion>4.0.0</modelVersion> - <parent> - <groupId>org.onap.ccsdk.cds</groupId> - <artifactId>ui</artifactId> + <parent> + <groupId>org.onap.ccsdk.cds</groupId> + <artifactId>cds-ui</artifactId> + <version>1.0.0-SNAPSHOT</version> + <relativePath>..</relativePath> + </parent> + + <artifactId>cds-ui-designer-client</artifactId> <version>1.0.0-SNAPSHOT</version> - <relativePath>..</relativePath> - </parent> - - <artifactId>designer-client</artifactId> - <version>1.0.0-SNAPSHOT</version> - <packaging>pom</packaging> - - <name>CDS designer Client</name> - - <properties> - <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> - <npm.executable>npm</npm.executable> - <onap.nexus.url>https://nexus.onap.org</onap.nexus.url> - </properties> - - <build> - <plugins> - <plugin> - <groupId>com.github.eirslett</groupId> - <artifactId>frontend-maven-plugin</artifactId> - <!-- Use the latest released version: https://repo1.maven.org/maven2/com/github/eirslett/frontend-maven-plugin/ --> - <version>1.3</version> - <configuration> - <nodeVersion>v13.7.0</nodeVersion> - <npmVersion>6.13.6</npmVersion> - <nodeDownloadRoot>https://nodejs.org/dist/</nodeDownloadRoot> - <installDirectory>./</installDirectory> - </configuration> - <executions> - <execution> - <id>install node and npm</id> - <goals> - <goal>install-node-and-npm</goal> - </goals> - <phase>generate-resources</phase> - </execution> - - <execution> - <id>npm install</id> - <goals> - <goal>npm</goal> - </goals> - - <phase>generate-resources</phase> - - <configuration> - <arguments>install</arguments> - </configuration> - </execution> - - <execution> - <id>npm build</id> - <goals> - <goal>npm</goal> - </goals> - - <phase>generate-resources</phase> - - <configuration> - <arguments>run build</arguments> - </configuration> - </execution> - - </executions> - </plugin> - </plugins> - </build> + <packaging>pom</packaging> + + <name>UI designer Client</name> + + <properties> + <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> + <npm.executable>npm</npm.executable> + <onap.nexus.url>https://nexus.onap.org</onap.nexus.url> + </properties> + + <build> + <plugins> + <plugin> + <groupId>com.github.eirslett</groupId> + <artifactId>frontend-maven-plugin</artifactId> + <!-- Use the latest released version: https://repo1.maven.org/maven2/com/github/eirslett/frontend-maven-plugin/ --> + <version>1.3</version> + <configuration> + <nodeVersion>v13.7.0</nodeVersion> + <npmVersion>6.13.6</npmVersion> + <nodeDownloadRoot>https://nodejs.org/dist/</nodeDownloadRoot> + <installDirectory>./</installDirectory> + </configuration> + <executions> + <execution> + <id>install node and npm</id> + <goals> + <goal>install-node-and-npm</goal> + </goals> + <phase>generate-resources</phase> + </execution> + + <execution> + <id>npm install</id> + <goals> + <goal>npm</goal> + </goals> + + <phase>generate-resources</phase> + + <configuration> + <arguments>install</arguments> + </configuration> + </execution> + + <execution> + <id>npm build</id> + <goals> + <goal>npm</goal> + </goals> + + <phase>generate-resources</phase> + + <configuration> + <arguments>run build</arguments> + </configuration> + </execution> + + </executions> + </plugin> + </plugins> + </build> </project> diff --git a/cds-ui/designer-client/proxy.conf.json b/cds-ui/designer-client/proxy.conf.json index 17de0a74f..4e8ef0aab 100644 --- a/cds-ui/designer-client/proxy.conf.json +++ b/cds-ui/designer-client/proxy.conf.json @@ -1,12 +1,12 @@ { "/controllerblueprint/*": { - "target": "https://41.128.168.198:3000", + "target": "https://localhost:3000", "secure": false, "logLevel": "debug", "changeOrigin": true }, "/resourcedictionary/*": { - "target": "https://41.128.168.198:3000", + "target": "https://localhost:3000", "secure": false, "logLevel": "debug", "changeOrigin": true diff --git a/cds-ui/designer-client/src/app/common/core/canDactivate/ComponentCanDeactivate.ts b/cds-ui/designer-client/src/app/common/core/canDactivate/ComponentCanDeactivate.ts new file mode 100644 index 000000000..e0dac0dc3 --- /dev/null +++ b/cds-ui/designer-client/src/app/common/core/canDactivate/ComponentCanDeactivate.ts @@ -0,0 +1,14 @@ +import {HostListener} from '@angular/core'; + +export abstract class ComponentCanDeactivate { + + abstract canDeactivate(): boolean; + + + @HostListener('window:beforeunload', ['$event']) + unloadNotification($event: any) { + if (!this.canDeactivate()) { + $event.returnValue = true; + } + } +} diff --git a/cds-ui/designer-client/src/app/common/core/canDactivate/ComponentCanDeactivateGuard.ts b/cds-ui/designer-client/src/app/common/core/canDactivate/ComponentCanDeactivateGuard.ts new file mode 100644 index 000000000..b24784262 --- /dev/null +++ b/cds-ui/designer-client/src/app/common/core/canDactivate/ComponentCanDeactivateGuard.ts @@ -0,0 +1,19 @@ +import {Injectable} from '@angular/core'; + +import {CanDeactivate} from '@angular/router'; +import {ComponentCanDeactivate} from './ComponentCanDeactivate'; + +@Injectable() +export class ComponentCanDeactivateGuard implements CanDeactivate<ComponentCanDeactivate> { + canDeactivate(component: ComponentCanDeactivate): boolean { + + if (component.canDeactivate()) { + if (confirm('You have unsaved changes! If you leave, your changes will be lost.')) { + return true; + } else { + return false; + } + } + return true; + } +} diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html index 0ffd9cb5e..2b6ba4c63 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html @@ -13,60 +13,60 @@ </h2> <div class="col profile-help"> <nav class="navbar navbar-expand-lg navbar-light"> - <ul class="navbar-nav ml-auto"> - <!-- <li class="nav-item help-btn"> - <a class="nav-link mr-2" href="https://wiki.onap.org/display/DW/CDS+Designer+Guide" target="_blank" - [delay]="300" tooltip="Help" placement="bottom"><i class="icon-info" aria-hidden="true"></i></a> - </li> --> - <!--Help Menu--> - <div class="nav-item dropdown helpMenu"> - <input class="dropdown-toggle" type="text"> - <div class="dropdown-text"><i class="icon-info" aria-hidden="true"></i></div> - <ul class="dropdown-content"> - <!-- <li> - <i class="icon-get_started" aria-hidden="true"></i> - <p> - <input id="clicker3" [checked]="startTour" type="checkbox" /> - <label for="clicker"> - Getting Started - <span>Quick steps to help you get started</span> - </label> - </p> + <ul class="navbar-nav ml-auto"> + <!-- <li class="nav-item help-btn"> + <a class="nav-link mr-2" href="https://wiki.onap.org/display/DW/CDS+Designer+Guide" target="_blank" + [delay]="300" tooltip="Help" placement="bottom"><i class="icon-info" aria-hidden="true"></i></a> </li> --> - <li> - <a href="https://wiki.onap.org/display/DW/CDS+Designer+Guide" target="_blank"> - <i class="icon-user_guide" aria-hidden="true"></i> - <p> - Tutorials - <span>CDS Designer's User Guide</span> - </p> - </a> - </li> - </ul> - </div> - <!--User Menu--> - <div class="nav-item dropdown userMenu"> - <input class="dropdown-toggle" type="text"> - <div class="dropdown-text"><img src="../assets/img/img-user.jpeg" align="right"></div> - <ul class="dropdown-content"> - <li> - <a href="#">Username</a> - </li> - <li> - <a href="#">Settings</a> - </li> - <li> - <a href="#">Projects</a> - </li> - <li> - <a href="#">Log out</a> - </li> - </ul> - </div> + <!--Help Menu--> + <div class="nav-item dropdown helpMenu"> + <input class="dropdown-toggle" type="text"> + <div class="dropdown-text"><i class="icon-info" aria-hidden="true"></i></div> + <ul class="dropdown-content"> + <!-- <li> + <i class="icon-get_started" aria-hidden="true"></i> + <p> + <input id="clicker3" [checked]="startTour" type="checkbox" /> + <label for="clicker"> + Getting Started + <span>Quick steps to help you get started</span> + </label> + </p> + </li> --> + <li> + <a href="https://wiki.onap.org/display/DW/CDS+Designer+Guide" target="_blank"> + <i class="icon-user_guide" aria-hidden="true"></i> + <p> + Tutorials + <span>CDS Designer's User Guide</span> + </p> + </a> + </li> + </ul> + </div> + <!--User Menu--> + <div class="nav-item dropdown userMenu"> + <input class="dropdown-toggle" type="text"> + <div class="dropdown-text"><img src="../assets/img/img-user.jpeg" align="right"></div> + <ul class="dropdown-content"> + <li> + <a href="#">Username</a> + </li> + <li> + <a href="#">Settings</a> + </li> + <li> + <a href="#">Projects</a> + </li> + <li> + <a href="#">Log out</a> + </li> + </ul> + </div> - </ul> + </ul> </nav> - </div> + </div> </div> </header> @@ -757,7 +757,7 @@ <div class="col"> <div class="tab-content" id="nav-tabContent" (change)="clickEvent()"> <div class="tab-pane fade show active" id="nav-metadata" role="tabpanel" - aria-labelledby="nav-metadata-tab" > + aria-labelledby="nav-metadata-tab"> <app-metadata-tab></app-metadata-tab> </div> <div class="tab-pane fade" id="nav-template" role="tabpanel" diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts index eb699af75..09434bc17 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts @@ -16,13 +16,14 @@ import {DesignerStore} from '../designer/designer.store'; import {ToastrService} from 'ngx-toastr'; import {NgxFileDropEntry} from 'ngx-file-drop'; import {PackageCreationService} from '../package-creation/package-creation.service'; +import {ComponentCanDeactivate} from '../../../../common/core/canDactivate/ComponentCanDeactivate'; @Component({ selector: 'app-configuration-dashboard', templateUrl: './configuration-dashboard.component.html', styleUrls: ['./configuration-dashboard.component.css'], }) -export class ConfigurationDashboardComponent implements OnInit { +export class ConfigurationDashboardComponent extends ComponentCanDeactivate implements OnInit { viewedPackage: BluePrintDetailModel = new BluePrintDetailModel(); @ViewChild(MetadataTabComponent, {static: false}) metadataTabComponent: MetadataTabComponent; @@ -55,6 +56,7 @@ export class ConfigurationDashboardComponent implements OnInit { private designerStore: DesignerStore, private toastService: ToastrService ) { + super(); this.packageCreationStore.state$.subscribe( cbaPackage => { this.cbaPackage = cbaPackage; @@ -323,4 +325,9 @@ export class ConfigurationDashboardComponent implements OnInit { clickEvent() { this.isSaveEnabled = true; } + + canDeactivate(): boolean { + return this.isSaveEnabled; + } + } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.html index 58be592af..2c98d206a 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.html @@ -49,6 +49,7 @@ [(ngModel)]="metaDataTab.version" (input)="validatePackageNameAndVersion()" pattern="(\d+)\.(\d+)\.(\d+)" placeholder="Example: 1.0.0"> </div> + <div class="model-note-container tag-notes">Must follow this format (1.0.0)</div> <div class="model-note-container error-message">{{errorMessage}}</div> </div> <div class="single-line-model"> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.ts index 9a38c62be..d2f2e0a8b 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.ts @@ -33,6 +33,7 @@ import {Router} from '@angular/router'; import {ToastrService} from 'ngx-toastr'; import {TourService} from 'ngx-tour-md-menu'; import {PackageCreationService} from './package-creation.service'; +import {ComponentCanDeactivate} from '../../../../common/core/canDactivate/ComponentCanDeactivate'; @Component({ @@ -40,7 +41,8 @@ import {PackageCreationService} from './package-creation.service'; templateUrl: './package-creation.component.html', styleUrls: ['./package-creation.component.css'] }) -export class PackageCreationComponent implements OnInit { +export class PackageCreationComponent extends ComponentCanDeactivate implements OnInit { + // adding initial referencing to designer mode @@ -52,6 +54,8 @@ export class PackageCreationComponent implements OnInit { private router: Router, private tourService: TourService, private toastService: ToastrService) { + + super(); } counter = 0; @@ -152,4 +156,8 @@ export class PackageCreationComponent implements OnInit { this.metadataTabComponent.saveMetaDataToStore(); } + + canDeactivate(): boolean { + return this.isSaveEnabled; + } } 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 4b0ef8b49..dda6231d9 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 @@ -31,7 +31,7 @@ <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" + <button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" id="templateTab" aria-expanded="true" aria-controls="collapseOne"> 1. Template <span class="accordian-title">{{currentTemplate?.fileName?.split('/')[1]}}</span> </button> 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 4d3471263..346a06d83 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 @@ -12,7 +12,7 @@ import { ToastrService } from 'ngx-toastr'; import { SharedService } from '../shared-service'; import { XmlParser } from '../utils/XmlParser'; import { TourService } from 'ngx-tour-md-menu'; -import {PackageCreationService} from '../../package-creation.service'; +import { PackageCreationService } from '../../package-creation.service'; declare var $: any; @Component({ @@ -352,8 +352,9 @@ export class TemplMappCreationComponent implements OnInit, OnDestroy { this.fileName = ''; this.toastr.success('File is created', 'success'); this.openListView(); - console.log(this.tourService.getStatus()); - this.tourService.goto('tm-templateEdit'); + if (localStorage.getItem('tour-guide') !== 'end' && localStorage.getItem('tour-guide') !== 'false') { + this.tourService.goto('tm-templateEdit'); + } } else { console.log('this file already exist'); this.toastr.error('File name already exist', 'Error'); 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 70e35939b..5750bf430 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 @@ -102,7 +102,9 @@ export class TemplMappListingComponent implements OnInit { createNewTemplate() { this.openCreationView(); this.sharedService.disableEdit(); - this.tourService.goto('tm-templateName'); + if (localStorage.getItem('tour-guide') !== 'end' && localStorage.getItem('tour-guide') !== 'false') { + this.tourService.goto('tm-templateName'); + } } openCreationView() { this.showCreationView.emit('tell parent to open create views'); diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-dashboard.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-dashboard.component.ts index c6b9c41f6..9862608b4 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-dashboard.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/packages-dashboard.component.ts @@ -39,8 +39,6 @@ export class PackagesDashboardComponent implements OnInit, OnDestroy { ngOnInit() { console.log('PackagesDashboardComponent'); - - this.tourService.initialize([...steps]); this.checkTour(); } @@ -53,10 +51,17 @@ export class PackagesDashboardComponent implements OnInit, OnDestroy { } start() { + + this.tourService.initialize([...steps]); console.log('start .................'); this.tourService.start(); + localStorage.setItem('tour-guide', 'start'); this.tourService.events$.subscribe(res => { console.log(res); + + if (res.name === 'end') { + localStorage.setItem('tour-guide', 'end'); + } if (res.value && res.value.anchorId) { if (res.value.anchorId.includes('mt-')) { $('#nav-metadata-tab').trigger('click'); @@ -76,6 +81,7 @@ export class PackagesDashboardComponent implements OnInit, OnDestroy { if (res.value.anchorId.includes('st-')) { $('#nav-scripts-tab').trigger('click'); } + } }); } diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.module.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.module.ts index 8e5d8b0b8..c0ec679f7 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.module.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.module.ts @@ -1,36 +1,37 @@ -import { NgModule } from '@angular/core'; -import { CommonModule, JsonPipe } from '@angular/common'; -import { ApiService } from '../../../common/core/services/api.typed.service'; -import { PackagesRoutingModule } from './packages.routing.module'; -import { NgbPaginationModule } from '@ng-bootstrap/ng-bootstrap'; -import { SharedModulesModule } from '../../shared-modules/shared-modules.module'; -import { PackagesDashboardComponent } from './packages-dashboard/packages-dashboard.component'; -import { PackageListComponent } from './packages-dashboard/package-list/package-list.component'; -import { DesignerComponent } from './designer/designer.component'; -import { SidebarModule } from 'ng-sidebar'; -import { PackagePaginationComponent } from './packages-dashboard/package-pagination/package-pagination.component'; -import { SortPackagesComponent } from './packages-dashboard/sort-packages/sort-packages.component'; -import { PackagesHeaderComponent } from './packages-dashboard/packages-header/packages-header.component'; -import { PackagesSearchComponent } from './packages-dashboard/search-by-packages/search-by-packages.component'; -import { TagsFilteringComponent } from './packages-dashboard/filter-by-tags/filter-by-tags.component'; -import { ConfigurationDashboardComponent } from './configuration-dashboard/configuration-dashboard.component'; -import { ActionsComponent } from './designer/actions/actions.component'; -import { PackageCreationComponent } from './package-creation/package-creation.component'; -import { FormsModule } from '@angular/forms'; -import { ImportsTabComponent } from './package-creation/imports-tab/imports-tab.component'; -import { NgxFileDropModule } from 'ngx-file-drop'; -import { TemplateMappingComponent } from './package-creation/template-mapping/template-mapping.component'; -import { SourceEditorComponent } from './source-editor/source-editor.component'; -import { ScriptsTabComponent } from './package-creation/scripts-tab/scripts-tab.component'; -import { AceEditorModule } from 'ng2-ace-editor'; -import { MetadataTabComponent } from './package-creation/metadata-tab/metadata-tab.component'; -import { DslDefinitionsTabComponent } from './package-creation/dsl-definitions-tab/dsl-definitions-tab.component'; -import { TemplMappCreationComponent } from './package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component'; -import { TemplMappListingComponent } from './package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component'; -import { DataTablesModule } from 'angular-datatables'; -import { DesignerSourceViewComponent } from './designer/source-view/source-view.component'; -import { NgxUiLoaderModule } from 'ngx-ui-loader'; +import {NgModule} from '@angular/core'; +import {CommonModule, JsonPipe} from '@angular/common'; +import {ApiService} from '../../../common/core/services/api.typed.service'; +import {PackagesRoutingModule} from './packages.routing.module'; +import {NgbPaginationModule} from '@ng-bootstrap/ng-bootstrap'; +import {SharedModulesModule} from '../../shared-modules/shared-modules.module'; +import {PackagesDashboardComponent} from './packages-dashboard/packages-dashboard.component'; +import {PackageListComponent} from './packages-dashboard/package-list/package-list.component'; +import {DesignerComponent} from './designer/designer.component'; +import {SidebarModule} from 'ng-sidebar'; +import {PackagePaginationComponent} from './packages-dashboard/package-pagination/package-pagination.component'; +import {SortPackagesComponent} from './packages-dashboard/sort-packages/sort-packages.component'; +import {PackagesHeaderComponent} from './packages-dashboard/packages-header/packages-header.component'; +import {PackagesSearchComponent} from './packages-dashboard/search-by-packages/search-by-packages.component'; +import {TagsFilteringComponent} from './packages-dashboard/filter-by-tags/filter-by-tags.component'; +import {ConfigurationDashboardComponent} from './configuration-dashboard/configuration-dashboard.component'; +import {ActionsComponent} from './designer/actions/actions.component'; +import {PackageCreationComponent} from './package-creation/package-creation.component'; +import {FormsModule} from '@angular/forms'; +import {ImportsTabComponent} from './package-creation/imports-tab/imports-tab.component'; +import {NgxFileDropModule} from 'ngx-file-drop'; +import {TemplateMappingComponent} from './package-creation/template-mapping/template-mapping.component'; +import {SourceEditorComponent} from './source-editor/source-editor.component'; +import {ScriptsTabComponent} from './package-creation/scripts-tab/scripts-tab.component'; +import {AceEditorModule} from 'ng2-ace-editor'; +import {MetadataTabComponent} from './package-creation/metadata-tab/metadata-tab.component'; +import {DslDefinitionsTabComponent} from './package-creation/dsl-definitions-tab/dsl-definitions-tab.component'; +import {TemplMappCreationComponent} from './package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component'; +import {TemplMappListingComponent} from './package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component'; +import {DataTablesModule} from 'angular-datatables'; +import {DesignerSourceViewComponent} from './designer/source-view/source-view.component'; +import {NgxUiLoaderModule} from 'ngx-ui-loader'; import {TourMatMenuModule} from 'ngx-tour-md-menu'; +import {ComponentCanDeactivateGuard} from '../../../common/core/canDactivate/ComponentCanDeactivateGuard'; @NgModule({ declarations: [PackagesDashboardComponent, @@ -53,6 +54,7 @@ import {TourMatMenuModule} from 'ngx-tour-md-menu'; MetadataTabComponent, DslDefinitionsTabComponent, DesignerSourceViewComponent, + ], imports: [ CommonModule, @@ -68,7 +70,7 @@ import {TourMatMenuModule} from 'ngx-tour-md-menu'; NgxUiLoaderModule, TourMatMenuModule.forRoot() ], - providers: [ApiService, JsonPipe], + providers: [ApiService, JsonPipe, ComponentCanDeactivateGuard], bootstrap: [] }) export class PackagesModule { diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.routing.module.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.routing.module.ts index f357bc167..d9671d04c 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.routing.module.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages.routing.module.ts @@ -1,10 +1,11 @@ import {NgModule} from '@angular/core'; -import {Routes, RouterModule} from '@angular/router'; +import {RouterModule, Routes} from '@angular/router'; import {PackagesDashboardComponent} from './packages-dashboard/packages-dashboard.component'; import {DesignerComponent} from './designer/designer.component'; import {PackageCreationComponent} from './package-creation/package-creation.component'; import {ConfigurationDashboardComponent} from './configuration-dashboard/configuration-dashboard.component'; -import { DesignerSourceViewComponent } from './designer/source-view/source-view.component'; +import {DesignerSourceViewComponent} from './designer/source-view/source-view.component'; +import {ComponentCanDeactivateGuard} from '../../../common/core/canDactivate/ComponentCanDeactivateGuard'; const routes: Routes = [ @@ -14,8 +15,8 @@ const routes: Routes = [ }, {path: 'designer/:id', component: DesignerComponent}, {path: 'designer/source/:id', component: DesignerSourceViewComponent}, - {path: 'package/:id', component: ConfigurationDashboardComponent}, - {path: 'createPackage', component: PackageCreationComponent} + {path: 'package/:id', component: ConfigurationDashboardComponent, canDeactivate: [ComponentCanDeactivateGuard]}, + {path: 'createPackage', component: PackageCreationComponent, canDeactivate: [ComponentCanDeactivateGuard]} ]; @NgModule({ diff --git a/cds-ui/designer-client/src/styles.css b/cds-ui/designer-client/src/styles.css index 1464cc295..62ce5aa70 100644 --- a/cds-ui/designer-client/src/styles.css +++ b/cds-ui/designer-client/src/styles.css @@ -1627,6 +1627,7 @@ ul.package-contributers{ margin-bottom: 26px; width: 100px; height: 30px; + line-height: 15px; background: #1B3E6F; color: #fff; font-size: 12px; @@ -3366,10 +3367,10 @@ table.dataTable.no-footer{ overflow: auto; padding: 20px; padding-top: 9px; - background: #fff; - color: #1B3E6F; + background: #1B3E6F; + color: #fff; border-top: solid 6px #1273EB; - box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.18) !important; + box-shadow: 0 2px 13px 6px rgba(47, 83, 151, .17) !important; border-radius: 3px !important; /* border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; */ @@ -3413,12 +3414,12 @@ for simplicity border: 0; background: none; font-weight: normal; - color: #1273EB; + color: #E0E8F2; font-size: 12px; } /*Wizard Content*/ .mat-menu-panel{ - box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.18) !important; + box-shadow: 0 2px 13px 6px rgba(47, 83, 151, .17) !important; border-radius: 3px !important; border-bottom: solid 3px #1273EB; } @@ -3430,13 +3431,13 @@ for simplicity position: absolute; border-left: 8px solid transparent; border-right: 8px solid transparent; - border-bottom: 8px solid #fff; + border-bottom: 8px solid #1B3E6F; left: 9px; top: -8px; } .mat-card{ - background: #fff !important; - color: #1B3E6F !important; + background: #1B3E6F !important; + color: #fff !important; font-family: inherit !important; border-radius: 0 !important; } @@ -3450,7 +3451,7 @@ for simplicity font-size: 16px !important; } .mat-icon-button[disabled]{ - color: rgba(27, 62, 111, .5) !important; + color: rgba(224, 232, 242, .5) !important; } |