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

fix：修改assetCilckSearch的样式

Browse Source
This commit is contained in:
zhangyu
2021-10-15 10:22:02 +08:00
parent bf38f47b16
commit ed24261c5e
5 changed files with 79 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue
View File

@@ -54,8 +54,8 @@
<div style="text-align: center;"><el-input style="width: calc(100% - 40px)" size="small" v-model="searchStr" @input="(val)=>{searchStrChange(val,key)}" suffix-icon="el-icon-search"/></div>
<el-checkbox-group v-model="selectValue[item.key]">
<el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" >
<span :title="item3.name" class="children-title-name"> {{item3.name}}</span>
<el-checkbox :label="item3.id+'-'+item4.id" :key="index4" v-for="(item4,index4) in item3.children">{{item4.name}}</el-checkbox>
<!-- <span :title="item3.name" class="children-title-name"> {{item3.name}}</span>-->
<el-checkbox :label="item3.id+'-'+item4.id" :key="index4" v-for="(item4,index4) in item3.children" :title="item3.name+'/'+item4.name">{{item3.name+'/'+item4.name}}</el-checkbox>
</el-dropdown-item>
</el-checkbox-group>
</el-dropdown-menu>
@@ -128,7 +128,7 @@ export default {
const arr = label.split('-')
const obj = oldChildren.find(item => item.id == arr[0])
const children = obj.children.find(item => item.id == arr[1])
return children.name
return obj.name + '/' + children.name
},
showDropDown (val, key) {
this.searchStr = this.detailSearchListCopy[key].searchStr
@@ -166,24 +166,24 @@ export default {
border-radius: 2px;
}
.search-detail-box:hover{
background-color: rgba(9,30,66,.13);
background: #F9F9F9;
}
.search-detail-box.select-dropdown{
background-color: rgba(9,30,66,.13);
}
.search-detail-box.show-my-dropdpwn{
background-color: #344563;
color: #fff;
.search-detail-title{
color: #fff;
}
.detail-top-search{
color: #fff;
}
.search-value{
color: #fff;
}
background: #F9F9F9;
}
/*.search-detail-box.show-my-dropdpwn{*/
/* background-color: #344563;*/
/* color: #fff;*/
/* .search-detail-title{*/
/* color: #fff;*/
/* }*/
/* .detail-top-search{*/
/* color: #fff;*/
/* }*/
/* .search-value{*/
/* color: #fff;*/
/* }*/
/*}*/
.detail-dropdown{
padding: 0 10px;
height: 30px;

80
nezha-fronted/src/components/common/detailView/list/asset/assetDetail.vue
View File

@@ -11,10 +11,10 @@
{{item.label}}
</el-option>
</el-select>
<el-button @click="orderTypeChange" size="small" style="height: 32px;padding: 0 5px 0 5px;margin-left: 10px" class="detail-button">
<button @click="orderTypeChange" size="small" class="detail-button top-tool-btn table-column-setting margin-l-10">
<i class="nz-icon nz-icon-arrow-up1" v-if="orderType=='ascending'" />
<i class="nz-icon nz-icon-arrow-down2" v-if="orderType=='descending'" />
</el-button>
</button>
</div>
<ul class="detail-row-box" ref="dataTable">
<li v-for="(item,index) in tableData" :key="index" class="detail-row" @click="detailViewRightShow(item)" :class="item.id === detailViewRightObj.id ? 'selected' : ''">
@@ -157,44 +157,44 @@ export default {
padding: 0 15px;
line-height: 40px;
align-items: center;
.detail-select{
height: 30px;
line-height: 30px;
flex: 1;
/deep/ .el-input--small{
height: 30px;
line-height: 30px;
background-color: rgba(9,30,66,0.08);
border: none;
color: #344563;
input{
height: 30px;
line-height: 30px;
background-color: rgba(9,30,66,0.08);
border: none;
color: #344563;
}
}
}
.detail-select:hover{
/deep/ .el-input--small{
input{
background-color: rgba(9,30,66,0.13);
}
}
}
.detail-button{
height: 28px;
line-height: 28px;
background-color: rgba(9,30,66,0.08);
border: none;
.nz-icon{
color: #344563;
}
}
.detail-button:hover{
background-color: rgba(9,30,66,0.13);
}
/*.detail-select{*/
/* height: 30px;*/
/* line-height: 30px;*/
/* flex: 1;*/
/* /deep/ .el-input--small{*/
/* height: 30px;*/
/* line-height: 30px;*/
/* background-color: rgba(9,30,66,0.08);*/
/* border: none;*/
/* color: #344563;*/
/* input{*/
/* height: 30px;*/
/* line-height: 30px;*/
/* background-color: rgba(9,30,66,0.08);*/
/* border: none;*/
/* color: #344563;*/
/* }*/
/* }*/
/*}*/
/*.detail-select:hover{*/
/* /deep/ .el-input--small{*/
/* input{*/
/* background-color: rgba(9,30,66,0.13);*/
/* }*/
/* }*/
/*}*/
/*.detail-button{*/
/* height: 28px;*/
/* line-height: 28px;*/
/* background-color: rgba(9,30,66,0.08);*/
/* border: none;*/
/* .nz-icon{*/
/* color: #344563;*/
/* }*/
/*}*/
/*.detail-button:hover{*/
/* background-color: rgba(9,30,66,0.13);*/
/*}*/
}
.detail-row-box{
height: calc(100% - 40px);

30
nezha-fronted/src/components/common/labelFilter/clickSearch.vue
View File

@@ -1,7 +1,7 @@
<template>
<div :style="{'height': height + 'px'}" class="search-box__container">
<div v-for="(data, type, index) in titleSearchListCopy" v-cloak :key="index" ref="searchContentBox" :class="{'search-content-box-height': data.length == 0}" class="search-content-box">
<label class="search-title">{{data.label}}:</label>
<div class="search-title">{{data.label}}:</div>
<el-skeleton v-if="data.type === 'checkBox'" :class="skeletonClass(data)" :loading="!data.show" :rows="1" class="search-items">
<template>
<el-checkbox-group v-if="data.type === 'checkBox'" ref="searchContent" v-model="selectValue[data.key]" @change="selectValue.change === 0 && selectValue.change++">
@@ -365,7 +365,7 @@ export default {
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 15px 0 15px 17px;
/*padding: 15px 0 15px 17px;*/
box-sizing: border-box;
border: 1px solid $--right-box-border-color;
background-color: #FFFFFF;
@@ -373,16 +373,17 @@ export default {
overflow-y: auto;
}
.search-title {
position: absolute;
width: 130px;
top: 7px;
left: 0;
line-height: 18px;
font-size: 14px;
color: #666666;
letter-spacing: 0;
font-weight: 500;
font-weight: 600;
overflow: hidden;
height: 100%;
line-height: 40px;
padding-left: 20px;
box-sizing: border-box;
background: #F9F9F9;
}
.search-content-box--copy {
position: fixed;
@@ -392,13 +393,16 @@ export default {
min-height: 31px;
}
.search-content-box,.search-content-box-height {
border-bottom: 1px solid $--primary-border-color;
flex: 1;
display: flex;
align-items: center;
flex-wrap: wrap;
position: relative;
padding: 5px 80px 5px 130px;
width: calc(100vw - 333px);
padding: 0px 80px 0px 0px;
box-sizing: border-box;
height: 100%;
/*line-height: 40px;*/
/deep/ .el-checkbox__label {
max-width: 150px;
@@ -408,11 +412,15 @@ export default {
vertical-align: text-bottom;
}
}
.search-content-box:last-of-type{
border-bottom: none;
}
.search-items {
display: flex;
width: 100%;
flex: 1;
flex-wrap: wrap;
box-sizing: border-box;
line-height: 40px;
&.search-items--checkbox .el-skeleton {
height: 21px;
}

2
nezha-fronted/src/components/common/language/en.js
View File

@@ -719,7 +719,7 @@ const en = {
pingInfo: 'Ping',
detail: {
list: 'List',
detail: 'Detail',
detail: 'View',
orderBy: 'OrderBy',
orderByLabel: 'Order by {label}'
}

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

@@ -78,7 +78,7 @@
</nz-data-list>
<nzDetailView
v-loading="detailViewLoading || tools.loading"
v-show="detailType !== 'list'"
v-if="detailType !== 'list'"
:api="url"
ref="dataList"
:layout="dataListLayout"