first commit
此提交包含在:
@@ -0,0 +1,279 @@
|
||||
;!function (e) {
|
||||
"use strict";
|
||||
var _ws, n = function () {
|
||||
this.v = "1.0.0";
|
||||
this.busiMessageUrl = "http://192.168.3.115:9201/api-busi/messageBusi/readMessage/";
|
||||
}, _url, _status, _lock = false, _id, _message = new Array(), _nowMessage;
|
||||
var _onopen = function (event) {
|
||||
_status = "open";
|
||||
console.log("连接成功");
|
||||
}, _onerror = function (event) {
|
||||
_status = "error";
|
||||
console.log("连接出错");
|
||||
}, _onmessage = function (event) {
|
||||
var obj = eval("(" + event.data + ")");
|
||||
if(obj !=undefined && obj !=null){
|
||||
if(obj[0].code == 1){
|
||||
// 第一次历史消息查询失败的情况
|
||||
return;
|
||||
}if(obj[0].code == 0){
|
||||
// 第一次历史消息查询成功的情况
|
||||
if(obj[0].data.size == 1){
|
||||
_message.push(obj[0].data.messageBusi);
|
||||
_showMessage();
|
||||
}else if(obj[0].data.size > 1){
|
||||
// 提醒未读消息条数
|
||||
_showHistoryMessage(obj[0].data.size);
|
||||
}
|
||||
|
||||
|
||||
return;
|
||||
}
|
||||
// 实时消息
|
||||
for (var i = 0; i < obj.length; i++) {
|
||||
_message.push(obj[i]);
|
||||
}
|
||||
if (_message.length > 0) {
|
||||
_showMessage();
|
||||
}
|
||||
}
|
||||
console.log("收到消息:" + event.data);
|
||||
}, _onclose = function (event) {
|
||||
_status = "close";
|
||||
console.log("关闭连接");
|
||||
}, _reconnection = function () {
|
||||
if (!'WebSocket' in window) {
|
||||
console.error("浏览器不支持推送消息");
|
||||
return;
|
||||
}
|
||||
_ws = new WebSocket(_url,"message_box");
|
||||
_ws.onopen = _onopen;
|
||||
_ws.onerror = _onerror;
|
||||
_ws.onmessage = _onmessage;
|
||||
_ws.onclose = _onclose;
|
||||
}, _closeHear = function () {
|
||||
if (_id) {
|
||||
clearInterval(_id);
|
||||
}
|
||||
}, _heartCheck = function () {
|
||||
if (_lock) {
|
||||
return;
|
||||
}
|
||||
_lock = true;
|
||||
_closeHear();
|
||||
_id = setInterval(function () {
|
||||
if (_url && _status && _status == "close") {
|
||||
console.log("尝试重连")
|
||||
_reconnection();
|
||||
} else if (_url && _status && _status == "open") {
|
||||
console.log("心跳检测");
|
||||
// _ws.send(new ArrayBuffer(4));
|
||||
_ws.send("ping");
|
||||
}
|
||||
_lock = false;
|
||||
}, 1000 * 60);
|
||||
|
||||
}, _readMsg = function () {
|
||||
try {
|
||||
var xmlHttp = new XMLHttpRequest();
|
||||
xmlHttp.onreadystatechange = function () {
|
||||
//当状态变化时处理的事情
|
||||
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
|
||||
//5.接收响应信息
|
||||
var data = eval("(" + xmlHttp.responseText + ")");
|
||||
if (data.code == 0) {
|
||||
document.getElementById("messageDiv").remove();
|
||||
_showMessage();
|
||||
} else {
|
||||
// 失败后添加至头部
|
||||
_message.unshift(_nowMessage);
|
||||
document.getElementById("messageDiv").remove();
|
||||
_showMessage();
|
||||
}
|
||||
}
|
||||
}
|
||||
xmlHttp.open("POST", myWebSocket.busiMessageUrl + _nowMessage.id, false);
|
||||
//4.发送请求
|
||||
xmlHttp.send();
|
||||
} catch (e) {
|
||||
// 失败后添加至头部
|
||||
_message.unshift(_nowMessage);
|
||||
document.getElementById("messageDiv").remove();
|
||||
_showMessage();
|
||||
}
|
||||
}, _readHistoryMsg = function () {
|
||||
document.getElementById("messageDiv").remove();
|
||||
}, _showHistoryMsg = function () {
|
||||
document.getElementById("messageDiv").remove();
|
||||
document.getElementsByClassName("myMessageBox")[0].click();
|
||||
},_doCopyOrderIdInfo = function (orderId){
|
||||
//复制订单号id
|
||||
var inputEle = document.createElement("input");
|
||||
document.designMode = "on";
|
||||
inputEle.value = orderId;
|
||||
document.body.appendChild(inputEle);
|
||||
inputEle.select();
|
||||
document.execCommand('copy');
|
||||
inputEle.blur();
|
||||
inputEle.style.display = 'none';
|
||||
document.body.removeChild(inputEle);
|
||||
document.designMode = "off";
|
||||
_readMsg();
|
||||
}, _showMessage = function () {
|
||||
setTimeout(function () {
|
||||
if (document.getElementById("messageDiv") != null || _message.length == 0) {
|
||||
return;
|
||||
}
|
||||
_nowMessage = _message.shift();
|
||||
var property = null;
|
||||
if(_nowMessage.property !=undefined){
|
||||
property = JSON.parse(_nowMessage.property);
|
||||
}
|
||||
var messageBody = _nowMessage.messageBody;
|
||||
var orderId = _nowMessage.orderId;
|
||||
var dateStr = _formatDate(new Date(parseInt(_nowMessage.sendTime)));
|
||||
|
||||
var htmls = `
|
||||
<div id="messageDiv" style="width: 500px;border: 1px solid #cecdcd;background-color: #f2f2f2;color: #fff;position: fixed;right: 15px;bottom: 0px;border-radius: 10px;z-index: 999999;">
|
||||
<div style="width: 500px;height: 55px;text-align: center;font-size: 24px;line-height: 50px;border-radius: 5px 5px 0 0;background-color:red;margin-left: -1px;">
|
||||
消息提醒
|
||||
</div>
|
||||
<div style="border: 1px solid #000;border-radius: 11px;margin: 10px;text-align: center;background-color: #fff;color: #000;font-size: 20px;padding:20px;">
|
||||
${messageBody}
|
||||
</div>
|
||||
<div style="display: flex;justify-content: center;">
|
||||
<span style="color: black;font-size: 16px;margin: 15px;float: left;">提醒发送人:<span>${_nowMessage.producerOperateName ? _nowMessage.producerOperateName : "系统"}</span></span>
|
||||
<span style="color: black;font-size: 16px;margin: 15px;float: right;margin-left: 40px;">消息时间:${dateStr}</span>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: center;">
|
||||
<div onclick="myWebSocket.readHistoryMsg()" style="width: 120px;height: 40px;border-radius: 5px;background-color:#009966;text-align: center;line-height: 40px;color: #fff;float: left;margin: 10px;cursor:pointer;">知道了</div>
|
||||
<div onclick="myWebSocket.doCopyOrderIdInfo(${orderId});" style="width: 120px;height: 40px;border-radius: 5px;background-color:#199ed8;text-align: center;line-height: 40px;color: #fff;float: right;margin: 10px;cursor:pointer;margin-left:50px;">点击复制单号</div>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
document.body.insertAdjacentHTML("beforeend", htmls);
|
||||
}, 2000)
|
||||
}, _showHistoryMessage = function (size) {
|
||||
var dateStr = _formatDate(new Date());
|
||||
var htmls = `
|
||||
<div id="messageDiv" style="width: 500px;border: 1px solid #cecdcd;background-color: #f2f2f2;color: #fff;position: fixed;right: 15px;bottom: 0px;border-radius: 10px;z-index: 999999;">
|
||||
<div style="width: 500px;height: 55px;text-align: center;font-size: 24px;line-height: 50px;border-radius: 5px 5px 0 0;background-color:red;margin-left: -1px;">
|
||||
消息提醒
|
||||
</div>
|
||||
<div style="border: 1px solid #000;border-radius: 11px;margin: 10px;text-align: center;background-color: #fff;color: #000;font-size: 20px;padding:20px;">
|
||||
您有${size}条消息未读
|
||||
</div>
|
||||
<div style="display: flex;justify-content: center;">
|
||||
<span style="color: black;font-size: 16px;margin: 15px;float: left;">提醒发送人:<span>系统</span></span>
|
||||
<span style="color: black;font-size: 16px;margin: 15px;float: right;margin-left: 40px;">消息时间:${dateStr}</span>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: center;">
|
||||
<div onclick="myWebSocket.readHistoryMsg()" style="width: 120px;height: 40px;border-radius: 5px;background-color:#009966;text-align: center;line-height: 40px;color: #fff;float: left;margin: 10px;cursor:pointer;">知道了</div>
|
||||
<div onclick="myWebSocket.showHistoryMsg();" style="width: 120px;height: 40px;border-radius: 5px;background-color:#169BD5;text-align: center;line-height: 40px;color: #fff;float: right;margin: 10px;cursor:pointer;margin-left:50px;">查看消息</div>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
document.body.insertAdjacentHTML("beforeend", htmls);
|
||||
}, _utf8ByteToUnicodeStr = function (utf8Bytes) {
|
||||
var unicodeStr = "";
|
||||
for (var pos = 0; pos < utf8Bytes.length;) {
|
||||
var flag = utf8Bytes[pos];
|
||||
var unicode = 0;
|
||||
if ((flag >>> 7) === 0) {
|
||||
unicodeStr += String.fromCharCode(utf8Bytes[pos]);
|
||||
pos += 1;
|
||||
|
||||
} else if ((flag & 0xFC) === 0xFC) {
|
||||
unicode = (utf8Bytes[pos] & 0x3) << 30;
|
||||
unicode |= (utf8Bytes[pos + 1] & 0x3F) << 24;
|
||||
unicode |= (utf8Bytes[pos + 2] & 0x3F) << 18;
|
||||
unicode |= (utf8Bytes[pos + 3] & 0x3F) << 12;
|
||||
unicode |= (utf8Bytes[pos + 4] & 0x3F) << 6;
|
||||
unicode |= (utf8Bytes[pos + 5] & 0x3F);
|
||||
unicodeStr += String.fromCharCode(unicode);
|
||||
pos += 6;
|
||||
|
||||
} else if ((flag & 0xF8) === 0xF8) {
|
||||
unicode = (utf8Bytes[pos] & 0x7) << 24;
|
||||
unicode |= (utf8Bytes[pos + 1] & 0x3F) << 18;
|
||||
unicode |= (utf8Bytes[pos + 2] & 0x3F) << 12;
|
||||
unicode |= (utf8Bytes[pos + 3] & 0x3F) << 6;
|
||||
unicode |= (utf8Bytes[pos + 4] & 0x3F);
|
||||
unicodeStr += String.fromCharCode(unicode);
|
||||
pos += 5;
|
||||
|
||||
} else if ((flag & 0xF0) === 0xF0) {
|
||||
unicode = (utf8Bytes[pos] & 0xF) << 18;
|
||||
unicode |= (utf8Bytes[pos + 1] & 0x3F) << 12;
|
||||
unicode |= (utf8Bytes[pos + 2] & 0x3F) << 6;
|
||||
unicode |= (utf8Bytes[pos + 3] & 0x3F);
|
||||
unicodeStr += String.fromCharCode(unicode);
|
||||
pos += 4;
|
||||
|
||||
} else if ((flag & 0xE0) === 0xE0) {
|
||||
unicode = (utf8Bytes[pos] & 0x1F) << 12;
|
||||
;
|
||||
unicode |= (utf8Bytes[pos + 1] & 0x3F) << 6;
|
||||
unicode |= (utf8Bytes[pos + 2] & 0x3F);
|
||||
unicodeStr += String.fromCharCode(unicode);
|
||||
pos += 3;
|
||||
|
||||
} else if ((flag & 0xC0) === 0xC0) { //110
|
||||
unicode = (utf8Bytes[pos] & 0x3F) << 6;
|
||||
unicode |= (utf8Bytes[pos + 1] & 0x3F);
|
||||
unicodeStr += String.fromCharCode(unicode);
|
||||
pos += 2;
|
||||
|
||||
} else {
|
||||
unicodeStr += String.fromCharCode(utf8Bytes[pos]);
|
||||
pos += 1;
|
||||
}
|
||||
}
|
||||
return unicodeStr;
|
||||
}, _formatDate = function (now) {
|
||||
var year = now.getFullYear(); //取得4位数的年份
|
||||
var month = now.getMonth() + 1; //取得日期中的月份,其中0表示1月,11表示12月
|
||||
var date = now.getDate(); //返回日期月份中的天数(1到31)
|
||||
var hour = now.getHours(); //返回日期中的小时数(0到23)
|
||||
var minute = now.getMinutes(); //返回日期中的分钟数(0到59)
|
||||
var second = now.getSeconds(); //返回日期中的秒数(0到59)
|
||||
if (month < 10) {
|
||||
month = "0" + month;
|
||||
}
|
||||
if (date < 10) {
|
||||
date = "0" + date;
|
||||
}
|
||||
if (hour < 10) {
|
||||
hour = "0" + hour;
|
||||
}
|
||||
if (minute < 10) {
|
||||
minute = "0" + minute;
|
||||
}
|
||||
if (second < 10) {
|
||||
second = "0" + second;
|
||||
}
|
||||
return year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
|
||||
};
|
||||
n.prototype.init = function (url) {
|
||||
if (!'WebSocket' in window) {
|
||||
console.error("浏览器不支持推送消息");
|
||||
return;
|
||||
}
|
||||
_url = url;
|
||||
_ws = new WebSocket(_url,"message_box");
|
||||
_ws.onopen = _onopen;
|
||||
_ws.onerror = _onerror;
|
||||
_ws.onmessage = _onmessage;
|
||||
_ws.onclose = _onclose;
|
||||
window.onbeforeunload = function (event) {
|
||||
_ws.close();
|
||||
};
|
||||
_heartCheck();
|
||||
}, n.prototype.close = function () {
|
||||
_closeHear();
|
||||
if(_ws){
|
||||
_ws.close();
|
||||
}
|
||||
}, n.prototype.reconnection = _reconnection, n.prototype.readMsg = _readMsg, n.prototype.doCopyOrderIdInfo = _doCopyOrderIdInfo, n.prototype.readHistoryMsg = _readHistoryMsg,n.prototype.showHistoryMsg = _showHistoryMsg;
|
||||
e.myWebSocket = new n;
|
||||
}(window);
|
||||
新增問題並參考
封鎖使用者