<template>
    <ui-dialog>
        <template #header>
            <span>{{ title }}</span>
            <i v-if="showCloseIcon" class="iconfont icon-close" @click="close" />
        </template>
        <div v-html="content" />
        <template v-if="showFooter" #footer>
            <ui-button type="submit" @click="close">{{ okText }}</ui-button>
        </template>
    </ui-dialog>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import { isFunction, omit } from '@kankan-components/utils'
export default defineComponent({
    name: 'UIAlert',
    props: {
        showCloseIcon: {
            type: Boolean,
            default: true,
        },
        showFooter: {
            type: Boolean,
            default: true,
        },
        title: {
            type: String,
            default: '提示',
        },
        okText: {
            type: String,
            default: '确定',
        },
        func: Function,
        content: String,
        destroy: Function,
    },
    setup(props) {
        const close = () => {
            if (isFunction(props.func) && props.func() === false) {
                return
            }
            isFunction(props.destroy) && props.destroy()
        }
        return {
            ...omit(props, 'destroy', 'func'),
            close,
        }
    },
})
</script>
