<!-- * @Description: * @Autor: renchao * @LastEditTime: 2023-05-09 09:20:10 --> <template> <el-dialog :close-on-click-modal="false" title="选择权利类型" class="qllxdialog" :visible.sync="dialogVisible" custom-class="insetDialog" append-to-body width="31%" > <!-- <el-radio-group v-model="radio"> <el-radio-button v-for="(value, key) in qllxlistdata" :key="key" :label="value" ></el-radio-button> </el-radio-group> --> <el-button class="gettypebutton" v-for="(value, key) in qllxlistdata" :key="key" :label="value" @click="clicksss(key)" plain>{{value}}</el-button> <div class="btn"> <el-button type="primary" @click="handleSubmit">确定</el-button> <el-button type="primary" @click="closeDialog">取消</el-button> </div> </el-dialog> </template> <script> export default { data() { return { dialogVisible: false, qllxlistdata: {}, radio: "", qllx:"" }; }, methods: { closeDialog() { this.dialogVisible = false; }, clicksss(el){ console.log("elllllllllllllllllllll",el); this.qllx=el }, handleSubmit() { if(this.qllx){ let qllxobj = { qllx:this.qllx, bsmQlxx:"" }; this.$parent.addRepairRecord(qllxobj) }else{ this.$message({ type: "warning", message: "请选择权利类型!", }); } this.qllx="" }, }, }; </script> <style scoped lang="scss"> @import '~@/styles/public.scss'; .qllxdialog { margin-top: 160px; /deep/.el-dialog__body { margin-top: 10px; // height: 100px; padding: 20px; } .gettypebutton{ cursor: pointer; margin-left: 20px; width: 45%; line-height: 20px; background-color: #ebebeb; margin-top: 20px; padding-left: 20px; border-radius: 2px; -webkit-box-sizing: border-box; box-sizing: border-box; border: 1px solid #ebebeb; -webkit-transition: all 0.3s; transition: all 0.3s; color: #000; } .gettypebutton:hover{ border: 1px solid #0F93F6; color: #0F93F6; } .gettypebutton:focus{ background-color: #0F93F6; border: 1px solid #0F93F6; color: #ebebeb; } .btn{ margin-top:30px; text-align: center; .el-button { margin-top: 10px; margin-left: 20px; } } } </style>