42 lines
789 B
Vue
42 lines
789 B
Vue
<template>
|
|
<div :id="`${questionId}-${val}`" :key="index" :style="{ background: color }" @click="use">
|
|
<input ref="input" type="radio" :value="val" :name="questionId">
|
|
<label :for="`${questionId}-${val}`">{{ val }}</label>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
interface Props {
|
|
color: string;
|
|
questionId: string;
|
|
val: string;
|
|
index: number;
|
|
}
|
|
|
|
const input = useTemplateRef('input')
|
|
|
|
const { color, questionId, val, index } = defineProps<Props>()
|
|
|
|
function use() {
|
|
if (input.value) {
|
|
input.value?.click()
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
<style scoped="true">
|
|
div {
|
|
padding: 3px;
|
|
border-right: none;
|
|
text-overflow: ellipsis;
|
|
flex: 1 1 0;
|
|
width: 0;
|
|
cursor: pointer;
|
|
}
|
|
|
|
label,
|
|
input {
|
|
pointer-events: none;
|
|
}
|
|
</style> |