<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>
      <UIbutton v-if="!single" type="cancel" @click="close('no')">{{ noText }}</UIbutton>
      <UIbutton type="primary" @click="close('ok')">{{ okText }}</UIbutton>
    </template>
  </ui-dialog>
</template>
<script lang="ts">
  // @ts-nocheck
  import { defineComponent } from 'vue';
  import { isFunction, omit } from './utils';
  import UIbutton from '../button';
  export default defineComponent({
    name: 'UiConfirm',
    components: { UIbutton },
    props: {
      title: {
        type: String,
        default: '提示',
      },
      okText: {
        type: String,
        default: '确定',
      },
      noText: {
        type: String,
        default: '取消',
      },
      single: {
        type: Boolean,
        default: false,
      },
      func: Function,
      content: String,
      destroy: Function,
      showCloseIcon: 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>
