修改同济大学运行图bar

This commit is contained in:
ival 2021-03-04 09:20:27 +08:00
parent d84f4ba836
commit 4e4d602400
3 changed files with 13 additions and 10 deletions

View File

@ -1,8 +1,8 @@
<template> <template>
<div class="menu" <div class="menu"
@click.stop="onClick" @click.self="onClick"
@mouseenter.stop="onMouseEnter" @mouseenter.self="onMouseEnter"
@mouseleave.stop="onMouseLeave"> @mouseleave.self="onMouseLeave">
<slot name="prefix"/> <slot name="prefix"/>
<span class="menu-label" :class="{'menu-check': check}" :style="{color: color}">{{menu.title}}</span> <span class="menu-label" :class="{'menu-check': check}" :style="{color: color}">{{menu.title}}</span>
<slot name="append"/> <slot name="append"/>

View File

@ -9,7 +9,7 @@
@mouseleave="onMouseLeave(el, i)"> @mouseleave="onMouseLeave(el, i)">
<template v-if="el.children&&el.children.length" slot="append"> <template v-if="el.children&&el.children.length" slot="append">
<span class="menu-arrow" /> <span class="menu-arrow" />
<menu-list class="menu-list" v-if="index==i" :background="background" :color="color" :menus="el.children"/> <menu-list class="menu-list" v-show="index==i" :background="background" :color="color" :menus="el.children"/>
</template> </template>
</menu-item> </menu-item>
</li> </li>
@ -49,18 +49,20 @@ export default {
}, },
methods: { methods: {
onMouseEnter(el, i) { onMouseEnter(el, i) {
this.$emit('mouseenter', el, i);
this.index = i; this.index = i;
}, },
onMouseLeave(el, i) { onMouseLeave(el, i) {
this.$emit('mouseleave', el, i);
this.index = -1; this.index = -1;
console.log(999999999999999)
}, },
onClick(el, i) { onClick(el, i) {
this.$emit('click', el, i);
if (el.disabled) return; if (el.disabled) return;
if (el.handle) { if (el.handle) {
el.handle(el); el.handle(el);
this.$emit('close', el, i) this.onMouseLeave(el, i);
this.index = -1;
} }
} }
} }

View File

@ -4,11 +4,10 @@
<menu-item :menu="el" <menu-item :menu="el"
:check="active==i" :check="active==i"
@click="onClick(el, i)" @click="onClick(el, i)"
@close="onMouseEnter(el, i)"
@mouseenter="onMouseEnter(el, i)" @mouseenter="onMouseEnter(el, i)"
@mouseleave="onMouseLeave(el, i)" :color="color" > @mouseleave="onMouseLeave(el, i)" :color="color" >
<template v-if="el.children&&el.children.length" slot="append"> <template v-if="el.children&&el.children.length" slot="append">
<menu-list style="transform: translateY(-3px);" v-if="index==i" :menus="el.children" :background="background" :color="color" :elMenuClass="elMenuClass"/> <menu-list style="transform: translateY(-3px);" v-show="index==i" :menus="el.children" :background="background" :color="color" :elMenuClass="elMenuClass"/>
</template> </template>
</menu-item> </menu-item>
</div> </div>
@ -59,13 +58,15 @@ export default {
if (el.disabled) return; if (el.disabled) return;
if (el.handle) { if (el.handle) {
el.handle(el); el.handle(el);
this.onMouseLeave(); this.onMouseLeave(el, i);
} }
}, },
onMouseEnter(el, i) { onMouseEnter(el, i) {
this.index = i; this.index = i;
console.log(333333333333333);
}, },
onMouseLeave(el, i) { onMouseLeave(el, i) {
console.log(444444444444444);
this.index = -1; this.index = -1;
} }
} }