<template>
|
<view class="oi-form-radio">
|
<!-- 单选框 -->
|
<radio-group v-if="model" :class="data.disabled?'input-disabled':''" :disabled="data.disabled"
|
@change="onChange">
|
<label v-for="(item) in data.selections" :key="item.value" class="radio-item">
|
<radio :value="item.value" :checked="item.value === model[data.fieldId]" />
|
<text>{{item.label}}</text>
|
</label>
|
</radio-group>
|
<radio-group v-else :class="data.disabled?'input-disabled':''" :disabled="data.disabled" @change="onChange">
|
<label v-for="(item) in data.selections" :key="item.value" class="radio-item">
|
<radio :value="item.value" :checked="item.value === data.value" />
|
<text>{{item.label}}</text>
|
</label>
|
</radio-group>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
name: "OIFormRadio",
|
props: {
|
data: {
|
type: Object,
|
required: true,
|
},
|
model: Object,
|
},
|
methods: {
|
onChange(e) {
|
let val = this.data.value = e.detail.value || ""
|
if (this.model) {
|
this.model[this.data.fieldId] = val
|
}
|
this.data.value = val
|
this.$emit("on-change", val)
|
},
|
|
}
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.oi-form-radio {
|
width: 100%;
|
.radio-item {
|
vertical-align: middle;
|
margin-left: 10rpx
|
}
|
|
.input-disabled {
|
background-color: #f3f3f3 !important;
|
}
|
}
|
</style>
|
