feat:部分代码去除事件监听

This commit is contained in:
zhangyu
2020-11-20 15:02:36 +08:00
parent 075fc8a5ff
commit 8fbfdc5dd2
13 changed files with 253 additions and 148 deletions

View File

@@ -852,6 +852,19 @@
// Severity Label
returnSeverityLabel(key){
return this.$CONSTANTS.alertMessage.severityData.find(s => {return s.value == key}).label
},
plpsscrolly(el,self){
if (el._ps_.scrollbarYTop > 50) {
self.tools.showTopBtn = true;
} else {
self.tools.showTopBtn = false;
}
},
plmouseenter(el,self){
self.tools.tableHover = true;
},
plmouseleave(el,self){
self.tools.tableHover = false;
}
},
watch: {
@@ -887,19 +900,9 @@
//绑定滚动条事件控制top按钮
let el = this.$refs.alertListTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.addEventListener("ps-scroll-y", () => {
if (el._ps_.scrollbarYTop > 50) {
this.tools.showTopBtn = true;
} else {
this.tools.showTopBtn = false;
}
});
el.addEventListener("mouseenter", () => {
this.tools.tableHover = true;
});
el.addEventListener("mouseleave", () => {
this.tools.tableHover = false;
});
el.addEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.addEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.addEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
});
/*if(this.from=='alertMessage'){
@@ -921,7 +924,12 @@
*/
},
beforeDestroy(){
let el = this.$refs.promTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.removeEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.removeEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.removeEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
}
}

View File

@@ -659,6 +659,19 @@
temp.tableFilter();
}, 500)
},
plpsscrolly(el,self){
if (el._ps_.scrollbarYTop > 50) {
self.showTopBtn = true;
} else {
self.showTopBtn = false;
}
},
plmouseenter(el,self){
self.tableHover = true;
},
plmouseleave(el,self){
self.tableHover = false;
}
},
mounted() {
this.getPanelData();
@@ -668,26 +681,21 @@
//绑定滚动条事件控制top按钮
let el = this.$refs.endpointQueryTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.addEventListener("ps-scroll-y", () => {
if (el._ps_.scrollbarYTop > 50) {
this.showTopBtn = true;
} else {
this.showTopBtn = false;
}
});
el.addEventListener("mouseenter", () => {
this.tableHover = true;
});
el.addEventListener("mouseleave", () => {
this.tableHover = false;
});
el.addEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.addEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.addEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
}, 300);
//});
},
beforeDestroy(){
let el = this.$refs.endpointQueryTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.removeEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.removeEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.removeEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
}
}
</script>

View File

@@ -211,7 +211,10 @@
setTimeout(() => {
let top = '';
let top2 = '';
document.querySelector("body>.el-dropdown-menu").addEventListener("ps-y-reach-end", () => {
document.querySelector("body>.el-dropdown-menu").addEventListener("ps-y-reach-end", this.psYReachEnd);
}, 100);
},
psYReachEnd(){
let yDom = document.querySelector("body>.el-dropdown-menu>.ps__rail-y");
let yDom2 = document.querySelector("body>.el-dropdown-menu>.ps__rail-y>.ps__thumb-y");
if (top) {
@@ -224,8 +227,6 @@
} else {
top2 = yDom2.style.top;
}
});
}, 100);
},
// 编辑图表信息,打开编辑弹窗
editChart(data) {
@@ -471,15 +472,17 @@
})
}
},
tableListEnter(self){
self.tableHover = true;
},
tableListLaeve(self){
self.tableHover = false;
},
},
mounted: function () {
this.onScroll();
document.querySelector("#tableList").addEventListener("mouseenter", () => {
this.tableHover = true;
});
document.querySelector("#tableList").addEventListener("mouseleave", () => {
this.tableHover = false;
});
document.querySelector("#tableList").addEventListener("mouseenter", this.tableListEnter.bind('',this));
document.querySelector("#tableList").addEventListener("mouseleave", this.tableListLaeve.bind('',this));
},
watch: {
'filter.searchName':function(n,o){
@@ -500,7 +503,9 @@
}
},
beforeDestroy(){
document.querySelector("#tableList").removeEventListener("mouseenter", this.tableListEnter);
document.querySelector("#tableList").removeEventListener("mouseleave", this.tableListLaeve);
document.querySelector("body>.el-dropdown-menu").removeEventListener("ps-y-reach-end", this.psYReachEnd);
}
}
</script>

