4dkankan-components/packages/components/basic/dialog/src/confirm.vue

<template>
    <ui-dialog>
        <template #header>
            <span>{{ title }}</span>
            <i class="iconfont icon-close" @click="close('no')"></i>
        </template>
        <template v-if="$slots.content">
            <slot name="content"></slot>
        </template>
        <template v-else>
            <div class="message" v-html="content"></div>
        </template>
        <template #footer v-if="!hideFoot">
            <ui-button v-if="!single" type="cancel" @click="close('no')">{{ noText }}</ui-button>
            <ui-button type="primary" @click="close('ok')">{{ okText }}</ui-button>
        </template>
    </ui-dialog>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import { isFunction, omit } from '@kankan/utils'

export default defineComponent({
    name: 'UIConfirm',
    props: {
        title: {
            type: String,
            default: '提示',
        },
        okText: {
            type: String,
            default: '确定',
        },
        noText: {
            type: String,
            default: '取消',
        },
        single: {
            type: Boolean,
            default: false,
        },
        hideFoot: {
            type: Boolean,
            default: false,
        },
        func: Function,
        content: String,
        destroy: Function,
    },
    setup: function (props, _) {
        const close = result => {
            if (isFunction(props.func) && props.func(result) === false) {
                return
            }
            isFunction(props.destroy) && props.destroy()
        }
        return {
            ...omit(props, 'destroy', 'func'),
            close,
        }
    },
})
</script>