jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add form validation

Browse source
This commit is contained in:
Chloe Herd 2023-08-15 16:40:45 -04:00
parent 985577202a
commit 183e183987
2 changed files with 21 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/layouts/review/review-sections/customer-review/customer-details-modal-question/customer-details-modal-question.spec.js
View file

@ -14,7 +14,7 @@ const testConstants = {
newValues: { newValues: {
firstName: "New First", firstName: "New First",
lastName: "New Last", lastName: "New Last",
emailAddress: "builddigitaltest@safelite.com - new", emailAddress: "builddigitaltest2@safelite.com",
phoneNumber: "222-222-2222", phoneNumber: "222-222-2222",
isSmsOptIn: true, isSmsOptIn: true,
}, },

24
src/layouts/review/review-sections/customer-review/customer-details-modal-question/customer-details-modal-question.vue
View file

@ -16,28 +16,28 @@
v-model="firstName" v-model="firstName"
ref="firstName" ref="firstName"
customInputId="firstName" customInputId="firstName"
validation-rules="" /> validation-rules="first-name-required" />
<textboxQuestion <textboxQuestion
class="mb-4" class="mb-4"
cmsWidgetName="CustomerLastNameWidget" cmsWidgetName="CustomerLastNameWidget"
v-model="lastName" v-model="lastName"
ref="lastName" ref="lastName"
customInputId="lastName" customInputId="lastName"
validation-rules="" /> validation-rules="last-name-required" />
<textboxQuestion <textboxQuestion
class="mb-4" class="mb-4"
cmsWidgetName="CustomerEmailWidget" cmsWidgetName="CustomerEmailWidget"
v-model="emailAddress" v-model="emailAddress"
ref="emailAddress" ref="emailAddress"
customInputId="emailAddress" customInputId="emailAddress"
validation-rules="" /> validation-rules="email-address-required|email-address-format" />
<phoneNumberQuestion <phoneNumberQuestion
class="mb-4" class="mb-4"
cmsWidgetName="CustomerPhoneWidget" cmsWidgetName="CustomerPhoneWidget"
v-model="phoneNumber" v-model="phoneNumber"
ref="phoneNumber" ref="phoneNumber"
isRequired isRequired
validation-rules="" /> validation-rules="phone-number-required" />
<checkboxQuestion <checkboxQuestion
class="mb-5" class="mb-5"
cmsWidgetName="CustomerTextMeWidget" cmsWidgetName="CustomerTextMeWidget"
@ -55,6 +55,22 @@ import textboxQuestion from "@/digital-components/textbox-question/textbox-quest
import phoneNumberQuestion from "@/digital-components/phone-number-question/phone-number-question"; import phoneNumberQuestion from "@/digital-components/phone-number-question/phone-number-question";
import checkboxQuestion from "@/digital-components/checkbox-question/checkbox-question"; import checkboxQuestion from "@/digital-components/checkbox-question/checkbox-question";
import textBlock from "@/digital-components/text-block/text-block"; import textBlock from "@/digital-components/text-block/text-block";
import { errorMessages } from "@/constants/error-messages";
import { required, regex } from "@/helpers/validation-rules";
import { defineRule } from "vee-validate";
// DEFINE VALIDATION RULES
defineRule("first-name-required", required(errorMessages.FIRST_NAME_REQUIRED));
defineRule("last-name-required", required(errorMessages.LAST_NAME_REQUIRED));
defineRule("phone-number-required", required(errorMessages.PHONE_REQUIRED));
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
)
);
export default { export default {
name: "customer-details-modal-question", name: "customer-details-modal-question",