dm-vue3-ui/es/modal/index.vue.js

This Components Library will help get you started developing in Vue 3.

import { Button, Modal } from "ant-design-vue/es";
import { defineComponent, openBlock, createBlock, mergeProps, unref, isRef, createSlots, withCtx, renderSlot, createTextVNode, toDisplayString, createVNode } from "vue";
import { useVModel } from "@vueuse/core";
import { $t } from "../i18n/index";
const _sfc_main = /* @__PURE__ */ defineComponent({
  ...{
    name: "dm-modal"
  },
  __name: "index",
  props: {
    modelValue: { type: Boolean },
    title: { default: "" },
    footer: { type: Boolean, default: () => true },
    okText: { default: "" },
    cancelText: { default: "" },
    spinning: { type: Boolean, default: () => false },
    prefixCls: { default: "dm-ui" },
    okButtonProps: { default: () => ({}) },
    cancelButtonProps: { default: () => ({}) }
  },
  emits: ["update:modelValue", "confirm", "cancel"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const modalVisible = useVModel(props, "modelValue", emit);
    const confirmHandler = () => {
      emit("confirm");
    };
    const cancelHandler = (e) => {
      modalVisible.value = false;
      emit("cancel", e);
    };
    return (_ctx, _cache) => {
      const _component_a_button = Button;
      const _component_a_modal = Modal;
      return openBlock(), createBlock(_component_a_modal, mergeProps(
        {
          visible: unref(modalVisible),
          "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => isRef(modalVisible) ? modalVisible.value = $event : null),
          wrapClassName: "dm-modal",
          prefixCls: `${props.prefixCls}-modal`
        },
        !props.footer ? {
          ..._ctx.$attrs,
          footer: props.footer
        } : _ctx.$attrs,
        { onCancel: cancelHandler }
      ), createSlots({
        default: withCtx(() => [
          renderSlot(_ctx.$slots, "default")
        ]),
        _: 2
      }, [
        _ctx.$slots.title || props.title ? {
          name: "title",
          fn: withCtx(() => [
            renderSlot(_ctx.$slots, "title", {}, () => [
              createTextVNode(toDisplayString(props.title), 1)
            ])
          ]),
          key: "0"
        } : void 0,
        props.footer ? {
          name: "footer",
          fn: withCtx(() => [
            renderSlot(_ctx.$slots, "footer", {}, () => [
              createVNode(_component_a_button, mergeProps(props.okButtonProps, {
                loading: props.spinning,
                type: "primary",
                prefixCls: `${props.prefixCls}-btn`,
                onClick: confirmHandler
              }), {
                default: withCtx(() => [
                  createTextVNode(toDisplayString(props.okText || unref($t)("datePicker.confirm")), 1)
                ]),
                _: 1
              }, 16, ["loading", "prefixCls"]),
              createVNode(_component_a_button, mergeProps({
                onClick: _cache[0] || (_cache[0] = ($event) => cancelHandler()),
                prefixCls: `${props.prefixCls}-btn`
              }, props.cancelButtonProps), {
                default: withCtx(() => [
                  createTextVNode(toDisplayString(props.cancelText || unref($t)("cronPicker.cancel")), 1)
                ]),
                _: 1
              }, 16, ["prefixCls"])
            ])
          ]),
          key: "1"
        } : void 0
      ]), 1040, ["visible", "prefixCls"]);
    };
  }
});
const index_vue_vue_type_style_index_0_lang = "";
export {
  _sfc_main as default
};