sxhundred/ISA-Frontend
1
0
Fork 0
mirror of https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend synced 2025-12-28 22:42:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

#1553 Ui Validators Lib und Servervalidierung

Browse Source
This commit is contained in:
Andreas Schickinger
2021-03-22 14:03:31 +01:00
committed by Lorenz Hilpert
parent 61f5262fab
commit ebbe4b1d98
24 changed files with 306 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
angular.json
View File

@@ -2056,6 +2056,46 @@
}
}
}
},
"@ui/validators": {
"projectType": "library",
"root": "apps/ui/validators",
"sourceRoot": "apps/ui/validators/src",
"prefix": "ui",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:ng-packagr",
"options": {
"tsConfig": "apps/ui/validators/tsconfig.lib.json",
"project": "apps/ui/validators/ng-package.json"
},
"configurations": {
"production": {
"tsConfig": "apps/ui/validators/tsconfig.lib.prod.json"
}
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "apps/ui/validators/src/test.ts",
"tsConfig": "apps/ui/validators/tsconfig.spec.json",
"karmaConfig": "apps/ui/validators/karma.conf.js"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"apps/ui/validators/tsconfig.lib.json",
"apps/ui/validators/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
}
},
"defaultProject": "sales"

28
apps/page/customer/src/lib/customer-create/customer-create-b2b.component.ts
View File

@@ -1,17 +1,18 @@
import { Component, ChangeDetectionStrategy, OnInit, ChangeDetectorRef, OnDestroy } from '@angular/core';
import { FormBuilder, FormControl, FormGroup, ValidationErrors, ValidatorFn, Validators } from '@angular/forms';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { ApplicationService } from '@core/application';
import { BreadcrumbService } from '@core/breadcrumb';
import { CrmCustomerService } from '@domain/crm';
import { CustomerDTO } from '@swagger/crm';
import { UiMessageModalComponent, UiModalService } from '@ui/modal';
import { UiModalService } from '@ui/modal';
import { AddressSelectionModalService } from '../modals/address-selection-modal/address-selection-modal.service';
import { CustomerCreateComponentBase } from './customer-create.component';
import { validateEmail } from '../validators/email-validator';
import { DomainCheckoutService } from '@domain/checkout';
import { Subscription } from 'rxjs';
import { genderLastNameValidator } from '../validators/gender-b2b-validator';
import { setInvalidPropertyErrors, UiValidators } from '@ui/validators';
@Component({
selector: 'page-customer-create-b2b',
@@ -71,8 +72,8 @@ export class CustomerCreateB2BComponent extends CustomerCreateComponentBase impl
}),
gender: fb.control(customer?.gender),
title: fb.control(customer?.title),
firstName: fb.control(customer?.firstName, [Validators.pattern(this.NAME_PATTERN)]),
lastName: fb.control(customer?.lastName, [Validators.pattern(this.NAME_PATTERN)]),
firstName: fb.control(customer?.firstName),
lastName: fb.control(customer?.lastName),
address: fb.group({
street: fb.control(customer?.address?.street, [Validators.required]),
streetNumber: fb.control(customer?.address?.streetNumber, [Validators.required]),
@@ -83,8 +84,8 @@ export class CustomerCreateB2BComponent extends CustomerCreateComponentBase impl
}),
communicationDetails: fb.group({
email: fb.control(customer?.communicationDetails?.email, [validateEmail]),
phone: fb.control(customer?.communicationDetails?.phone, [Validators.pattern(this.PHONE_PATTERN)]),
mobile: fb.control(customer?.communicationDetails?.mobile, [Validators.pattern(this.PHONE_PATTERN)]),
phone: fb.control(customer?.communicationDetails?.phone, [UiValidators.phone]),
mobile: fb.control(customer?.communicationDetails?.mobile, [UiValidators.phone]),
}),
differentShippingAddress: fb.control(false),
shippingAddress: fb.group({
@@ -159,14 +160,15 @@ export class CustomerCreateB2BComponent extends CustomerCreateComponentBase impl
this.router.navigate(['/customer', response.result.id]);
}
} catch (error) {
console.error(error);
this.modal.open({
content: UiMessageModalComponent,
data: { title: 'Es ist ein Fehler aufgetreten', message: Object.values(error.error.invalidProperties).join(', ') },
});
}
this.control.enable();
this.control.reset(this.control.value);
console.error(error);
if (error.error.invalidProperties) {
setInvalidPropertyErrors({ invalidProperties: error.error.invalidProperties, formGroup: this.control });
}
this.control.markAllAsTouched();
}
}
}

