d9ae709b-3c27-4b69-b125-b8b80b54f90b

import { Dictionary } from 'ngx-tethys/types';
import { helpers } from 'ngx-tethys/util';

import { Inject, Injectable, Optional } from '@angular/core';
import { ValidationErrors } from '@angular/forms';

import { THY_VALIDATOR_CONFIG, ThyFormValidationMessages, ThyFormValidatorGlobalConfig } from './form.class';

export const ERROR_VALUE_REPLACE_REGEX = /\{(.+?)\}/g;

const INVALID_CLASS = 'is-invalid';
const INVALID_FEEDBACK_CLASS = 'invalid-feedback';

const defaultValidatorConfig: ThyFormValidatorGlobalConfig = {
    showElementError: true,
    removeElementError: true,
    validationMessages: {}
};

const globalValidationMessages = {
    required: '该选项不能为空',
    maxlength: '该选项输入值长度不能大于{maxlength}',
    minlength: '该选项输入值长度不能小于{minlength}',
    thyUniqueCheck: '输入值已经存在，请重新输入',
    email: '输入邮件的格式不正确',
    confirm: '两次输入不一致',
    pattern: '该选项输入格式不正确',
    number: '必须输入数字',
    url: '输入URL格式不正确',
    max: '该选项输入值不能大于{max}',
    min: '该选项输入值不能小于{min}'
};

/**
 * @private
 */
@Injectable()
export class ThyFormValidatorLoader {
    private config: ThyFormValidatorGlobalConfig;

    private getDefaultValidationMessage(key: string) {
        if (this.config.globalValidationMessages && this.config.globalValidationMessages[key]) {
            return this.config.globalValidationMessages[key];
        } else {
            return globalValidationMessages[key];
        }
    }
    constructor(
        @Optional()
        @Inject(THY_VALIDATOR_CONFIG)
        config: ThyFormValidatorGlobalConfig
    ) {
        this.config = Object.assign({}, defaultValidatorConfig, config);
    }

    get validationMessages() {
        return this.config.validationMessages;
    }

    get validateOn() {
        if (!this.config?.validateOn) {
            this.config.validateOn = 'submit';
        }
        return this.config.validateOn;
    }

    isElementInInputGroup(element: HTMLElement) {
        return !!(element?.parentElement?.tagName.toUpperCase() === 'THY-INPUT-GROUP');
    }

    getErrorMessage(name: string, key: string): string {
        if (this.validationMessages[name] && this.validationMessages[name][key]) {
            return this.validationMessages[name][key];
        } else {
            return this.getDefaultValidationMessage(key);
        }
    }

    getErrorMessages(name: string, validationErrors: ValidationErrors): string[] {
        const messages = [];
        for (const validationError in validationErrors) {
            if (validationErrors.hasOwnProperty(validationError)) {
                messages.push(this.getErrorMessage(name, validationError));
            }
        }
        return messages;
    }

    defaultShowError(element: HTMLElement, errorMessages: string[]) {
        if (element && element.parentElement) {
            const documentFrag = document.createDocumentFragment();
            const divNode = document.createElement('DIV');
            const textNode = document.createTextNode(errorMessages[0]);
            divNode.appendChild(textNode);
            divNode.setAttribute('class', INVALID_FEEDBACK_CLASS);
            documentFrag.appendChild(divNode);
            element.parentElement.append(documentFrag);
        }
    }

    defaultRemoveError(element: HTMLElement) {
        if (element && element.parentElement) {
            const invalidFeedback = element.parentElement.querySelector('.invalid-feedback');
            if (invalidFeedback) {
                element.parentElement.removeChild(invalidFeedback);
            }
        }
    }

    removeError(element: HTMLElement) {
        const formControlElement = this.isElementInInputGroup(element) ? element.parentElement : element;
        formControlElement.classList.remove(INVALID_CLASS);
        if (helpers.isFunction(this.config.removeElementError)) {
            this.config.removeElementError(formControlElement);
        } else if (this.config.showElementError) {
            this.defaultRemoveError(formControlElement);
        } else {
            // do nothings
        }
    }

    showError(element: HTMLElement, errorMessages: string[]) {
        const formControlElement = this.isElementInInputGroup(element) ? element.parentElement : element;
        formControlElement.classList.add(INVALID_CLASS);
        if (helpers.isFunction(this.config.showElementError)) {
            this.config.showElementError(formControlElement, errorMessages);
        } else if (this.config.showElementError) {
            this.defaultShowError(formControlElement, errorMessages);
        } else {
            // do nothings
        }
    }

    addValidationMessages(messages: ThyFormValidationMessages) {
        Object.assign(this.config.validationMessages, messages);
    }

    setGlobalValidationMessages(validationMessages: Dictionary<string>) {
        this.config.globalValidationMessages = validationMessages;
    }
}

