feat: dashboard页左上角panel列表增加滚动条

This commit is contained in:
陈劲松
2020-03-13 13:44:05 +08:00
parent dcf51c4793
commit 1d1553dcf7
2 changed files with 26 additions and 18 deletions

View File

@@ -10,7 +10,7 @@
<div class="content-right">
<div class="top-tools">
<div>
<el-dropdown @command="panelChange" class="panel-dropdown-title" trigger="click" >
<el-dropdown @command="panelChange" class="panel-dropdown-title" trigger="click" v-scrollBar:el-dropdown>
<el-row :gutter="10" class="el-dropdown-link" style="">
<el-col :span="21" class="panel-list-title" :title="showPanel.name">{{showPanel.name}}</el-col>
<el-col :span="3" style="padding-left:0px !important;"><i class="el-icon-arrow-down el-icon--right"></i></el-col>

View File

@@ -126,6 +126,10 @@ Vue.directive("scrollBar", {
if (arg === "el-table") {
el = el.querySelector(".el-table__body-wrapper");
!el && console.warn("未发现className为el-table__body-wrapper的dom");
} else if (arg === "el-dropdown") {
el = el.querySelector(".el-dropdown-menu");
!el && console.warn("未发现className为el-dropdown-menu的dom");
}
// 启用x轴后不让原生滚动条出来作乱
vnode.context.$nextTick(() => {
@@ -137,7 +141,7 @@ Vue.directive("scrollBar", {
el.classList.add("ps")
);
});
}
const rules = ["fixed", "absolute", "relative"];
if (!rules.includes(window.getComputedStyle(el, null).position)) {
console.error(
@@ -153,13 +157,17 @@ Vue.directive("scrollBar", {
const { arg } = binding;
if (arg === "el-table") {
el = el.querySelector(".el-table__body-wrapper");
!el && console.warn("未发现className为el-table__body-wrapper的dom");
} else if (arg === "el-dropdown") {
el = el.querySelector(".el-dropdown-menu");
!el && console.warn("未发现className为el-dropdown-menu的dom");
}
setTimeout(() => {
el.classList.add("ps");
el.classList.add("ps--active-y");
el._ps_.update();
}, 1500)
!el && console.warn("未发现className为el-table__body-wrapper的dom");
}
try {
vnode.context.$nextTick(() => {
el_scrollBar(el);