fe / yohobuy-node · Commits

Go to a project

Authored by 徐炜
Commit f416383afdbdd44987c9fd60db1b7520c15964af 1 parent c0d8a298

Babel 翻译

Inline Side-by-side
Showing 1 changed file with 95 additions and 196 deletions
'use strict';
/**
* 在线客服客户页
*
... ... @@ -43,8 +45,8 @@ var allRTs,
var processInfo = {
scrollLoad: false,
manual: false,
promoter: 1, // 评论发起者 1：客户自己 2：客服
savedEval: false // 是否保存过评论
promoter: 1, // 评论发起者 1：客户自己 2：客服
savedEval: false // 是否保存过评论
};
var key,
... ... @@ -144,12 +146,9 @@ function pageInit() {
* @param msg 具体消息
*/
function systemTip(type, msg) {
var tip,
liHtml;
var tipMap = {
var tip, liHtml;
};
var tipMap = {};
if (type) {
tip = tipMap[type];
... ... @@ -157,12 +156,7 @@ function pageInit() {
tip = msg;
}
liHtml =
`<div class="list-item">
<p class="push-tip">
<span class="tip">${tip}</span>
</p>
</div>`;
liHtml = '<div class="list-item">\n <p class="push-tip">\n <span class="tip">' + tip + '</span>\n </p>\n </div>';
// 添加消息
$msgList.append(liHtml);
... ... @@ -205,7 +199,6 @@ function pageInit() {
socketConfCM.message.type = msgType || 1;
socketChat.send(socketConfCM);
$area.val('');
} else {
socketConfCM.type = allRTs.CU_SEND;
socketConfCM.uuid = uuid.v4();
... ... @@ -326,36 +319,22 @@ function pageInit() {
switch (msgType) {
case OUT_SERVICE: // 0是没上班
liHtml =
`<div class="list-item">
<p class="push-tip">
<span class="tip">${message.content}您也可以选择<a class="leave-msg">留言</a></span>
</p>
</div>`;
case OUT_SERVICE:
// 0是没上班
liHtml = '<div class="list-item">\n <p class="push-tip">\n <span class="tip">' + message.content + '\u60A8\u4E5F\u53EF\u4EE5\u9009\u62E9<a class="leave-msg">\u7559\u8A00</a></span>\n </p>\n </div>';
break;
case LINE_UP: // 1是需要排队
liHtml =
`<div class="list-item">
<p class="push-tip">
<span class="tip">
${message.content}您也可以选择<a class="leave-msg">留言</a>！
</span>
</p>
</div>`;
case LINE_UP:
// 1是需要排队
liHtml = '<div class="list-item">\n <p class="push-tip">\n <span class="tip">\n ' + message.content + '\u60A8\u4E5F\u53EF\u4EE5\u9009\u62E9<a class="leave-msg">\u7559\u8A00</a>\uFF01\n </span>\n </p>\n </div>';
// 隐藏人工
$iconMs.hide();
break;
case MANUAL_SERVICE: // 2是接入人工成功
liHtml =
`<div class="list-item">
<p class="push-tip">
<span class="tip">${message.content}</span>
</p>
</div>`;
case MANUAL_SERVICE:
// 2是接入人工成功
liHtml = '<div class="list-item">\n <p class="push-tip">\n <span class="tip">' + message.content + '</span>\n </p>\n </div>';
// 接入人工客服需要评价
processInfo.manual = true;
... ... @@ -365,13 +344,9 @@ function pageInit() {
$iconMs.hide();
break;
case ADMIN_MANUAL_SERVICE: // 3是管理员分配客服成功
liHtml =
`<div class="list-item">
<p class="push-tip">
<span class="tip">${message.content}</span>
</p>
</div>`;
case ADMIN_MANUAL_SERVICE:
// 3是管理员分配客服成功
liHtml = '<div class="list-item">\n <p class="push-tip">\n <span class="tip">' + message.content + '</span>\n </p>\n </div>';
// 接入人工客服需要评价
processInfo.manual = true;
... ... @@ -419,23 +394,13 @@ function pageInit() {
// 图片添加标签
if (msgType === 2) {
message.newContent =
`<img class="img-msg" src="${message.content}">`;
message.newContent = '<img class="img-msg" src="' + message.content + '">';
}
liHtml = `<div class="list-item host">
<img src="${rec.userHead}" class="avatar">
<div class="item-detail">
<span class="time">${rec.userName} ${rec.sendTimeShort}</span>
<div class="msg-bubble">
<div>${message.newContent}</div>
</div>
</div>
</div>`;
liHtml = '<div class="list-item host">\n <img src="' + rec.userHead + '" class="avatar">\n <div class="item-detail">\n <span class="time">' + rec.userName + ' ' + rec.sendTimeShort + '</span>\n <div class="msg-bubble">\n <div>' + message.newContent + '</div>\n </div>\n </div>\n </div>';
$msgList.append(liHtml);
$panelMainBody.scrollTop($panelMainBody[0].scrollHeight);
}
/**
... ... @@ -445,15 +410,7 @@ function pageInit() {
function breakCountdown(message) {
var liHtml;
liHtml =
`<div class="list-item">
<p class="push-tip">
<span class="tip">
${message.content}
<span class="countdown"></span>
</span>
</p>
</div>`;
liHtml = '<div class="list-item">\n <p class="push-tip">\n <span class="tip">\n ' + message.content + '\n <span class="countdown"></span>\n </span>\n </p>\n </div>';
$msgList.append(liHtml);
$panelMainBody.scrollTop($panelMainBody[0].scrollHeight);
... ... @@ -472,18 +429,9 @@ function pageInit() {
message.newContent = emojiPrefix(message.newContent);
if (msgType === 2) {
message.newContent =
`<img class="img-msg" src="${message.content}">`;
message.newContent = '<img class="img-msg" src="' + message.content + '">';
}
liHtml = `<div class="list-item guest">
<img src="${rec.csHead}" class="avatar">
<div class="item-detail">
<span class="time">${rec.csName} ${rec.sendTimeShort}</span>
<div class="msg-bubble">
<div>${message.newContent}</div>
</div>
</div>
</div>`;
liHtml = '<div class="list-item guest">\n <img src="' + rec.csHead + '" class="avatar">\n <div class="item-detail">\n <span class="time">' + rec.csName + ' ' + rec.sendTimeShort + '</span>\n <div class="msg-bubble">\n <div>' + message.newContent + '</div>\n </div>\n </div>\n </div>';
$msgList.append(liHtml);
$panelMainBody.scrollTop($panelMainBody[0].scrollHeight);
... ... @@ -502,7 +450,8 @@ function pageInit() {
// 评价原因
function discontentHtml(len, data) {
var i, r,
var i,
r,
html = '',
ceilRows = Math.ceil(len / 2),
floorRows = Math.floor(len / 2);
... ... @@ -510,38 +459,16 @@ function pageInit() {
if (ceilRows === floorRows) {
for (r = 1, i = 0; r <= ceilRows; r++) {
html +=
`<div class="dis-row">
<span class="type" data-id="${data[i].id}" data-content="${data[i].content}">
${data[i].content}
</span>
<span class="type" data-id="${data[i + 1].id}" data-content="${data[i].content}">
${data[i + 1].content}
</span>
</div>`;
html += '<div class="dis-row">\n <span class="type" data-id="' + data[i].id + '" data-content="' + data[i].content + '">\n ' + data[i].content + '\n </span>\n <span class="type" data-id="' + data[i + 1].id + '" data-content="' + data[i].content + '">\n ' + data[i + 1].content + '\n </span>\n </div>';
i += 2;
}
} else {
for (r = 1, i = 0; r <= ceilRows - 1; r++) {
html +=
`<div class="dis-row">
<span class="type" data-id="${data[i].id}" data-content="${data[i].content}">
${data[i].content}
</span>
<span class="type" data-id="${data[i + 1].id}" data-content="${data[i].content}">
${data[i + 1].content}
</span>
</div>`;
html += '<div class="dis-row">\n <span class="type" data-id="' + data[i].id + '" data-content="' + data[i].content + '">\n ' + data[i].content + '\n </span>\n <span class="type" data-id="' + data[i + 1].id + '" data-content="' + data[i].content + '">\n ' + data[i + 1].content + '\n </span>\n </div>';
i += 2;
}
html +=
`<div class="dis-row">
<span class="type" data-id="${data[len - 1].id}" data-content="${data[i].content}">
${data[len - 1].content}
</span>
</div>`;
html += '<div class="dis-row">\n <span class="type" data-id="' + data[len - 1].id + '" data-content="' + data[i].content + '">\n ' + data[len - 1].content + '\n </span>\n </div>';
}
$evalModal.find('.discontent').empty().append(html);
... ... @@ -554,7 +481,7 @@ function pageInit() {
data: {
conversationId: socketConfCM.conversationId
},
success: function(res) {
success: function success(res) {
var data = res.data,
len = data.length;
... ... @@ -608,15 +535,7 @@ function pageInit() {
case allTypes.ROBOT_SEND:
rec.csName = rec.csName || '客服机器人';
tipTpl = `<div class="list-item guest">
<img src="${assetsPrefix}/img/service/robot-avatar.png" class="avatar">
<div class="item-detail">
<span class="time">${rec.csName} ${rec.sendTimeShort}</span>
<div class="msg-bubble">
<div>${message.newContent}</div>
</div>
</div>
</div>`;
tipTpl = '<div class="list-item guest">\n <img src="' + assetsPrefix + '/img/service/robot-avatar.png" class="avatar">\n <div class="item-detail">\n <span class="time">' + rec.csName + ' ' + rec.sendTimeShort + '</span>\n <div class="msg-bubble">\n <div>' + message.newContent + '</div>\n </div>\n </div>\n </div>';
break;
case allTypes.CS_SEND:
... ... @@ -643,15 +562,7 @@ function pageInit() {
break;
case allTypes.OFFLINE:
tipTpl =
`<div class="list-item">
<p class="push-tip">
<span class="tip">
${message.content}
<a class="red-tip reconnect">连线客服</a>
</span>
</p>
</div>`;
tipTpl = '<div class="list-item">\n <p class="push-tip">\n <span class="tip">\n ' + message.content + '\n <a class="red-tip reconnect">\u8FDE\u7EBF\u5BA2\u670D</a>\n </span>\n </p>\n </div>';
break;
default:
... ... @@ -668,26 +579,24 @@ function pageInit() {
*/
function connectSocket() {
socketChat.init(Object.assign(originConf, {
onMessage: function(e) {
onMessage: function onMessage(e) {
var jsonString = e.data;
var received = JSON.parse(jsonString);
socketConfCM.conversationId = received.newConversationId !== 0 ?
received.newConversationId :
received.conversationId;
socketConfCM.conversationId = received.newConversationId !== 0 ? received.newConversationId : received.conversationId;
getMessage(received);
},
onClose: function() {
onClose: function onClose() {
$('.connect-fail').fadeIn();
},
connectFailCb: function() {
connectFailCb: function connectFailCb() {
$('.connect-fail').fadeIn();
},
socketClosedCb: function() {
socketClosedCb: function socketClosedCb() {
$('.connect-fail').fadeIn();
}
}));
... ... @@ -712,61 +621,54 @@ function pageInit() {
endTime = msgList[0].sendTime;
if (hasMore) {
for (item of msgList) {
item.message.newContent = emojiPrefix(item.message.newContent);
if (item.message.type === 2) {
item.message.newContent =
['<img class="img-msg" src="', item.message.newContent, '">'].join('');
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try {
for (var _iterator = msgList[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
item = _step.value;
item.message.newContent = emojiPrefix(item.message.newContent);
if (item.message.type === 2) {
item.message.newContent = ['<img class="img-msg" src="', item.message.newContent, '">'].join('');
}
switch (item.type) {
case allRTs.CU_SEND:
// 用户头像处理
if (!item.userHead) {
item.userHead = assetsPrefix + socketConf.defaultUserHead;
}
msgTpl += '<div class="list-item host">\n <img src="' + item.userHead + '" class="avatar">\n <div class="item-detail">\n <span class="time">' + item.userName + ' ' + item.sendTimeShort + '</span>\n <div class="msg-bubble">\n <div>' + item.message.newContent + '</div>\n </div>\n </div>\n </div>';
break;
case allRTs.ROBOT_SEND:
item.csName = item.csName || '客服机器人';
msgTpl = '<div class="list-item guest">\n <img src="' + assetsPrefix + '/img/service/robot-avatar.png" class="avatar">\n <div class="item-detail">\n <span class="time">' + item.csName + ' ' + item.sendTimeShort + '</span>\n <div class="msg-bubble">\n <div>' + item.message.newContent + '</div>\n </div>\n </div>\n </div>';
break;
case allRTs.CS_SEND:
msgTpl += '<div class="list-item guest">\n <img src="' + item.csHead + '" class="avatar">\n <div class="item-detail">\n <span class="time">' + item.csName + ' ' + item.sendTimeShort + '</span>\n <div class="msg-bubble">\n <div>' + item.message.newContent + '</div>\n </div>\n </div>\n </div>';
break;
default:
break;
}
}
switch (item.type) {
case allRTs.CU_SEND:
// 用户头像处理
if (!item.userHead) {
item.userHead = assetsPrefix + socketConf.defaultUserHead;
}
msgTpl +=
`<div class="list-item host">
<img src="${item.userHead}" class="avatar">
<div class="item-detail">
<span class="time">${item.userName} ${item.sendTimeShort}</span>
<div class="msg-bubble">
<div>${item.message.newContent}</div>
</div>
</div>
</div>`;
break;
case allRTs.ROBOT_SEND:
item.csName = item.csName || '客服机器人';
msgTpl =
`<div class="list-item guest">
<img src="${assetsPrefix}/img/service/robot-avatar.png" class="avatar">
<div class="item-detail">
<span class="time">${item.csName} ${item.sendTimeShort}</span>
<div class="msg-bubble">
<div>${item.message.newContent}</div>
</div>
</div>
</div>`;
break;
case allRTs.CS_SEND:
msgTpl +=
`<div class="list-item guest">
<img src="${item.csHead}" class="avatar">
<div class="item-detail">
<span class="time">${item.csName} ${item.sendTimeShort}</span>
<div class="msg-bubble">
<div>${item.message.newContent}</div>
</div>
</div>
</div>`;
break;
default:
break;
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return) {
_iterator.return();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
... ... @@ -792,7 +694,7 @@ function pageInit() {
type: 'GET',
url: urls.msgHistory,
data: data,
success: function(res) {
success: function success(res) {
if (res && res.code === 200) {
hasMore && msgResolve(res.data);
$history.hide();
... ... @@ -802,8 +704,6 @@ function pageInit() {
});
}
// 用户信息获取并初始化socket连接
(function() {
var param = {
... ... @@ -824,7 +724,7 @@ function pageInit() {
connectSocket();
}
});
}());
})();
// tab页title重置
tab.tabVisible(function() {
... ... @@ -901,7 +801,7 @@ function pageInit() {
$btnEval.hide();
processInfo.savedEval = true;
socketConfCM.type = 10; // 评价后通知客服
socketConfCM.type = 10; // 评价后通知客服
socketConfCM.uuid = uuid.v4();
socketChat.send(socketConfCM);
}
... ... @@ -910,7 +810,6 @@ function pageInit() {
mEval.modal('hide');
}
});
});
// 根节点高度设置
... ... @@ -952,10 +851,7 @@ function pageInit() {
time = tag.data('time'),
status = tag.data('status');
var msgContent = ['单号：', no,
'金额：', '￥' + nm,
'下单时间：', time,
'状态：', status];
var msgContent = ['单号：', no, '金额：', '￥' + nm, '下单时间：', time, '状态：', status];
sendMessage(e, 10, msgContent);
});
... ... @@ -1042,7 +938,9 @@ function pageInit() {
// 星评
$document.on('click', '.make-eval .star', function() {
var el, i, len,
var el,
i,
len,
tag = $(this),
index = tag.index(),
$detailReason = $('.detail-reason'),
... ... @@ -1143,7 +1041,8 @@ function pageInit() {
// 关闭聊天窗口
$close.click(function() {
if (processInfo.manual && !processInfo.savedEval) { // 没有保存过评论
if (processInfo.manual && !processInfo.savedEval) {
// 没有保存过评论
showEvalModal();
} else {
window.close();
... ... @@ -1202,7 +1101,7 @@ function pageInit() {
socketConf.servers.push(configDomains.imSocket);
pageInit();
}
}());
})();
}
});
}());
})();
... ...