Added some validation related stuff

src/common-components/dropdown-question/dropdown-question.vue

@@ -7,7 +7,8 @@
 				:name="inputId" 
 				:aria-disabled="isDisabled" 
 				:disabled="isDisabled" 
-				:aria-required="isRequired">
+				:aria-required="isRequired"
+				:validationRules="validationRules" >
 			<option v-for="(value, name, index) in options" :value="name" :key="index">
 				{{ value }}       
 			</option>
@@ -33,6 +34,7 @@ export default {
 		isDisabled: Boolean,
 		isRequired: Boolean,
 		disableAutoFill: Boolean,
+		validationRules: String, 
 	},
 	data() {
 		return {

src/common-components/textbox-question/textbox-question.vue

@@ -13,7 +13,8 @@
 			:disabled="isDisabled" 
 			:aria-required="isRequired"     
 			autocomplete="off"   
-			:class="[hasIcon ? 'has-icon' : '', iconRight ? 'icon-right' : '']" />
+			:class="[hasIcon ? 'has-icon' : '', iconRight ? 'icon-right' : '']"
+			:validationRules="validationRules" />
 		<p class="mt-2 form-test-error" v-if="!suppressError">
 			There has been an error!
 		</p>
@@ -45,6 +46,7 @@ export default {
 			type: String,
 			default: '',
 		},
+		validationRules: String,
 	},
 	data() {
 		return {

src/constants/error-messages.js

@@ -7,6 +7,13 @@ const errorMessages = {
     WINDSHIELD_CHIP_COUNT_REQUIRED: "Please select chip(s)",
     WINSHIELD_REPLACE_OPTIONS_REQUIRED: "Please select windshield part",
     REPLACE_OPTIONS_REQUIRED: "Please select rear window type",
+    STREET_ADDRESS_REQUIRED: "Please enter your street address",
+    CITY_REQUIRED: "Please enter your city",
+    STATE_REQUIRED: "Please enter your state",
+    ZIP_REQUIRED: "Please enter your ZIP",
+    FIRST_NAME_REQUIRED: "Please enter your first name",
+    LAST_NAME_REQUIRED: "Please enter your last name",
+    EMAIL_ADDRESS_REQUIRED: "Please enter your email address",
 };
   
 export { errorMessages };

src/layouts/address-lookup/customer-questions/address-questions/address-questions.vue

@@ -56,6 +56,7 @@ export default ({
 				zip: "",            
 			}),
 		},
+		validationRules: String,       
 	},
 	setup(props, { emit }) {
 		const addressModel = computed({  // Use computed to wrap the object

src/layouts/address-lookup/customer-questions/customer-questions.vue

@@ -24,62 +24,65 @@ import { computed } from 'vue';
 //import store from "@/store";
 
 export default ({
-		name: "customer-questions",
+	name: "customer-questions",
-		emits: ['update:modelValue'], // The component emits an event
+	emits: ['update:modelValue'], // The component emits an event
-		props: {
+	props: {
-			modelValue: {
+		modelValue: {
-				type: Object,
+			type: Object,
-				default: () => ({
+			default: () => ({
-					customerQuestions: {
+				customerQuestions: {
-						addressQuestions: {
+					addressQuestions: {
-							streetAddress: "",
+						streetAddress: "",
-							city: "",
+						city: "",
-							state: "",
+						state: "",
-							zip: "",
+						zip: "",
-						},
-						firstName: "",
-						lastName: "",
-						emailAddress: "",
-					}          
-				}),
-			}       
-		},    
-		data(){
-			return {
-
-			}
-		},
-		setup(props, { emit }) {
-			const customerModel = computed({  // Use computed to wrap the object
-					get: () => props.modelValue,
-					set: (value) => emit('update:modelValue', value),
-			});
-
-			return { customerModel };
-		},     
-		methods: {
-			initializeComponent(cmsContent){
-					// pass alert texts to addressQuestions component
-					this.$refs.addressQuestions.initializeComponent(cmsContent);
-
-					this.$refs.firstName.initializeComponent(cmsContent[6].QuestionText);
-					this.$refs.lastName.initializeComponent(cmsContent[7].QuestionText);
-					this.$refs.emailAddress.initializeComponent(cmsContent[8].QuestionText);
-			}
-		},
-		computed: {
-			value: {
-					get: function() {
-							return this.modelValue;
 					},
-					set: function(newValue) {
+					firstName: "",
-							this.$emit("update:modelValue", newValue);
+					lastName: "",
-					}
+					emailAddress: "",
-			},
+				}          
+			}),
 		},
-		components: {
+		validationRules: String,       
-			addressQuestions,
+	},    
-			textboxQuestion,
+	data() {
+		return {
+
 		}
+	},
+	setup(props, { emit }) {
+		// Please do not modify, this "computed" is used to track and report 
+		// this object's property changes to the parent component
+		const customerModel = computed({  // Use computed to wrap the object
+			get: () => props.modelValue,
+			set: (value) => emit('update:modelValue', value),
+		});
+
+		return { customerModel };
+	},     
+	methods: {
+		initializeComponent(cmsContent){
+			// pass alert texts to addressQuestions component
+			this.$refs.addressQuestions.initializeComponent(cmsContent);
+
+			this.$refs.firstName.initializeComponent(cmsContent[6].QuestionText);
+			this.$refs.lastName.initializeComponent(cmsContent[7].QuestionText);
+			this.$refs.emailAddress.initializeComponent(cmsContent[8].QuestionText);
+		}
+	},
+	computed: {
+		value: {
+			get: function() {
+				return this.modelValue;
+			},
+			set: function(newValue) {
+				this.$emit("update:modelValue", newValue);
+			}
+		},
+	},
+	components: {
+		addressQuestions,
+		textboxQuestion,
+	}
 })
 </script>