yuang-framework-ui-pc/lib/ele-alert/index.cjs

yuang-framework-ui-pc Library

"use strict";
const vue = require("vue");
const elementPlus = require("element-plus");
const icons = require("../icons");
const props = require("./props");
const _sfc_main = vue.defineComponent({
  name: "EleAlert",
  components: {
    ElIcon: elementPlus.ElIcon,
    CloseOutlined: icons.CloseOutlined,
    InfoCircleFilled: icons.InfoCircleFilled,
    CheckCircleFilled: icons.CheckCircleFilled,
    ExclamationCircleFilled: icons.ExclamationCircleFilled,
    CloseCircleFilled: icons.CloseCircleFilled
  },
  props: props.alertProps,
  emits: props.alertEmits,
  setup(props2, { emit, slots }) {
    const visible = vue.ref(true);
    const isRich = vue.computed(() => {
      return props2.description !== false && (!!props2.description || !!slots.default);
    });
    const handleClose = (e) => {
      if (!visible.value || !props2.closable) {
        return;
      }
      visible.value = false;
      emit("close", e);
    };
    const open = () => {
      if (!visible.value) {
        visible.value = true;
      }
    };
    return { visible, isRich, handleClose, open };
  }
});
const _export_sfc = (sfc, props2) => {
  const target = sfc.__vccOpts || sfc;
  for (const [key, val] of props2) {
    target[key] = val;
  }
  return target;
};
const _hoisted_1 = { key: 0 };
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_CheckCircleFilled = vue.resolveComponent("CheckCircleFilled");
  const _component_ExclamationCircleFilled = vue.resolveComponent("ExclamationCircleFilled");
  const _component_CloseCircleFilled = vue.resolveComponent("CloseCircleFilled");
  const _component_InfoCircleFilled = vue.resolveComponent("InfoCircleFilled");
  const _component_ElIcon = vue.resolveComponent("ElIcon");
  const _component_CloseOutlined = vue.resolveComponent("CloseOutlined");
  return vue.openBlock(), vue.createBlock(vue.Transition, { name: _ctx.transitionName }, {
    default: vue.withCtx(() => [
      _ctx.visible ? (vue.openBlock(), vue.createElementBlock("div", {
        key: 0,
        class: vue.normalizeClass([
          "ele-alert",
          { "is-success": _ctx.type === "success" },
          { "is-warning": _ctx.type === "warning" },
          { "is-error": _ctx.type === "error" },
          { "is-dark": _ctx.effect === "dark" },
          { "is-center": _ctx.center },
          { "is-rich": _ctx.isRich }
        ])
      }, [
        _ctx.showIcon ? (vue.openBlock(), vue.createElementBlock("div", {
          key: 0,
          class: "ele-alert-icon",
          style: vue.normalizeStyle(_ctx.iconStyle)
        }, [
          vue.renderSlot(_ctx.$slots, "icon", {}, () => [
            vue.createVNode(_component_ElIcon, vue.normalizeProps(vue.guardReactiveProps(_ctx.iconProps || {})), {
              default: vue.withCtx(() => [
                _ctx.type === "success" ? (vue.openBlock(), vue.createBlock(_component_CheckCircleFilled, { key: 0 })) : _ctx.type === "warning" ? (vue.openBlock(), vue.createBlock(_component_ExclamationCircleFilled, { key: 1 })) : _ctx.type === "error" ? (vue.openBlock(), vue.createBlock(_component_CloseCircleFilled, { key: 2 })) : (vue.openBlock(), vue.createBlock(_component_InfoCircleFilled, { key: 3 }))
              ]),
              _: 1
            }, 16)
          ])
        ], 4)) : vue.createCommentVNode("", true),
        vue.createElementVNode("div", {
          class: "ele-alert-body",
          style: vue.normalizeStyle(_ctx.bodyStyle)
        }, [
          _ctx.title || _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("div", {
            key: 0,
            class: "ele-alert-title",
            style: vue.normalizeStyle(_ctx.titleStyle)
          }, [
            vue.renderSlot(_ctx.$slots, "title", {}, () => [
              vue.createTextVNode(vue.toDisplayString(_ctx.title), 1)
            ])
          ], 4)) : vue.createCommentVNode("", true),
          _ctx.isRich ? (vue.openBlock(), vue.createElementBlock("div", {
            key: 1,
            class: "ele-alert-text",
            style: vue.normalizeStyle(_ctx.descriptionStyle)
          }, [
            vue.renderSlot(_ctx.$slots, "default", {}, () => [
              vue.createTextVNode(vue.toDisplayString(_ctx.description === true ? "" : _ctx.description), 1)
            ])
          ], 4)) : vue.createCommentVNode("", true)
        ], 4),
        vue.renderSlot(_ctx.$slots, "action"),
        _ctx.closable ? (vue.openBlock(), vue.createElementBlock("div", {
          key: 1,
          class: "ele-alert-close",
          style: vue.normalizeStyle(_ctx.closeIconStyle),
          onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClose && _ctx.handleClose(...args))
        }, [
          vue.renderSlot(_ctx.$slots, "closeIcon", {}, () => [
            _ctx.closeText ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1, vue.toDisplayString(_ctx.closeText), 1)) : (vue.openBlock(), vue.createBlock(_component_ElIcon, vue.normalizeProps(vue.mergeProps({ key: 1 }, _ctx.closeIconProps || {})), {
              default: vue.withCtx(() => [
                vue.createVNode(_component_CloseOutlined)
              ]),
              _: 1
            }, 16))
          ])
        ], 4)) : vue.createCommentVNode("", true)
      ], 2)) : vue.createCommentVNode("", true)
    ]),
    _: 3
  }, 8, ["name"]);
}
const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
module.exports = index;