fix: 修复一些样式问题

This commit is contained in:
chenjinsong
2021-05-18 20:45:46 +08:00
parent fd77ced048
commit 63ba0189a5
3 changed files with 35 additions and 33 deletions

View File

@@ -12,52 +12,52 @@
@mouseenter="enter(index)" @mouseleave="leave(index)" @mouseenter="enter(index)" @mouseleave="leave(index)"
> >
<div class="item__title">{{guide.title}}</div> <div class="item__title">{{guide.title}}</div>
<div class="item__icon" @click="jump(guide.route)"><i :class="guide.icon"></i></div> <div :class="{'item__icon--disabled': !hasButton(guide.permissionCode)}" class="item__icon" @click="jump(guide.route)"><i :class="guide.icon"></i></div>
</div> </div>
</div> </div>
<div class="guide-desc"> <div class="guide-desc">
<template v-if="activeIndex === 0"> <template v-if="activeIndex === 0">
<div class="desc-text">{{$t('guide.dcTip')}}</div> <div class="desc-text">{{$t('guide.dcTip')}}</div>
<div class="guide__btn-group"> <div class="guide__btn-group">
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('dc_add')}" @click="jumpAndOpen('dc')">{{$t('guide.addDc')}}</button> <button :class="{'guide__btn--disabled': !hasButton('dc_add')}" class="guide__btn" type="button" @click="jumpAndOpen('dc')">{{$t('guide.addDc')}}</button>
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('dc_add')}" @click="jumpAndOpen('cabinet')">{{$t('guide.addCabinet')}}</button> <button :class="{'guide__btn--disabled': !hasButton('dc_add')}" class="guide__btn" type="button" @click="jumpAndOpen('cabinet')">{{$t('guide.addCabinet')}}</button>
</div> </div>
</template> </template>
<template v-if="activeIndex === 1"> <template v-if="activeIndex === 1">
<div class="desc-text">{{$t('guide.agentTip')}}</div> <div class="desc-text">{{$t('guide.agentTip')}}</div>
<div class="guide__btn-group"> <div class="guide__btn-group">
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('agent_add')}" @click="jumpAndOpen('agent')">{{$t('guide.addAgent')}}</button> <button :class="{'guide__btn--disabled': !hasButton('agent_add')}" class="guide__btn" type="button" @click="jumpAndOpen('agent')">{{$t('guide.addAgent')}}</button>
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('agent_add')}" @click="downloadAgent">{{$t('guide.downloadAgent')}}</button> <button :class="{'guide__btn--disabled': !hasButton('agent_add')}" class="guide__btn" type="button" @click="downloadAgent">{{$t('guide.downloadAgent')}}</button>
</div> </div>
</template> </template>
<template v-if="activeIndex === 2"> <template v-if="activeIndex === 2">
<div class="desc-text">{{$t('guide.assetTip')}}</div> <div class="desc-text">{{$t('guide.assetTip')}}</div>
<div class="guide__btn-group"> <div class="guide__btn-group">
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('asset_add')}" @click="jumpAndOpen('asset')">{{$t('guide.addAsset')}}</button> <button :class="{'guide__btn--disabled': !hasButton('asset_add')}" class="guide__btn" type="button" @click="jumpAndOpen('asset')">{{$t('guide.addAsset')}}</button>
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('asset_add')}" @click="jumpAndOpen('importAsset')">{{$t('guide.importAsset')}}</button> <button :class="{'guide__btn--disabled': !hasButton('asset_add')}" class="guide__btn" type="button" @click="jumpAndOpen('importAsset')">{{$t('guide.importAsset')}}</button>
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('asset_add')}" @click="openTerminal">{{$t('guide.webTerminal')}}</button> <button :class="{'guide__btn--disabled': !hasButton('asset_add')}" class="guide__btn" type="button" @click="openTerminal">{{$t('guide.webTerminal')}}</button>
</div> </div>
</template> </template>
<template v-if="activeIndex === 3"> <template v-if="activeIndex === 3">
<div class="desc-text">{{$t('guide.monitorTip')}}</div> <div class="desc-text">{{$t('guide.monitorTip')}}</div>
<div class="guide__btn-group"> <div class="guide__btn-group">
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('project_add')}" @click="jumpAndOpen('project')">{{$t('guide.addProject')}}</button> <button :class="{'guide__btn--disabled': !hasButton('project_add')}" class="guide__btn" type="button" @click="jumpAndOpen('project')">{{$t('guide.addProject')}}</button>
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('monitor_module_add')}" @click="jumpAndOpen('module')">{{$t('guide.addModule')}}</button> <button :class="{'guide__btn--disabled': !hasButton('monitor_module_add')}" class="guide__btn" type="button" @click="jumpAndOpen('module')">{{$t('guide.addModule')}}</button>
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('monitor_endpoint_add')}" @click="jumpAndOpen('endpoint')">{{$t('guide.addEndpoint')}}</button> <button :class="{'guide__btn--disabled': !hasButton('monitor_endpoint_add')}" class="guide__btn" type="button" @click="jumpAndOpen('endpoint')">{{$t('guide.addEndpoint')}}</button>
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('monitor_endpoint_add')}" @click="jumpAndOpen('importEndpoint')">{{$t('guide.importEndpoint')}}</button> <button :class="{'guide__btn--disabled': !hasButton('monitor_endpoint_add')}" class="guide__btn" type="button" @click="jumpAndOpen('importEndpoint')">{{$t('guide.importEndpoint')}}</button>
</div> </div>
</template> </template>
<template v-if="activeIndex === 4"> <template v-if="activeIndex === 4">
<div class="desc-text">{{$t('guide.visualizationTip')}}</div> <div class="desc-text">{{$t('guide.visualizationTip')}}</div>
<div class="guide__btn-group"> <div class="guide__btn-group">
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('panel_add')}" @click="jumpAndOpen('panel')">{{$t('guide.addPanel')}}</button> <button :class="{'guide__btn--disabled': !hasButton('panel_add')}" class="guide__btn" type="button" @click="jumpAndOpen('panel')">{{$t('guide.addPanel')}}</button>
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('panel_chart_add')}" @click="jumpAndOpen('chart')">{{$t('guide.addChart')}}</button> <button :class="{'guide__btn--disabled': !hasButton('panel_chart_add')}" class="guide__btn" type="button" @click="jumpAndOpen('chart')">{{$t('guide.addChart')}}</button>
</div> </div>
</template> </template>
<template v-if="activeIndex === 5"> <template v-if="activeIndex === 5">
<div class="desc-text">{{$t('guide.alertTip')}}</div> <div class="desc-text">{{$t('guide.alertTip')}}</div>
<div class="guide__btn-group"> <div class="guide__btn-group">
<button class="guide__btn" type="button" :class="{'nz-btn-permissions': !hasButton('alertRule_add')}" @click="jumpAndOpen('alertRule')">{{$t('guide.addAlertRule')}}</button> <button :class="{'guide__btn--disabled': !hasButton('alertRule_add')}" class="guide__btn" type="button" @click="jumpAndOpen('alertRule')">{{$t('guide.addAlertRule')}}</button>
</div> </div>
</template> </template>
</div> </div>
@@ -83,42 +83,42 @@ export default {
title: this.$t('guide.dc'), title: this.$t('guide.dc'),
icon: 'nz-icon nz-icon-datacenter1', icon: 'nz-icon nz-icon-datacenter1',
tip: this.$t('guide.dcTip'), tip: this.$t('guide.dcTip'),
buttonPermissions: 'dc_add' permissionCode: 'dc_view'
}, },
{ {
route: '/agent', route: '/agent',
title: this.$t('guide.agent'), title: this.$t('guide.agent'),
icon: 'nz-icon nz-icon-agent', icon: 'nz-icon nz-icon-agent',
tip: this.$t('guide.agentTip'), tip: this.$t('guide.agentTip'),
buttonPermissions: 'agent_add' permissionCode: 'agent_view'
}, },
{ {
route: '/asset', route: '/asset',
title: this.$t('guide.asset'), title: this.$t('guide.asset'),
icon: 'nz-icon nz-icon-menu-assets', icon: 'nz-icon nz-icon-menu-assets',
tip: this.$t('guide.assetTip'), tip: this.$t('guide.assetTip'),
buttonPermissions: 'asset_add' permissionCode: 'asset_view'
}, },
{ {
route: '/monitor/project', route: '/monitor/project',
title: this.$t('guide.monitor'), title: this.$t('guide.monitor'),
icon: 'nz-icon nz-icon-menu-project', icon: 'nz-icon nz-icon-menu-project',
tip: this.$t('guide.monitorTip'), tip: this.$t('guide.monitorTip'),
buttonPermissions: 'project_add' permissionCode: 'project_view'
}, },
{ {
route: '/panel', route: '/panel',
title: this.$t('guide.visualization'), title: this.$t('guide.visualization'),
icon: 'nz-icon nz-icon-visualization', icon: 'nz-icon nz-icon-visualization',
tip: this.$t('guide.visualizationTip'), tip: this.$t('guide.visualizationTip'),
buttonPermissions: 'panel_add' permissionCode: 'panel_view'
}, },
{ {
route: '/alertRule', route: '/alertRule',
title: this.$t('guide.alert'), title: this.$t('guide.alert'),
icon: 'nz-icon nz-icon-menu-alert', icon: 'nz-icon nz-icon-menu-alert',
tip: this.$t('guide.alertTip'), tip: this.$t('guide.alertTip'),
buttonPermissions: "alertRule_add" permissionCode: 'alertRule_view'
} }
], ],
interval: null interval: null
@@ -157,13 +157,13 @@ export default {
this.$store.commit('openConsole') this.$store.commit('openConsole')
}, },
jump (route) { jump (route) {
let buttonPermissions = true let allowed = false
this.guideList.forEach(ele => { this.guideList.forEach(ele => {
if (!this.hasButton(ele.buttonPermissions)){ if (this.hasButton(ele.permissionCode)) {
buttonPermissions = false allowed = true
} }
}) })
if (!buttonPermissions){ if (!allowed) {
return return
} }
this.$emit('close') this.$emit('close')
@@ -407,6 +407,9 @@ export default {
color: #ABABAB; color: #ABABAB;
} }
} }
.item__icon.item__icon--disabled {
cursor: not-allowed;
}
} }
.item__title { .item__title {
padding-top: 20px; padding-top: 20px;
@@ -483,9 +486,8 @@ export default {
.guide__btn:hover { .guide__btn:hover {
opacity: .9; opacity: .9;
} }
.nz-btn-permissions { .guide__btn.guide__btn--disabled {
pointer-events: none; cursor: not-allowed;
cursor: default;
opacity: 0.4; opacity: 0.4;
} }
} }

View File

@@ -106,12 +106,12 @@ export default {
prop: 'id', prop: 'id',
show: true, show: true,
width: 80, width: 80,
sortable:'custom' sortable: 'custom'
}, { }, {
label: this.$t('overall.name'), label: this.$t('overall.name'),
prop: 'name', prop: 'name',
show: true, show: true,
sortable:'custom' sortable: 'custom'
}, { }, {
label: this.$t('config.mib.fileName'), label: this.$t('config.mib.fileName'),
prop: 'fileName', prop: 'fileName',
@@ -127,11 +127,11 @@ export default {
}, { }, {
label: this.$t('config.mib.updateUser'), label: this.$t('config.mib.updateUser'),
prop: 'updateUser', prop: 'updateUser',
show: true show: false
}, { }, {
label: this.$t('config.mib.updateAt'), label: this.$t('config.mib.updateAt'),
prop: 'updateAt', prop: 'updateAt',
show: true show: false
} }
] ]
} }

View File

@@ -1 +1 @@
{"baseUrl":"http://192.168.40.42:8080/nz-admin/", "version": "2.0.2021.05.11.19.43"} {"baseUrl":"/", "version": "2.0.2021.05.11.19.43"}