Sharkey/src/client/components/ui/radios.vue

56 lines
896 B
Vue
Raw Normal View History

2020-11-14 05:16:28 +02:00
<script lang="ts">
2020-11-14 05:50:24 +02:00
import { defineComponent, h } from 'vue';
2021-03-23 10:30:14 +02:00
import MkRadio from '@client/components/ui/radio.vue';
2020-11-14 05:16:28 +02:00
export default defineComponent({
components: {
MkRadio
},
props: {
modelValue: {
required: false
},
},
data() {
return {
value: this.modelValue,
}
},
watch: {
value() {
this.$emit('update:modelValue', this.value);
}
2020-11-14 05:50:24 +02:00
},
render() {
const label = this.$slots.desc();
const options = this.$slots.default();
return h('div', {
class: 'novjtcto'
}, [
h('div', label),
...options.map(option => h(MkRadio, {
key: option.props.value,
value: option.props.value,
modelValue: this.value,
'onUpdate:modelValue': value => this.value = value,
}, option.children))
]);
2020-11-14 05:16:28 +02:00
}
});
</script>
2020-11-18 05:09:14 +02:00
<style lang="scss">
2020-11-14 05:16:28 +02:00
.novjtcto {
margin: 32px 0;
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
}
</style>