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

fix: 修复 alertLable 页面，因定位问题超出浏览器窗口

Browse Source
This commit is contained in:
@changcode
2021-11-02 16:07:50 +08:00
parent f6ac483d33
commit 8abb1e0980
2 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
nezha-fronted/src/components/common/alert/alertLabel.vue
View File

@@ -300,7 +300,8 @@ export default {
data () { data () {
return { return {
alertLabelData: null, alertLabelData: null,
loading: true loading: true,
heightList: 0
} }
}, },
components: { components: {
@@ -330,18 +331,15 @@ export default {
}, },
computed: { computed: {
calcPosition () { calcPosition () {
const self = this
return function (position) { return function (position) {
const clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight const clientHeight = (document.body.clientHeight < document.documentElement.clientHeight) ? document.body.clientHeight : document.documentElement.clientHeight
const leftOffSetView = this.detailList ? -80 : 10 const leftOffSetView = this.detailList ? -80 : 10
const topOffSetView = this.detailList ? 0 : 0 const leftOffSet = this.detailList ? -80 : 10
const leftOffSet = this.detailList ? -80 : 20 const topOffSet = this.detailList ? 60 : 22
const topOffSet = this.detailList ? 45 : 0 if (position.top + this.heightList > clientHeight) {
const elHeight = self.type === 'asset' ? 318 : (self.type === 'project' ? 70 : 70)
if (position.top + elHeight > clientHeight) {
return { return {
left: `${position.left + position.width + leftOffSet}px`, left: `${position.left + position.width + leftOffSet}px`,
top: `${position.top - elHeight + topOffSet}px` top: `${position.top - this.heightList + topOffSet}px`
} }
} else if (this.alertTableDialog) { } else if (this.alertTableDialog) {
const dialog = document.querySelector('#dialog-alert-massage .el-dialog') const dialog = document.querySelector('#dialog-alert-massage .el-dialog')
@@ -355,7 +353,7 @@ export default {
} else { } else {
return { return {
left: `${position.left + position.width + leftOffSetView}px`, left: `${position.left + position.width + leftOffSetView}px`,
top: `${position.top + topOffSetView}px` top: `${position.top}px`
} }
} }
} }
@@ -438,7 +436,9 @@ export default {
} }
} }
}, },
mounted () {}, mounted () {
this.heightList = this.$refs.alertLabels.getBoundingClientRect().height
},
beforeDestroy () { beforeDestroy () {
} }

4
nezha-fronted/src/components/common/rightBox/administration/roleBox.vue
View File

@@ -6,9 +6,9 @@
<span v-cancel="{obj: editRole, func: esc}"><i class="nz-icon nz-icon-close"></i></span> <span v-cancel="{obj: editRole, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
</div> </div>
</div> </div>
<div class="right-box__container"> <div class="right-box__container right-box-container__left">
<div class="container__form"> <div class="container__form">
<el-form :disabled="detail" :model="editRole" :rules="rules" class="right-box-form right-box-form-left" label-position = "top" label-width="120px" ref="roleForm"> <el-form :disabled="detail" :model="editRole" :rules="rules" label-position="top" label-width="120px" ref="roleForm">
<!--name--> <!--name-->
<el-form-item :label="$t('config.roles.name')" prop="name"> <el-form-item :label="$t('config.roles.name')" prop="name">
<el-input maxlength="64" placeholder="" id="role-box-input-name" <el-input maxlength="64" placeholder="" id="role-box-input-name"