plus-pro-components/es/components/dialog/src/index.vue2.mjs

Page level components developed based on Element Plus.

import { defineComponent, computed, ref, watchEffect, openBlock, createBlock, unref, mergeProps, createSlots, withCtx, createElementVNode, renderSlot, normalizeStyle, createVNode, createTextVNode, toDisplayString } from 'vue';
import { ElDialog, ElButton } from 'element-plus';
import '../../../hooks/index.mjs';
import { useLocale } from '../../../hooks/useLocale.mjs';

const _hoisted_1 = { class: "plus-dialog-body" };
var _sfc_main = /* @__PURE__ */ defineComponent({
  ...{
    name: "PlusDialog",
    inheritAttrs: false
  },
  __name: "index",
  props: {
    modelValue: { type: Boolean, default: false },
    confirmText: { default: "" },
    cancelText: { default: "" },
    confirmLoading: { type: Boolean, default: false },
    hasFooter: { type: Boolean, default: true },
    footerAlign: { default: "right" },
    top: { default: "15vh" },
    width: { default: "460px" },
    title: { default: "" }
  },
  emits: ["update:modelValue", "cancel", "confirm"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const style = computed(() => ({
      justifyContent: props.footerAlign === "left" ? "flex-start" : props.footerAlign === "center" ? "center" : "flex-end"
    }));
    const subVisible = ref(false);
    const { t } = useLocale();
    watchEffect(() => {
      subVisible.value = props.modelValue;
    });
    const handleConfirm = () => {
      emit("confirm");
    };
    const handleCancel = () => {
      emit("update:modelValue", false);
      emit("cancel");
    };
    return (_ctx, _cache) => {
      return openBlock(), createBlock(unref(ElDialog), mergeProps({
        modelValue: subVisible.value,
        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => subVisible.value = $event),
        top: _ctx.top,
        width: _ctx.width,
        title: _ctx.title || unref(t)("plus.dialog.title"),
        "close-on-click-modal": false,
        "close-on-press-escape": false,
        "append-to-body": false,
        "before-close": handleCancel,
        class: "plus-dialog"
      }, _ctx.$attrs), createSlots({
        default: withCtx(() => [
          createElementVNode("div", _hoisted_1, [
            renderSlot(_ctx.$slots, "default")
          ])
        ]),
        _: 2
        /* DYNAMIC */
      }, [
        _ctx.$slots.header ? {
          name: "header",
          fn: withCtx(() => [
            renderSlot(_ctx.$slots, "header")
          ]),
          key: "0"
        } : void 0,
        _ctx.hasFooter ? {
          name: "footer",
          fn: withCtx(() => [
            createElementVNode(
              "div",
              {
                class: "plus-dialog-footer",
                style: normalizeStyle(style.value)
              },
              [
                renderSlot(_ctx.$slots, "footer", {}, () => [
                  createVNode(unref(ElButton), { onClick: handleCancel }, {
                    default: withCtx(() => [
                      createTextVNode(
                        toDisplayString(_ctx.cancelText || unref(t)("plus.dialog.cancelText")),
                        1
                        /* TEXT */
                      )
                    ]),
                    _: 1
                    /* STABLE */
                  }),
                  createVNode(unref(ElButton), {
                    type: "primary",
                    loading: _ctx.confirmLoading,
                    onClick: handleConfirm
                  }, {
                    default: withCtx(() => [
                      createTextVNode(
                        toDisplayString(_ctx.confirmText || unref(t)("plus.dialog.confirmText")),
                        1
                        /* TEXT */
                      )
                    ]),
                    _: 1
                    /* STABLE */
                  }, 8, ["loading"])
                ])
              ],
              4
              /* STYLE */
            )
          ]),
          key: "1"
        } : void 0
      ]), 1040, ["modelValue", "top", "width", "title"]);
    };
  }
});

export { _sfc_main as default };