/*
|
* @Author: your name
|
* @Date: 2022-04-13 15:55:32
|
* @LastEditTime: 2022-04-13 15:55:34
|
* @LastEditors: Please set LastEditors
|
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
* @FilePath: \stagefull\force-app\main\default\staticresources\alertJs\showMessageLWC.js
|
*/
|
const message = {
|
background: '',
|
outside: '',
|
inside: '',
|
insideSetTime: '',
|
body: '',
|
time: 0,
|
run(msg = "success", type = 'success', time = 2000) {
|
this.time = time;
|
this.background = this.backgroundCheck(type)
|
this.body = document.body;
|
let id = 'inside_box' + Date.now();
|
let outsideShow = document.getElementById('message_box_show');
|
if (outsideShow != null) {
|
this.inside = document.createElement('div');
|
this.inside.setAttribute('class', 'message_box_inside cc-display')
|
this.inside.setAttribute('id', id)
|
this.inside.style = 'border-radius: 5px;color: #FFF;cursor: pointer;display: inline-block;font-size: 12px;height: 40px;line-height: 34px;min-width: 110px;padding: 0 10px 0 10px;text-align: left;text-decoration: none;-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true)";zoom: 1;filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true);-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true)";filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true);-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);-webkit-box-shadow: 0px 2px 2px rgb(0 0 0 / 20%);box-shadow: 0px 2px 2px rgb(0 0 0 / 20%);';
|
this.inside.style.backgroundColor = this.background;
|
this.inside.style.border = '2px solid ' + this.background;
|
this.inside.innerHTML = `<span>${msg}</span>`
|
outsideShow.appendChild(this.inside);
|
} else {
|
this.outside = document.createElement('div');
|
this.outside.setAttribute('id', 'message_box_outside')
|
this.outside.setAttribute('class', 'cc-display')
|
this.outside.style = 'position: fixed;top: 40px;left: 50%;transform: translate(-50%, -50%);z-index: 2000;';
|
outsideShow = document.createElement('div');
|
outsideShow.setAttribute('id', 'message_box_show');
|
this.inside = document.createElement('div');
|
this.inside.setAttribute('class', 'message_box_inside cc-display')
|
this.inside.setAttribute('id', id)
|
this.inside.style = 'border-radius: 5px;color: #FFF;cursor: pointer;display: inline-block;font-size: 12px;height: 40px;line-height: 34px;min-width: 110px;padding: 0 10px 0 10px;text-align: left;text-decoration: none;-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true)";zoom: 1;filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true);-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true)";filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true);-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);-webkit-box-shadow: 0px 2px 2px rgb(0 0 0 / 20%);box-shadow: 0px 2px 2px rgb(0 0 0 / 20%);';
|
this.inside.style.backgroundColor = this.background;
|
this.inside.style.border = '2px solid ' + this.background;
|
this.inside.innerHTML = `<span>${msg}</span>`
|
outsideShow.appendChild(this.inside);
|
this.outside.appendChild(outsideShow);
|
this.body.appendChild(this.outside);
|
}
|
this[id] = this.insideTime(this.inside, outsideShow);
|
this.boxShowTime(this.inside, id, outsideShow);
|
},
|
boxShowTime(inside, insideSetTime, outsideShow) {
|
inside.addEventListener('mouseleave', () => {
|
this[insideSetTime] = this.insideTime(inside, outsideShow);
|
})
|
inside.addEventListener('mouseenter', () => {
|
clearTimeout(this[insideSetTime]);
|
})
|
},
|
insideTime(inside, outsideShow) {
|
let insideSetTime = setTimeout(() => {
|
outsideShow.removeChild(inside);
|
}, this.time);
|
return insideSetTime;
|
},
|
backgroundCheck(type) {
|
if (type === 'success') return '#67C23A';
|
if (type === 'error') return '#F56C6C';
|
if (type === 'warning') return '#E6A23C';
|
return '#909399';
|
},
|
}
|
export { message };
|