29
apps/page/customer/src/lib/customer-create/customer-create-branch.component.ts
View File

@@ -1,17 +1,17 @@
import { Component, ChangeDetectionStrategy, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';
import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { ApplicationService } from '@core/application';
import { BreadcrumbService } from '@core/breadcrumb';
import { CrmCustomerService } from '@domain/crm';
import { CustomerDTO } from '@swagger/crm';
import { UiMessageModalComponent, UiModalService } from '@ui/modal';
import { UiModalService } from '@ui/modal';
import { AddressSelectionModalService } from '../modals/address-selection-modal/address-selection-modal.service';
import { CustomerCreateComponentBase } from './customer-create.component';
import { validateEmail } from '../validators/email-validator';
import { Subscription } from 'rxjs';
import { DomainCheckoutService } from '@domain/checkout';
import { UiValidators } from '@ui/common';
import { UiValidators, setInvalidPropertyErrors } from '@ui/validators';
@Component({
selector: 'page-customer-create-branch',
@@ -82,8 +82,8 @@ export class CustomerCreateBranchComponent extends CustomerCreateComponentBase i
}),
gender: fb.control(customer?.gender, [Validators.required, Validators.min(1)]),
title: fb.control(customer?.title),
firstName: fb.control(customer?.firstName, [Validators.required, Validators.pattern(this.NAME_PATTERN)]),
lastName: fb.control(customer?.lastName, [Validators.required, Validators.pattern(this.NAME_PATTERN)]),
firstName: fb.control(customer?.firstName, [Validators.required]),
lastName: fb.control(customer?.lastName, [Validators.required]),
dateOfBirth: fb.control(customer?.dateOfBirth, [UiValidators.date]),
address: fb.group({
street: fb.control(customer?.address?.street),
@@ -95,8 +95,8 @@ export class CustomerCreateBranchComponent extends CustomerCreateComponentBase i
}),
communicationDetails: fb.group({
email: fb.control(customer?.communicationDetails?.email, [validateEmail]),
phone: fb.control(customer?.communicationDetails?.phone, [Validators.pattern(this.PHONE_PATTERN)]),
mobile: fb.control(customer?.communicationDetails?.mobile, [Validators.pattern(this.PHONE_PATTERN)]),
phone: fb.control(customer?.communicationDetails?.phone, [UiValidators.phone]),
mobile: fb.control(customer?.communicationDetails?.mobile, [UiValidators.phone]),
}),
differentShippingAddress: fb.control(false),
shippingAddress: fb.group({
@@ -163,14 +163,15 @@ export class CustomerCreateBranchComponent extends CustomerCreateComponentBase i
this.router.navigate(['/customer', response.result.id]);
}
} catch (error) {
console.error(error);
this.modal.open({
content: UiMessageModalComponent,
data: { title: 'Es ist ein Fehler aufgetreten', message: Object.values(error.error.invalidProperties).join(', ') },
});
}
this.control.enable();
this.control.reset(this.control.value);
console.error(error);
if (error.error.invalidProperties) {
setInvalidPropertyErrors({ invalidProperties: error.error.invalidProperties, formGroup: this.control });
}
this.control.markAllAsTouched();
}
}
}

30
apps/page/customer/src/lib/customer-create/customer-create-guest.component.ts
View File

