perf: 调整列表页表格的高度,调整panel顶部工具栏左侧位置
This commit is contained in:
@@ -144,6 +144,11 @@ li{
|
||||
line-height: 16px;
|
||||
position: relative;
|
||||
}
|
||||
.to-top.nz-btn {
|
||||
position: fixed;
|
||||
bottom: 26px;
|
||||
right: 20px;
|
||||
}
|
||||
.nz-btn-metricbtn{
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
text-align: center
|
||||
}
|
||||
.list-width{
|
||||
width:98%;
|
||||
width: calc(100% - 14px);
|
||||
overflow-x:hidden;/*避免鼠标第一次放到曲线时,x轴出现滚动条后消失*/
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -60,7 +60,7 @@ export default {
|
||||
float: left;
|
||||
}
|
||||
.pagination {
|
||||
padding-top: 16px;
|
||||
padding-top: 14px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
@@ -34,7 +34,7 @@
|
||||
:data="tableData"
|
||||
border
|
||||
tooltip-effect="light"
|
||||
height="calc(100% - 138px)"
|
||||
height="calc(100% - 125px)"
|
||||
v-scrollBar:el-table
|
||||
style="width: 100%;">
|
||||
<el-table-column
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
:data="tableData"
|
||||
border
|
||||
tooltip-effect="light"
|
||||
height="calc(100% - 138px)"
|
||||
height="calc(100% - 125px)"
|
||||
v-scrollBar:el-table
|
||||
style="width: 100%;">
|
||||
<el-table-column
|
||||
|
||||
@@ -50,7 +50,7 @@
|
||||
|
||||
<el-table
|
||||
class="nz-table"
|
||||
height="calc(100% - 138px)"
|
||||
height="calc(100% - 125px)"
|
||||
style="width: 100%;"
|
||||
:data="tableData"
|
||||
v-scrollBar:el-table
|
||||
@@ -179,6 +179,7 @@
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Pagination :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
|
||||
<!--<button class="to-top nz-btn nz-btn-size-normal nz-btn-style-light">TOP</button>-->
|
||||
</div>
|
||||
|
||||
<!--<asset-add-unit :add-unit-show='addUnitShow' @refreshData="flushData" ref="assetAddUnit"
|
||||
@@ -757,12 +758,13 @@
|
||||
this.getIDCOptionData();
|
||||
},
|
||||
mounted() {
|
||||
setTimeout(()=>{
|
||||
this.$nextTick(() => {
|
||||
//左侧dc列表初始选中状态
|
||||
if (this.$store.state.assetData.selectedData.length > 0) {
|
||||
this.checkList = [];
|
||||
this.checkList = this.$store.state.assetData.selectedData;
|
||||
}
|
||||
}, 50);
|
||||
});
|
||||
let localStorageTitle=localStorage.getItem("nz-tableTitle-" + localStorage.getItem("nz-username") + "-" + this.$route.path);
|
||||
this.tablelable = localStorageTitle ? JSON.parse(localStorageTitle) : this.tableTitle;
|
||||
this.dropCol = localStorageTitle ? JSON.parse(localStorageTitle) : this.tableTitle;
|
||||
@@ -786,6 +788,3 @@
|
||||
border: 1px solid #1166bb;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
|
||||
@@ -34,7 +34,7 @@
|
||||
class="nz-table"
|
||||
:data="tableData"
|
||||
border
|
||||
height="calc(100% - 138px)"
|
||||
height="calc(100% - 125px)"
|
||||
v-scrollBar:el-table
|
||||
style="width: 100%;">
|
||||
<el-table-column
|
||||
|
||||
@@ -161,7 +161,7 @@
|
||||
:data="cabinetDatas"
|
||||
border
|
||||
v-scrollBar:el-table
|
||||
height="calc(100% - 138px)"
|
||||
height="calc(100% - 125px)"
|
||||
style="width: 100%;">
|
||||
<el-table-column
|
||||
:resizable="false"
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-table :data="tableData" border height="calc(100% - 138px)" style="width: 100%;" class="nz-table" v-scrollBar:el-table>
|
||||
<el-table :data="tableData" border height="calc(100% - 125px)" style="width: 100%;" class="nz-table" v-scrollBar:el-table>
|
||||
<el-table-column :resizable="false" v-for="(item, index) in tablelable" v-if="item.show" :width="item.width"
|
||||
:key="`col-${index}`" :label="item.label">
|
||||
<template slot-scope="scope" :column="item">
|
||||
|
||||
@@ -622,20 +622,21 @@
|
||||
}
|
||||
|
||||
.panel-dropdown-title {
|
||||
line-height:25px;
|
||||
line-height:24px;
|
||||
padding-left:5px;
|
||||
margin-left:10px;
|
||||
margin-top: 3px;
|
||||
text-align:left;
|
||||
border-radius:4px;
|
||||
width:120px;
|
||||
height:25px;
|
||||
height:24px;
|
||||
border:solid 1px #d8dce1;
|
||||
white-space: nowrap;
|
||||
overflow-x: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.panel-list-title {
|
||||
min-height:25px;
|
||||
min-height:24px;
|
||||
width:100px;
|
||||
white-space: nowrap;
|
||||
overflow-x: hidden;
|
||||
@@ -675,7 +676,7 @@
|
||||
.table-list {
|
||||
margin-top: 6px;
|
||||
overflow-y: auto;
|
||||
height: calc(100% - 120px);
|
||||
height: calc(100% - 92px);
|
||||
}
|
||||
|
||||
.box-content {
|
||||
|
||||
@@ -119,7 +119,7 @@
|
||||
:data="endpointTableData"
|
||||
border
|
||||
class="nz-table"
|
||||
height="calc(100% - 138px)"
|
||||
height="calc(100% - 125px)"
|
||||
v-scrollBar:el-table
|
||||
style="width: 100%;">
|
||||
<el-table-column
|
||||
@@ -215,7 +215,7 @@
|
||||
v-scrollBar:el-table
|
||||
class="nz-table"
|
||||
:header-cell-class-name="cellClass"
|
||||
height="calc(100% - 110px)"
|
||||
height="calc(100% - 92px)"
|
||||
@selection-change="selectChange"
|
||||
ref="metricInfoTab"
|
||||
style="width: 100%;">
|
||||
|
||||
@@ -86,7 +86,7 @@ Vue.directive("scrollBar", {
|
||||
!el && console.warn("未发现className为el-table__body-wrapper的dom");
|
||||
|
||||
// 启用x轴后不让原生滚动条出来作乱
|
||||
vnode.context.$nextTick(() => {
|
||||
/*vnode.context.$nextTick(() => {
|
||||
el.classList.add("ps");
|
||||
el.addEventListener("ps-scroll-y", () =>
|
||||
el.classList.add("ps")
|
||||
@@ -94,7 +94,7 @@ Vue.directive("scrollBar", {
|
||||
el.addEventListener("ps-scroll-x", () =>
|
||||
el.classList.add("ps")
|
||||
);
|
||||
});
|
||||
});*/
|
||||
}
|
||||
const rules = ["fixed", "absolute", "relative"];
|
||||
if (!rules.includes(window.getComputedStyle(el, null).position)) {
|
||||
|
||||
Reference in New Issue
Block a user