From 55f7dcf0fb25c39028cacd2458062d8be954da85 Mon Sep 17 00:00:00 2001
From: scottkiener-at-safelite <scott.kiener@safelite.com>
Date: Wed, 14 Jan 2026 09:17:58 -0500
Subject: [PATCH] INSR-6047 - New elements and functionality

Page is functional and has all necessary elements
No styling done
---
 .../provider-preference.vue                   | 111 +++++++++++-------
 1 file changed, 68 insertions(+), 43 deletions(-)

diff --git a/src/layouts/provider-preference/provider-preference.vue b/src/layouts/provider-preference/provider-preference.vue
index eac2c575..145b1cf7 100644
--- a/src/layouts/provider-preference/provider-preference.vue
+++ b/src/layouts/provider-preference/provider-preference.vue
@@ -15,16 +15,26 @@
                         id="sub-header"
                         cmsWidgetName="SiteSubHeader"
                         class="mb-0 mt-4 text-center" />
-                    <buttonQuestion
-                        ref="buttonQuestion"
-                        v-model="selectedProvider"
-                        class="provider-preference"
-                        questionText="Select an option:"
-                        :answers="prefAnswers"
-                        groupName="prefQuestions"
-                        buttonTypeString="providerPrefRadio"
-                        :validationRules="rules.optionRequired"
-                        isRequired />
+                    <div
+                        class="body-text"
+                        v-html="scheduleWithSafeliteText"></div>
+                    <buttonMain
+                        ref="buttonMain"
+                        variant="navigation"
+                        buttonText="Schedule now"
+                        :class="
+                            (disableForwardAction || isForwardActionDisabled) &&
+                            'form-test-invalid'
+                        "
+                        @clickEvent="forwardButtonAction(options.SAFELITE)" />
+                    <div
+                        class="body-text"
+                        v-html="scheduleWithOtherText"></div>
+                    <textLink
+                        linkType="navigation"
+                        text="Find another shop"    
+                        href="#"
+                        @clickEvent="forwardButtonAction(options.TPA)" />
                     <siteFooter
                         :ref="SITE_FOOTER_REF_NAME"
                         class="mt-5"
@@ -33,6 +43,7 @@
                         :isForwardButtonNavigationDisabled="isForwardNavigationDisabled"
                         @backClicked="navigateBack"
                         @forwardClicked="forwardButtonAction" />
+
                 </div>
             </div>
         </div>
@@ -80,6 +91,8 @@ import globalRules from '@/constants/global-rules';
 import bailoutMessage from '@/constants/bailoutMessage';
 import contentGroupModal from '@/iss-components/content-group-modal/content-group-modal.vue';
 import showIssLoadingModal from '@/helpers/loading-modal-helper';
+import textLink from '@/ux-components/text-link/text-link.vue';
+import buttonMain from '@/ux-components/button-main/button-main.vue';
 
 const options = { SAFELITE: 'SafeliteOption', TPA: 'TPAOption' };
 const RECAL_MODAL_REF_NAME = 'RecalModal';
@@ -97,10 +110,12 @@ export default {
         // eslint-disable-next-line vue/no-reserved-component-names
         Form,
         buttonQuestion,
+        buttonMain,
         steeringModal,
         shopPreferenceModal,
         tpaRecalModal,
-        contentGroupModal
+        contentGroupModal,
+        textLink
     },
     mixins: [baseFormMixin],
     async beforeRouteEnter(to, from, next) {
@@ -176,6 +191,15 @@ export default {
         },
         ackError() {
             return errorMessages.ACKNOWLEDGEMENT_REQUIRED;
+        },
+        scheduleWithSafeliteText() {
+            return this.getCmsContent('ScheduleWithSafeliteText', 'BodyText');
+        },
+        scheduleWithOtherText() {
+            return this.getCmsContent('ScheduleWithOtherText', 'BodyText');
+        },
+        options() {
+            return options;
         }
     },
     watch: {
@@ -223,41 +247,42 @@ export default {
             showIssLoadingModal(true);
             this.navigateForward(this.navigationScenarios.CLICKED_FORWARD_WITH_TPA_ENABLED);
         },
-        forwardButtonAction() {
-            if (this.selectedProvider) {
-                let scenario = null;
-                switch (this.selectedProvider) {
-                    case options.SAFELITE:
-                        this.mainStore.updateIsSafeliteProvider(true);
+        forwardButtonAction(selectedProvider) {
+            console.log('forwardButtonAction', selectedProvider);
+            let scenario = null;
+            switch (selectedProvider) {
+                case options.SAFELITE:
+                    this.mainStore.updateIsSafeliteProvider(true);
+                    scenario =
+                        this.navigationScenarios
+                            .CLICKED_FORWARD_WITH_SAFELITE;
+                    break;
+                case options.TPA:
+                    this.mainStore.updateIsSafeliteProvider(false);
+                    console.log('enableTPAFlow', this.mainStore.issConfig.enableTPAFlow);
+                    if (this.mainStore.issConfig.enableTPAFlow) {
+                        console.log('hasRecalibrationPart', this.mainStore.hasRecalibrationPart);
+                        if (this.mainStore.hasRecalibrationPart) {
+                            this.$refs[TPA_RECAL_MODAL_REF_NAME].openModal();
+                            return;
+                        }
                         scenario =
                             this.navigationScenarios
-                                .CLICKED_FORWARD_WITH_SAFELITE;
-                        break;
-                    case options.TPA:
-                        this.mainStore.updateIsSafeliteProvider(false);
-                        if (this.mainStore.issConfig.enableTPAFlow) {
-                            if (this.mainStore.hasRecalibrationPart) {
-                                this.$refs[TPA_RECAL_MODAL_REF_NAME].openModal();
-                                return;
-                            }
-                            scenario =
-                                this.navigationScenarios
-                                    .CLICKED_FORWARD_WITH_TPA_ENABLED;
-                        } else {
-                            this.mainStore.setBailout(bailoutMessage.TPANotEnabled());
-                            scenario =
-                                this.navigationScenarios
-                                    .CLICKED_FORWARD_WITH_TPA_DISABLED;
-                        }
-                        break;
-                    default:
-                }
-                this.navigateForward(scenario);
-                this.mainStore.saveProviderPreferenceData({
-                    selectedProvider: this.selectedProvider,
-                    tpaAcknowledgement: this.tpaAcknowledgement
-                });
+                                .CLICKED_FORWARD_WITH_TPA_ENABLED;
+                    } else {
+                        this.mainStore.setBailout(bailoutMessage.TPANotEnabled());
+                        scenario =
+                            this.navigationScenarios
+                                .CLICKED_FORWARD_WITH_TPA_DISABLED;
+                    }
+                    break;
+                default:
             }
+            this.navigateForward(scenario);
+            this.mainStore.saveProviderPreferenceData({
+                selectedProvider: selectedProvider,
+                tpaAcknowledgement: this.tpaAcknowledgement
+            });
         },
         openStateSteeringModal() {
             this.$refs[STEERING_MODAL_REF_NAME].openModal();