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

perf: asset详情页tag框样式调整

Browse Source
This commit is contained in:
chenjinsong
2020-06-19 18:35:13 +08:00
parent d66f957baf
commit d72e39bafa
2 changed files with 58 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1376,14 +1376,14 @@ li{
margin-left: 10px;
}
/* start--param*/
.param-box {
.param-box, .tag-edit-box {
border: 1px solid #DCDFE6;
border-radius: 4px;
}
.param-box-endpoint {
height: 325px;
}
.param-box-module {
.param-box-module, .tag-edit-box {
height: 140px;
}
.param-box-row {
@@ -2042,3 +2042,35 @@ li{
font-family: NotoSans !important;
font-size: 12px !important;
}
.tag-edit-box {
.tag-edit-box-head {
display: flex;
box-sizing: border-box;
>div {
font-size: 13px;
color: #0275b8;
}
>div:not(:last-of-type) {
width: calc(50% - 25px);
padding: 0 10px;
}
>div:last-of-type {
width: 50px;
}
}
.tag-edit-box-body {
display: flex;
box-sizing: border-box;
.tag-edit {
padding: 0 10px;
}
>div:not(:last-of-type) {
width: calc(50% - 25px);
padding: 0 10px;
}
>div:last-of-type {
width: 50px;
}
}
}

27
nezha-fronted/src/components/common/rightBox/assetBox.vue
View File

@@ -137,7 +137,25 @@
</button>
</div>
</template>
<div class="param-box param-box-module">
<div class="tag-edit-box">
<div class="tag-edit-box-head">
<div>Tag</div>
<div>Value</div>
<div>Action</div>
</div>
<el-scrollbar ref="tagEditBoxScrollbar" style="height: calc(100% - 32px);">
<div class="tag-edit-box-body" v-for="(item, index) in assetData.tags">
<el-form-item class="tag-edit tag-edit-tag" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}" :prop="'tags.' + index + '.tag'">
<el-input placeholder="tag" size="mini" v-model="item.tag"></el-input>
</el-form-item>
<el-form-item class="tag-edit tag-edit-value" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}" :prop="'tags.' + index + '.value'">
<el-input placeholder="value" size="mini" v-model="item.value"></el-input>
</el-form-item>
<div class="param-box-row-symbol" :id="'asset-tag-remove-'+index" @click="removeTag(index)"><i class="nz-icon nz-icon-minus-square"></i></div>
</div>
</el-scrollbar>
</div>
<!--<div class="param-box param-box-module">
<el-scrollbar ref="paramBoxScrollbar" style="height: 100%">
<div class="param-box-row" v-for="(item, index) in assetData.tags">
<el-form-item class="param-box-row-key" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}" :prop="'tags.' + index + '.tag'">
@@ -150,7 +168,7 @@
<span class="param-box-row-symbol" :id="'asset-tag-remove-param-'+index" @click="removeTag(index)"><i class="nz-icon nz-icon-minus-square"></i></span>
</div>
</el-scrollbar>
</div>
</div>-->
</el-form-item>
<!------------------------------------------impi---------------------------------------------->
<!--<div v-if="assetType == 1">
@@ -504,11 +522,14 @@
},
addTag() {
this.assetData.tags.push({tag: "", value: ""});
this.$nextTick(() => {
this.$refs.tagEditBoxScrollbar.update();
});
},
removeTag: function(index) {
this.assetData.tags.splice(index, 1);
this.$nextTick(() => {
this.$refs.paramBoxScrollbar.update();
this.$refs.tagEditBoxScrollbar.update();
});
},
clickOutSide(data) {