Code development platform for open source projects from the European Union institutions :large_blue_circle: EU Login authentication by SMS will be completely phased out by mid-2025. To see alternatives please check here

Skip to content
Snippets Groups Projects
Commit 99815418 authored by Sebastian-Ion TINCU's avatar Sebastian-Ion TINCU
Browse files

EDELIVERY-3687 SMP UI Add/Edit user 

Upgrade Angular to 6.1.10 (i.e. latest): upgrade to the HttpClient.
Upgrade Angular Material to 6.4.7 (i.e. latest): upgrade to mat-*
elements, attributes and directives; fix date pickers; fix missing
md-input-containers elements.
Upgrade RxJS to 6.2.2 (i.e. latest). Remove RxJS from devDependencies.
Remove unused codelyzer dependency.
Remove no longer needed md2 dependency.
Add section for the certificate to the user screen.
Add certificate service to support uploading certificates to the server.
parent 4b8a7bc4
No related branches found
No related tags found
No related merge requests found
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 5982 additions and 4810 deletions
smp-angular/.angular-cli.json deleted 100644 → 0
+ 0
− 58
View file @ 4b8a7bc4
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"name": "domibus-MSH-web"
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"styles.css",
"theme.scss"
],
"scripts": [],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [
{
"project": "src/tsconfig.app.json"
},
{
"project": "src/tsconfig.spec.json"
},
{
"project": "e2e/tsconfig.e2e.json"
}
],
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "css",
"component": {}
}
}
smp-angular/angular.json 0 → 100644
+ 130
− 0
View file @ 99815418
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"domibus-MSH-web": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.app.json",
"polyfills": "src/polyfills.ts",
"assets": [
"src/assets",
"src/favicon.ico"
],
"styles": [
"src/styles.css",
"src/theme.scss"
],
"scripts": []
},
"configurations": {
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "domibus-MSH-web:build"
},
"configurations": {
"production": {
"browserTarget": "domibus-MSH-web:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "domibus-MSH-web:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"karmaConfig": "./karma.conf.js",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json",
"scripts": [],
"styles": [
"src/styles.css",
"src/theme.scss"
],
"assets": [
"src/assets",
"src/favicon.ico"
]
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.app.json",
"src/tsconfig.spec.json"
],
"exclude": []
}
}
}
},
"domibus-MSH-web-e2e": {
"root": "e2e",
"sourceRoot": "e2e",
"projectType": "application",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "./protractor.conf.js",
"devServerTarget": "domibus-MSH-web:serve"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"e2e/tsconfig.e2e.json"
],
"exclude": []
}
}
}
}
},
"defaultProject": "domibus-MSH-web",
"schematics": {
"@schematics/angular:component": {
"prefix": "app",
"styleext": "css"
},
"@schematics/angular:directive": {
"prefix": "app"
}
}
}
\ No newline at end of file
smp-angular/karma.conf.js
+ 6
− 8
View file @ 99815418
......@@ -4,33 +4,31 @@
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '@angular/cli'],
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('@angular/cli/plugins/karma')
require('@angular-devkit/build-angular/plugins/karma')
],
client:{
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
files: [
{ pattern: './src/test.ts', watched: false }
],
preprocessors: {
'./src/test.ts': ['@angular/cli']
},
mime: {
'text/x-typescript': ['ts','tsx']
},
coverageIstanbulReporter: {
reports: [ 'html', 'lcovonly' ],
dir: require('path').join(__dirname, 'coverage'), reports: [ 'html', 'lcovonly' ],
fixWebpackSourcePaths: true
},
angularCli: {
environment: 'dev'
},
reporters: config.angularCli && config.angularCli.codeCoverage
? ['progress', 'coverage-istanbul']
: ['progress', 'kjhtml'],
......
smp-angular/package-lock.json
+ 5535
− 4427
View file @ 99815418
This diff is collapsed.
smp-angular/package.json
+ 33
− 35
View file @ 99815418
{
"name": "smp-web",
"version": "0.0.0",
"version": "4.0.0",
"license": "MIT",
"angular-cli": {},
"scripts": {
......@@ -14,45 +14,43 @@
},
"private": true,
"dependencies": {
"@angular/animations": "^4.1.0",
"@angular/cdk": "^2.0.0-beta.8",
"@angular/common": "^4.1.0",
"@angular/compiler": "^4.1.0",
"@angular/core": "^4.1.0",
"@angular/forms": "^4.1.0",
"@angular/http": "^4.1.0",
"@angular/material": "^2.0.0-beta.8",
"@angular/platform-browser": "^4.1.0",
"@angular/platform-browser-dynamic": "^4.1.0",
"@angular/platform-server": "^4.1.0",
"@angular/router": "^4.1.0",
"@swimlane/ngx-datatable": "^9.1.0",
"core-js": "^2.4.1",
"@angular/animations": "^6.1.0",
"@angular/cdk": "^6.4.7",
"@angular/common": "^6.1.0",
"@angular/compiler": "^6.1.0",
"@angular/core": "^6.1.0",
"@angular/forms": "^6.1.0",
"@angular/http": "^6.1.0",
"@angular/material": "^6.4.7",
"@angular/platform-browser": "^6.1.0",
"@angular/platform-browser-dynamic": "^6.1.0",
"@angular/platform-server": "^6.1.0",
"@angular/router": "^6.1.0",
"@swimlane/ngx-datatable": "^13.0.0",
"core-js": "^2.5.7",
"file-saver": "^1.3.3",
"hammerjs": "^2.0.8",
"md2": "0.0.29",
"rxjs": "^5.5.11",
"ts-helpers": "^1.1.1",
"zone.js": "^0.8.9"
"rxjs": "^6.3.3",
"ts-helpers": "^1.1.2",
"zone.js": "^0.8.26"
},
"devDependencies": {
"@angular/cli": "^1.0.1",
"@angular/compiler-cli": "^4.1.0",
"@types/file-saver": "0.0.1",
"@types/jasmine": "2.5.47",
"@types/node": "^7.0.14",
"codelyzer": "~3.0.0",
"jasmine-core": "2.6.1",
"jasmine-spec-reporter": "4.1.0",
"karma": "1.7.0",
"karma-chrome-launcher": "^2.0.0",
"@angular-devkit/build-angular": "~0.8.0",
"@angular/cli": "^6.2.5",
"@angular/compiler-cli": "^6.1.10",
"@types/file-saver": "1.3.1",
"@types/jasmine": "2.8.9",
"@types/node": "^10.11.7",
"jasmine-core": "3.2.1",
"jasmine-spec-reporter": "4.2.1",
"karma": "^3.0.0",
"karma-chrome-launcher": "^2.2.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.0.2",
"karma-jasmine": "^1.1.2",
"karma-remap-istanbul": "^0.6.0",
"protractor": "~5.1.1",
"rxjs": "^5.5.11",
"ts-node": "3.0.4",
"tslint": "^5.1.0",
"typescript": "~2.3.2"
"protractor": "^5.4.1",
"ts-node": "^7.0.1",
"tslint": "^5.11.0",
"typescript": "^2.9.0"
}
}
smp-angular/src/app/alert/alert.component.ts
+ 2
− 2
View file @ 99815418
import {Component, OnInit} from "@angular/core";
import {AlertService} from "./alert.service";
import {Component, OnInit} from '@angular/core';
import {AlertService} from './alert.service';
@Component({
moduleId: module.id,
......
smp-angular/src/app/alert/alert.service.ts
+ 1
− 2
View file @ 99815418
import {Injectable} from '@angular/core';
import {Router, NavigationStart, NavigationEnd} from '@angular/router';
import {Observable} from 'rxjs';
import {Subject} from 'rxjs/Subject';
import {Observable, Subject} from 'rxjs';
@Injectable()
export class AlertService {
......
smp-angular/src/app/alerts/alerts-result.model.ts
+ 1
− 1
View file @ 99815418
import {AlertsEntry} from "./alerts-entry.model";
import {AlertsEntry} from './alerts-entry.model';
export interface AlertsResult {
alertsEntries: Array<AlertsEntry>;
......
smp-angular/src/app/alerts/alerts.component.html
+ 81
− 74
View file @ 99815418
<page-header id="alertsheader_id">Alerts</page-header>
<div class="selectionCriteria">
<md-card>
<md-card-content>
<mat-card>
<mat-card-content>
<div class="panel">
<form name="filterForm" #filterForm="ngForm" (ngSubmit)="search()">
<!-- Processed -->
<md-select placeholder="Processed" [(ngModel)]="filter.processed" name="processed" id="processed_id">
<md-option [value]="''"></md-option>
<md-option *ngFor="let aprocessed of aProcessedValues" [value]="aprocessed">
<mat-select placeholder="Processed" [(ngModel)]="filter.processed" name="processed" id="processed_id">
<mat-option [value]="''"></mat-option>
<mat-option *ngFor="let aprocessed of aProcessedValues" [value]="aprocessed">
{{aprocessed}}
</md-option>
</md-select>
</mat-option>
</mat-select>
<!-- Alert Type (Basic) -->
<md-select placeholder="Alert Type" [(ngModel)]="filter.alertType" name="alertType"
<mat-select placeholder="Alert Type" [(ngModel)]="filter.alertType" name="alertType"
id="alerttype_id" (change)="onAlertTypeChanged(filter.alertType)">
<md-option [value]="''"></md-option>
<md-option *ngFor="let atype of aTypes" [value]="atype">
<mat-option [value]="''"></mat-option>
<mat-option *ngFor="let atype of aTypes" [value]="atype">
{{atype}}
</md-option>
</md-select>
</mat-option>
</mat-select>
<!-- Alert Id (Advanced) -->
<md-input-container *ngIf="advancedSearch">
<input mdInput placeholder="Alert Id" name="alertId" [(ngModel)]="filter.alertId"
<mat-form-field *ngIf="advancedSearch">
<input matInput placeholder="Alert Id" name="alertId" [(ngModel)]="filter.alertId"
#alertId="ngModel" id="alertid_id">
</md-input-container>
</mat-form-field>
<!-- Alert Level (Basic) -->
<md-select placeholder="Alert Level" [(ngModel)]="filter.alertLevel" name="alertLevel"
<mat-select placeholder="Alert Level" [(ngModel)]="filter.alertLevel" name="alertLevel"
id="alertlevel_id">
<md-option [value]="''">
</md-option>
<md-option *ngFor="let alevel of aLevels" [value]="alevel">
<mat-option [value]="''">
</mat-option>
<mat-option *ngFor="let alevel of aLevels" [value]="alevel">
{{alevel}}
</md-option>
</md-select>
</mat-option>
</mat-select>
<!-- Creation From (Basic) -->
<md2-datepicker placeholder="Creation From:" appClearInvalid
[(ngModel)]="filter.creationFrom"
name="creationFrom"
[max]="timestampCreationFromMaxDate"
(change)='onTimestampCreationFromChange($event)'
[type]="'datetime'"
#timestampControl="ngModel" id="creationfrom_id">
</md2-datepicker>
<input [matDatepicker]="creationFromDatePicker"
placeholder="Creation From:"
appClearInvalid
[(ngModel)]="filter.creationFrom"
name="creationFrom"
[max]="timestampCreationFromMaxDate"
(dateChange)='onTimestampCreationFromChange($event)'
[type]="'datetime'" #timestampControl="ngModel" id="creationfrom_id" />
<mat-datepicker #creationFromDatePicker></mat-datepicker>
<!-- Creation To (Basic) -->
<md2-datepicker placeholder="Creation To:" appClearInvalid
[(ngModel)]="filter.creationTo"
name="creationTo"
[min]="timestampCreationToMinDate"
[max]="timestampCreationToMaxDate"
(change)='onTimestampCreationToChange($event)'
[type]="'datetime'"
#timestampControl="ngModel" id="creationto_id">
</md2-datepicker>
<input [matDatepicker]="creationToDatePicker"
placeholder="Creation To:" appClearInvalid
[(ngModel)]="filter.creationTo"
name="creationTo"
[min]="timestampCreationToMinDate"
[max]="timestampCreationToMaxDate"
(dateChange)='onTimestampCreationToChange($event)'
[type]="'datetime'"
#timestampControl="ngModel" id="creationto_id"/>
<mat-datepicker #creationToDatePicker></mat-datepicker>
<!-- Reporting From -->
<md2-datepicker placeholder="Reporting From:" appClearInvalid
[(ngModel)]="filter.reportingFrom"
name="reportingFrom"
[max]="timestampReportingFromMaxDate"
(change)='onTimestampReportingFromChange($event)'
[type]="'datetime'"
#timestampControl="ngModel" id="reportingfrom_id" *ngIf="advancedSearch">
</md2-datepicker>
<input [matDatepicker]="reportingFromDatePicker"
placeholder="Reporting From:" appClearInvalid
[(ngModel)]="filter.reportingFrom"
name="reportingFrom"
[max]="timestampReportingFromMaxDate"
(dateChange)='onTimestampReportingFromChange($event)'
[type]="'datetime'"
#timestampControl="ngModel" id="reportingfrom_id" *ngIf="advancedSearch" />
<mat-datepicker #reportingFromDatePicker></mat-datepicker>
<!-- Reporting To -->
<md2-datepicker placeholder="Reporting To:" appClearInvalid
[(ngModel)]="filter.reportingTo"
name="reportingTo"
[min]="timestampReportingToMinDate"
[max]="timestampReportingToMaxDate"
(change)='onTimestampReportingToChange($event)'
[type]="'datetime'"
#timestampControl="ngModel" id="reportingto_id" *ngIf="advancedSearch">
</md2-datepicker>
<input [matDatepicker]="reportingToDatePicker"
placeholder="Reporting To:" appClearInvalid
[(ngModel)]="filter.reportingTo"
name="reportingTo"
[min]="timestampReportingToMinDate"
[max]="timestampReportingToMaxDate"
(dateChange)='onTimestampReportingToChange($event)'
[type]="'datetime'"
#timestampControl="ngModel" id="reportingto_id" *ngIf="advancedSearch" />
<mat-datepicker #reportingToDatePicker></mat-datepicker>
<!-- Alert Type Criteria -->
<div class="panel" *ngIf="isAlertTypeDefined()">
<md-card>
<mat-card>
<div>
<md-card-title>
<mat-card-title>
{{filter.alertType}}
</md-card-title>
</mat-card-title>
</div>
<md-card-content>
<md-input-container *ngFor="let item of items; let i = index">
<input mdInput placeholder={{item}} name={{item}} [(ngModel)]="dynamicFilters[i]"
<mat-card-content>
<mat-form-field *ngFor="let item of items; let i = index">
<input matInput placeholder={{item}} name={{item}} [(ngModel)]="dynamicFilters[i]"
#{{item}}="ngModel" id={{item}}_id>
</md-input-container>
</md-card-content>
</md-card>
</mat-form-field>
</mat-card-content>
</mat-card>
</div>
<!-- Search Button and Basic/Advanced Search-->
<div class="searchArea">
<button md-raised-button color="primary" [disabled]="!filterForm.form.valid" id="searchbutton_id">
<md-icon>search</md-icon>
<button mat-raised-button color="primary" [disabled]="!filterForm.form.valid" id="searchbutton_id">
<mat-icon>search</mat-icon>
<span>Search</span>
</button>
<a href="#" *ngIf="!advancedSearch" (click)="toggleAdvancedSearch()" id="advancedlink_id">Advanced</a>
......@@ -101,8 +108,8 @@
</div>
</form>
</div>
</md-card-content>
</md-card>
</mat-card-content>
</mat-card>
<ng-template #rowProcessed let-row="row" let-value="value" ngx-datatable-cell-template>
<input autofocus type="checkbox" [checked]="value" id="processed{{row.$$index}}_id" (click)="setProcessedValue(row)"/>
......@@ -120,8 +127,8 @@
<app-column-picker [allColumns]="columnPicker.allColumns" [selectedColumns]="columnPicker.selectedColumns"
(onSelectedColumnsChanged)="columnPicker.changeSelectedColumns($event)"></app-column-picker>
</span>
<button md-icon-button color="primary" [disabled]="!isSaveAsCSVButtonEnabled()" (click)="saveAsCSV()"
id="saveascsvbutton_id" md-tooltip="Export as CSV">
<button mat-icon-button color="primary" [disabled]="!isSaveAsCSVButtonEnabled()" (click)="saveAsCSV()"
id="saveascsvbutton_id" matTooltip="Export as CSV">
<img src="assets/images/exportCSV.svg" width="30" height="30">
</button>
</div>
......@@ -150,14 +157,14 @@
</ngx-datatable>
<div class="group-action-button">
<button id="alertsCancelButton" md-raised-button color="primary" (click)="cancel()"
<button id="alertsCancelButton" mat-raised-button color="primary" (click)="cancel()"
[disabled]="buttonsDisabled">
<md-icon>cancel</md-icon>
<mat-icon>cancel</mat-icon>
<span>Cancel</span>
</button>
<button id="alertsSaveButton" md-raised-button color="primary" (click)="save(false)"
<button id="alertsSaveButton" mat-raised-button color="primary" (click)="save(false)"
[disabled]="buttonsDisabled">
<md-icon>save</md-icon>
<mat-icon>save</mat-icon>
<span>Save</span>
</button>
</div>
......
smp-angular/src/app/alerts/alerts.component.spec.ts
+ 2
− 2
View file @ 99815418
import {async, ComponentFixture, TestBed} from "@angular/core/testing";
import {async, ComponentFixture, TestBed} from '@angular/core/testing';
import {AlertsComponent} from "./alerts.component";
import {AlertsComponent} from './alerts.component';
describe('AlertsComponent', () => {
let component: AlertsComponent;
......
smp-angular/src/app/alerts/alerts.component.ts
+ 37
− 42
View file @ 99815418
import {Component, OnInit, TemplateRef, ViewChild} from "@angular/core";
import {ColumnPicker} from "../common/column-picker/column-picker.model";
import {RowLimiter} from "../common/row-limiter/row-limiter.model";
import {isNullOrUndefined} from "util";
import {DownloadService} from "../download/download.service";
import {AlertComponent} from "../alert/alert.component";
import {Observable} from "rxjs/Observable";
import {AlertsResult} from "./alerts-result.model";
import {Http, URLSearchParams, Response, Headers} from "@angular/http";
import {AlertService} from "../alert/alert.service";
import {AlertsEntry} from "./alerts-entry.model";
import {CancelDialogComponent} from "../common/cancel-dialog/cancel-dialog.component";
import {MdDialog} from "@angular/material";
import {SaveDialogComponent} from "../common/save-dialog/save-dialog.component";
import {Component, OnInit, TemplateRef, ViewChild} from '@angular/core';
import {ColumnPicker} from '../common/column-picker/column-picker.model';
import {RowLimiter} from '../common/row-limiter/row-limiter.model';
import {DownloadService} from '../download/download.service';
import {AlertComponent} from '../alert/alert.component';
import {Observable} from 'rxjs';
import {AlertsResult} from './alerts-result.model';
import {AlertService} from '../alert/alert.service';
import {AlertsEntry} from './alerts-entry.model';
import {CancelDialogComponent} from '../common/cancel-dialog/cancel-dialog.component';
import {MatDatepickerInputEvent, MatDialog} from '@angular/material';
import {SaveDialogComponent} from '../common/save-dialog/save-dialog.component';
import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http';
@Component({
moduleId: module.id,
......@@ -60,7 +59,7 @@ export class AlertsComponent implements OnInit {
timestampReportingToMinDate: Date = null;
timestampReportingToMaxDate: Date = new Date();
constructor(private http: Http, private alertService: AlertService, public dialog: MdDialog, private downloadService: DownloadService) {
constructor(private http: HttpClient, private alertService: AlertService, public dialog: MatDialog, private downloadService: DownloadService) {
}
ngOnInit() {
......@@ -85,42 +84,42 @@ export class AlertsComponent implements OnInit {
}
getAlertsEntries(offset: number, pageSize: number, orderBy: string, asc: boolean): Observable<AlertsResult> {
let searchParams: URLSearchParams = new URLSearchParams();
searchParams.set('page', offset.toString());
searchParams.set('pageSize', pageSize.toString());
searchParams.set('orderBy', orderBy);
let params: HttpParams = new HttpParams();
params.set('page', offset.toString());
params.set('pageSize', pageSize.toString());
params.set('orderBy', orderBy);
// filters
if(this.filter.processed) {
searchParams.set('processed', this.filter.processed==='PROCESSED'?'true':'false');
params.set('processed', this.filter.processed==='PROCESSED'?'true':'false');
}
if(this.filter.alertType) {
searchParams.set('alertType', this.filter.alertType);
params.set('alertType', this.filter.alertType);
}
if(this.filter.alertId) {
searchParams.set('alertId', this.filter.alertId);
params.set('alertId', this.filter.alertId);
}
if(this.filter.alertLevel) {
searchParams.set('alertLevel', this.filter.alertLevel);
params.set('alertLevel', this.filter.alertLevel);
}
if(this.filter.creationFrom) {
searchParams.set('creationFrom', this.filter.creationFrom.getTime());
params.set('creationFrom', this.filter.creationFrom.getTime());
}
if(this.filter.creationTo) {
searchParams.set('creationTo', this.filter.creationTo.getTime());
params.set('creationTo', this.filter.creationTo.getTime());
}
if(this.filter.reportingFrom) {
searchParams.set('reportingFrom', this.filter.reportingFrom.getTime());
params.set('reportingFrom', this.filter.reportingFrom.getTime());
}
if(this.filter.reportingTo) {
searchParams.set('reportingTo', this.filter.reportingTo.getTime());
params.set('reportingTo', this.filter.reportingTo.getTime());
}
if(this.dynamicFilters.length > 0) {
......@@ -131,18 +130,14 @@ export class AlertsComponent implements OnInit {
for(let filter in this.dynamicFilters) {
d[filter] = this.dynamicFilters[filter];
}
searchParams.set('parameters', d.toString());
params.set('parameters', d.toString());
}
if (asc != null) {
searchParams.set('asc', asc.toString());
params.set('asc', asc.toString());
}
return this.http.get(AlertsComponent.ALERTS_URL, {
search: searchParams
}).map((response: Response) =>
response.json()
);
return this.http.get<AlertsResult>(AlertsComponent.ALERTS_URL, { params });
}
page(offset, pageSize, orderBy, asc) {
......@@ -237,7 +232,7 @@ export class AlertsComponent implements OnInit {
}
getDynamicParameters(alertType:string): string[] {
if(!isNullOrUndefined(alertType) && alertType != '') {
if(alertType) {
// just for testing begin: MOCK
if(alertType == 'MSG_COMMUNICATION_FAILURE') {
return ['MSG_COMM1', 'MSG_COMM2', 'MSG_COMM3']
......@@ -250,19 +245,19 @@ export class AlertsComponent implements OnInit {
}
}
onTimestampCreationFromChange(event) {
onTimestampCreationFromChange(event: MatDatepickerInputEvent<Date>) {
this.timestampCreationToMinDate = event.value;
}
onTimestampCreationToChange(event) {
onTimestampCreationToChange(event: MatDatepickerInputEvent<Date>) {
this.timestampCreationFromMaxDate = event.value;
}
onTimestampReportingFromChange(event) {
onTimestampReportingFromChange(event: MatDatepickerInputEvent<Date>) {
this.timestampReportingToMinDate = event.value;
}
onTimestampReportingToChange(event) {
onTimestampReportingToChange(event: MatDatepickerInputEvent<Date>) {
this.timestampReportingFromMaxDate = event.value;
}
......@@ -352,7 +347,7 @@ export class AlertsComponent implements OnInit {
}
public isAlertTypeDefined(): boolean {
return !isNullOrUndefined(this.filter.alertType) && this.filter.alertType != '';
return this.filter.alertType;
}
cancel() {
......@@ -366,11 +361,11 @@ export class AlertsComponent implements OnInit {
}
save(withDownloadCSV: boolean) {
let headers = new Headers({'Content-Type': 'application/json'});
let headers: HttpHeaders = new HttpHeaders({'Content-Type': 'application/json'});
let dialogRef = this.dialog.open(SaveDialogComponent);
dialogRef.afterClosed().subscribe(result => {
if (result) {
this.http.put(AlertsComponent.ALERTS_URL, JSON.stringify(this.rows), {headers: headers}).subscribe(res => {
this.http.put(AlertsComponent.ALERTS_URL, JSON.stringify(this.rows), {headers}).subscribe(res => {
this.alertService.success("The operation 'update alerts' completed successfully.", false);
this.page(this.offset, this.rowLimiter.pageSize, this.orderBy, this.asc);
if(withDownloadCSV) {
......
smp-angular/src/app/app-info/smp-info.service.ts
+ 12
− 18
View file @ 99815418
import {Injectable} from "@angular/core";
import {Http, Response} from "@angular/http";
import {Observable} from "rxjs/Observable";
import "rxjs/add/operator/map";
import {Router} from "@angular/router";
import {HttpEventService} from "../http/http-event.service";
import {ReplaySubject} from "rxjs";
import {SmpInfo} from "./smp-info.model";
import {Injectable} from '@angular/core';
import {HttpClient, HttpResponse} from '@angular/common/http';
import {Observable, ReplaySubject} from 'rxjs';
import {Router} from '@angular/router';
import {HttpEventService} from '../http/http-event.service';
import {SmpInfo} from './smp-info.model';
@Injectable()
export class SmpInfoService {
constructor(private http: Http, private router: Router) {
constructor(private http: HttpClient, private router: Router) {
}
getSmpInfo(): Observable<SmpInfo> {
let subject = new ReplaySubject();
this.http.get('rest/application/info')
.map((response: Response) => {
const smpInfo: SmpInfo = { version: response.json().version };
return smpInfo;
})
let subject = new ReplaySubject<SmpInfo>();
this.http.get<SmpInfo>('rest/application/info')
.subscribe((res: SmpInfo) => {
subject.next(res);
}, (error: any) => {
}, error => {
console.log("getSmpInfo:" + error);
// subject.next(null);
});
}
);
return subject.asObservable();
}
......
smp-angular/src/app/app.component.css
+ 5
− 5
View file @ 99815418
[md-raised-button] {
[mat-raised-button] {
width: 100%;
}
md-sidenav-container {
mat-sidenav-container {
width: 100%;
height: 100%;
/*border: solid green;*/
}
md-sidenav {
mat-sidenav {
text-align: center;
box-shadow: 7px 7px 10px #9B9B9B;
/*border: dashed red;*/
}
md-sidenav.menu-expanded {
mat-sidenav.menu-expanded {
width: 220px;
}
md-sidenav.menu-collapsed {
mat-sidenav.menu-collapsed {
width: 50px;
}
......
smp-angular/src/app/app.component.html
+ 26
− 26
View file @ 99815418
<md-sidenav-container >
<md-sidenav mode="side" opened="true" ngClass="{{menuClass}}">
<mat-sidenav-container >
<mat-sidenav mode="side" opened="true" ngClass="{{menuClass}}">
<!-- sidenav content -->
<div id="topLogo">
<img src="assets/images/smp_logo_icon.svg" [attr.height]="fullMenu ? '74px' : '40px'" [attr.width]="fullMenu ? '74px' : '40px'"/>
......@@ -8,32 +8,32 @@
</div>
</div>
<button md-raised-button class="sideNavButton" [routerLink]="['/']" id="messages_id">
<md-icon md-tooltip="Search participants" mdTooltipDisabled="{{fullMenu}}" mdTooltipPosition="right">search</md-icon>
<button mat-raised-button class="sideNavButton" [routerLink]="['/']" id="messages_id">
<mat-icon matTooltip="Search participants" matTooltipDisabled="{{fullMenu}}" matTooltipDisabled="right">search</mat-icon>
<span>Participants</span>
</button>
<button md-raised-button class="sideNavButton" [routerLink]="['/user']" *ngIf="hasAdmin()" id="user_id">
<md-icon md-tooltip="Users" mdTooltipDisabled="{{fullMenu}}" mdTooltipPosition="right">people</md-icon>
<button mat-raised-button class="sideNavButton" [routerLink]="['/user']" *ngIf="hasAdmin()" id="user_id">
<mat-icon matTooltip="Users" matTooltipDisabled="{{fullMenu}}" matTooltipDisabled="right">people</mat-icon>
<span>Users</span>
</button>
<button md-raised-button class="sideNavButton" [routerLink]="['/truststore']" *ngIf="hasAdmin()" id="truststore_id">
<md-icon md-tooltip="Truststore" mdTooltipDisabled="{{fullMenu}}" mdTooltipPosition="right">vpn_key</md-icon>
<button mat-raised-button class="sideNavButton" [routerLink]="['/truststore']" *ngIf="hasAdmin()" id="truststore_id">
<mat-icon matTooltip="Truststore" matTooltipDisabled="{{fullMenu}}" matTooltipDisabled="right">vpn_key</mat-icon>
<span>Keystore</span>
</button>
<button md-raised-button class="sideNavButton" [routerLink]="['/domain']" *ngIf="hasAdmin()" id="domain_id">
<md-icon md-tooltip="Domain" mdTooltipDisabled="{{fullMenu}}" mdTooltipPosition="right">domain</md-icon>
<button mat-raised-button class="sideNavButton" [routerLink]="['/domain']" *ngIf="hasAdmin()" id="domain_id">
<mat-icon matTooltip="Domain" matTooltipDisabled="{{fullMenu}}" matTooltipDisabled="right">domain</mat-icon>
<span>Domain</span>
</button>
<div class="collapse-button">
<button *ngIf="fullMenu" md-raised-button id="expand_id" (click)="toggleMenu()">
<md-icon md-tooltip="Collapse" mdTooltipPosition="right">chevron_left</md-icon>
<button *ngIf="fullMenu" mat-raised-button id="expand_id" (click)="toggleMenu()">
<mat-icon matTooltip="Collapse" matTooltipDisabled="right">chevron_left</mat-icon>
</button>
<button *ngIf="!fullMenu" md-raised-button id="collapse_id" (click)="toggleMenu()">
<md-icon md-tooltip="Esxpand" mdTooltipPosition="right">chevron_right</md-icon>
<button *ngIf="!fullMenu" mat-raised-button id="collapse_id" (click)="toggleMenu()">
<mat-icon matTooltip="Esxpand" matTooltipDisabled="right">chevron_right</mat-icon>
</button>
</div>
......@@ -52,7 +52,7 @@
</div>
</div>
</md-sidenav>
</mat-sidenav>
<!-- primary content -->
<div id=".my-content" style="position:absolute; bottom:5px; top:5px; right: 5px; left: 5px">
......@@ -67,36 +67,36 @@
<page-helper></page-helper>
</div>
<div id="sandwichMenu">
<button md-icon-button [md-menu-trigger-for]="settingsMenu" id="settingsmenu_id" md-tooltip="Menu">
<md-icon>menu</md-icon>
<button mat-icon-button [mat-menu-trigger-for]="settingsMenu" id="settingsmenu_id" matTooltip="Menu">
<mat-icon>menu</mat-icon>
</button>
<md-menu x-position="before" #settingsMenu="mdMenu">
<mat-menu x-position="before" #settingsMenu="matMenu">
<div *ngIf="currentUser">
<button md-menu-item disabled="true" id="currentuser_id">
<md-icon>person</md-icon>
<button mat-menu-item disabled="true" id="currentuser_id">
<mat-icon>person</mat-icon>
<span>{{currentUser}}</span>
</button>
<hr/>
<button md-menu-item (click)="logout($event)" id="logout_id">
<md-icon>power_settings_new</md-icon>
<button mat-menu-item (click)="logout($event)" id="logout_id">
<mat-icon>power_settings_new</mat-icon>
<span>Logout</span>
</button>
</div>
<div *ngIf="!currentUser" style="text-align: center; vertical-align: middle;margin: 2px;">
<button md-menu-item disabled="true">
<md-icon>person_outline</md-icon>
<button mat-menu-item disabled="true">
<mat-icon>person_outline</mat-icon>
<span>Not logged in</span>
</button>
</div>
</md-menu>
</mat-menu>
</div>
</div>
<div id="routerHolder" style="min-height: 100%" >
......@@ -105,4 +105,4 @@
<alert></alert>
</div>
</md-sidenav-container>
</mat-sidenav-container>
smp-angular/src/app/app.component.ts
+ 12
− 11
View file @ 99815418
import {Component, OnInit, ViewChild} from "@angular/core";
import {SecurityService} from "./security/security.service";
import {Router, RouterOutlet} from "@angular/router";
import {SecurityEventService} from "./security/security-event.service";
import {Title} from "@angular/platform-browser";
import {Http, Response} from "@angular/http";
import {Observable} from "rxjs/Observable";
import {Component, OnInit, ViewChild} from '@angular/core';
import {SecurityService} from './security/security.service';
import {Router, RouterOutlet} from '@angular/router';
import {SecurityEventService} from './security/security-event.service';
import {Title} from '@angular/platform-browser';
import {Http, Response} from '@angular/http';
import {Observable} from 'rxjs';
import {HttpClient, HttpResponse} from '@angular/common/http';
@Component({
selector: 'app-root',
......@@ -24,12 +25,12 @@ export class AppComponent implements OnInit {
constructor(private securityService: SecurityService,
private router: Router,
private securityEventService: SecurityEventService,
private http: Http,
private http: HttpClient,
private titleService: Title) {
let applicationNameResponse: Observable<Response> = this.http.get('rest/application/name');
let applicationNameResponse: Observable<string> = this.http.get<string>('rest/application/name');
applicationNameResponse.subscribe((name: Response) => {
this.titleService.setTitle(name.json());
applicationNameResponse.subscribe((name: string) => {
this.titleService.setTitle(name);
});
}
......
smp-angular/src/app/app.module.ts
+ 89
− 88
View file @ 99815418
import {BrowserModule} from "@angular/platform-browser";
import {NgModule} from "@angular/core";
import {FormsModule, ReactiveFormsModule} from "@angular/forms";
import {Http, HttpModule, RequestOptions, XHRBackend} from "@angular/http";
import {BrowserModule} from '@angular/platform-browser';
import {NgModule} from '@angular/core';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {HttpClient, HttpClientModule} from '@angular/common/http';
import {
MdButtonModule,
MdDialogModule,
MdIconModule,
MdInputModule,
MdListModule,
MdMenuModule,
MdSelectModule,
MdSidenavModule,
MdTooltipModule,
MdExpansionModule
} from "@angular/material";
MatButtonModule,
MatDialogModule,
MatIconModule,
MatInputModule,
MatListModule,
MatMenuModule,
MatSelectModule,
MatSidenavModule,
MatTooltipModule,
MatExpansionModule,
MatDatepicker,
MatCardModule,
MatDatepickerModule,
MatSlideToggleModule,
} from '@angular/material';
import "hammerjs";
import {NgxDatatableModule} from "@swimlane/ngx-datatable";
import {Md2Module, Md2SelectModule} from "md2";
import {NgxDatatableModule} from '@swimlane/ngx-datatable';
import {AppComponent} from "./app.component";
import {LoginComponent} from "./login/login.component";
import {HomeComponent} from "./home/home.component";
import {AppComponent} from './app.component';
import {LoginComponent} from './login/login.component';
import {HomeComponent} from './home/home.component';
import {AuthenticatedGuard} from "./guards/authenticated.guard";
import {AuthorizedGuard} from "./guards/authorized.guard";
import {routing} from "./app.routes";
import {IsAuthorized} from "./security/is-authorized.directive";
import {ExtendedHttpClient} from "./http/extended-http-client";
import {HttpEventService} from "./http/http-event.service";
import {SecurityService} from "./security/security.service";
import {SecurityEventService} from "./security/security-event.service";
import {DomainService} from "./security/domain.service";
import {AlertComponent} from "./alert/alert.component";
import {AlertService} from "./alert/alert.service";
import {AuthenticatedGuard} from './guards/authenticated.guard';
import {AuthorizedGuard} from './guards/authorized.guard';
import {routing} from './app.routes';
import {IsAuthorized} from './security/is-authorized.directive';
import {ExtendedHttpClient, extendedHttpClientCreator} from './http/extended-http-client';
import {HttpEventService} from './http/http-event.service';
import {SecurityService} from './security/security.service';
import {SecurityEventService} from './security/security-event.service';
import {DomainService} from './security/domain.service';
import {AlertComponent} from './alert/alert.component';
import {AlertService} from './alert/alert.service';
import {FooterComponent} from "./footer/footer.component";
import {SmpInfoService} from "./app-info/smp-info.service";
import {AuthorizedAdminGuard} from "./guards/authorized-admin.guard";
import {ServiceGroupComponent} from "./service-group/service-group.component";
import {DomainComponent} from "./domain/domain.component";
import {UserComponent} from "./user/user.component";
import {TrustStoreComponent} from "./trust-store/trust-store.component";
import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
import {ServiceGroupMetadataListDialogComponent} from "./service-group/service-group-metadata-list-dialog/service-group-metadata-list-dialog.component";
import {RowLimiterComponent} from "./common/row-limiter/row-limiter.component";
import {DatePipe} from "./custom-date/date.pipe";
import {CapitalizeFirstPipe} from "./common/capitalize-first.pipe";
import {DefaultPasswordDialogComponent} from "./security/default-password-dialog/default-password-dialog.component";
import {ServiceGroupDetailsDialogComponent} from "./service-group/service-group-details-dialog/service-group-details-dialog.component";
import {CancelDialogComponent} from "./common/cancel-dialog/cancel-dialog.component";
import {DirtyGuard} from "./common/dirty.guard";
import {SaveDialogComponent} from "./common/save-dialog/save-dialog.component";
import {TrustStoreDialogComponent} from "./trust-store/trust-store-dialog/trust-store-dialog.component";
import {TrustStoreUploadComponent} from "./trust-store/trust-store-upload/trust-store-upload.component";
import {ColumnPickerComponent} from "./common/column-picker/column-picker.component";
import {PageHelperComponent} from "./common/page-helper/page-helper.component";
import {SharedModule} from "./common/module/shared.module";
import {ClearInvalidDirective} from "./custom-date/clear-invalid.directive";
import {PageHeaderComponent} from "./common/page-header/page-header.component";
import {DomainSelectorComponent} from "./common/domain-selector/domain-selector.component";
import {AlertsComponent} from "./alerts/alerts.component";
import {FooterComponent} from './footer/footer.component';
import {SmpInfoService} from './app-info/smp-info.service';
import {AuthorizedAdminGuard} from './guards/authorized-admin.guard';
import {ServiceGroupComponent} from './service-group/service-group.component';
import {DomainComponent} from './domain/domain.component';
import {UserComponent} from './user/user.component';
import {TrustStoreComponent} from './trust-store/trust-store.component';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {ServiceGroupMetadataListDialogComponent} from './service-group/service-group-metadata-list-dialog/service-group-metadata-list-dialog.component';
import {RowLimiterComponent} from './common/row-limiter/row-limiter.component';
import {DatePipe} from './custom-date/date.pipe';
import {CapitalizeFirstPipe} from './common/capitalize-first.pipe';
import {DefaultPasswordDialogComponent} from './security/default-password-dialog/default-password-dialog.component';
import {ServiceGroupDetailsDialogComponent} from './service-group/service-group-details-dialog/service-group-details-dialog.component';
import {CancelDialogComponent} from './common/cancel-dialog/cancel-dialog.component';
import {DirtyGuard} from './common/dirty.guard';
import {SaveDialogComponent} from './common/save-dialog/save-dialog.component';
import {TrustStoreDialogComponent} from './trust-store/trust-store-dialog/trust-store-dialog.component';
import {TrustStoreUploadComponent} from './trust-store/trust-store-upload/trust-store-upload.component';
import {ColumnPickerComponent} from './common/column-picker/column-picker.component';
import {PageHelperComponent} from './common/page-helper/page-helper.component';
import {SharedModule} from './common/module/shared.module';
import {ClearInvalidDirective} from './custom-date/clear-invalid.directive';
import {PageHeaderComponent} from './common/page-header/page-header.component';
import {DomainSelectorComponent} from './common/domain-selector/domain-selector.component';
import {AlertsComponent} from './alerts/alerts.component';
import {SearchTableComponent} from "./common/search-table/search-table.component";
import {ServiceGroupExtensionDialogComponent} from "./service-group/service-group-extension-dialog/service-group-extension-dialog.component";
import {ServiceGroupMetadataDialogComponent} from "./service-group/service-group-metadata-dialog/service-group-metadata-dialog.component";
import {DomainDetailsDialogComponent} from "./domain/domain-details-dialog/domain-details-dialog.component";
import {UserDetailsDialogComponent} from "./user/user-details-dialog/user-details-dialog.component";
import {DownloadService} from "./download/download.service";
import {TrustStoreService} from "./trust-store/trust-store.service";
import {UserService} from "./user/user.service";
import {RoleService} from "./security/role.service";
export function extendedHttpClientFactory(xhrBackend: XHRBackend, requestOptions: RequestOptions, httpEventService: HttpEventService) {
return new ExtendedHttpClient(xhrBackend, requestOptions, httpEventService);
}
import {SearchTableComponent} from './common/search-table/search-table.component';
import {ServiceGroupExtensionDialogComponent} from './service-group/service-group-extension-dialog/service-group-extension-dialog.component';
import {ServiceGroupMetadataDialogComponent} from './service-group/service-group-metadata-dialog/service-group-metadata-dialog.component';
import {DomainDetailsDialogComponent} from './domain/domain-details-dialog/domain-details-dialog.component';
import {UserDetailsDialogComponent} from './user/user-details-dialog/user-details-dialog.component';
import {DownloadService} from './download/download.service';
import {TrustStoreService} from './trust-store/trust-store.service';
import {UserService} from './user/user.service';
import {RoleService} from './security/role.service';
import {CertificateService} from './user/certificate.service';
@NgModule({
declarations: [
......@@ -127,25 +127,26 @@ export function extendedHttpClientFactory(xhrBackend: XHRBackend, requestOptions
],
imports: [
BrowserModule,
HttpClientModule,
BrowserAnimationsModule,
FormsModule,
HttpModule,
NgxDatatableModule,
MdButtonModule,
MdDialogModule,
MdTooltipModule,
MdMenuModule,
MdInputModule,
MdIconModule,
MdListModule,
MdSidenavModule,
MdSelectModule,
MatButtonModule,
MatCardModule,
MatDatepickerModule,
MatDialogModule,
MatTooltipModule,
MatMenuModule,
MatInputModule,
MatIconModule,
MatListModule,
MatSidenavModule,
MatSelectModule,
MatSlideToggleModule,
routing,
ReactiveFormsModule,
Md2Module,
Md2SelectModule,
SharedModule,
MdExpansionModule
MatExpansionModule,
],
providers: [
AuthenticatedGuard,
......@@ -161,13 +162,13 @@ export function extendedHttpClientFactory(xhrBackend: XHRBackend, requestOptions
DownloadService,
TrustStoreService,
UserService,
CertificateService,
RoleService,
{
provide: Http,
useFactory: extendedHttpClientFactory,
deps: [XHRBackend, RequestOptions, HttpEventService],
multi: false
}
provide: ExtendedHttpClient,
useFactory: extendedHttpClientCreator,
deps: [HttpClient]
},
],
bootstrap: [AppComponent]
})
......
smp-angular/src/app/common/cancel-dialog/cancel-dialog.component.html
+ 5
− 5
View file @ 99815418
<div style="width: 500px;text-align: center">
<h1 md-dialog-title>Do you want to cancel all unsaved operations?</h1>
<h1 mat-dialog-title>Do you want to cancel all unsaved operations?</h1>
<div class="divTable">
<div class="divTableBody">
......@@ -7,15 +7,15 @@
<div class="divTableRow">
<div class="divTableCell">
<button md-raised-button color="primary" (click)="dialogRef.close(true)" id="yesbuttondialog_id">
<md-icon>check_circle</md-icon>
<button mat-raised-button color="primary" (click)="dialogRef.close(true)" id="yesbuttondialog_id">
<mat-icon>check_circle</mat-icon>
<span>Yes</span>
</button>
</div>
<div class="divTableCell">
<button md-raised-button color="primary" (click)="dialogRef.close(false)" id="nobuttondialog_id">
<md-icon>cancel</md-icon>
<button mat-raised-button color="primary" (click)="dialogRef.close(false)" id="nobuttondialog_id">
<mat-icon>cancel</mat-icon>
<span>No</span>
</button>
</div>
......
smp-angular/src/app/common/cancel-dialog/cancel-dialog.component.ts
+ 2
− 2
View file @ 99815418
import {Component} from '@angular/core';
import {MdDialogRef} from "@angular/material";
import {MatDialogRef} from '@angular/material';
@Component({
selector: 'app-cancel-dialog',
......@@ -8,7 +8,7 @@ import {MdDialogRef} from "@angular/material";
})
export class CancelDialogComponent {
constructor(public dialogRef: MdDialogRef<CancelDialogComponent>) {
constructor(public dialogRef: MatDialogRef<CancelDialogComponent>) {
}
}
smp-angular/src/app/common/column-picker/column-picker.component.ts
+ 2
− 3
View file @ 99815418
import {Component, EventEmitter, Input, Output} from "@angular/core";
import {isNullOrUndefined} from "util";
import {Component, EventEmitter, Input, Output} from '@angular/core';
@Component({
selector: 'app-column-picker',
......@@ -47,7 +46,7 @@ export class ColumnPickerComponent {
setLastColumn(array : Array<any>, colName : any) {
let col = array.find(x => x.name === colName);
if(!isNullOrUndefined(col)) {
if(col !== null && col !== undefined) {
let posCol = array.indexOf(col);
array.splice(posCol, 1);
array.push(col);
......
smp-angular/src/app/common/directive/attribute/click-stop-propagation.directive.ts
+ 1
− 1
View file @ 99815418
import {Directive, HostListener} from "@angular/core";
import {Directive, HostListener} from '@angular/core';
@Directive({
selector: "[click-stop-propagation]"
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

For further information about the platform and support, please see https://code.europa.eu/info/about