DigitalConsumer.FixMyGlass/src/common-components/radio-question/radio-question.vue
2021-12-07 15:10:43 -05:00

45 lines
1.2 KiB
Vue

<template>
<div class="radio_question">
<div class="needed_car_info mt-5 mb-2 d-flex">
<span class="text-center fs-6 fw-bold w-100 needed_car_info-text">{{
questionText
}}</span>
</div>
<div class="w-100 d-flex justify-content-center">
<div class="car_list overflow-scroll position-absolute container-fluid w-100 pt-1" role="radiogroup" aria-labelledby="select-year-radio-group">
<h3 class="visually-hidden" id="select-year-radio-group">*</h3>
<radio v-for="answer in answers" :key="answer"
:radioID="answer"
@click="chooseAnswer(answer)"
loaderColor="blue"
loaderPosition="right"
sizeInRem="1.5"
data-test="radio"
groupName="radio-list"
textPosition="text-start"
:value="modelValue"
/>
</div>
</div>
</div>
</template>
<script>
import radio from "@/ux-components/radio/radio";
export default {
name: "radio-question",
props: {
questionText: String,
answers: Array,
modelValue: String
},
methods: {
chooseAnswer(answer) {
this.$emit('update:modelValue', answer);
}
},
components: {
radio,
},
};
</script>