pui9-components 2.0.8 → 3.0.0

package/src/components/PuiTextArea.vue

@@ -1,204 +0,0 @@
-<template>
-	<!-- DESKTOP - TABLET -->
-	<div v-if="!isMobile">
-		<div v-if="toplabel" class="ml-1 mr-1">
-			<v-layout>
-				<v-flex xs12>
-					<label v-if="getLabel === '$nbsp;'">&nbsp;</label>
-					<label v-else :class="getLabelRequiredClass">{{ getLabel }}</label>
-				</v-flex>
-			</v-layout>
-			<v-layout>
-				<v-flex xs12>
-					<v-textarea
-						v-model="internalModel"
-						v-bind="allProps"
-						:class="getEditedClass"
-						:rules="getRules"
-						solo
-						outlined
-						flat
-						single-line
-						auto-grow
-						@blur="updateValueLazy"
-						@input="updateValueRealtime"
-						:placeholder="getPlaceholder"
-						:error="internalError"
-					></v-textarea>
-				</v-flex>
-			</v-layout>
-		</div>
-		<div v-else class="ml-1 mr-1">
-			<v-layout>
-				<v-flex :class="labelColumnStyles ? labelColumnStyles : 'xs12 sm6 md4 xl3'">
-					<label :class="getLabelRequiredClass">{{ getLabel }}</label>
-				</v-flex>
-				<v-flex :class="valueColumnStyles ? valueColumnStyles : 'xs12 sm6 md8 xl9'">
-					<v-textarea
-						v-model="internalModel"
-						v-bind="allProps"
-						:class="getEditedClass"
-						:rules="getRules"
-						solo
-						outlined
-						flat
-						single-line
-						auto-grow
-						@blur="updateValueLazy"
-						@input="updateValueRealtime"
-						:placeholder="getPlaceholder"
-						:error="internalError"
-					></v-textarea>
-				</v-flex>
-			</v-layout>
-		</div>
-	</div>
-	<!-- MOBILE -->
-	<div v-else>
-		<v-layout>
-			<v-flex xs12>
-				<v-textarea
-					v-model="internalModel"
-					v-bind="allProps"
-					:class="getMobileClass"
-					:rules="getRules"
-					class="v-text-field--mobile"
-					:label="getLabel"
-					flat
-					auto-grow
-					@blur="updateValueLazy"
-					@input="updateValueRealtime"
-					:placeholder="getPlaceholder"
-					:error="internalError"
-				></v-textarea>
-			</v-flex>
-		</v-layout>
-	</div>
-</template>
-
-<script>
-import PuiFormComponentMixin from '../mixins/PuiFormComponentMixin';
-
-export default {
-	name: 'PuiTextArea',
-	mixins: [PuiFormComponentMixin],
-	props: {
-		value: {
-			type: [String, Number],
-			required: false
-		},
-		realtime: {
-			type: Boolean,
-			required: false,
-			default: false
-		},
-		placeholder: {
-			type: String,
-			default: ' ',
-			required: false
-		},
-		noLazyModel: {
-			type: Boolean,
-			required: false,
-			default: false
-		},
-		labelColumnStyles: {
-			type: String,
-			required: false
-		},
-		valueColumnStyles: {
-			type: String,
-			required: false
-		},
-		rules: {
-			type: Array,
-			required: false
-		}
-	},
-	computed: {
-		getLabelRequiredClass() {
-			return { 'v-label--required': this.required };
-		},
-		getEditedClass() {
-			return { 'v-text-field--edited': this.isEdited };
-		},
-		getMobileClass() {
-			return { 'v-text-field--edited': this.isEdited, 'v-text-field--required': this.required };
-		},
-		getRules() {
-			const rules = this.rules ? [...this.rules] : [];
-			if (this.required) {
-				var func = (value) => !!value || this.requiredMessage;
-				var func2 = () => !this.internalError;
-				var func3 = () => {
-					if (this.internalModel === '' || this.internalModel === null) {
-						return this.requiredMessage;
-					}
-					return true;
-				};
-				rules.push(func, func2, func3);
-			}
-			return rules;
-		}
-	},
-	watch: {
-		value(val) {
-			if (!this.noLazyModel && !this.firstLazyLoad) {
-				this.initializeModel(val);
-				this.firstLazyLoad = true;
-			} else {
-				this.internalModel = val;
-			}
-		}
-	},
-	created() {
-		if (this.noLazyModel) {
-			this.firstLazyLoad = true;
-		}
-		this.initialValue = this.value;
-		this.initializeModel(this.value);
-	},
-	methods: {
-		updateValueLazy() {
-			this.checkValue();
-			if (!this.realtime) {
-				this.internalModel = this.sanitizePuiFormHtmlText(this.internalModel);
-				if (this.internalModel === '' || this.internalModel === 'null' || this.internalModel === 'undefined') {
-					this.internalModel = undefined;
-				}
-				this.$emit('input', this.internalModel);
-			}
-		},
-		updateValueRealtime() {
-			this.checkValue();
-			if (this.realtime) {
-				this.internalModel = this.sanitizePuiFormHtmlText(this.internalModel);
-				if (this.internalModel === '' || this.internalModel === 'null' || this.internalModel === 'undefined') {
-					this.internalModel = undefined;
-				}
-				this.$emit('input', this.internalModel);
-			}
-		},
-		initializeModel(value) {
-			this.internalModel = value;
-			if (value !== null && !this.firstLazyLoad) {
-				this.firstLazyLoad = true;
-			}
-		},
-		checkValue() {
-			this.clearMessages();
-			if (this.required) {
-				if (this.internalModel === '' || this.internalModel === null) {
-					this.showErrorMessage();
-				}
-			}
-		},
-		clearMessages() {
-			this.internalError = false;
-		},
-		showErrorMessage() {
-			this.internalError = true;
-		}
-	}
-};
-</script>

