Files
foton-laws-system-front/src/components/hzwlComponents/RadioGroupFormItem.vue
T
2023-11-14 09:19:08 +08:00

62 lines
1.2 KiB
Vue

<template>
<el-form-item :label="label" :prop="prop" class="add-form-item form-item-disabled">
<el-radio-group :value="value"
:disabled="disabled"
:placeholder="placeholder"
@input="handleChange"
>
<el-radio v-for="item in options"
:key="item.value"
:label="item.label">{{ item.value }}</el-radio>
</el-radio-group>
</el-form-item>
</template>
<script>
export default {
name: "RadioGroupFormItem",
props: {
label: {
type: String,
},
prop: {
type: String
},
value: {
required: true
},
disabled: {
type: Boolean,
default: false
},
options: {
type: Array,
required: true
},
},
computed: {
placeholder () {
return `请选择${this.label}`
},
},
methods: {
handleChange (event) {
console.log(event)
this.$emit('input', event)
}
}
}
</script>
<style scoped lang="less">
.add-form-item /deep/ .el-radio-group{
padding: 0 10px !important;
}
.add-form-item /deep/ .el-radio{
margin-right: 15px !important;
}
.add-form-item /deep/ .el-radio:last-child {
margin-right: 0 !important;
}
</style>