From 853a7affe7d0c0d58e8815e58df853ff53caaca0 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Fri, 20 Jan 2023 11:17:49 -0500
Subject: [PATCH] added dropdown-question component to page

---
 .../license-plate-lookup.vue                  | 26 ++++++++++++-------
 1 file changed, 17 insertions(+), 9 deletions(-)

diff --git a/src/layouts/license-plate-lookup/license-plate-lookup.vue b/src/layouts/license-plate-lookup/license-plate-lookup.vue
index e9ce0061..6f825e2a 100644
--- a/src/layouts/license-plate-lookup/license-plate-lookup.vue
+++ b/src/layouts/license-plate-lookup/license-plate-lookup.vue
@@ -33,13 +33,14 @@
           disableAutoFill
           inputId="license-plate-question"
           validationRules="license-plate-required" />
-        <textboxQuestion
-          cmsWidgetName="RegistrationZipQuestionWidget"  
-          v-model="registrationZipCode"
-          isRequired
+        <dropdownQuestion
+          cmsWidgetName="StateQuestionWidget"
+          v-model="licenseState"
+          ref="state"
+          inputId="8fdf9dc2e13e430eb57529499dceb3eb"
+          :options="stateOptions"
           disableAutoFill
-          inputId="zip"
-          validationRules="zip-required|zip-format"
+          validationRules="state-required"
           class="mt-4" />
         <siteFooter
           :isForwardActionDisabled="!meta.valid"
@@ -57,10 +58,11 @@ import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
 import { settleAllPromises } from '@/helpers/layout-helper';
 import { useMainStore } from '@/store';
 import { errorMessages } from "@/constants/error-messages";
-import { required, regex } from "@/helpers/validation-rules";
+import { required } from "@/helpers/validation-rules";
 import { defineRule } from "vee-validate";
 import { getDamageString, isGlassAvailableForCarId } from '@/helpers/damage-helper.js';
 import { routerParams } from '@/router/router-params.js'
+import { states } from "@/constants/states";
 
 // Import Component
 import baseFormMixin from '@/mixins/base-form-mixin';
@@ -71,12 +73,12 @@ import siteHeader from '@/common-components/site-header/site-header.vue';
 import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.vue';
 import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
 import textboxQuestion from '@/common-components/textbox-question/textbox-question.vue';
+import dropdownQuestion from '@/common-components/dropdown-question/dropdown-question.vue';
 import alert from "@/ux-components/alert/alert";
 
 // Define Validation Rules
 defineRule("license-plate-required", required(errorMessages.LICENSE_PLATE_REQUIRED));
-defineRule("zip-required", required(errorMessages.REGISTRATION_ZIP_REQUIRED));
-defineRule("zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.SERVICE_ZIP_FORMAT));
+defineRule("state-required", required(errorMessages.STATE_REQUIRED));
 
 export default {
   name: 'license-plate-lookup',
@@ -261,6 +263,11 @@ export default {
                 .replaceAll("{custom:vinYmmFound}", vinYmmFound)
                 .replaceAll("{custom:vinYmmExpected}", vinYmmExpected);
       },
+      stateOptions: {
+        get: function () {
+            return states;
+        },
+    },
   },
   watch: {
       licensePlate() {
@@ -281,6 +288,7 @@ export default {
     siteSubHeader,
     vehicleBanner,
     textboxQuestion,
+    dropdownQuestion,
     alert
   },
 };