This commit is contained in:
syuilo 2018-06-10 03:27:10 +09:00
parent 56df89f8dd
commit 5d01e19ce7
3 changed files with 32 additions and 16 deletions

View file

@ -15,7 +15,20 @@ import Vue from 'vue';
import * as anime from 'animejs';
export default Vue.extend({
props: ['source', 'compact', 'items'],
props: {
source: {
required: true
},
items: {
type: Array,
required: true
},
compact: {
type: Boolean,
required: false,
default: false
}
},
data() {
return {
hukidasi: !this.compact
@ -44,13 +57,13 @@ export default Vue.extend({
top = y;
}
if (left + width > window.innerWidth) {
left = window.innerWidth - width;
if (left + width - window.pageXOffset > window.innerWidth) {
left = window.innerWidth - width + window.pageXOffset;
this.hukidasi = false;
}
if (top + height > window.innerHeight) {
top = window.innerHeight - height;
if (top + height - window.pageYOffset > window.innerHeight) {
top = window.innerHeight - height + window.pageYOffset;
this.hukidasi = false;
}
@ -139,9 +152,13 @@ $border-color = rgba(27, 31, 35, 0.15)
transform-origin center -($balloon-size)
&:before
&:after
content ""
display block
position absolute
pointer-events none
&:before
top -($balloon-size * 2)
left s('calc(50% - %s)', $balloon-size)
border-top solid $balloon-size transparent
@ -150,9 +167,6 @@ $border-color = rgba(27, 31, 35, 0.15)
border-bottom solid $balloon-size $border-color
&:after
content ""
display block
position absolute
top -($balloon-size * 2) + 1.5px
left s('calc(50% - %s)', $balloon-size)
border-top solid $balloon-size transparent

View file

@ -1,6 +1,6 @@
<template>
<div class="mk-note-menu" style="position:initial">
<mk-menu ref="menu" :source="source" :compact="compact" :items="items" @closed="$destroy"/>
<div style="position:initial">
<mk-menu :source="source" :compact="compact" :items="items" @closed="closed"/>
</div>
</template>
@ -63,8 +63,10 @@ export default Vue.extend({
});
},
close() {
this.$refs.menu.close();
closed() {
this.$nextTick(() => {
this.$destroy();
});
}
}
});

View file

@ -23,12 +23,12 @@ export default Vue.extend({
let x = this.x;
let y = this.y;
if (x + width > window.innerWidth) {
x = window.innerWidth - width;
if (x + width - window.pageXOffset > window.innerWidth) {
x = window.innerWidth - width + window.pageXOffset;
}
if (y + height > window.innerHeight) {
y = window.innerHeight - height;
if (y + height - window.pageYOffset > window.innerHeight) {
y = window.innerHeight - height + window.pageYOffset;
}
this.$el.style.left = x + 'px';