73 lines
2.1 KiB
Vue
73 lines
2.1 KiB
Vue
<template>
|
|
<div class="select-car sticky-lg-top py-4">
|
|
<div class="select-car-form overflow-hidden p-3 rounded">
|
|
<div class="car_info text-center">
|
|
<Header
|
|
text="Select a year to get started"
|
|
/>
|
|
<radioQuestion
|
|
questionText="What year is your vehicle?"
|
|
:answers="this.years"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import radioQuestion from "@/commonComponents/radioQuestion/radioQuestion";
|
|
import Header from "@/uxComponents/header/header";
|
|
import { endpoints } from "@/constants/endpoints.js";
|
|
import globalMethods from "@/global-methods";
|
|
import axios from "axios";
|
|
|
|
export default {
|
|
name: "SelectCar",
|
|
data() {
|
|
return {
|
|
years: [],
|
|
};
|
|
},
|
|
mounted() {
|
|
globalMethods.callHttpClient({
|
|
method: endpoints.GetYears.method,
|
|
endpoint: endpoints.GetYears.url,
|
|
payload:{}
|
|
})
|
|
.then( (response) => {
|
|
this.years = response.data.Result;
|
|
});
|
|
|
|
// Sample Call to Mockey to represent real data being sent back from the API, and how the modles are supposed to
|
|
// be prosessed and passed to child components.
|
|
axios.get("https://mockey.qa.sagaws.net/service/content/selectYear").then((response) => {
|
|
response.data.Result.forEach((m) => {
|
|
switch (m.Type) {
|
|
case this.widgetNames.PAGE_HEADING_WIDGET: {
|
|
this.pageHeader = m.Model;
|
|
break;
|
|
}
|
|
case this.widgetNames.RADIO_QUESTION_WIDGET: {
|
|
this.radioQuestion = m.Model;
|
|
break;
|
|
}
|
|
default: {
|
|
break;
|
|
}
|
|
}
|
|
})
|
|
});
|
|
},
|
|
methods: {
|
|
selectYear(year) {
|
|
const listButtons = document.querySelectorAll('.list-button');
|
|
globalMethods.disableItems(listButtons);
|
|
this.dispatchNonBlockingStoreAction("selectYear", { year: year });
|
|
}
|
|
},
|
|
components: {
|
|
radioQuestion,
|
|
Header,
|
|
},
|
|
};
|
|
</script>
|