62 lines
1.6 KiB
Vue
62 lines
1.6 KiB
Vue
<template>
|
|
<textboxQuestion
|
|
ref="saveProgressInputTextQuestion"
|
|
:cmsWidgetName="cmsWidgetName"
|
|
v-model="value"
|
|
inputId="saveProgressUserInput"
|
|
questionAlignment="center"
|
|
cornerStyle="rounded"
|
|
:displayQuestionText="true"
|
|
isRequired
|
|
@input="validateEmail"
|
|
validationRules="email-address-required|email-address-format" />
|
|
</template>
|
|
|
|
<script>
|
|
import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
|
|
|
|
//Supporting Files
|
|
import { defineRule } from "vee-validate";
|
|
import { required, regex } from "@/helpers/validation-rules";
|
|
import { errorMessages } from "@/constants/error-messages";
|
|
|
|
// Define Validation Rules
|
|
defineRule("email-address-required", required(errorMessages.EMAIL_ADDRESS_REQUIRED));
|
|
defineRule(
|
|
"email-address-format",
|
|
regex(
|
|
/^([a-zA-Z0-9_\-.+]+)@([a-zA-Z0-9-]+)\.([a-zA-Z]{2,})$/,
|
|
errorMessages.EMAIL_ADDRESS_FORMAT
|
|
)
|
|
);
|
|
|
|
const EMAIL_REGEX = /[^a-zA-Z0-9_\-.+@]/g;
|
|
|
|
export default {
|
|
name: "save-progress-question",
|
|
props: {
|
|
modelValue: String,
|
|
cmsWidgetName: String,
|
|
},
|
|
computed: {
|
|
value: {
|
|
get: function () {
|
|
return this.modelValue;
|
|
},
|
|
set: function (newValue) {
|
|
this.$emit("update:modelValue", newValue);
|
|
},
|
|
},
|
|
},
|
|
methods: {
|
|
validateEmail() {
|
|
setTimeout(() => {
|
|
this.value = this.value.replace(EMAIL_REGEX, "");
|
|
});
|
|
},
|
|
},
|
|
components: {
|
|
textboxQuestion,
|
|
},
|
|
};
|
|
</script>
|