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

perf: 调整全局table、侧滑按钮样式等

Browse Source 
1.侧滑的按钮大小更改
2.table表头配置放在最后一列
3.table表头高度减小
This commit is contained in:
陈劲松
2020-02-17 17:29:15 +08:00
parent d874854599
commit 28a2795ac8
17 changed files with 66 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
nezha-fronted/src/assets/stylus/main.scss
View File

@@ -118,6 +118,9 @@ li{
.nz-btn-min-width-82 {
min-width: 82px;
}
.nz-btn-min-width-100 {
min-width: 100px;
}
.nz-btn-min-width-120 {
min-width: 120px;
}
@@ -506,8 +509,8 @@ li{
}
//小信息栏边框
.nz-table.el-table th .cell{
height: 36px;
line-height: 36px;
height: 32px;
line-height: 32px;
display:flex;
background-image: linear-gradient(#f8f8f8, #e6e6e6);
border-right: 1px solid #d4d4d4;
@@ -517,9 +520,9 @@ li{
height: 38px;
line-height: 38px;
}
.nz-table .el-table__row td:first-of-type {
/*.nz-table .el-table__row td:first-of-type {
padding-left: 38px;
}
}*/
.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow { /*覆盖tooltip小三角颜色*/
border-top-color: #ebeef5;
}
@@ -528,22 +531,21 @@ li{
}
.nz-table-gear {
display: inline-block;
width: 38px;
text-align: center;
border-right: 2px solid #d4d4d4;
width: 8px;
box-sizing: border-box;
float: left;
margin-left: -10px;
border-left: 1px solid white;
position: relative;
}
.nz-table-gear>i {
cursor: pointer;
position: absolute;
left: 7px;
}
.nz-table-txt {
border-right: 1px solid #d4d4d4;
width: calc(100% - 19px);
display: inline-block;
border-left:1px solid #fff;
box-sizing: border-box;
float: left;
padding-left: 10px;
}
/* end--内容*/
@@ -1115,3 +1117,7 @@ li{
height: 25px;
line-height: 25px !important;
}
.el-textarea textarea {
height: 140px !important;
}

9
nezha-fronted/src/components/common/header.vue
View File

@@ -43,9 +43,9 @@
</template>
<template v-for="(item, index) in projectData">
<el-menu-item :index="'2-' + index">
<div @click="jumpToProject(item)" :class="{'menu-item-active' :(activeIndex == 'project' && activeItemIndex == item.id)}">
<div @mouseenter="hoverItemIndex = '2-' + index" @mouseleave="hoverItemIndex = ''" @click="jumpToProject(item)" :class="{'menu-item-active' :(activeIndex == 'project' && activeItemIndex == item.id)}">
<span class="too-long-split" style="width: 135px;">{{item.name}}</span>
<div @click.stop="toEditProject(item)" class="menu-edit"><i style="color: inherit" class="nz-icon nz-icon-edit"></i></div>
<div v-show="hoverItemIndex == '2-' + index" @click.stop="toEditProject(item)" class="menu-edit"><i style="color: inherit" class="nz-icon nz-icon-edit"></i></div>
</div>
</el-menu-item>
</template>
@@ -56,11 +56,11 @@
</template>
<template v-for="(item, index) in assetData">
<el-menu-item :index="'3-' + index">
<div @click="jumpToAsset(item.id)" :class="{'menu-item-active' : (activeIndex == 'asset' && indOf(activeItemIndexes, item.id) > -1) }">
<div @mouseenter="hoverItemIndex = '3-' + index" @mouseleave="hoverItemIndex = ''" @click="jumpToAsset(item.id)" :class="{'menu-item-active' : (activeIndex == 'asset' && indOf(activeItemIndexes, item.id) > -1) }">
<span class="too-long-split" style="width: 130px;">{{item.name}}</span>
<idc-config-box :post-idc="item" ref="idcConfigBox" placement="left" @after="getIDCOptionData" :user-data="userDatas">
<template v-slot:optionZone>
<div @click="closeAllPop" class="menu-edit">
<div v-show="hoverItemIndex == '3-' + index" @click="closeAllPop" class="menu-edit">
<i class="nz-icon nz-icon-edit" @click="getIDCOptionData(item.id)" style="color: inherit"></i>
</div>
</template>
@@ -133,6 +133,7 @@
activeIndex:'',
activeItemIndex:'',
activeItemIndexes: [],
hoverItemIndex: '',
editPanel:{//新增or编辑的panel
id:'',
name: ''

4
nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
View File

@@ -194,10 +194,10 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click="esc" id="ep-esc" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
<button @click="esc" id="ep-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button @click="save" id="ep-add" class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
<button @click="save" id="ep-add" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

4
nezha-fronted/src/components/common/rightBox/alertConfigBox.vue
View File

@@ -99,10 +99,10 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click="esc" id="alert-box-esc" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
<button @click="esc" id="alert-box-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button v-if="rightBox.isEdit" @click="saveOrToEdit" id="alert-box-save" class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
<button v-if="rightBox.isEdit" @click="saveOrToEdit" id="alert-box-save" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

4
nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
View File

@@ -161,10 +161,10 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click="esc" id="ep-edit-esc" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
<button @click="esc" id="ep-edit-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button v-if="rightBox.isEdit" @click="save" id="ep-edit-save" class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
<button v-if="rightBox.isEdit" @click="save" id="ep-edit-save" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

4
nezha-fronted/src/components/common/rightBox/moduleBox.vue
View File

@@ -84,10 +84,10 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click="esc" id="module-box-esc" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
<button @click="esc" id="module-box-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button v-if="rightBox.isEdit" @click="saveOrToEdit" id="module-box-save" class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
<button v-if="rightBox.isEdit" @click="saveOrToEdit" id="module-box-save" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

4
nezha-fronted/src/components/common/rightBox/panelBox.vue
View File

@@ -26,10 +26,10 @@
<!-- begin--底部按钮-->
<div class="right-box-bottom-btns">
<button @click="esc" id="module-box-esc" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
<button @click="esc" id="module-box-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button @click="save" id="module-box-save" class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
<button @click="save" id="module-box-save" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

4
nezha-fronted/src/components/common/rightBox/projectBox.vue
View File

@@ -32,10 +32,10 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click="esc" id="project-esc" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
<button @click="esc" id="project-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button v-if="rightBox.isEdit" @click="saveOrToEdit" id="project-save" class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
<button v-if="rightBox.isEdit" @click="saveOrToEdit" id="project-save" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

4
nezha-fronted/src/components/page/alert/config.vue
View File

@@ -55,11 +55,11 @@
min-width="110px"
>
<template slot="header" slot-scope="scope">
<template v-if="index==0">
<template v-if="index==tablelable.length-1">
<span class="nz-table-txt">{{item.label}}</span>
<span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
<i class="nz-icon nz-icon-gear"></i>
</span>
<span class="nz-table-txt">{{item.label}}</span>
</template>
<div v-else>
<span>{{item.label}}</span>

4
nezha-fronted/src/components/page/alert/list.vue
View File

@@ -39,11 +39,11 @@
min-width="110px"
>
<template slot="header" slot-scope="scope">
<template v-if="index==0">
<template v-if="index==tablelable.length-1">
<span class="nz-table-txt">{{item.label}}</span>
<span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
<i class="nz-icon nz-icon-gear"></i>
</span>
<span class="nz-table-txt">{{item.label}}</span>
</template>
<div v-else>
<span>{{item.label}}</span>

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

@@ -63,11 +63,11 @@
:class-name="item.prop == 'option' ? 'content-right-options' : ''"
>
<template slot="header" slot-scope="scope">
<template v-if="index==0">
<template v-if="index==tablelable.length-1">
<span class="nz-table-txt">{{item.label}}</span>
<span @click.stop="elementsetShow('shezhi',$event)" id="asset-tab-set" class="nz-table-gear">
<i class="nz-icon nz-icon-gear"></i>
</span>
<span class="nz-table-txt">{{item.label}}</span>
</template>
<div v-else>
<span>{{item.label}}</span>

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

@@ -345,10 +345,10 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click.stop="sendStateData('close')" id="add-asset-esc" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
<button @click.stop="sendStateData('close')" id="add-asset-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button @click.stop="addNewData('asset')" id="add-asset-new" class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
<button @click.stop="addNewData('asset')" id="add-asset-new" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

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

@@ -387,10 +387,10 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click.stop="sendStateData('close')" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120" id="asset-edit-cancel">
<button @click.stop="sendStateData('close')" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100" id="asset-edit-cancel">
<span>{{$t('overall.cancel')}}</span>
</button>
<button v-if="!tabView" @click.stop="editData('asset')" class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120" id="asset-edit-save">
<button v-if="!tabView" @click.stop="editData('asset')" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100" id="asset-edit-save">
<span>{{$t('overall.save')}}</span>
</button>
</div>

8
nezha-fronted/src/components/page/config/account.vue
View File

@@ -50,11 +50,11 @@
:label="item.label"
>
<template slot="header" slot-scope="scope">
<template v-if="index==0">
<template v-if="index==tablelable.length-1">
<span class="nz-table-txt">{{item.label}}</span>
<span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
<i class="nz-icon nz-icon-gear"></i>
</span>
<span class="nz-table-txt">{{item.label}}</span>
</template>
<div v-else>
<span>{{item.label}}</span>
@@ -156,11 +156,11 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click="esc" id="account-esc"
class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button v-if="rightBox.isEdit" @click="saveOrToEdit" id="account-save"
class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

8
nezha-fronted/src/components/page/config/promServer.vue
View File

@@ -39,11 +39,11 @@
<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="header" slot-scope="scope">
<template v-if="index==0">
<template v-if="index==tablelable.length-1">
<span class="nz-table-txt">{{item.label}}</span>
<span @click.stop="elementsetShow('shezhi',$event)" id="prom-tab-set" class="nz-table-gear">
<i class="nz-icon nz-icon-gear"></i>
</span>
<span class="nz-table-txt">{{item.label}}</span>
</template>
<div v-else>
<span>{{item.label}}</span>
@@ -172,11 +172,11 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click="esc" id="prom-esc" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
<button @click="esc" id="prom-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button v-if="rightBox.isEdit" @click="saveOrToEdit" id="prom-save"
class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

4
nezha-fronted/src/components/page/dashboard/chartBox.vue
View File

@@ -164,10 +164,10 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button @click="esc" id="chart-box-esc" class="nz-btn nz-btn-size-large nz-btn-style-light nz-btn-min-width-120">
<button @click="esc" id="chart-box-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100">
<span>{{$t('overall.cancel')}}</span>
</button>
<button @click="confirmAdd" id="chart-box-save" class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120">
<button @click="confirmAdd" id="chart-box-save" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100">
<span>{{$t('overall.save')}}</span>
</button>
</div>

9
nezha-fronted/src/components/page/project/project.vue
View File

@@ -8,9 +8,6 @@
height: 25px !important;
border-color: #d8d8d8;
}
.project .nz-table .el-table__row td:first-of-type {
padding-left: 0;
}
.change-time-height {
height: 23px;
}
@@ -126,12 +123,12 @@
min-width="110px"
>
<template slot="header" slot-scope="scope">
<span v-if="index==0">
<template v-if="index==tablelable.length-1">
<span class="nz-table-txt">{{item.label}}</span>
<span @click.stop="elementsetShow('shezhi',$event)" class="nz-table-gear">
<i class="nz-icon nz-icon-gear"></i>
</span>
<span class="nz-table-txt">{{item.label}}</span>
</span>
</template>
<div v-else>
<span>{{item.label}}</span>
</div>