<template>
    <div>
        <h-button @click="handleClick" type="primary">基本用法</h-button>
        <br/>
        <br/>
        <h-button @click="handleWithoutTitle" type="primary">无标题</h-button>
        <br/>
        <br/>
        <h-button @click="handleCancel" type="primary">确认和取消</h-button>
        <br/>
        <br/>
        <h-button @click="handleAsync" type="primary">异步关闭</h-button>
        <br/>
        <br/>
        <h-button @click="handleGlobal" type="primary">全局调用</h-button>
    </div>
</template>

<script>
import Dialog from './dialog.js'
import hButton from '../button/';
export default {
    name: "hanzo-dialog",
    data() {
        return {
            show: false
        }
    },
    components: {
        hButton
    },
    methods: {
        handleClick() {
            Dialog.alert({
                title: '标题',
                message: '弹窗内容'
            }).then(() => {
            // on close
            });
        },
        handleWithoutTitle() {
            Dialog.alert({
                message: '弹窗内容'
            }).then(() => {
            // on close
            });
        },
        handleCancel() {
            Dialog.confirm({
                title: '标题',
                message: '弹窗内容'
            }).then(() => {
                // on confirm
            }).catch(() => {
                // on cancel
            });
        },
        beforeClose(action, done) {
            if (action === 'confirm') {
                setTimeout(done, 1000);
            } else {
                done();
            }
        },
        handleAsync() {
            Dialog.confirm({
                title: '标题',
                message: '弹窗内容',
                beforeClose: this.beforeClose
            }).then(() => {
                // on confirm
            }).catch(() => {
                // on cancel
            });
        },
        handleGlobal() {
            Dialog.alert({
                title: '标题',
                message: '弹窗内容'
            }).then(() => {
            // on close
            });
        }
    }
}
</script>