perf: project样式调整
This commit is contained in:
@@ -190,7 +190,7 @@
|
||||
.el-table {
|
||||
position: absolute;
|
||||
width: calc(100% - 40px);
|
||||
border: 1px solid #E7EAED;
|
||||
border: 1px solid $--right-box-border-color;
|
||||
border-bottom: none;
|
||||
|
||||
.caret-wrapper {
|
||||
@@ -209,10 +209,10 @@
|
||||
|
||||
td {
|
||||
padding: 9px 0;
|
||||
border-bottom: 1px solid #E7EAED;
|
||||
border-bottom: 1px solid $--right-box-border-color;
|
||||
}
|
||||
th {
|
||||
border-color: #E7EAED;
|
||||
border-color: $--right-box-border-color;
|
||||
}
|
||||
.el-table__header th:first-of-type {
|
||||
border-left: none;
|
||||
@@ -221,7 +221,7 @@
|
||||
position: fixed;
|
||||
right: 31px;
|
||||
height: 49px;
|
||||
border-bottom: 1px solid #E7EAED;
|
||||
border-bottom: 1px solid $--right-box-border-color;
|
||||
background-color: white;
|
||||
}
|
||||
thead {
|
||||
@@ -284,7 +284,7 @@
|
||||
}
|
||||
/* start--覆盖el-table边框、gutter等样式 */
|
||||
.el-table__body-wrapper, .el-table__fixed-body-wrapper {
|
||||
box-shadow: 1px 0 #E7EAED;
|
||||
box-shadow: 1px 0 $--right-box-border-color;
|
||||
|
||||
.cell {
|
||||
color: #333;
|
||||
@@ -298,20 +298,20 @@
|
||||
}
|
||||
/* 最后一列用box-shadow模拟边框 */
|
||||
.el-table:not(.no-operation).el-table--border .el-table__body-wrapper td:nth-last-child(2) {
|
||||
box-shadow: 1px 0 #E7EAED;
|
||||
box-shadow: 1px 0 $--right-box-border-color;
|
||||
}
|
||||
.el-table:not(.no-operation).el-table--border .el-table__header-wrapper th:nth-last-child(3) {
|
||||
border-right: none !important;
|
||||
box-shadow: 1px 0 #E7EAED;
|
||||
box-shadow: 1px 0 $--right-box-border-color;
|
||||
}
|
||||
.el-table__fixed-body-wrapper {
|
||||
td:not(.is-hidden) {
|
||||
border-left: 1px solid #E7EAED;
|
||||
border-left: 1px solid $--right-box-border-color;
|
||||
}
|
||||
}
|
||||
.el-table__fixed-header-wrapper {
|
||||
th:not(.is-hidden) {
|
||||
border-left: 1px solid #E7EAED;
|
||||
border-left: 1px solid $--right-box-border-color;
|
||||
}
|
||||
th:last-of-type {
|
||||
border-right: none !important;
|
||||
|
||||
@@ -50,6 +50,8 @@ $--monitor-color: #98AEC5; //全局停用色灰色
|
||||
warningColor: var(--theme-color);
|
||||
suspendedColor: $--suspended-color;
|
||||
monitorColor: $--monitor-color;
|
||||
primaryBorderColor: $--primary-border-color;
|
||||
rightBoxBorderColor: $--right-box-border-color;
|
||||
}
|
||||
/* element-ui变量覆盖 */
|
||||
/*$--color-primary: red; // 覆盖element-ui的主题色
|
||||
|
||||
@@ -2073,27 +2073,6 @@ li{
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.right-bottom-zoom{
|
||||
position: absolute;
|
||||
top: calc(100% - 100px);
|
||||
left: calc(100% - 45px);
|
||||
height: 90px;
|
||||
width: 35px;
|
||||
border: 1px solid #E7EAED;
|
||||
box-shadow: -1px 1px 9px -1px rgba(205,205,205,0.77);
|
||||
.zoom-option{
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
opacity: 0.42;
|
||||
background: #FFF;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.zoom-option:hover{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.nz-icon-arrow-down{
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@@ -212,7 +212,7 @@ export default {
|
||||
justify-content: space-between;
|
||||
padding: 15px 0 15px 17px;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #E7EAED;
|
||||
border: 1px solid $--right-box-border-color;
|
||||
background-color: #FFFFFF;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -851,7 +851,7 @@ export default {
|
||||
width: 37.5%;
|
||||
margin-right: 2%;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #E7EAED;
|
||||
border: 1px solid $--right-box-border-color;
|
||||
border-radius: 2px;
|
||||
position: relative;
|
||||
}
|
||||
@@ -875,7 +875,7 @@ export default {
|
||||
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #E7EAED;
|
||||
border: 1px solid $--right-box-border-color;
|
||||
border-radius: 2px;
|
||||
}
|
||||
/* end--table*/
|
||||
@@ -884,7 +884,7 @@ export default {
|
||||
.search-box{
|
||||
width: calc(100% - 10px);
|
||||
padding: 10px 5px;
|
||||
border-bottom: 1px solid #E7EAED;
|
||||
border-bottom: 1px solid $--right-box-border-color;
|
||||
display: flex;
|
||||
}
|
||||
/deep/ .new-search .search-input-all{
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<!-- 顶部工具栏 -->
|
||||
<div class="main-modal"></div>
|
||||
<div class="main-container">
|
||||
<div v-show="bottomBox.mainResizeShow" class="top-tools">
|
||||
<div v-show="bottomBox.mainResizeShow" :style="from === fromRoute.project ? 'padding-right: 5px' : ''" class="top-tools">
|
||||
<div class="top-tool-left" style="min-width: 300px">
|
||||
<slot name="top-tool-left"></slot>
|
||||
</div>
|
||||
@@ -25,10 +25,10 @@
|
||||
<div v-if="showLayout.indexOf('clickSearch') > -1" class="search-box">
|
||||
<slot name="search"></slot>
|
||||
</div>
|
||||
<div v-show="bottomBox.mainResizeShow" class="nz-table2">
|
||||
<div v-show="bottomBox.mainResizeShow" :style="from === fromRoute.project ? 'padding-right: 5px' : ''" class="nz-table2">
|
||||
<slot v-bind:mainResizeShow="bottomBox.mainResizeShow"></slot>
|
||||
</div>
|
||||
<div v-show="bottomBox.mainResizeShow" class="pagination-bottom">
|
||||
<div v-show="bottomBox.mainResizeShow" :style="from === fromRoute.project ? 'width: calc(100% - 15px);bottom: 18px' : ''" class="pagination-bottom">
|
||||
<slot name="pagination"></slot>
|
||||
</div>
|
||||
</div>
|
||||
@@ -62,6 +62,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fromRoute } from '@/components/common/js/constants'
|
||||
import bottomBox from '@/components/common/bottomBox/bottomBox'
|
||||
import { bottomBoxWindow } from '@/components/common/js/tools'
|
||||
|
||||
@@ -91,6 +92,7 @@ export default {
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
fromRoute: fromRoute,
|
||||
/* 二级页面相关 */
|
||||
bottomBox: {
|
||||
object: {},
|
||||
|
||||
@@ -126,9 +126,6 @@ export default {
|
||||
return '-'
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
console.info(this.customTableTitle)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -4,6 +4,7 @@
|
||||
ref="dataTable"
|
||||
:data="tableData"
|
||||
:height="height"
|
||||
style="width: calc(100% - 25px)"
|
||||
border
|
||||
@header-dragend="dragend"
|
||||
@sort-change="tableDataSort"
|
||||
|
||||
@@ -549,13 +549,6 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
getUserData () {
|
||||
this.$get('sys/user/list').then(response => {
|
||||
if (response.code === 200) {
|
||||
this.userData = response.data.list
|
||||
}
|
||||
})
|
||||
},
|
||||
// 刷新拓扑图
|
||||
visNetworkReload () {
|
||||
this.$refs.facade.$refs.visNetwork.reload()
|
||||
@@ -617,7 +610,6 @@ export default {
|
||||
if (pageSize) {
|
||||
this.endpointPageObj.pageSize = pageSize
|
||||
}
|
||||
this.getUserData()
|
||||
},
|
||||
mounted () {
|
||||
// 初始化表头
|
||||
|
||||
@@ -23,9 +23,10 @@
|
||||
v-loading="slotProps.loading"
|
||||
:api="url"
|
||||
:custom-table-title="tools.customTableTitle"
|
||||
:height="mainTableHeight"
|
||||
:height="projectTableHeight"
|
||||
:table-data="tableData"
|
||||
:tableId="tableId"
|
||||
style="padding-right: 0"
|
||||
@del="del"
|
||||
@edit="edit"
|
||||
@orderBy="tableDataSort"
|
||||
@@ -35,7 +36,8 @@
|
||||
</template>
|
||||
<template v-slot:pagination>
|
||||
<div class="project-page">
|
||||
<Pagination ref="Pagination" :page-obj="pageObj" :table-id="tableId" @pageNo='pageNo' @pageSize='pageSize'></Pagination>
|
||||
<Pagination ref="Pagination" :page-obj="pageObj" :table-id="tableId" style="width: calc(100% - 15px);padding-bottom: 6px;" @pageNo='pageNo'
|
||||
@pageSize='pageSize'></Pagination>
|
||||
</div>
|
||||
</template>
|
||||
</nz-data-list>
|
||||
@@ -68,6 +70,7 @@ export default {
|
||||
name: '',
|
||||
remark: ''
|
||||
},
|
||||
projectTableHeight: 'calc(100% - 58px)',
|
||||
tableId: 'projectTable',
|
||||
queryPermission: 'account_view',
|
||||
searchMsg: { // 给搜索框子组件传递的信息
|
||||
@@ -140,8 +143,8 @@ export default {
|
||||
<style lang="scss">
|
||||
.project-list{
|
||||
.project-page{
|
||||
margin: 0 10px 0 20px;
|
||||
border: 1px solid #eeeeee;
|
||||
margin: 0 0 0 20px;
|
||||
border: 1px solid $--right-box-border-color;
|
||||
border-top: none;
|
||||
/deep/ .pagination{
|
||||
padding-top: 0;
|
||||
|
||||
Reference in New Issue
Block a user