fix: 优化选择器组件在拖拽过程中打开下拉框的情况,优化拖拽使用组件

main
wu.jian2 2 years ago
parent a1ac5ec06e
commit d514ba5055

@ -5,8 +5,8 @@
:popper-class="'basic-component-select select-popper-' + config.code" :popper-class="'basic-component-select select-popper-' + config.code"
:class="['basic-component-select', `select-${config.code}`]" :class="['basic-component-select', `select-${config.code}`]"
:placeholder="`请选择${placeholder || newPlaceholder}`" :placeholder="`请选择${placeholder || newPlaceholder}`"
filterable
clearable clearable
:filterable="filterable"
@visible-change="visibleChange" @visible-change="visibleChange"
@change="selectChange" @change="selectChange"
@mouseenter.native="mouseenter" @mouseenter.native="mouseenter"
@ -44,7 +44,8 @@ export default {
value: '', value: '',
innerConfig: {}, innerConfig: {},
optionData: [], optionData: [],
newPlaceholder: '' newPlaceholder: '',
filterable: false
} }
}, },
computed: { computed: {
@ -70,6 +71,8 @@ export default {
window.dataSetFields = [] window.dataSetFields = []
}) })
if (this.isPreview) { if (this.isPreview) {
this.filterable = true
document.querySelector(`.select-${this.config.code}`).style.pointerEvents = 'all'
if (window.dataSetFields.length === 0) { if (window.dataSetFields.length === 0) {
getDataSetDetails(this.config.dataSource.businessKey).then(res => { getDataSetDetails(this.config.dataSource.businessKey).then(res => {
window.dataSetFields = res.fields.map(field => { window.dataSetFields = res.fields.map(field => {
@ -81,6 +84,8 @@ export default {
this.placeholder = window.dataSetFields.find(field => field.value === this.config.dataSource.dimensionField)?.label || '' this.placeholder = window.dataSetFields.find(field => field.value === this.config.dataSource.dimensionField)?.label || ''
}) })
} }
} else {
document.querySelector(`.select-${this.config.code}`).style.pointerEvents = 'none'
} }
}, },
beforeDestroy () { beforeDestroy () {
@ -170,12 +175,6 @@ export default {
item.style.setProperty('--dropDownHoverFontColor', this.innerConfig.customize.dropDownHoverFontColor) item.style.setProperty('--dropDownHoverFontColor', this.innerConfig.customize.dropDownHoverFontColor)
item.style.setProperty('--dropDownHoverBackgroundColor', this.innerConfig.customize.dropDownHoverBackgroundColor) item.style.setProperty('--dropDownHoverBackgroundColor', this.innerConfig.customize.dropDownHoverBackgroundColor)
}) })
//
// const selectDropdownItemSelectedEl = document.querySelectorAll(`.select-popper-${this.innerConfig.code} .el-select-dropdown__item.selected`)
// selectDropdownItemSelectedEl.forEach(item => {
// item.style.color = this.innerConfig.customize.activeFontColor
// item.style.backgroundColor = this.innerConfig.customize.activeBackgroundColor
// })
} }
// 使 // 使
const selectDropdownItemEl = document.querySelectorAll(`.select-popper-${this.innerConfig.code} .el-select-dropdown__item`) const selectDropdownItemEl = document.querySelectorAll(`.select-popper-${this.innerConfig.code} .el-select-dropdown__item`)
@ -187,6 +186,7 @@ export default {
} }
}) })
}, },
//
mouseenter () { mouseenter () {
if (this.value) { if (this.value) {
setTimeout(() => { setTimeout(() => {

Loading…
Cancel
Save