@@ -1,18 +1,19 @@
import { Component, ChangeDetectionStrategy, OnInit, ChangeDetectorRef, OnDestroy } from '@angular/core';
import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { ApplicationService } from '@core/application';
import { BreadcrumbService } from '@core/breadcrumb';
import { CrmCustomerService } from '@domain/crm';
import { CustomerDTO } from '@swagger/crm';
import { UiValidators } from '@ui/common';
import { UiMessageModalComponent, UiModalService } from '@ui/modal';
import { UiValidators } from '@ui/validators';
import { UiModalService } from '@ui/modal';
import { AddressSelectionModalService } from '../modals/address-selection-modal/address-selection-modal.service';
import { CustomerCreateComponentBase } from './customer-create.component';
import { validateEmail } from '../validators/email-validator';
import { Subscription } from 'rxjs';
import { DomainCheckoutService } from '@domain/checkout';
import { map } from 'rxjs/operators';
import { setInvalidPropertyErrors } from '@ui/validators';
@Component({
selector: 'page-customer-create-guest',
@@ -83,8 +84,8 @@ export class CustomerCreateGuestComponent extends CustomerCreateComponentBase im
}),
gender: fb.control(customer?.gender, [Validators.required, Validators.min(1)]),
title: fb.control(customer?.title),
firstName: fb.control(customer?.firstName, [Validators.required, Validators.pattern(this.NAME_PATTERN)]),
lastName: fb.control(customer?.lastName, [Validators.required, Validators.pattern(this.NAME_PATTERN)]),
firstName: fb.control(customer?.firstName, [Validators.required]),
lastName: fb.control(customer?.lastName, [Validators.required]),
dateOfBirth: fb.control(customer?.dateOfBirth, [UiValidators.date]),
address: fb.group({
street: fb.control(customer?.address?.street, [Validators.required]),
@@ -96,8 +97,8 @@ export class CustomerCreateGuestComponent extends CustomerCreateComponentBase im
}),
communicationDetails: fb.group({
email: fb.control(customer?.communicationDetails?.email, [Validators.required, validateEmail]),
phone: fb.control(customer?.communicationDetails?.phone, [Validators.pattern(this.PHONE_PATTERN)]),
mobile: fb.control(customer?.communicationDetails?.mobile, [Validators.pattern(this.PHONE_PATTERN)]),
phone: fb.control(customer?.communicationDetails?.phone, [UiValidators.phone]),
mobile: fb.control(customer?.communicationDetails?.mobile, [UiValidators.phone]),
}),
differentShippingAddress: fb.control(false),
shippingAddress: fb.group({
@@ -175,14 +176,15 @@ export class CustomerCreateGuestComponent extends CustomerCreateComponentBase im
this.router.navigate(['/customer', response.result.id]);
}
} catch (error) {
console.error(error);
this.modal.open({
content: UiMessageModalComponent,
data: { title: 'Es ist ein Fehler aufgetreten', message: Object.values(error.error.invalidProperties).join(', ') },
});
}
this.control.enable();
this.control.reset(this.control.value);
console.error(error);
if (error.error.invalidProperties) {
setInvalidPropertyErrors({ invalidProperties: error.error.invalidProperties, formGroup: this.control });
}
this.control.markAllAsTouched();
}
}
}

26
apps/page/customer/src/lib/customer-create/customer-create-online.component.ts
View File

@@ -6,13 +6,14 @@ import { BreadcrumbService } from '@core/breadcrumb';
import { DomainCheckoutService } from '@domain/checkout';
import { CrmCustomerService } from '@domain/crm';
import { CustomerDTO } from '@swagger/crm';
import { UiValidators } from '@ui/common';
import { UiMessageModalComponent, UiModalService } from '@ui/modal';
import { UiValidators } from '@ui/validators';
import { UiModalService } from '@ui/modal';
import { map } from 'rxjs/operators';
import { AddressSelectionModalService } from '../modals/address-selection-modal/address-selection-modal.service';
import { validateEmail } from '../validators/email-validator';
import { CustomerCreateComponentBase } from './customer-create.component';
import { Subscription } from 'rxjs';
import { setInvalidPropertyErrors } from '@ui/validators';
@Component({
selector: 'customer-create-online',
@@ -110,8 +111,8 @@ export class CustomerCreateOnlineComponent extends CustomerCreateComponentBase i
}),
gender: fb.control(customer?.gender || undefined, [Validators.required, Validators.min(1)]),
title: fb.control(customer?.title),
firstName: fb.control(customer?.firstName, [Validators.required, Validators.pattern(this.NAME_PATTERN)]),
lastName: fb.control(customer?.lastName, [Validators.required, Validators.pattern(this.NAME_PATTERN)]),
firstName: fb.control(customer?.firstName, [Validators.required]),
lastName: fb.control(customer?.lastName, [Validators.required]),
dateOfBirth: fb.control(customer?.dateOfBirth, [UiValidators.date]),
address: fb.group({
street: fb.control(customer?.address?.street, [Validators.required]),
@@ -127,8 +128,8 @@ export class CustomerCreateOnlineComponent extends CustomerCreateComponentBase i
[Validators.required, validateEmail, this.emailDomainErrorValidator],
[this.emailExistsValidator]
),
phone: fb.control(customer?.communicationDetails?.phone, [Validators.pattern(this.PHONE_PATTERN)]),
mobile: fb.control(customer?.communicationDetails?.mobile, [Validators.pattern(this.PHONE_PATTERN)]),
phone: fb.control(customer?.communicationDetails?.phone, [UiValidators.phone]),
mobile: fb.control(customer?.communicationDetails?.mobile, [UiValidators.phone]),
}),
differentShippingAddress: fb.control(false),
shippingAddress: fb.group({
@@ -200,15 +201,16 @@ export class CustomerCreateOnlineComponent extends CustomerCreateComponentBase i
if (error?.error?.invalidProperties?.Email) {
this.addInvalidDomain(this.control.value.communicationDetails?.email);
} else {
this.modal.open({
content: UiMessageModalComponent,
data: { title: 'Es ist ein Fehler aufgetreten', message: Object.values(error.error.invalidProperties).join(', ') },
});
this.control.enable();
this.control.reset(this.control.value);
console.error(error);
if (error.error.invalidProperties) {
setInvalidPropertyErrors({ invalidProperties: error.error.invalidProperties, formGroup: this.control });
}
}
}
this.control.enable();
this.control.reset(this.control.value);
this.control.markAllAsTouched();
this.control.updateValueAndValidity();
}

