61 lines
1.5 KiB
JavaScript
61 lines
1.5 KiB
JavaScript
class Toast {
|
|
constructor() {
|
|
this.body = document.querySelector("body");
|
|
}
|
|
|
|
/**
|
|
* time: 提示显示时间
|
|
* position: 位置 top = 20%, center = 50%, bottom = 20%
|
|
* message: 提示的文字
|
|
* @param option
|
|
*/
|
|
tips(option = {}) {
|
|
var defaultOption = {
|
|
time: 3000,
|
|
position: 'center',
|
|
message: '默认'
|
|
};
|
|
|
|
defaultOption.time = option.time || defaultOption.time;
|
|
defaultOption.position = option.position || defaultOption.position;
|
|
defaultOption.message = option.message || defaultOption.message;
|
|
|
|
var tpl = `<div class="lb-toast" style="${
|
|
defaultOption.position == "bottom"
|
|
? 'bottom: 10%'
|
|
: `top: ${defaultOption.position == "top" ? '10%' : '50%'}`
|
|
}">
|
|
<div class="lb-toast_text">${defaultOption.message}</div>
|
|
</div>`;
|
|
|
|
|
|
this.body.innerHTML += tpl;
|
|
|
|
setTimeout(() => {
|
|
var toast = document.querySelector(".lb-toast");
|
|
console.log(toast)
|
|
this.body.removeChild(toast)
|
|
}, defaultOption.time)
|
|
|
|
}
|
|
|
|
loading() {
|
|
var tpl = `<div class="spinner">
|
|
<div class="rect1"></div>
|
|
<div class="rect2"></div>
|
|
<div class="rect3"></div>
|
|
<div class="rect4"></div>
|
|
<div class="rect5"></div>
|
|
</div>`;
|
|
this.body.innerHTML += tpl;
|
|
}
|
|
|
|
clearLoading() {
|
|
var spinner = document.querySelector(".spinner");
|
|
if (spinner != null) {
|
|
this.body.removeChild(spinner)
|
|
}
|
|
}
|
|
}
|
|
|
|
var toast = new Toast(); |