vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
109 lines (108 loc) • 3.47 kB
JavaScript
import { Utils as c } from "@vuux/utils";
class i {
static list = [];
static install;
/**
* 创建Toast
*
* @param options 配置
*/
static createToast(t) {
const { type: s, content: a, duration: e = 1e3 } = t, o = document.createElement("div");
return o.classList.add("app-toast"), s === "success" && (o.innerHTML = `
<div class="toast-box">
<div class="toast-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="rgba(255, 255, 255, 0.8)">
<path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z"></path>
</svg>
</div>
<div class="toast-content">${a}</div>
</div>
`), s === "error" && (o.innerHTML = `
<div class="toast-box">
<div class="toast-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="rgba(255, 255, 255, 0.8)">
<path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM12 10.5858L14.8284 7.75736L16.2426 9.17157L13.4142 12L16.2426 14.8284L14.8284 16.2426L12 13.4142L9.17157 16.2426L7.75736 14.8284L10.5858 12L7.75736 9.17157L9.17157 7.75736L12 10.5858Z"></path>
</svg>
</div>
<div class="toast-content">${a}</div>
</div>
`), s === "text" && (o.innerHTML = `
<div class="toast-text">
<div class="content-text">${a}</div>
</div>
`), { toast: o, duration: e };
}
/**
* 添加Toast
*
* @param toast Toast元素
* @param duration 延迟ms
*/
static add(t, s) {
i.list.push(t), document.body.appendChild(t), i.autoClose(t, s);
}
/**
* 移除Toast
*
* @param toast Toast元素
*/
static remove(t) {
const s = i.list.indexOf(t);
s >= 0 && (i.list.splice(s, 1), document.body.removeChild(t));
}
/**
* 自动关闭
*
* @param toast Toast元素
* @param duration 延迟ms
*/
static async autoClose(t, s) {
await c.wait(s + 300), i.remove(t);
}
/**
* @description 显示一般消息
*
* @param content 内容
* @param duration 延迟ms
*/
static open(t, s = 2e3) {
const { toast: a, duration: e } = i.createToast({
type: "text",
content: t,
duration: s
});
i.add(a, e);
}
/**
* @description 显示成功消息
*
* @param content 内容
* @param duration 延迟ms
*/
static success(t, s = 2e3) {
const { toast: a, duration: e } = i.createToast({
type: "success",
content: t,
duration: s
});
i.add(a, e);
}
/**
* @description 显示失败消息
*
* @param content 内容
* @param duration 延迟ms
*/
static error(t, s = 2e3) {
const { toast: a, duration: e } = i.createToast({
type: "error",
content: t,
duration: s
});
i.add(a, e);
}
}
export {
i as default
};