fix: network app 更多点击事件切换为鼠标悬浮触发

This commit is contained in:
@changcode
2022-10-28 15:30:16 +08:00
parent db105804b3
commit 3093c3e3a8

View File

@@ -20,14 +20,14 @@
</div> </div>
<div class="app-cards"> <div class="app-cards">
<div class="app-card" v-for="(app, index) in appData" :key="index"> <div class="app-card" @mouseenter="mouseenter(app)" @mouseleave="mouseleave(app)" v-for="(app, index) in appData" :key="index">
<div class="app-card-title"> <div class="app-card-title">
<div class="app-card-title-name"> <div class="app-card-title-name">
<i class="cn-icon" :class="app.type === 'provider' ? 'cn-icon-entity' : 'cn-icon-app2'"></i> <i class="cn-icon" :class="app.type === 'provider' ? 'cn-icon-entity' : 'cn-icon-app2'"></i>
<span @click="drillDownData(app.type, app.name)">{{app.name}}</span> <span @click="drillDownData(app.type, app.name)">{{app.name}}</span>
</div> </div>
<div class="app-card-title-more" v-ele-click-outside="clickOutSide"> <div class="app-card-title-more">
<span><i class="cn-icon cn-icon-more-dark" @click="moreChange(app)"></i></span> <span><i class="cn-icon cn-icon-more-dark"></i></span>
<span class="app-card-title-more-delete" @click="del(app, index)" v-show="app.moreOptions"><i class="cn-icon cn-icon-delete"></i>{{$t('overall.delete')}}</span> <span class="app-card-title-more-delete" @click="del(app, index)" v-show="app.moreOptions"><i class="cn-icon cn-icon-delete"></i>{{$t('overall.delete')}}</span>
</div> </div>
</div> </div>
@@ -694,16 +694,30 @@ export default {
}) })
} }
}, },
moreChange (app) { // moreChange (app) {
// this.appData.forEach(t => {
// if (t.name === app.name && t.type === app.type) {
// t.moreOptions = !t.moreOptions
// }
// })
// },
resize () {
this.myChart.forEach(t => {
t.resize()
})
},
mouseenter (app) {
this.appData.forEach(t => { this.appData.forEach(t => {
if (t.name === app.name && t.type === app.type) { if (t.name === app.name && t.type === app.type) {
t.moreOptions = !t.moreOptions t.moreOptions = !t.moreOptions
} }
}) })
}, },
resize () { mouseleave (app) {
this.myChart.forEach(t => { this.appData.forEach(t => {
t.resize() if (t.name === app.name && t.type === app.type) {
t.moreOptions = false
}
}) })
} }
}, },