3
apps/page/customer/src/lib/customer-create/customer-create.component.ts
View File

@@ -14,9 +14,6 @@ import { ChangeDetectorRef } from '@angular/core';
import { isBoolean } from '@utils/common';
export abstract class CustomerCreateComponentBase {
readonly PHONE_PATTERN = '^[0-9]+$';
readonly NAME_PATTERN = '^[A-Za-zäÄöÖüÜßñÑáéíóúÁÉÍÓÚàèìòùÀÈÌÒÙ ]+$';
emailExistsValidator: AsyncValidatorFn = async (control): Promise<ValidationErrors | null> => {
if (control.value) {
if ((await this.customerService.emailExists(control.value).toPromise())?.result) {

2
apps/page/customer/src/lib/customer-details/customer-data-edit/customer-data-edit.component.ts
View File

@@ -6,7 +6,7 @@ import { ApplicationService } from '@core/application';
import { BreadcrumbService } from '@core/breadcrumb';
import { CrmCustomerService } from '@domain/crm';
import { CountryDTO, CustomerDTO, KeyValueDTOOfStringAndString } from '@swagger/crm';
import { UiValidators } from '@ui/common';
import { UiValidators } from '@ui/validators';
import { ScrollPositionService } from 'apps/ui/common/src/lib/scroll-position/scroll-position.service';
import { Observable } from 'rxjs';
import { first, map, switchMap } from 'rxjs/operators';

1
apps/ui/common/src/lib/index.ts
View File

@@ -6,5 +6,4 @@ export * from './scroll-container.directive';
export * from './date';
export * from './date/constants';
export * from './skeleton-loader';
export * from './validators';
// end:ng42.barrel

3
apps/ui/common/src/lib/validators/index.ts
View File

@@ -1,3 +0,0 @@
import { date } from './date.validator';
export const UiValidators = { date };

25
apps/ui/validators/README.md Normal file
View File

@@ -0,0 +1,25 @@
# Validators
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10.1.2.
## Code scaffolding
Run `ng generate component component-name --project validators` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project validators`.
> Note: Don't forget to add `--project validators` or else it will be added to the default project in your `angular.json` file.
## Build
Run `ng build validators` to build the project. The build artifacts will be stored in the `dist/` directory.
## Publishing
After building your library with `ng build validators`, go to the dist folder `cd dist/validators` and run `npm publish`.
## Running unit tests
Run `ng test validators` to execute the unit tests via [Karma](https://karma-runner.github.io).
## Further help
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

32
apps/ui/validators/karma.conf.js Normal file
View File

@@ -0,0 +1,32 @@
// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
module.exports = function (config) {
config.set({
basePath: '',
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-devkit/build-angular/plugins/karma'),
],
client: {
clearContext: false, // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: require('path').join(__dirname, '../../../coverage/ui/validators'),
reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true,
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
restartOnFileChange: true,
});
};

7
apps/ui/validators/ng-package.json Normal file
View File

@@ -0,0 +1,7 @@
{
"$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
"dest": "../../../dist/ui/validators",
"lib": {
"entryFile": "src/public-api.ts"
}
}

11
apps/ui/validators/package.json Normal file
View File

@@ -0,0 +1,11 @@
{
"name": "@ui/validators",
"version": "0.0.1",
"peerDependencies": {
"@angular/common": "^10.1.2",
"@angular/core": "^10.1.2"
},
"dependencies": {
"tslib": "^2.0.0"
}
}

18
apps/ui/validators/src/lib/set-invalid-property-errors.ts Normal file
View File

@@ -0,0 +1,18 @@
import { FormGroup } from '@angular/forms';
import { StringDictionary } from '@cmf/core';
import * as _ from 'lodash';
export function setInvalidPropertyErrors({
invalidProperties,
formGroup,
}: {
invalidProperties: StringDictionary<string>;
formGroup: FormGroup;
}) {
for (const key in invalidProperties) {
if (Object.prototype.hasOwnProperty.call(invalidProperties, key)) {
const invalidProperty = invalidProperties[key];
formGroup?.get(_.camelCase(key))?.setErrors({ invalidProperty });
}
}
}

7
apps/ui/validators/src/lib/validators.ts Normal file
View File

@@ -0,0 +1,7 @@
import { phone } from './validators/phone-number.validator';
import { date } from './validators/date.validator';
export const UiValidators = {
phone,
date,
};

0
apps/ui/common/src/lib/validators/date.validator.ts → apps/ui/validators/src/lib/validators/date.validator.ts
View File

3
apps/ui/validators/src/lib/validators/phone-number.validator.ts Normal file
View File

@@ -0,0 +1,3 @@
import { Validators } from '@angular/forms';
export const phone = Validators.pattern('^[0-9]+$');

6
apps/ui/validators/src/public-api.ts Normal file
View File

@@ -0,0 +1,6 @@
/*
* Public API Surface of validators
*/
export * from './lib/validators';
export * from './lib/set-invalid-property-errors';

24
apps/ui/validators/src/test.ts Normal file
View File

@@ -0,0 +1,24 @@
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
import 'zone.js/dist/zone';
import 'zone.js/dist/zone-testing';
import { getTestBed } from '@angular/core/testing';
import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
declare const require: {
context(
path: string,
deep?: boolean,
filter?: RegExp
): {
keys(): string[];
<T>(id: string): T;
};
};
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
// Then we find all the tests.
const context = require.context('./', true, /\.spec\.ts$/);
// And load the modules.
context.keys().map(context);

25
apps/ui/validators/tsconfig.lib.json Normal file
View File

@@ -0,0 +1,25 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "../../../tsconfig.json",
"compilerOptions": {
"outDir": "../../../out-tsc/lib",
"target": "es2015",
"declaration": true,
"declarationMap": true,
"inlineSources": true,
"types": [],
"lib": [
"dom",
"es2018"
]
},
"angularCompilerOptions": {
"skipTemplateCodegen": true,
"strictMetadataEmit": true,
"enableResourceInlining": true
},
"exclude": [
"src/test.ts",
"**/*.spec.ts"
]
}

10
apps/ui/validators/tsconfig.lib.prod.json Normal file
View File

@@ -0,0 +1,10 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "./tsconfig.lib.json",
"compilerOptions": {
"declarationMap": false
},
"angularCompilerOptions": {
"enableIvy": false
}
}

17
apps/ui/validators/tsconfig.spec.json Normal file
View File

@@ -0,0 +1,17 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "../../../tsconfig.json",
"compilerOptions": {
"outDir": "../../../out-tsc/spec",
"types": [
"jasmine"
]
},
"files": [
"src/test.ts"
],
"include": [
"**/*.spec.ts",
"**/*.d.ts"
]
}

17
apps/ui/validators/tslint.json Normal file
View File

@@ -0,0 +1,17 @@
{
"extends": "../../../tslint.json",
"rules": {
"directive-selector": [
true,
"attribute",
"ui",
"camelCase"
],
"component-selector": [
true,
"element",
"ui",
"kebab-case"
]
}
}

3
tsconfig.json
View File

@@ -191,6 +191,9 @@
],
"@domain/catalog": [
"apps/domain/catalog/src/public-api.ts"
],
"@ui/validators": [
"apps/ui/validators/src/public-api.ts"
]
}
}