birdpaper-ui/es/popconfirm/src/popconfirm.vue2.js

一个通用的 vue3 UI组件库。A common vue3 UI component library.

import { defineComponent, ref } from "vue";
import { vClickOutside } from "../../directives/clickOutside.js";
import { IconInformationFill, IconCheckboxCircleFill, IconCloseCircleFill, IconErrorWarningFill } from "birdpaper-icon";
const _sfc_main = defineComponent({
  name: "Popconfirm",
  props: {
    /**确认框文本内容 */
    content: { type: String, default: "" },
    /** 类型 */
    type: { type: String, default: "info" },
    /** 弹出位置 */
    position: { type: String, default: "top" },
    /** 确认按钮文本 */
    okText: { type: String, default: "确认" },
    /** 取消按钮文本 */
    cancleText: { type: String, default: "取消" },
    /** 触发确定前的回调，返回 false 则中断 */
    onBeforeOk: { type: Function, default: () => true }
  },
  directives: { clickOutside: vClickOutside },
  emits: ["ok", "cancle"],
  setup(props, { emit }) {
    const name = "bp-popconfirm";
    const show = ref(false);
    const iconType = {
      info: IconInformationFill,
      success: IconCheckboxCircleFill,
      error: IconCloseCircleFill,
      warning: IconErrorWarningFill
    };
    const handleCancle = () => {
      show.value = false;
      emit("cancle");
    };
    const okLoading = ref(false);
    const handleOk = async () => {
      try {
        okLoading.value = true;
        const res = await props.onBeforeOk();
        if (!res)
          return;
        show.value = false;
        emit("ok");
      } catch (error) {
        console.log("[ Popconfirm -onBeforeOk error]", error);
      } finally {
        okLoading.value = false;
      }
    };
    return {
      name,
      show,
      okLoading,
      iconType,
      handleCancle,
      handleOk
    };
  }
});
export {
  _sfc_main as default
};