View File

@@ -517,6 +517,19 @@
bus.$on('alert-message-change',()=>{
this.getTableData();
})
},
plpsscrolly(el,self){
if (el._ps_.scrollbarYTop > 50) {
self.tools.showTopBtn = true;
} else {
self.tools.showTopBtn = false;
}
},
plmouseenter(el,self){
self.tools.tableHover = true;
},
plmouseleave(el,self){
self.tools.tableHover = false;
}
},
watch: {
@@ -555,21 +568,19 @@
//绑定滚动条事件控制top按钮
let el = this.$refs.alertRuleTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.addEventListener("ps-scroll-y", () => {
if (el._ps_.scrollbarYTop > 50) {
this.tools.showTopBtn = true;
} else {
this.tools.showTopBtn = false;
el.addEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.addEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.addEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
});
el.addEventListener("mouseenter", () => {
this.tools.tableHover = true;
});
el.addEventListener("mouseleave", () => {
this.tools.tableHover = false;
});
},
beforeDestroy(){
let el = this.$refs.promTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.removeEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.removeEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.removeEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
});
}
}
</script>

View File

@@ -234,7 +234,7 @@ export default {
// };
},
beforeDestroy(){
window.onresize=null
}
}
</script>

View File

@@ -752,6 +752,19 @@
return showTag.value
}
}
},
plpsscrolly(el,self){
if (el._ps_.scrollbarYTop > 50) {
self.tools.showTopBtn = true;
} else {
self.tools.showTopBtn = false;
}
},
plmouseenter(el,self){
self.tools.tableHover = true;
},
plmouseleave(el,self){
self.tools.tableHover = false;
}
},
@@ -805,19 +818,9 @@
//绑定滚动条事件控制top按钮
let el = this.$refs.assetTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.addEventListener("ps-scroll-y", () => {
if (el._ps_.scrollbarYTop > 50) {
this.tools.showTopBtn = true;
} else {
this.tools.showTopBtn = false;
}
});
el.addEventListener("mouseenter", () => {
this.tools.tableHover = true;
});
el.addEventListener("mouseleave", () => {
this.tools.tableHover = false;
});
el.addEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.addEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.addEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
//resize时刷新左侧列表滚动条
let vm = this;
@@ -827,6 +830,14 @@
};
});
},
beforeDestroy(){
let el = this.$refs.assetTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.removeEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.removeEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.removeEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
},
destroyed() {
window.onresize = null;
bus.$off("asset-filter-change");

View File

@@ -476,6 +476,19 @@
bus.$on("dc-list-change", () => {
this.getTableData();
});
},
plpsscrolly(el,self){
if (el._ps_.scrollbarYTop > 100) {
self.tools.showTopBtn = true;
} else {
self.tools.showTopBtn = false;
}
},
plmouseenter(el,self){
self.tools.tableHover = true;
},
plmouseleave(el,self){
self.tools.tableHover = false;
}
},
watch: {
@@ -514,24 +527,22 @@
this.getUserData();//绑定滚动条事件控制top按钮
let el = this.$refs.dcTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.addEventListener("ps-scroll-y", () => {
if (el._ps_.scrollbarYTop > 100) {
this.bottomBox.showTopBtn = true;
} else {
this.bottomBox.showTopBtn = false;
}
});
el.addEventListener("mouseenter", () => {
this.tools.tableHover = true;
});
el.addEventListener("mouseleave", () => {
this.tools.tableHover = false;
});
el.addEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.addEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.addEventListener("mouseleave", this.plmouseleave.bind('',el,this));
window.onresize = function() {
el._ps_.update();
};
}
});
},
beforeDestroy(){
let el = this.$refs.promTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.removeEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.removeEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.removeEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
}
}
</script>

