UiRadio.vue 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <template>
  2. <el-row class="form-group">
  3. <el-col :span="3" style="min-height:50px;padding-top:5px;">
  4. <label style="margin-left:10px;vertical-align: middle;" class="control-label">{{label ? label : 'Radio'}}</label>
  5. </el-col>
  6. <el-col :span="14">
  7. <div class="text-left">
  8. <el-radio-group
  9. v-model="radio_check"
  10. :size="params.group.size ? params.group.size : 'small'"
  11. :fill="params.group.fill ? params.group.fill : '#20a0ff'"
  12. :text-color="params.group.textColor ? params.group.textColor : '#ffffff'">
  13. <el-radio-button
  14. v-if="params.attr.label"
  15. v-for="item in params.attr.radios"
  16. :key="item.value"
  17. :name="params.attr.name"
  18. :disabled="item.disabled ? true : false"
  19. :label="item.value">
  20. {{item.label}}
  21. </el-radio-button>
  22. <el-radio
  23. v-else
  24. v-for="item in params.attr.radios"
  25. :key="item.value"
  26. :name="params.attr.name"
  27. :disabled="item.disabled ? true : false"
  28. :label="item.value">
  29. {{item.label}}
  30. </el-radio>
  31. </el-radio-group>
  32. </div>
  33. </el-col>
  34. <el-col :span="7">
  35. <div class="classJs">
  36. <div v-if="tips">
  37. <span class="red">*</span>&ensp;{{tips}}
  38. </div>
  39. </div>
  40. </el-col>
  41. </el-row>
  42. </template>
  43. <script>
  44. export default {
  45. props: ['label','params','tips'],
  46. data() {
  47. return {
  48. radio_check: this.params.attr.radioCheck
  49. }
  50. },
  51. mounted() {},
  52. methods: {}
  53. }
  54. </script>
  55. <style scoped>
  56. .el-radio-button__orig-radio {
  57. display: none;
  58. }
  59. .classJs {
  60. margin-left: 10px;
  61. vertical-align: middle;
  62. height:42px;
  63. line-height:42px;
  64. }
  65. .red{
  66. color: red;
  67. }
  68. </style>