eiru_pos/src/components/modals/ProductModal.vue

<template lang="pug">
    modal(name='product-modal' transition='nice-modal-fade' @before-close='beforeClose' :classes="['v--modal', 'product-modal']")
        product-form(title='Nuevo Producto' @onAccept='onAccept' @onCancel='onCancel')
</template>

<script>
    import ProductForm from '@@/forms/ProductForm'

    export default {
        components: {
            ProductForm
        },
        props: {
            title: {
                type: String,
                default: ''
            },
            show: {
                type: Boolean,
                default: false
            }
        },
        watch: {
            show(value) {
                if (!value) {
                    this.$modal.hide('product-modal')
                    return
                }

                this.$modal.show('product-modal')
            }
        },
        methods: {
            beforeClose(e) {
                if (this.show) {
                    e.stop()
                }
            },
            onAccept(value) {
                this.$emit('onAccept', value)
            },
            onCancel() {
                this.$emit('onCancel')
            }
        }
    }
</script>

<style lang="sass">
</style>