Update modal.vue

This commit is contained in:
syuilo 2020-09-05 22:06:33 +09:00
parent 32c4b079ba
commit a965fac82a
1 changed files with 7 additions and 5 deletions

View File

@ -1,11 +1,13 @@
<template> <template>
<div class="mk-modal" v-hotkey.global="keymap" :style="{ pointerEvents: showing ? 'auto' : 'none' }"> <div class="mk-modal" v-hotkey.global="keymap" :style="{ pointerEvents: showing ? 'auto' : 'none' }">
<transition :name="$store.state.device.animation ? 'bg-fade' : ''" appear> <transition :name="$store.state.device.animation ? 'bg-fade' : ''" appear>
<div class="bg _modalBg" ref="bg" v-if="showing" @click="$emit('click')"></div> <div class="bg _modalBg" v-if="showing" @click="$emit('click')"></div>
</transition>
<transition :name="$store.state.device.animation ? 'modal' : ''" appear @after-leave="$emit('closed')">
<div class="content" ref="content" v-if="showing" @click.self="$emit('click')"><slot></slot></div>
</transition> </transition>
<div class="content" @click.self="$emit('click')">
<transition :name="$store.state.device.animation ? 'modal' : ''" appear @after-leave="$emit('closed')">
<slot v-if="showing"></slot>
</transition>
</div>
</div> </div>
</template> </template>
@ -13,7 +15,7 @@
import { defineComponent } from 'vue'; import { defineComponent } from 'vue';
export default defineComponent({ export default defineComponent({
emits: ['click', 'esc'], emits: ['click', 'esc', 'closed'],
props: { props: {
showing: { showing: {
type: Boolean, type: Boolean,