This commit is contained in:
syuilo
2018-06-08 11:46:45 +09:00
parent 335ab5ab54
commit ebeb7f8578
11 changed files with 117 additions and 81 deletions

View File

@ -1,5 +1,5 @@
<template>
<div class="context-menu" :style="{ left: `${x}px`, top: `${y}px` }" @contextmenu.prevent="() => {}">
<div class="context-menu" @contextmenu.prevent="() => {}">
<x-menu :menu="menu" @x="click"/>
</div>
</template>
@ -17,6 +17,23 @@ export default Vue.extend({
props: ['x', 'y', 'menu'],
mounted() {
this.$nextTick(() => {
const width = this.$el.offsetWidth;
const height = this.$el.offsetHeight;
let x = this.x;
let y = this.y;
if (x + width > window.innerWidth) {
x = window.innerWidth - width;
}
if (y + height > window.innerHeight) {
y = window.innerHeight - height;
}
this.$el.style.left = x + 'px';
this.$el.style.top = y + 'px';
Array.from(document.querySelectorAll('body *')).forEach(el => {
el.addEventListener('mousedown', this.onMousedown);
});
@ -38,7 +55,7 @@ export default Vue.extend({
return false;
},
click(item) {
if (item.onClick) item.onClick();
if (item.action) item.action();
this.close();
},
close() {
@ -59,7 +76,6 @@ root(isDark)
$item-height = 38px
$padding = 10px
display none
position fixed
top 0
left 0