Merge pull request #269 from Safelite/feature/Digital/SSR-385

Created policy vehicle page

src/layouts/policy-vehicles/policy-vehicles-question/policy-vehicles-question.vue

@@ -0,0 +1,28 @@
+<template>
+    <buttonQuestion 
+    :questionText="questionText" 
+    ref="policyVehiclesQuestion"
+    buttonTypeString="listButton"
+    isOverflowScrollable
+    :answers="answers"
+    isRequired />
+</template>
+<script>
+import buttonQuestion from "@/digital-components/button-question/button-question";
+
+export default ({
+    name: "policy-vehicles-question",    
+    components: {
+        buttonQuestion,
+    },
+    computed: {
+      questionText() {
+            return this.getCmsContent("PolicyVehiclesQuestion", "QuestionText");
+        },
+        answers(){
+            return this.getCmsContent("PolicyVehiclesQuestion", "Answers");
+        },
+    },
+})
+</script>
+  

src/layouts/policy-vehicles/policy-vehicles.vue

@@ -0,0 +1,71 @@
+<template>
+    <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm"  v-slot="{ meta }" >
+        <div class="page-container-grouped-styles">
+            <div class="fade-on-route-transition position-relative">
+                <siteHeader cmsWidgetName="SiteHeaderWidget"/>
+                <div class="select-car">
+                    <div class="container-fluid pb-2">
+                        <div class="row">
+                            <div class="col">
+                                <div class="select-car-form rounded text-center">
+                                    <vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mb-3" />
+                                    <policyVehiclesQuestion class="px-4" cmsWidgetName="PolicyVehiclesQuestion"/>
+                                    <siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" :isForwardActionDisabled="!meta.valid" @ForwardClicked="forwardButtonAction" @back-clicked="backButtonAction"/>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </Form>
+</template>
+<script>
+// Components
+import siteHeader from '@/iss-components/site-header/site-header';
+import siteFooter from "@/iss-components/site-footer/site-footer";
+import vehicleBanner from "@/iss-components/vehicle-banner/vehicle-banner";
+import policyVehiclesQuestion from "@/layouts/policy-vehicles/policy-vehicles-question/policy-vehicles-question";
+// Supporting files
+import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
+import { settleAllPromises } from "@/helpers/layout-helper";
+import { Form } from "vee-validate";
+import BaseFormMixin from '@/mixins/base-form-mixin.js';
+export default {
+    name: "policy-vehicles",
+    mixins: [BaseFormMixin],
+    async beforeRouteEnter(to, from, next)
+    {
+        // Call APIs
+        const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
+        // Settle promises and get results
+        const promiseResultMap = [
+            {
+                resultKey: "cmsContent",
+                promise: cmsContentPromise,
+            },];
+            //use resultMap to populate layout content.
+            let resultMap = await settleAllPromises(promiseResultMap);
+            next((vm) => {
+                vm.setCmsContent(resultMap.cmsContent);
+            });
+        },
+        methods:
+        {
+            backButtonAction() {              
+            },
+            forwardButtonAction() {
+                return this.navigateForward();
+            },
+            navigateForward() {
+            },
+        },
+        components: {
+            siteHeader,
+            siteFooter,
+            vehicleBanner,
+            policyVehiclesQuestion,
+            Form,
+        },
+    }
+</script>