birdpaper-ui
Version:
一个通用的 vue3 UI组件库。A common vue3 UI component library.
70 lines (69 loc) • 2.62 kB
JavaScript
"use strict";
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;
};
const vue = require("vue");
const messageList_vue_vue_type_script_setup_true_name_MessageList_lang = require("./messageList.vue.js");
const util = require("../../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 = vue.reactive({ id, ...config });
const updateIdx = util.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 = util.deepClone(this.messageList.value);
for (let i = 0; i < arr.length; i++) {
const element = arr[i];
this.remove(element.id);
}
});
this.messageList = vue.ref([]);
this.mask.setAttribute("class", `bp-mask-message`);
const vm = vue.createVNode(messageList_vue_vue_type_script_setup_true_name_MessageList_lang, {
list: this.messageList.value,
onRemove: this.remove
});
if (appContext) {
vm.appContext = appContext;
}
vue.render(vm, this.mask);
document.body.appendChild(this.mask);
}
}
module.exports = MessageManager;