package/src/components/PuiTextField.vue

@@ -1,389 +0,0 @@
-<template>
-    <!-- DESKTOP - TABLET -->
-    <div v-if="!isMobile">
-        <div v-if="toplabel || !hasLabel" class="ml-1 mr-1">
-            <v-layout v-if="hasLabel">
-                <v-flex xs12>
-                    <label v-if="getLabel === '$nbsp;'">&nbsp;</label>
-                    <label v-else :class="getLabelRequiredClass">{{ getLabel }}</label>
-                    <pui-form-tooltip v-bind="{ tooltipDescription, tooltipIcon }" v-if="showTooltip" ref="tooltip"></pui-form-tooltip>
-                </v-flex>
-            </v-layout>
-            <v-layout>
-                <v-flex xs12>
-                    <v-text-field
-                        v-model="internalModel"
-                        v-bind="allProps"
-                        :class="getEditedClass"
-                        :rules="getRules"
-                        solo
-                        outlined
-                        flat
-                        @blur="updateValueLazy"
-                        @input="updateValueRealtime"
-                        :placeholder="getPlaceholder"
-                        :error="internalError"
-                        v-on="$listeners"
-                    ></v-text-field>
-                </v-flex>
-            </v-layout>
-        </div>
-        <div v-else class="ml-1 mr-1">
-            <v-layout>
-                <v-flex :class="labelColumnStyles ? labelColumnStyles : 'xs12 sm6 md4 xl3'">
-                    <label :class="getLabelRequiredClass">{{ getLabel }}</label>
-                    <pui-form-tooltip v-bind="{ tooltipDescription, tooltipIcon }" v-if="showTooltip" ref="tooltip"></pui-form-tooltip>
-                </v-flex>
-                <v-flex :class="valueColumnStyles ? valueColumnStyles : 'xs12 sm6 md8 xl9'">
-                    <v-text-field
-                        v-model="internalModel"
-                        v-bind="allProps"
-                        :class="getEditedClass"
-                        :rules="getRules"
-                        solo
-                        outlined
-                        flat
-                        @blur="updateValueLazy"
-                        @input="updateValueRealtime"
-                        :placeholder="getPlaceholder"
-                        :error="internalError"
-                        v-on="$listeners"
-                    ></v-text-field>
-                </v-flex>
-            </v-layout>
-        </div>
-    </div>
-    <!-- MOBILE -->
-    <div v-else>
-        <v-layout>
-            <v-flex xs12>
-                <v-text-field
-                    v-model="internalModel"
-                    v-bind="allProps"
-                    :label="getLabel"
-                    :class="getMobileClass"
-                    :rules="getRules"
-                    class="v-text-field--mobile"
-                    flat
-                    @blur="updateValueLazy"
-                    @input="updateValueRealtime"
-                    :placeholder="getPlaceholder"
-                    :error="internalError"
-                    v-on="$listeners"
-                ></v-text-field>
-            </v-flex>
-        </v-layout>
-    </div>
-</template>
-
-<script>
-import PuiFormComponentMixin from '../mixins/PuiFormComponentMixin';
-
-export default {
-    name: 'PuiTextField',
-    mixins: [PuiFormComponentMixin],
-    props: {
-        value: {
-            type: [String, Number],
-            required: false
-        },
-        tooltip: {
-            type: Boolean,
-            required: false,
-            default: false
-        },
-        tooltipDescription: {
-			type: String,
-			required: false
-		},
-		tooltipIcon: {
-			type: String,
-			required: false,
-		},
-        realtime: {
-            type: Boolean,
-            required: false,
-            default: false
-        },
-        placeholder: {
-            type: String,
-            required: false,
-            default: ' '
-        },
-        noLazyModel: {
-            type: Boolean,
-            required: false,
-            default: false
-        },
-        readonly: {
-            type: Boolean,
-            required: false,
-            default: false
-        },
-        rules: {
-            type: Array,
-            default: () => {
-                return [];
-            }
-        },
-        emailMask: {
-            type: Boolean,
-            required: false,
-            default: false
-        },
-        nifMask: {
-            type: Boolean,
-            required: false,
-            default: false
-        },
-        nieMask: {
-            type: Boolean,
-            required: false,
-            default: false
-        },
-        cifMask: {
-            type: Boolean,
-            required: false,
-            default: false
-        },
-        passportMask: {
-            type: Boolean,
-            required: false,
-            default: false
-        },
-        maxlength: {
-            type: [Number, String],
-            required: false
-        },
-        labelColumnStyles: {
-            type: String,
-            required: false
-        },
-        valueColumnStyles: {
-            type: String,
-            required: false
-        }
-    },
-    computed: {
-        getMobileClass() {
-            return { 'v-text-field--edited': this.isEdited, 'v-text-field--required': this.required };
-        },
-        getLabelRequiredClass() {
-            return { 'v-label--required': this.required };
-        },
-        getEditedClass() {
-            return { 'v-text-field--edited': this.isEdited };
-        },
-        getRules() {
-            const rules = [...this.rules];
-            if (this.required) {
-                var func = (value) => !!value || this.requiredMessage;
-                var func2 = () => !this.internalError;
-                var func3 = () => {
-                    if (this.internalModel === '' || this.internalModel === null) {
-                        return this.requiredMessage;
-                    }
-                    return true;
-                };
-                rules.push(func, func2, func3);
-            }
-            if (this.emailMask) {
-                var checkEmail = (value) => {
-                    if (!value) {
-                        return true;
-                    }
-                    if (value.length > 0) {
-                        const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-                        return pattern.test(value) || this.$t('form.puialertconfiguration.emails_invalid');
-                    }
-                    return false;
-                }
-                rules.push(checkEmail);
-            }
-            if (this.nifMask) {
-                var checkNif = (value) => {
-                    if (!value) {
-                        return true;
-                    }
-                    value = value.toUpperCase();
-                    if (value.length > 0) {
-                        const pattern = /^(\d{8})([A-Z]{1})$/;
-                        var letters = "TRWAGMYFPDXBNJZSQVHLCKE";
-                        if (pattern.test(value)) {
-                            console.log("letters.charAt(value.substring(0, 8) % 23)",letters.charAt(value.substring(0, 8) % 23));
-                            console.log("value.charAt(8)",value.charAt(8));
-                            if (letters.charAt(value.substring(0, 8) % 23) === value.charAt(8)){
-                                return true;
-                            } else{
-                                return this.$t('form.puialertconfiguration.nifs_invalid');
-                            }
-                        } else {
-                            return this.$t('form.puialertconfiguration.nifs_invalid');
-                        }
-                    }
-                    return false;
-                }
-                rules.push(checkNif);
-            }
-            if (this.nieMask) {
-                var checkNie = (value) => {
-                    if (!value) {
-                        return true;
-                    }
-                    value = value.toUpperCase();
-                    if (value.length > 0) {
-                        const pattern = /^([XYZ]{1})(\d{7})([A-Z]{1})$/;
-                        var letters = "TRWAGMYFPDXBNJZSQVHLCKE";
-                        if (pattern.test(value)) {
-                            if (value.startsWith('X')) {
-                                value = value.replace('X', '0');
-                            } else if (value.startsWith('Y')) {
-                                value = value.replace('Y', '1');
-                            } else if (value.startsWith('Z')) {
-                                value = value.replace('Z', '2');
-                            }
-                            if (letters.charAt(value.substring(0, 8) % 23) == value.charAt(8)){
-                                return true;
-                            } else{
-                                return this.$t('form.puialertconfiguration.nies_invalid');
-                            }
-                        } else {
-                            return this.$t('form.puialertconfiguration.nies_invalid');
-                        }
-                    }
-                    return false;
-                }
-                rules.push(checkNie);
-            }
-            if (this.cifMask) {
-                var checkCif = (value) => {
-                    if (!value) {
-                        return true;
-                    }
-                    value = value.toUpperCase();
-                    if (value.length > 0) {
-                        const pattern = /^([ABCDEFGHJKLMNPQRSUVW])(\d{7})([0-9A-J])$/;
-                        return pattern.test(value) || this.$t('form.puialertconfiguration.cifs_invalid');
-                    }
-                    var v1 = new Array(0, 2, 4, 6, 8, 1, 3, 5, 7, 9);
-                    var temp = 0;
-                    var dc;
-                    var i;
-                    for (i = 2; i <= 6; i += 2) {
-                        temp = temp + v1[parseInt(value.substr(i - 1, 1))];
-                        temp = temp + parseInt(value.substr(i, 1));
-                    }
-                    temp = temp + v1[parseInt(value.substr(7, 1))];
-                    temp = (10 - (temp % 10));
-                    if (temp == 10) {
-                        temp = 0;
-                    }
-                    dc = value.toUpperCase().charAt(8);
-                    if ((dc == temp) || (temp == 1 && dc == 'A') || (temp == 2 && dc == 'B') || (temp == 3 && dc == 'C') || (temp == 4 && dc == 'D') || (temp == 5 && dc == 'E') || (temp == 6 && dc == 'F') || (temp == 7 && dc == 'G') || (temp == 8 && dc == 'H') || (temp == 9 && dc == 'I') || (temp == 0 && dc == 'J')){
-                        return true;
-                    } else {
-                        return this.$t('form.puialertconfiguration.cifs_invalid');
-                    }
-                }
-                rules.push(checkCif);
-            }
-            if (this.passportMask) {
-                var checkPassport = (value) => {
-                    if (!value) {
-                        return true;
-                    }
-                    value = value.toUpperCase();
-                    if (value.length > 0) {
-                        const pattern = /[A-Z]{3}[0-9]{6}/;
-                        return pattern.test(value) || this.$t('form.puialertconfiguration.passports_invalid');
-                    }
-                    return false;
-                }
-                rules.push(checkPassport);
-            }
-            return rules;
-        },
-        compPlaceholder() {
-            if (this.placeholder && this.placeholder.length > 0) {
-                return this.placeholder;
-            }
-            return ' ';
-        },
-        showTooltip() {
-            if (this.getLabel === '' || this.getLabel === null) {
-                return false;
-            }
-            return this.tooltipDescription || this.tooltip;
-        }
-    },
-    watch: {
-        value(val) {
-            if (!this.noLazyModel && !this.firstLazyLoad) {
-                this.initializeModel(val);
-                this.firstLazyLoad = true;
-            } else {
-                this.internalModel = val;
-            }
-        }
-    },
-    created() {
-        if (this.noLazyModel) {
-            this.firstLazyLoad = true;
-        }
-        this.initialValue = this.value;
-        this.initializeModel(this.value);
-    },
-    mounted() {
-		if (this.tooltip && this.$refs.tooltip) {
-			this.setTooltip();
-		}
-    },
-    methods: {
-        setTooltip() {
-            if (this.maxlength) {
-                this.$refs.tooltip.pushMessage(`${this.$t('pui9.error.field_maxlength')} ${this.maxlength}`);
-            }
-        },
-        updateValueLazy() {
-            this.checkValue();
-            if (!this.realtime) {
-                this.internalModel = this.sanitizePuiFormHtmlText(this.internalModel);
-                if (this.internalModel === '' || this.internalModel === 'null' || this.internalModel === 'undefined') {
-                    this.internalModel = undefined;
-                }
-                this.$emit('input', this.internalModel);
-            }
-        },
-        updateValueRealtime() {
-            this.checkValue();
-            if (this.realtime) {
-                this.internalModel = this.sanitizePuiFormHtmlText(this.internalModel);
-                if (this.internalModel === '' || this.internalModel === 'null' || this.internalModel === 'undefined') {
-                    this.internalModel = undefined;
-                }
-                this.$emit('input', this.internalModel);
-            }
-        },
-        initializeModel(value) {
-            this.internalModel = value;
-            if (value !== null && !this.firstLazyLoad) {
-                this.firstLazyLoad = true;
-            }
-        },
-        checkValue() {
-            this.clearMessages();
-            if (this.required) {
-                if (this.internalModel === '' || this.internalModel === null) {
-                    this.showErrorMessage();
-                }
-            }
-        },
-        clearMessages() {
-            this.internalError = false;
-        },
-        showErrorMessage() {
-            this.internalError = true;
-        }
-    }
-};
-</script>

