fix:处理 asset Sub 切换底部选项 出现多个subAsset的问题

This commit is contained in:
zhangyu
2021-07-16 09:56:18 +08:00
parent c2cf06b485
commit 9ae70267bf
3 changed files with 44 additions and 9 deletions

View File

@@ -108,11 +108,17 @@ export default {
immediate: true, immediate: true,
handler (n) { handler (n) {
if ((this.from === fromRoute.asset) && n) { if ((this.from === fromRoute.asset) && n) {
const assetSub = { prop: 'assetSubTab', name: this.$t('overall.assetSubTab'), active: false }
if (n.childrenNum) { if (n.childrenNum) {
const assetSub = { prop: 'assetSubTab', name: this.$t('overall.assetSubTab'), active: false } if (!this.tabs.asset.panel.find(item => item.prop === assetSub.prop)) {
this.tabs.asset.panel.push(assetSub) this.tabs.asset.panel.push(assetSub)
this.tabs.asset.alertMessage.push(assetSub) this.tabs.asset.alertMessage.push(assetSub)
this.tabs.asset.endpoint.push(assetSub) this.tabs.asset.endpoint.push(assetSub)
}
} else if (this.tabs.asset.panel.find(item => item.prop === assetSub.prop)) {
this.tabs.asset.panel = this.tabs.asset.panel.filter(item => item.prop !== assetSub.prop)
this.tabs.asset.alertMessage = this.tabs.asset.alertMessage.filter(item => item.prop !== assetSub.prop)
this.tabs.asset.endpoint = this.tabs.asset.endpoint.filter(item => item.prop !== assetSub.prop)
} }
} }
} }
@@ -155,12 +161,12 @@ export default {
alertMessage: [ alertMessage: [
{ prop: 'panelTab', name: this.$t('overall.detail'), active: false }, { prop: 'panelTab', name: this.$t('overall.detail'), active: false },
{ prop: 'alertMessageTab', name: this.$t('overall.alert'), active: true }, { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: true },
{ prop: 'endpointTab', name: 'Endpoint', active: false }, { prop: 'endpointTab', name: 'Endpoint', active: false }
], ],
endpoint: [ endpoint: [
{ prop: 'panelTab', name: this.$t('overall.detail'), active: false }, { prop: 'panelTab', name: this.$t('overall.detail'), active: false },
{ prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false }, { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false },
{ prop: 'endpointTab', name: 'Endpoint', active: true }, { prop: 'endpointTab', name: 'Endpoint', active: true }
], ],
alertMessageSub: [ alertMessageSub: [
{ prop: 'panelTab', name: this.$t('overall.detail'), active: false }, { prop: 'panelTab', name: this.$t('overall.detail'), active: false },

View File

@@ -57,12 +57,26 @@
</div> </div>
</template> </template>
<template v-else-if="item.prop === 'model'">{{scope.row.model ? scope.row.model.name : '-'}}</template> <template v-else-if="item.prop === 'model'">{{scope.row.model ? scope.row.model.name : '-'}}</template>
<template v-else-if="item.prop === 'parent'">{{scope.row.parent ? scope.row.parent.name : '-'}}</template> <template v-else-if="item.prop === 'parent'">
<span
v-if="scope.row.parent"
@mouseenter="labelHover(scope.row, 'asset', true, $event)"
@mouseleave="labelHover(scope.row, 'asset', false)">
{{scope.row.parent.name}}
<alertLabel
v-if="scope.row.loading"
:id="scope.row.pid"
:that="scope.row"
:type="'asset'"
></alertLabel>
</span>
<span v-else> - </span>
</template>
<template v-else-if="item.prop === 'children'"> <template v-else-if="item.prop === 'children'">
<div @click="$emit('showBottomBox', 'assetSubTab', scope.row)" v-if="scope.row.childrenNum"> <div @click="$emit('showBottomBox', 'assetSubTab', scope.row)" v-if="scope.row.childrenNum" style="cursor: pointer">
<i class="nz-icon nz-icon-overview-project monitorColor color23BF9A"></i> <i class="nz-icon nz-icon-overview-project monitorColor color23BF9A"></i>
{{scope.row.childrenNum}}</div> {{scope.row.childrenNum}}</div>
<span v-else-if="scope.row.type.vm===1"> <i class="nz-icon nz-icon-overview-project monitorColor color23BF9A"></i> 0 </span> <!-- <span v-else-if="scope.row.pid == -1"> <i class="nz-icon nz-icon-overview-project monitorColor color23BF9A"></i> 0 </span>-->
<span v-else> - </span> <span v-else> - </span>
</template> </template>
<template v-else-if="item.prop === 'brand'">{{scope.row.brand ? scope.row.brand.name : '-'}}</template> <template v-else-if="item.prop === 'brand'">{{scope.row.brand ? scope.row.brand.name : '-'}}</template>
@@ -107,9 +121,13 @@
import table from '@/components/common/mixin/table' import table from '@/components/common/mixin/table'
import { showTableTooltip, hideTableTooltip } from '@/components/common/js/tools' import { showTableTooltip, hideTableTooltip } from '@/components/common/js/tools'
import bus from '@/libs/bus' import bus from '@/libs/bus'
import alertLabel from '@/components/common/alert/alertLabel'
export default { export default {
name: 'assetTable', name: 'assetTable',
mixins: [table], mixins: [table],
components: {
alertLabel: alertLabel
},
props: { props: {
showOption: { showOption: {
type: Boolean, type: Boolean,
@@ -258,6 +276,16 @@ export default {
this.bottomBox.targetTab = 'endpoint' this.bottomBox.targetTab = 'endpoint'
this.bottomBox.showSubList = true this.bottomBox.showSubList = true
}, },
// label 鼠标划入
labelHover (item, type, loading, e) {
if (e) {
const dom = e.currentTarget
const position = dom.getBoundingClientRect()
this.$set(item, 'position', position)
}
this.$set(item, 'loading', loading)
// this.$set(this.tableData,index,item);// 调用父组件
},
returnCabinet (start, end) { // 返回机柜u位信息 returnCabinet (start, end) { // 返回机柜u位信息
if (!start || !end) { if (!start || !end) {
return '' return ''

View File

@@ -20,6 +20,7 @@
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"
:params2="searchCheckBox"
:permissions="{ :permissions="{
import: 'asset_add', import: 'asset_add',
export: 'asset_view' export: 'asset_view'