1	import { Dictionary } from 'ngx-tethys/types';
2	import { helpers } from 'ngx-tethys/util';
3
4	import { Inject, Injectable, Optional } from '@angular/core';
5	import { ValidationErrors } from '@angular/forms';	1✔
6		1✔
7	import { THY_VALIDATOR_CONFIG, ThyFormValidationMessages, ThyFormValidatorGlobalConfig } from './form.class';	1✔
8		1✔
9	export const ERROR_VALUE_REPLACE_REGEX = /\{(.+?)\}/g;
10
11	const INVALID_CLASS = 'is-invalid';
12	const INVALID_FEEDBACK_CLASS = 'invalid-feedback';
13		1✔
14	const defaultValidatorConfig: ThyFormValidatorGlobalConfig = {
15	showElementError: true,
16	removeElementError: true,
17	validationMessages: {}
18	};
19
20	const globalValidationMessages = {
21	required: '该选项不能为空',
22	maxlength: '该选项输入值长度不能大于{maxlength}',
23	minlength: '该选项输入值长度不能小于{minlength}',
24	thyUniqueCheck: '输入值已经存在，请重新输入',
25	email: '输入邮件的格式不正确',
26	confirm: '两次输入不一致',
27	pattern: '该选项输入格式不正确',
28	number: '必须输入数字',
29	url: '输入URL格式不正确',	1✔
30	max: '该选项输入值不能大于{max}',
31	min: '该选项输入值不能小于{min}'	×
32	};	×
33
34	/**
35	* @private	×
36	*/
37	@Injectable()
38	export class ThyFormValidatorLoader {
39	private config: ThyFormValidatorGlobalConfig;	×
40
41	private getDefaultValidationMessage(key: string) {
42	if (this.config.globalValidationMessages && this.config.globalValidationMessages[key]) {	×
43	return this.config.globalValidationMessages[key];
44	} else {
45	return globalValidationMessages[key];	×
46	}	×
47	}
48	constructor(	×
49	@Optional()
50	@Inject(THY_VALIDATOR_CONFIG)
51	config: ThyFormValidatorGlobalConfig	×
52	) {
53	this.config = Object.assign({}, defaultValidatorConfig, config);
54	}	×
55		×
56	get validationMessages() {
57	return this.config.validationMessages;
58	}	×
59
60	get validateOn() {
61	if (!this.config?.validateOn) {
62	this.config.validateOn = 'submit';	×
63	}	×
64	return this.config.validateOn;	×
65	}	×
66
67	isElementInInputGroup(element: HTMLElement) {
68	return !!(element?.parentElement?.tagName.toUpperCase() === 'THY-INPUT-GROUP');	×
69	}
70
71	getErrorMessage(name: string, key: string): string {	×
72	if (this.validationMessages[name] && this.validationMessages[name][key]) {	×
73	return this.validationMessages[name][key];	×
74	} else {	×
75	return this.getDefaultValidationMessage(key);	×
76	}	×
77	}	×
78		×
79	getErrorMessages(name: string, validationErrors: ValidationErrors): string[] {
80	const messages = [];
81	for (const validationError in validationErrors) {
82	if (validationErrors.hasOwnProperty(validationError)) {	×
83	messages.push(this.getErrorMessage(name, validationError));	×
84	}	×
85	}	×
86	return messages;
87	}
88
89	defaultShowError(element: HTMLElement, errorMessages: string[]) {
90	if (element && element.parentElement) {	×
91	const documentFrag = document.createDocumentFragment();	×
92	const divNode = document.createElement('DIV');	×
93	const textNode = document.createTextNode(errorMessages[0]);	×
94	divNode.appendChild(textNode);
95	divNode.setAttribute('class', INVALID_FEEDBACK_CLASS);	×
96	documentFrag.appendChild(divNode);	×
97	element.parentElement.append(documentFrag);
98	}
99	}
100
101	defaultRemoveError(element: HTMLElement) {
102	if (element && element.parentElement) {
103	const invalidFeedback = element.parentElement.querySelector('.invalid-feedback');	×
104	if (invalidFeedback) {	×
105	element.parentElement.removeChild(invalidFeedback);	×
106	}	×
107	}
108	}	×
109		×
110	removeError(element: HTMLElement) {
111	const formControlElement = this.isElementInInputGroup(element) ? element.parentElement : element;
112	formControlElement.classList.remove(INVALID_CLASS);
113	if (helpers.isFunction(this.config.removeElementError)) {
114	this.config.removeElementError(formControlElement);
115	} else if (this.config.showElementError) {
116	this.defaultRemoveError(formControlElement);	×
117	} else {
118	// do nothings
119	}	×
120	}
121		1✔
122	showError(element: HTMLElement, errorMessages: string[]) {
123	const formControlElement = this.isElementInInputGroup(element) ? element.parentElement : element;
124	formControlElement.classList.add(INVALID_CLASS);
125	if (helpers.isFunction(this.config.showElementError)) {	1✔
126	this.config.showElementError(formControlElement, errorMessages);
127	} else if (this.config.showElementError) {
128	this.defaultShowError(formControlElement, errorMessages);
129	} else {
130	// do nothings
131	}
132	}
133
134	addValidationMessages(messages: ThyFormValidationMessages) {
135	Object.assign(this.config.validationMessages, messages);
136	}
137
138	setGlobalValidationMessages(validationMessages: Dictionary<string>) {
139	this.config.globalValidationMessages = validationMessages;
140	}
141	}

atinc / ngx-tethys / d9ae709b-3c27-4b69-b125-b8b80b54f90b

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous