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

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

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

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

<style lang="sass">
    .customer-modal
</style>