bab-icon/resources/assets/js/components/UiRadio.vue

<template>
    <el-row class="form-group">
        <el-col :span="3" style="min-height:50px;padding-top:5px;">
            <label style="margin-left:10px;vertical-align: middle;" class="control-label">{{label ? label : 'Radio'}}</label>
        </el-col>
        <el-col :span="14">
            <div class="text-left">
                <el-radio-group
                    v-model="radio_check"
                    @change="selectChange"
                    :size="params.group.size ? params.group.size : 'small'"
                    :fill="params.group.fill ? params.group.fill : '#20a0ff'"
                    :text-color="params.group.textColor ? params.group.textColor : '#ffffff'">
                    <el-radio-button
                        v-if="params.attr.label"
                        v-for="item in params.attr.radios"
                        :key="item.value"
                        :name="params.attr.name"
                        :disabled="item.disabled ? true : false"
                        :label="item.value">
                        {{item.label}}
                    </el-radio-button>
                    <el-radio
                        v-else
                        v-for="item in params.attr.radios"
                        :key="item.value"
                        :name="params.attr.name"
                        :disabled="item.disabled ? true : false"
                        :label="item.value">
                        {{item.label}}
                    </el-radio>
                  </el-radio-group>
            </div>
        </el-col>
        <el-col :span="7">
            <div class="classJs">
                <div v-if="tips">
                    <span class="red">*</span>&ensp;{{tips}}
                </div>
            </div>
        </el-col>
    </el-row>
</template>

<script>
    export default {
        props: ['label','params','tips'],
        data() {
            return {
                radio_check: this.params.attr.radioCheck
            }
        },
        mounted() {},
        methods: {
            selectChange(value) {
                this.$emit('set-keys',value);
            },
        }
    }
</script>

<style scoped>
    .el-radio-button__orig-radio {
        display: none;
    }
    .classJs {
        margin-left: 10px;
        vertical-align: middle;
        height:42px;
        line-height:42px;
    }
    .red{
        color: red;
    }
</style>