fix: 修复搜索框下拉选项位置异常的问题

还有缺陷,待修复
This commit is contained in:
chenjinsong
2020-09-08 19:02:59 +08:00
parent 444e412458
commit 1cc43473cd
3 changed files with 18 additions and 11 deletions

View File

@@ -292,6 +292,7 @@ export const bottomBoxWindow = {
}, },
showSubListWatch(vm, n) { showSubListWatch(vm, n) {
vm.bottomBox.inTransform = n; vm.bottomBox.inTransform = n;
console.info(vm.bottomBox.inTransform)
if (!n) { if (!n) {
vm.mainTableHeight = vm.$tableHeight.normal; //重置table的高度 vm.mainTableHeight = vm.$tableHeight.normal; //重置table的高度
vm.tools.toTopBtnTop = vm.$tableHeight.toTopBtnTop; vm.tools.toTopBtnTop = vm.$tableHeight.toTopBtnTop;

View File

@@ -170,7 +170,7 @@
name: "index", name: "index",
data() { data() {
return { return {
selectDom: {top: '', tempTop: ''}, // 选择弹框的位置 selectDom: {top: '', tempTop: '', show: true}, // 选择弹框的位置
clearSearchShow: false, clearSearchShow: false,
select_conditionsName:'', select_conditionsName:'',
selectInfoList: searchSelectInfo, selectInfoList: searchSelectInfo,
@@ -265,12 +265,12 @@
listsV.forEach((item, index) => { listsV.forEach((item, index) => {
item.style.display = "none"; item.style.display = "none";
}); });
if (n) { /*if (n) {
this.selectDom.tempTop = this.selectDom.top; this.selectDom.tempTop = this.selectDom.top;
this.selectDom.top = '36px'; this.selectDom.top = '36px';
} else { } else {
this.selectDom.top = this.selectDom.tempTop; this.selectDom.top = this.selectDom.tempTop;
} }*/
setTimeout(() => { setTimeout(() => {
listsK.forEach((item, index) => { listsK.forEach((item, index) => {
item.style.display = ""; item.style.display = "";
@@ -1179,12 +1179,14 @@
getSelectPosition(e) { getSelectPosition(e) {
let inputListDom = this.getDomFromParents(e.target, 'input-center-box', 0); let inputListDom = this.getDomFromParents(e.target, 'input-center-box', 0);
if (inputListDom) { if (inputListDom) {
this.$nextTick(() => {
if (this.inTransform) { if (this.inTransform) {
this.selectDom.top = "36px"; //this.selectDom.top = "36px";
} else { } else {
let position = inputListDom.getBoundingClientRect(); let position = inputListDom.getBoundingClientRect();
this.selectDom.top = position.top+36+'px'; this.selectDom.top = position.top+36+'px';
} }
});
} }
}, },
/*递归向上获取指定class的dom*/ /*递归向上获取指定class的dom*/
@@ -1221,6 +1223,10 @@
}) })
}, },
close_search(e) {
this.selectDom.show = false;
}
}, },
mounted() { mounted() {
/*this.defaultItem ? this.select_list.push({name:this.defaultItem,label:this.defaultItem}) : ''; /*this.defaultItem ? this.select_list.push({name:this.defaultItem,label:this.defaultItem}) : '';
@@ -1525,7 +1531,7 @@
box-shadow: 0 2px 4px rgba(0,0,0,0.1); box-shadow: 0 2px 4px rgba(0,0,0,0.1);
overflow-y: auto; overflow-y: auto;
z-index: 9999; z-index: 9999;
right: 139px; /*right: 139px;*/
} }
.select_info_list ul li{ .select_info_list ul li{
padding: 5px 10px; padding: 5px 10px;

View File

@@ -10,7 +10,7 @@
<div class="top-tools" v-show="bottomBox.mainResizeShow"> <div class="top-tools" v-show="bottomBox.mainResizeShow">
<div class="top-tool-main-right" :class="{'top-tool-main-right-to-left': bottomBox.showSubList}"> <div class="top-tool-main-right" :class="{'top-tool-main-right-to-left': bottomBox.showSubList}">
<div class="top-tool-search float-right"> <div class="top-tool-search float-right">
<search-input :searchMsg="searchMsg" @search="search" :bottomBox.inTransform="bottomBox.inTransform"></search-input> <search-input :searchMsg="searchMsg" @search="search" :inTransform="bottomBox.inTransform"></search-input>
</div> </div>
<button id="alert-add" @click="add" :title="$t('overall.createAlertRule')" <button id="alert-add" @click="add" :title="$t('overall.createAlertRule')"
class="nz-btn nz-btn-size-normal nz-btn-style-light margin-l-20"> class="nz-btn nz-btn-size-normal nz-btn-style-light margin-l-20">