gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: 右侧内容min-width=1200及相关处理

Browse Source 
1.右侧内容min-width=1200
2.浏览器窗体缩小后增加横向滚动条
3.增加project、asset左侧菜单滚动条
4.将table高度抽取为常量
This commit is contained in:
陈劲松
2020-03-09 18:05:43 +08:00
parent de4bf4b9a0
commit e381419eb5
13 changed files with 114 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
nezha-fronted/src/components/page/asset/asset.vue
View File

@@ -1,32 +1,34 @@
<template>
<div class="asset" ref="asset">
<div class="content-left">
<div class="sidebar-title">{{$t('asset.asset')}}</div>
<div class="sidebar-info">
<!--<div class="sidebar-info-header">ALL</div>-->
<el-checkbox :indeterminate="checkAllHandler" class="sidebar-info-item" v-model="checkAllFlag" @change="dcSelectAll" :true-label="1" :false-label="0">
<div class="sidebar-info-item-txt" style="font-weight: bold;">All</div>
</el-checkbox>
<el-checkbox-group v-model="checkList" size="small" @change="changeCheckBox">
<el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(checkList, item.id)}"
v-for="(item,key) in checkListData" :key="key" :label=item.id>
<div class="sidebar-info-item-txt">
<el-popover v-if="item.name.length > 16" trigger="hover" placement="top-start" :content="item.name" >
<span slot="reference">{{item.name}}</span>
</el-popover>
<span v-else>{{item.name}}</span>
</div>
<!-- <idc-config-box ref="idcConfigBox" :post-idc="item" placement="left" @after="getIDCOptionData" :button-class="'checkbox-edit'" :user-data="idcUserData">-->
<!-- <template v-slot:optionZone>-->
<!-- <span @click="closeAllPop">-->
<!-- <i class="nz-icon nz-icon-edit" @click="getSingleIDCData(item.id,'edit')"></i>-->
<!-- </span>-->
<!-- </template>-->
<!-- </idc-config-box>-->
<el-scrollbar ref="leftScrollbar" style="height: 100%">
<div class="sidebar-title">{{$t('asset.asset')}}</div>
<div class="sidebar-info">
<!--<div class="sidebar-info-header">ALL</div>-->
<el-checkbox :indeterminate="checkAllHandler" class="sidebar-info-item" v-model="checkAllFlag" @change="dcSelectAll" :true-label="1" :false-label="0">
<div class="sidebar-info-item-txt" style="font-weight: bold;">All</div>
</el-checkbox>
</el-checkbox-group>
</div>
<el-checkbox-group v-model="checkList" size="small" @change="changeCheckBox">
<el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(checkList, item.id)}"
v-for="(item,key) in checkListData" :key="key" :label=item.id>
<div class="sidebar-info-item-txt">
<el-popover v-if="item.name.length > 16" trigger="hover" placement="top-start" :content="item.name" >
<span slot="reference">{{item.name}}</span>
</el-popover>
<span v-else>{{item.name}}</span>
</div>
<!-- <idc-config-box ref="idcConfigBox" :post-idc="item" placement="left" @after="getIDCOptionData" :button-class="'checkbox-edit'" :user-data="idcUserData">-->
<!-- <template v-slot:optionZone>-->
<!-- <span @click="closeAllPop">-->
<!-- <i class="nz-icon nz-icon-edit" @click="getSingleIDCData(item.id,'edit')"></i>-->
<!-- </span>-->
<!-- </template>-->
<!-- </idc-config-box>-->
</el-checkbox>
</el-checkbox-group>
</div>
</el-scrollbar>
</div>
<div class="content-right">
@@ -50,7 +52,7 @@
<el-table
class="nz-table"
height="calc(100% - 125px)"
:height="$tableHeight.normal"
style="width: 100%;"
:data="tableData"
v-scrollBar:el-table
@@ -346,7 +348,6 @@
idcId: '',
idcIds: ''
},
tableHeight: document.documentElement.clientHeight - 200,
tabShow: false,
tabView: true,
tagType: 'add',
@@ -782,10 +783,18 @@
}
});
}
//resize时刷新左侧列表滚动条
let _this = this;
window.onresize = function() {
_this.$refs.leftScrollbar.update();
}
});
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;
},
destroyed() {
window.onresize = null;
}
}
</script>