fix:修改overview顶部tool区域的布局方式

This commit is contained in:
zhangyu
2020-12-16 11:27:29 +08:00
parent 6966e3a01d
commit e71339f21c
2 changed files with 11 additions and 7 deletions

View File

@@ -4,9 +4,9 @@
.overview-content-header{
display: flex;
padding: 8px 0 2px 0;
justify-content: space-between;
}
.overview-content-header .header-title{
flex:12;
height: 35px;
line-height: 35px;
font-size: 1.5rem !important;
@@ -14,15 +14,21 @@
margin-left: 15px;
}
.overview-content-header .header-tool{
flex: 2;
height: 35px;
min-width: 340px;
display: flex;
padding: 5px;
}
.header-tool .tool-container{
display: flex;
text-align: center;
justify-content: space-between;
min-width: 310px;
}
.tool-container .pickTime{
margin-right: -20px;
}
.tool-container .time{
flex: 4;
font-size: 1rem !important;
display: inline-block;
height: 35px;
@@ -31,7 +37,6 @@
vertical-align: middle;
}
.tool-container .date{
flex: 4;
height: 35px;
}
.date .week{
@@ -44,7 +49,6 @@
line-height: 0.75rem;
}
.tool-container .operation{
flex: 2;
display: inline-block;
line-height: 35px;
}

View File

@@ -5,15 +5,15 @@
<!--标题-->
<div class="overview-content-header">
<div class="header-title" :class="{'hide-div':!isFullScreen}">{{systemName&&systemName != 'undefined'&&systemName != null?systemName: $t('dashboard.overview.contentTitle')}}</div>
<div class="overview-loading"><loading ref="overviewLoading" ></loading></div>
<div class="header-tool">
<div class="overview-loading"><loading ref="overviewLoading" ></loading></div>
<div class="tool-container">
<div class="time">{{sysTime}}</div>
<div class="date">
<div class="week">{{sysWeek}}</div>
<div class="sys-date">{{sysDate}}</div>
</div>
<pick-time :showTimePicker="false" class="float-right pickTime margin-l-20" :refresh-data-func="setFreshDataTimer" v-model="searchTime" :use-chart-unit="false" ref="pickTime"></pick-time>
<pick-time :showTimePicker="false" class="float-right pickTime" :refresh-data-func="setFreshDataTimer" v-model="searchTime" :use-chart-unit="false" ref="pickTime"></pick-time>
<div class="operation" @click="switchFullScreen" ><span ><i class="nz-icon screen-icon" :class="{'nz-icon-maxview':!isFullScreen,'nz-icon-exit-full-screen':isFullScreen}"></i></span></div>
</div>
</div>