birdpaper-ui/es/message/src/instance.js

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

var __defProp = Object.defineProperty;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __publicField = (obj, key, value) => {
  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
  return value;
};
import { ref, createVNode, render, reactive } from "vue";
import _sfc_main from "./messageList.vue.js";
import { arrayIndexOf, deepClone } from "../../utils/util.js";
class MessageManager {
  constructor(appContext) {
    __publicField(this, "mask", document.createElement("div"));
    __publicField(this, "messageList");
    /**
     * 添加消息提示
     * @param {MessageItem} config
     * @returns
     */
    __publicField(this, "add", (config) => {
      var _a;
      const id = config.id ?? `_bp_message_${Math.random().toString(36).slice(-8)}`;
      this.mask.setAttribute("class", `bp-mask-message bp-message-${config.position || "top"}`);
      const message = reactive({ id, ...config });
      const updateIdx = arrayIndexOf(this.messageList.value, "id", id);
      updateIdx !== -1 ? this.messageList.value[updateIdx] = config : this.messageList.value.push(message);
      const len = this.messageList.value.length;
      if (len > 1 && ((_a = this.messageList.value[len - 1]) == null ? void 0 : _a.duration) === message.duration) {
        message.duration = message.duration ?? 3e3 + 200 * len;
      }
      return {
        remove: () => this.remove(id)
      };
    });
    /**
     * 移除消息提示
     * @param {string} id 消息id
     */
    __publicField(this, "remove", (id) => {
      for (let i = 0; i < this.messageList.value.length; i++) {
        const { id: itemId } = this.messageList.value[i];
        if (id === itemId) {
          this.messageList.value.splice(i, 1);
          break;
        }
      }
    });
    /** 清除消息列表 */
    __publicField(this, "clear", () => {
      const arr = deepClone(this.messageList.value);
      for (let i = 0; i < arr.length; i++) {
        const element = arr[i];
        this.remove(element.id);
      }
    });
    this.messageList = ref([]);
    this.mask.setAttribute("class", `bp-mask-message`);
    const vm = createVNode(_sfc_main, {
      list: this.messageList.value,
      onRemove: this.remove
    });
    if (appContext) {
      vm.appContext = appContext;
    }
    render(vm, this.mask);
    document.body.appendChild(this.mask);
  }
}
export {
  MessageManager as default
};