package/src/dateTimeUtils.js

@@ -1,78 +0,0 @@
-import moment from 'moment';
-
-/// //////////////// MOMENTJS TIME SUPPORT
-export default {
-	getLocalDateNowMillis: () => {
-		return moment();
-	},
-	getLocalDateNow: (format) => {
-		var f = 'YYYY-MM-DD';
-		if (format) {
-			f = format;
-		}
-		return moment().format(f);
-	},
-	formatDate: (date, format) => {
-		return moment(date).format(format);
-	},
-	getLocalTimeNow: (format) => {
-		var f = 'HH:mm:ss';
-		if (format) {
-			f = format;
-		}
-		return moment().format(f);
-	},
-	getLocalDate: (date) => {
-		if (date) {
-			return moment(date).format();
-		}
-		return date;
-	},
-	getLocalFormattedDateFromMillis: (millis, isoFormat) => {
-		return moment(millis).format(isoFormat);
-	},
-	getLocalFormattedDate: (date, isoFormat) => {
-		if (date) {
-			return moment(date).format(isoFormat);
-		}
-		return date;
-	},
-	isLocalDateValid: (date) => {
-		return moment(date).isValid();
-	},
-	isLocalDateBefore: (date, date2) => {
-		var d2 = moment(date2);
-		return moment(date).isBefore(d2);
-	},
-	isLocalDateSameOrBefore: (date, date2) => {
-		var d2 = moment(date2);
-		return moment(date).isSameOrBefore(d2);
-	},
-	isLocalDateAfter: (date, date2) => {
-		var d2 = moment(date2);
-		return moment(date).isAfter(d2);
-	},
-	isLocalDateSameOrAfter: (date, date2) => {
-		var d2 = moment(date2);
-		return moment(date).isSameOrAfter(d2);
-	},
-	isLocalDateEqual: (date, date2) => {
-		var d2 = moment(date2);
-		return moment(date).isSame(d2);
-	},
-	getUTCDate: (date) => {
-		return moment.utc(date).format();
-	},
-	getUTCOffset: () => {
-		return moment().utcOffset();
-	},
-	getUTCDateNow: () => {
-		return moment.utc().format();
-	},
-	addDaysToLocalDate(date, numberOfDays) {
-		return moment(date).add(numberOfDays, 'days').utc().format();
-	},
-	getMomentFromDate(date) {
-		return moment(date);
-	}
-};