fix(过滤组件): 数值下拉组件设置样式为平铺展示tab组件切换标题无法显示
This commit is contained in:
parent
d8dd664cb7
commit
a2620d16de
@ -1,5 +1,9 @@
|
||||
<template>
|
||||
<el-radio-group @change="visualChange" v-model="selectValue">
|
||||
<el-radio-group
|
||||
style="height: 40px; line-height: 40px"
|
||||
@change="visualChange"
|
||||
v-model="selectValue"
|
||||
>
|
||||
<template v-for="item in options">
|
||||
<el-radio
|
||||
:key="item.id + 'radio'"
|
||||
@ -7,7 +11,7 @@
|
||||
:value="item.id"
|
||||
v-if="radioStyle.showStyle === 'single'"
|
||||
:disabled="itemDisabled"
|
||||
/>
|
||||
/>
|
||||
<el-radio-button
|
||||
v-else
|
||||
:disabled="itemDisabled"
|
||||
@ -91,7 +95,7 @@ export default {
|
||||
},
|
||||
radioStyle: {
|
||||
handler() {
|
||||
this.setPlaceholderColor()
|
||||
this.setPlaceholderColor();
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
@ -104,20 +108,20 @@ export default {
|
||||
});
|
||||
},
|
||||
beforeDestroy() {
|
||||
let styleEle = document.querySelector(`#radio-style${this.id}`)
|
||||
let styleEle = document.querySelector(`#radio-style${this.id}`);
|
||||
if (styleEle) {
|
||||
styleEle. parentElement.removeChild(styleEle)
|
||||
styleEle.parentElement.removeChild(styleEle);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
setPlaceholderColor() {
|
||||
let styleEle = document.querySelector(`#radio-style${this.id}`)
|
||||
let styleEle = document.querySelector(`#radio-style${this.id}`);
|
||||
if (!styleEle) {
|
||||
styleEle = document.createElement('style')
|
||||
styleEle.id = `radio-style${this.id}`
|
||||
document.querySelector('head').appendChild(styleEle)
|
||||
styleEle = document.createElement("style");
|
||||
styleEle.id = `radio-style${this.id}`;
|
||||
document.querySelector("head").appendChild(styleEle);
|
||||
}
|
||||
styleEle.innerHTML = `#component${this.id} {\n color: transparent !important; \n border-color:transparent !important; \n background-color: transparent !important; \n } #component${this.id} .el-radio-button:not(.is-active) .el-radio-button__inner {\n color: ${this.radioStyle.wordColor}; \n border-color: ${this.radioStyle.brColor}; \n background-color: ${this.radioStyle.innerBgColor}; \n } #component${this.id} .el-radio:not(.is-check) .el-radio__label {\n color: ${this.radioStyle.wordColor}; \n }`
|
||||
styleEle.innerHTML = `#component${this.id} {\n background-color: transparent !important; \n } #component${this.id} .el-radio-button:not(.is-active) .el-radio-button__inner {\n color: ${this.radioStyle.wordColor}; \n border-color: ${this.radioStyle.brColor}; \n background-color: ${this.radioStyle.innerBgColor}; \n } #component${this.id} .el-radio:not(.is-check) .el-radio__label {\n color: ${this.radioStyle.wordColor}; \n }`;
|
||||
},
|
||||
resetList(arrays) {
|
||||
if (Array.isArray(arrays)) {
|
||||
|
||||
@ -108,7 +108,7 @@ export default {
|
||||
computed: {
|
||||
mode() {
|
||||
let result = 'el-select'
|
||||
if (this.element.style.showMode && this.element.style.showMode === 'radio' && !this.element.options.attrs.multiple && !this.isConfig) {
|
||||
if (this.element.style.showMode && this.element.style.showMode === 'radio' && !this.element.options.attrs.multiple && !this.isConfig && this.element.options.attrs.required) {
|
||||
return 'DeRadio'
|
||||
}
|
||||
if (this.element.options && this.element.options.attrs && this.element.options.attrs.visual) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user