View File

@@ -333,6 +333,19 @@
this.$set(this.searchLabel, "orderBy", orderBy);
this.getTableData();
},
plpsscrolly(el,self){
if (el._ps_.scrollbarYTop > 50) {
self.tools.showTopBtn = true;
} else {
self.tools.showTopBtn = false;
}
},
plmouseenter(el,self){
self.tools.tableHover = true;
},
plmouseleave(el,self){
self.tools.tableHover = false;
}
},
mounted() {
//初始化表头
@@ -351,22 +364,20 @@
//绑定滚动条事件控制top按钮
let el = this.$refs.mibTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.addEventListener("ps-scroll-y", () => {
if (el._ps_.scrollbarYTop > 50) {
this.tools.showTopBtn = true;
} else {
this.tools.showTopBtn = false;
}
});
el.addEventListener("mouseenter", () => {
this.tools.tableHover = true;
});
el.addEventListener("mouseleave", () => {
this.tools.tableHover = false;
});
el.addEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.addEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.addEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
});
},
beforeDestroy(){
let el = this.$refs.promTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.removeEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.removeEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.removeEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
}
}
</script>
<style >

View File

@@ -332,6 +332,19 @@
this.$set(this.searchLabel, "orderBy", orderBy);
this.getTableData();
},
plpsscrolly(el,self){
if (el._ps_.scrollbarYTop > 50) {
self.tools.showTopBtn = true;
} else {
self.tools.showTopBtn = false;
}
},
plmouseenter(self){
self.tools.tableHover = true;
},
plmouseleave(self){
self.tools.tableHover = false;
}
},
mounted() {
//初始化表头
@@ -350,19 +363,9 @@
//绑定滚动条事件控制top按钮
let el = this.$refs.modelTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.addEventListener("ps-scroll-y", () => {
if (el._ps_.scrollbarYTop > 50) {
this.tools.showTopBtn = true;
} else {
this.tools.showTopBtn = false;
}
});
el.addEventListener("mouseenter", () => {
this.tools.tableHover = true;
});
el.addEventListener("mouseleave", () => {
this.tools.tableHover = false;
});
el.addEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.addEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.addEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
});
},
@@ -371,6 +374,14 @@
let vm = this;
this.$bottomBoxWindow.showSubListWatch(vm, n);
},
},
beforeDestroy(){
let el = this.$refs.promTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.removeEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.removeEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.removeEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
}
}
</script>

View File

@@ -327,6 +327,9 @@
}
}
}
for(let i=0;i<50;i++){
response.data.list.push(response.data.list[0]);
}
this.tableData = response.data.list;
this.pageObj.total = response.data.total
}
@@ -397,6 +400,19 @@
return this.promServerType.find(item=>{
return item.value == type
})
},
plpsscrolly(el,self){
if (el._ps_.scrollbarYTop > 50) {
self.tools.showTopBtn = true;
} else {
self.tools.showTopBtn = false;
}
},
plmouseenter(el,self){
self.tools.tableHover = true;
},
plmouseleave(el,self){
self.tools.tableHover = false;
}
},
mounted() {
@@ -419,19 +435,9 @@
//绑定滚动条事件控制top按钮
let el = this.$refs.promTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.addEventListener("ps-scroll-y", () => {
if (el._ps_.scrollbarYTop > 50) {
this.bottomBox.showTopBtn = true;
} else {
this.bottomBox.showTopBtn = false;
}
});
el.addEventListener("mouseenter", () => {
this.tools.tableHover = true;
});
el.addEventListener("mouseleave", () => {
this.tools.tableHover = false;
});
el.addEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.addEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.addEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
});
},
@@ -447,6 +453,14 @@
let vm = this;
this.$bottomBoxWindow.showSubListWatch(vm, n);
},
},
beforeDestroy(){
let el = this.$refs.promTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.removeEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.removeEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.removeEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
}
}
</script>

