<template>
    <div class="hide">
        <div class="row" ref="content">
            <div class="col no-padding">
                <div class="row">
                    <div class="col all-caps fs-13 bold" ref="title"></div>
                </div>
                <div class="row fs-12 m-t-5">
                    <div class="col" ref="message"></div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        data() {
            return {
                title: '',
                message: ''
            }
        },
        methods: {
            execute(){
                this.$refs.title.innerHTML = this.title;
                this.$refs.message.innerHTML = this.message;

                let content = this.$refs.content;

                new Noty({
                    type: 'success',
                    text: content.innerHTML.toString(),
                    timeout: 5000,
                    closeWith: ['button'],
                    layout: "bottomRight",
                    theme: "metroui"
                }).show();
            }
        }
    }
</script>