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

NEZ-948 fix: asset label 样式调整

Browse Source
This commit is contained in:
@changcode
2021-08-30 10:48:04 +08:00
parent dc8d5c2561
commit 780b119c61
3 changed files with 59 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
nezha-fronted/src/components/common/popBox/selectAssetMetaGroup.vue
View File

@@ -1,5 +1,5 @@
<template>
<el-popover ref="selectAssetMetaGroupPopBox" v-model="popBox.show" :placement="placement" popper-class="nz-pop nz-pop-select-panel" transition="slide" width="300">
<el-popover ref="selectAssetMetaGroupPopBox" v-model="popBox.show" :placement="placement" popper-class="nz-pop nz-pop-select-panel nz-pop-select-panel__dropdown" transition="slide" width="300">
<div>
<div class="pop-item-wider">
@@ -19,11 +19,34 @@
node-key="id"
@node-click="selectObject">
<div slot-scope="{ node, data }" class="tree--node">
<span>{{ node.label }}</span>
<span class="tree--operation">
<span class="panel-dropdown-btn panel-dropdown-btn-delete" @click.stop="del(data)"><i class="nz-icon nz-icon-delete"></i></span>
<span class="panel-dropdown-btn" @click.stop="edit(data)"><i class="nz-icon nz-icon-edit"></i></span>
<!-- -->
<span>
<el-popover
placement="right"
trigger="hover"
:content="node.label">
<span slot="reference">{{ node.label }}</span>
</el-popover>
</span>
<!-- <span class="tree&#45;&#45;operation">-->
<!-- <span class="panel-dropdown-btn panel-dropdown-btn-delete" @click.stop="del(data)"><i class="nz-icon nz-icon-delete"></i></span>-->
<!-- <span class="panel-dropdown-btn" @click.stop="edit(data)"><i class="nz-icon nz-icon-edit"></i></span>-->
<!-- </span>-->
<el-row class="block-col-2" style="width: 35px;">
<el-col>
<el-dropdown placement="bottom" trigger="click">
<span class="el-dropdown-link tree--operation" @click.stop><i class="nz-icon nz-icon-more1"></i></span>
<el-dropdown-menu slot="dropdown" v-has="['asset_label_delete', 'asset_label_edit']">
<el-dropdown-item>
<span @click.stop="edit(data)"><i v-has="'asset_label_edit'" class="nz-icon nz-icon-edit"></i>{{$t('overall.edit')}}</span>
</el-dropdown-item>
<el-dropdown-item>
<span @click.stop="del(data)" v-has="'asset_label_delete'"><i class="nz-icon nz-icon-delete"></i>{{$t('overall.delete')}}</span>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-col>
</el-row>
</div>
</el-tree>
</div>
@@ -32,6 +55,9 @@
<div slot="reference">
<slot name="trigger"></slot>
</div>
<div slot="default">
<slot name="tail"></slot>
</div>
</el-popover>
</template>

33
nezha-fronted/src/components/page/config/assetMeta.vue
View File

@@ -11,15 +11,21 @@
>
<template v-slot:top-tool-left>
<select-group ref="selectGroup" :filter-object="filterGroup" :object-data="groupData" :placement="'bottom-start'"
:show-object="showGroup" style="width: 300px;" @del="delGroup" @edit="editGroup" @selectObject="groupChange">
:show-object="showGroup" @del="delGroup" @edit="editGroup" @selectObject="groupChange">
<template v-slot:header>
<div class="panel-select-header">
<el-input id="panel-list-search" v-model="filterGroup" :placeholder="$t('overall.search')" clearable size="mini" style="width: 240px; margin-right: 5px;"></el-input>
<span id="panel-list-toadd" v-has="'asset_label_add'" :title='$t("dashboard.panel.createPanelTitleSec")' class="panel-select-add" @click="addGroup"><i class="nz-icon nz-icon-plus"></i></span>
<el-input id="panel-list-search" v-model="filterGroup" :placeholder="$t('overall.search')" clearable size="mini" style="width: 280px;"></el-input>
</div>
</template>
<template v-slot:trigger>
<el-input v-model="showGroup.name" class="panel-name" placeholder="" readonly="readonly" size="small"></el-input>
<!-- <el-input v-model="showGroup.name" class="panel-name" placeholder="" readonly="readonly" size="small"></el-input>-->
<span style="display: inline-block;padding: 0 7px;font-weight: bold">{{showGroup.name}}</span>
<i style="font-size: 12px;color: #BEBEBE;" class="nz-icon nz-icon-arrow-down"></i>
</template>
<template v-slot:tail>
<div class="panel-select-tail">
<span id="panel-list-toadd" v-has="'asset_label_add'" :title='$t("dashboard.panel.createPanelTitleSec")' class="panel-select-add" @click="addGroup"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{ $t('overall.addProject') }}</span>
</div>
</template>
</select-group>
</template>
@@ -268,7 +274,7 @@ export default {
}
</script>
<style scoped>
<style lang="scss" scoped>
.content{
display: flex;
height: calc(100% - 40px);
@@ -322,6 +328,21 @@ export default {
}
.panel-select-header {
padding: 0 0 10px 16px;
text-align: center;
}
.panel-select-tail {
border-top: 1px solid #DEDEDE;
.panel-select-add {
line-height: 32px;
height: 32px;
display: inline-block;
cursor: pointer;
i {
color: #FA901C;
font-size: 12px;
font-weight: bold;
padding-left: 20px;
}
}
}
</style>

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

@@ -28,7 +28,7 @@
</template>
<template v-slot:tail>
<div class="panel-select-tail">
<span id="panel-list-toadd" v-has="'panel_add'" :title='$t("dashboard.panel.createPanelTitleSec")' class="panel-select-add" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;Add</span>
<span id="panel-list-toadd" v-has="'panel_add'" :title='$t("dashboard.panel.createPanelTitleSec")' class="panel-select-add" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{ $t('overall.addProject') }}</span>
</div>
</template>
</select-panel>