View File

@@ -194,10 +194,7 @@
tooltipDom.style.display = "block";
tooltipDom.innerHTML = params.value;
}
this.$refs.chartRoom.addEventListener("mousemove", (event) => {
tooltipDom.style.top = event.pageY + "px";
tooltipDom.style.left = event.pageX-15 + "px";
});
this.$refs.chartRoom.addEventListener("mousemove", this.chartRoomMouseMove.bind("",event,tooltipDom));
});
this.chart.on('mouseout', (params) => {
if(params.componentType == this.axisTooltip + "Axis") {
@@ -207,6 +204,10 @@
}
this.resize();
},
chartRoomMouseMove(event,tooltipDom){
tooltipDom.style.top = event.pageY + "px";
tooltipDom.style.left = event.pageX-15 + "px";
},
resize() {
this.$nextTick(() => {
if(this.chart){
@@ -476,6 +477,9 @@
},
watch:{
},
beforeDestroy(){
this.$refs.chartRoom.removeEventListener("mousemove", this.chartRoomMouseMove);
},
destroyed() {
if(this.chart){

View File

@@ -109,7 +109,7 @@
</div>
<div class="content-col-content" v-loading="topologyLoading">
<transition name = "el-zoom-in-center">
<div style="width: 100%;height: 100%;position: relative" v-if="allProject.length>0">
<div style="width: 100%;height: 100%;position: relative" v-if="allProject&&allProject.length>0">
<el-carousel :interval="5000" arrow="hover" :trigger="'click'">
<el-carousel-item v-for="(item,index) in allProject" :key="index">
<div class="maskLayer" @click="toProject(item)"></div>
@@ -1589,11 +1589,12 @@
// };
},
beforeDestroy(){
this.allProject=null;
this.allProject=[];
},
destroyed() {
clearInterval(this.freshDataTimer);
clearInterval(this.freshDateTimer);
this.allProject=null;
}
}
</script>

View File

@@ -751,6 +751,19 @@
}
return '';
},
plpsscrolly(el,self){
if (el._ps_.scrollbarYTop > 50) {
self.tools.showTopBtn = true;
} else {
self.tools.showTopBtn = false;
}
},
plmouseenter(el,self){
self.tools.tableHover = true;
},
plmouseleave(el,self){
self.tools.tableHover = false;
}
},
created(){
this.currentProject=this.$store.state.currentProject;
@@ -809,20 +822,9 @@
//绑定滚动条事件控制top按钮
let el=this.$refs.endpointTable.$el.querySelector(".el-table__body-wrapper");
if(el._ps_){
el.addEventListener("ps-scroll-y",()=>{
if(el._ps_.scrollbarYTop>50){
this.tools.showTopBtn=true;
}else{
this.tools.showTopBtn=false;
}
});
el.addEventListener("mouseenter",()=>{
this.tools.tableHover=true;
});
el.addEventListener("mouseleave",()=>{
this.tools.tableHover=false;
});
el.addEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.addEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.addEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
});
}
@@ -861,6 +863,14 @@
bus.$off("module-list-change");
bus.$off("endpoint-list-change");
bus.$off('alert-message-change')
},
beforeDestroy(){
let el = this.$refs.promTable.$el.querySelector(".el-table__body-wrapper");
if (el._ps_) {
el.removeEventListener("ps-scroll-y", this.plpsscrolly.bind('',el,this));
el.removeEventListener("mouseenter", this.plmouseenter.bind('',el,this));
el.removeEventListener("mouseleave", this.plmouseleave.bind('',el,this));
}
}
}
</script>