...
|
...
|
@@ -10,27 +10,41 @@ var $ = require('yoho-jquery'), |
|
|
socketChat = require('./socket-chat'),
|
|
|
common = require('../../../config/common'),
|
|
|
countdown = require('./countdown'),
|
|
|
emojiMap = require('./emoji-map'),
|
|
|
uuid = require('uuid');
|
|
|
|
|
|
require('bootstrap');
|
|
|
require('../common');
|
|
|
require('../plugins/jquery.qupload');
|
|
|
require('blueimp-file-upload/js/jquery.iframe-transport');
|
|
|
require('blueimp-file-upload/js/jquery.fileupload');
|
|
|
|
|
|
|
|
|
// 记录鼠标位置
|
|
|
var cursorPo;
|
|
|
var uid,
|
|
|
cursorPo;
|
|
|
|
|
|
|
|
|
var $sendOrder = $('.send-order'),
|
|
|
$rightHeadTab = $('.right-head .tab'),
|
|
|
$panelMainBody = $('.panel-main .main-body'),
|
|
|
$msgList = $('.msg-list'),
|
|
|
$leaveMsg = $('#leaveMsg'),
|
|
|
$sendImgInput = $('#sendImg');
|
|
|
|
|
|
|
|
|
var operation = {
|
|
|
savedEval: false
|
|
|
};
|
|
|
|
|
|
|
|
|
var uid = $('input[name=uid]').val();
|
|
|
uid = $('input[name=uid]').val();
|
|
|
socketConf.conversationMessage.userId = uid;
|
|
|
|
|
|
var cM = socketConf.conversationMessage;
|
|
|
|
|
|
var urls = {
|
|
|
leaveMsg: '/leavemessage/saveLeavemessage',
|
|
|
evalReason: '/evalute/queryEvaluteReason',
|
|
|
makeEval: '/evalute/saveEvalute'
|
|
|
};
|
|
|
|
...
|
...
|
@@ -38,114 +52,6 @@ for (var key in urls) { |
|
|
urls[key] = common.domains.bjIm + urls[key];
|
|
|
}
|
|
|
|
|
|
|
|
|
/**
|
|
|
* 切换显示
|
|
|
*/
|
|
|
function switchTab(e) {
|
|
|
var tag = $(e.target);
|
|
|
|
|
|
if (tag.hasClass('active')) return;
|
|
|
|
|
|
var actOrder = tag.hasClass('order');
|
|
|
|
|
|
if (actOrder) {
|
|
|
$('.right-head .tab.order').toggleClass('active');
|
|
|
$('.right-head .tab.qa').toggleClass('active');
|
|
|
$('.right-body' + '.order').show();
|
|
|
$('.right-body' + '.qa').hide();
|
|
|
$('.right-footer' + '.qa').hide();
|
|
|
} else {
|
|
|
$('.right-head .tab.order').toggleClass('active');
|
|
|
$('.right-head .tab.qa').toggleClass('active');
|
|
|
$('.right-body' + '.order').hide();
|
|
|
$('.right-body' + '.qa').show();
|
|
|
$('.right-footer' + '.qa').show();
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 打星评论
|
|
|
* @param e
|
|
|
*/
|
|
|
function starComment(e) {
|
|
|
var tag = $(e.target);
|
|
|
var index = tag.index();
|
|
|
var list = $('.make-eval .stars .star');
|
|
|
|
|
|
var el;
|
|
|
for (var i = 0, len = list.length; i < len; i++) {
|
|
|
el = $(list[i]);
|
|
|
el.index() <= index && el.addClass('positive');
|
|
|
el.index() > index && el.removeClass('positive');
|
|
|
}
|
|
|
|
|
|
var starText = {
|
|
|
0: '非常不满意',
|
|
|
1: '不满意',
|
|
|
2: '一般',
|
|
|
3: '满意',
|
|
|
4: '非常满意'
|
|
|
};
|
|
|
|
|
|
var textEl = $('.make-eval .star-text');
|
|
|
textEl.text(starText[index]);
|
|
|
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 选择不满意的类型
|
|
|
* @param e
|
|
|
*/
|
|
|
function typeComment(e) {
|
|
|
$(e.target).toggleClass('chosen');
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 消息编辑框功能区
|
|
|
* @param e
|
|
|
*/
|
|
|
function dispatchUtil(e) {
|
|
|
var cTa = $(e.currentTarget),
|
|
|
index = cTa.index(),
|
|
|
comp = $('.emoji-component');
|
|
|
|
|
|
var utilMap = {
|
|
|
0: function() {
|
|
|
var topPo = cTa.offset().top,
|
|
|
leftPo = cTa.offset().left,
|
|
|
cTaHeight = cTa.height();
|
|
|
|
|
|
var isNone = comp.css('display') === 'none';
|
|
|
|
|
|
comp.css({display: 'inline-block'});
|
|
|
var compHeight = comp.height();
|
|
|
isNone && comp.css({
|
|
|
top: topPo - cTaHeight - compHeight - 5,
|
|
|
left: leftPo
|
|
|
});
|
|
|
|
|
|
!isNone && comp.hide();
|
|
|
},
|
|
|
|
|
|
2: function() {
|
|
|
$('#makeEvaluation').modal({
|
|
|
show: true
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
3: function() {
|
|
|
connectService();
|
|
|
}
|
|
|
};
|
|
|
|
|
|
if (index === 1) return;
|
|
|
utilMap[index](e);
|
|
|
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 设置
|
|
|
* @param e
|
...
|
...
|
@@ -159,114 +65,6 @@ function setEmoji(e) { |
|
|
emojiId = tag.data('id'),
|
|
|
comp = $('.emoji-component');
|
|
|
|
|
|
var emojiMap = [
|
|
|
{file: '100', text: '/微笑', code: '/::)'},
|
|
|
{file: '101', text: '/撇嘴', code: '/::~'},
|
|
|
{file: '102', text: '/色', code: '/::B'},
|
|
|
{file: '103', text: '/发呆', code: '/::|'},
|
|
|
{file: '104', text: '/得意', code: '/:8-)'},
|
|
|
{file: '105', text: '/流泪', code: '/::<'},
|
|
|
{file: '106', text: '/害羞', code: '/::$'},
|
|
|
{file: '107', text: '/闭嘴', code: '/::X'},
|
|
|
{file: '108', text: '/睡', code: '/::Z'},
|
|
|
{file: '109', text: '/大哭', code: '/::\'('},
|
|
|
{file: '110', text: '/尴尬', code: '/::-|'},
|
|
|
{file: '111', text: '/发怒', code: '/::@'},
|
|
|
{file: '112', text: '/调皮', code: '/::P'},
|
|
|
{file: '113', text: '/呲牙', code: '/::D'},
|
|
|
{file: '114', text: '/惊讶', code: '/::O'},
|
|
|
{file: '115', text: '/难过', code: '/::('},
|
|
|
{file: '116', text: '/酷', code: '/::+'},
|
|
|
{file: '117', text: '/冷汗', code: '/:--b'},
|
|
|
{file: '118', text: '/抓狂', code: '/::Q'},
|
|
|
{file: '119', text: '/吐', code: '/::T'},
|
|
|
{file: '120', text: '/偷笑', code: '/:,@P'},
|
|
|
{file: '121', text: '/愉快', code: '/:,@-D'},
|
|
|
{file: '122', text: '/白眼', code: '/::d'},
|
|
|
{file: '123', text: '/傲慢', code: '/:,@o'},
|
|
|
{file: '124', text: '/饥饿', code: '/::g'},
|
|
|
{file: '125', text: '/困', code: '/:|-)'},
|
|
|
{file: '126', text: '/惊恐', code: '/::!'},
|
|
|
{file: '127', text: '/流汗', code: '/::L'},
|
|
|
{file: '128', text: '/憨笑', code: '/::>'},
|
|
|
{file: '129', text: '/悠闲', code: '/::,@'},
|
|
|
{file: '130', text: '/奋斗', code: '/:,@f'},
|
|
|
{file: '131', text: '/咒骂', code: '/::-S'},
|
|
|
{file: '132', text: '/疑问', code: '/:?'},
|
|
|
{file: '133', text: '/嘘', code: '/:,@x'},
|
|
|
{file: '134', text: '/晕', code: '/:,@@'},
|
|
|
{file: '135', text: '/疯了', code: '/::8'},
|
|
|
{file: '136', text: '/衰', code: '/:,@!'},
|
|
|
{file: '137', text: '/骷髅', code: '/:!!!'},
|
|
|
{file: '138', text: '/敲打', code: '/:xx'},
|
|
|
{file: '139', text: '/再见', code: '/:bye'},
|
|
|
{file: '140', text: '/擦汗', code: '/:wipe'},
|
|
|
{file: '141', text: '/抠鼻', code: '/:dig'},
|
|
|
{file: '142', text: '/鼓掌', code: '/:handclap'},
|
|
|
{file: '143', text: '/糗大了', code: '/:&-('},
|
|
|
{file: '144', text: '/坏笑', code: '/:B-)'},
|
|
|
{file: '145', text: '/左哼哼', code: '/:<@'},
|
|
|
{file: '146', text: '/右哼哼', code: '/:@>'},
|
|
|
{file: '147', text: '/哈欠', code: '/::-O'},
|
|
|
{file: '148', text: '/鄙视', code: '/:>-|'},
|
|
|
{file: '149', text: '/委屈', code: '/:P-('},
|
|
|
{file: '150', text: '/快哭了', code: '/::\'|'},
|
|
|
{file: '151', text: '/阴险', code: '/:X-)'},
|
|
|
{file: '152', text: '/亲亲', code: '/::*'},
|
|
|
{file: '153', text: '/吓', code: '/:@x'},
|
|
|
{file: '154', text: '/可怜', code: '/:8*'},
|
|
|
{file: '155', text: '/菜刀', code: '/:pd'},
|
|
|
{file: '156', text: '/西瓜', code: '/:<W>'},
|
|
|
{file: '157', text: '/啤酒', code: '/:beer'},
|
|
|
{file: '158', text: '/篮球', code: '/:basketb'},
|
|
|
{file: '159', text: '/乒乓', code: '/:oo'},
|
|
|
{file: '160', text: '/咖啡', code: '/:coffee'},
|
|
|
{file: '161', text: '/饭', code: '/:eat'},
|
|
|
{file: '162', text: '/猪头', code: '/:pig'},
|
|
|
{file: '163', text: '/玫瑰', code: '/:rose'},
|
|
|
{file: '164', text: '/凋谢', code: '/:fade'},
|
|
|
{file: '165', text: '/嘴唇', code: '/:showlove'},
|
|
|
{file: '166', text: '/爱心', code: '/:heart'},
|
|
|
{file: '167', text: '/心碎', code: '/:break'},
|
|
|
{file: '168', text: '/蛋糕', code: '/:cake'},
|
|
|
{file: '169', text: '/闪电', code: '/:li'},
|
|
|
{file: '170', text: '/炸弹', code: '/:bome'},
|
|
|
{file: '171', text: '/刀', code: '/:kn'},
|
|
|
{file: '172', text: '/足球', code: '/:footb'},
|
|
|
{file: '173', text: '/瓢虫', code: '/:ladybug'},
|
|
|
{file: '174', text: '/便便', code: '/:shit'},
|
|
|
{file: '175', text: '/月亮', code: '/:moon'},
|
|
|
{file: '176', text: '/太阳', code: '/:sun'},
|
|
|
{file: '177', text: '/礼物', code: '/:gift'},
|
|
|
{file: '178', text: '/拥抱', code: '/:hug'},
|
|
|
{file: '179', text: '/强', code: '/:strong'},
|
|
|
{file: '180', text: '/弱', code: '/:weak'},
|
|
|
{file: '181', text: '/握手', code: '/:share'},
|
|
|
{file: '182', text: '/胜利', code: '/:v'},
|
|
|
{file: '183', text: '/抱拳', code: '/:@)'},
|
|
|
{file: '184', text: '/勾引', code: '/:jj'},
|
|
|
{file: '185', text: '/拳头', code: '/:@@'},
|
|
|
{file: '186', text: '/差劲', code: '/:bad'},
|
|
|
{file: '187', text: '/爱你', code: '/:lvu'},
|
|
|
{file: '188', text: '/NO', code: '/:no'},
|
|
|
{file: '189', text: '/OK', code: '/:ok'},
|
|
|
{file: '190', text: '/爱情', code: '/:love'},
|
|
|
{file: '191', text: '/飞吻', code: '/:<L>'},
|
|
|
{file: '192', text: '/跳跳', code: '/:jump'},
|
|
|
{file: '193', text: '/发抖', code: '/:shake'},
|
|
|
{file: '194', text: '/怄火', code: '/:<O>'},
|
|
|
{file: '195', text: '/转圈', code: '/:circle'},
|
|
|
{file: '196', text: '/磕头', code: '/:kotow'},
|
|
|
{file: '197', text: '/回头', code: '/:turn'},
|
|
|
{file: '198', text: '/跳绳', code: '/:skip'},
|
|
|
{file: '199', text: '/投降', code: '/:oY'},
|
|
|
{file: '200', text: '/激动', code: '/:#-O'},
|
|
|
{file: '201', text: '/乱舞', code: '/:hiphot'},
|
|
|
{file: '202', text: '/献吻', code: '/:kiss'},
|
|
|
{file: '203', text: '/左太极', code: '/:<&'},
|
|
|
{file: '204', text: '/右太极', code: '/:&>'}
|
|
|
];
|
|
|
|
|
|
for (var i = 0, len = emojiMap.length; i < len; i++) {
|
|
|
if (emojiMap[i].file === emojiId.toString()) {
|
|
|
emojiText = emojiMap[i].text;
|
...
|
...
|
@@ -361,19 +159,7 @@ function toggleAnswer(e) { |
|
|
* 发送订单
|
|
|
*/
|
|
|
function sendOrderInfo(e) {
|
|
|
var tag = $(e.currentTarget),
|
|
|
no = tag.data('no'),
|
|
|
nm = tag.data('nm'),
|
|
|
time = tag.data('time'),
|
|
|
status = tag.data('status');
|
|
|
|
|
|
var msgContent = ['单号:', no,
|
|
|
'金额:', '¥' + nm,
|
|
|
'下单时间:', time,
|
|
|
'状态:', status];
|
|
|
|
|
|
|
|
|
_sendMessage(e, 10, msgContent);
|
|
|
}
|
|
|
|
|
|
/**
|
...
|
...
|
@@ -389,108 +175,79 @@ function connectService() { |
|
|
* 处理收到消息
|
|
|
* @private
|
|
|
*/
|
|
|
function _getMessage(received) {
|
|
|
console.log('客户收到消息!', received);
|
|
|
function _getMessage(rec) {
|
|
|
console.log('客户收到消息!', rec);
|
|
|
|
|
|
var recType = received.type,
|
|
|
time = received.sendTimeShort,
|
|
|
message = received.message,
|
|
|
var recType = rec.type,
|
|
|
time = rec.sendTimeShort,
|
|
|
message = rec.message,
|
|
|
msgType = message.type,
|
|
|
allTypes = socketConf.receivedType;
|
|
|
allTypes = socketConf.recType;
|
|
|
|
|
|
// 请求人工/接入人工成功/接入人工失败
|
|
|
var tipTpl;
|
|
|
|
|
|
if (recType === 10005) { // 客服评价邀请
|
|
|
$('input[name=promoter]').val(2);
|
|
|
$('#makeEvaluation').modal('show');
|
|
|
}
|
|
|
|
|
|
if (recType === 2) {
|
|
|
switch (msgType) {
|
|
|
case 0: // 0是没上班
|
|
|
tipTpl = `<div class="list-item">
|
|
|
<p class="push-tip">
|
|
|
<span class="tip">${message.content}<a class="leave-msg">留言</a>!</span>
|
|
|
</p>
|
|
|
</div>`;
|
|
|
break;
|
|
|
case 1: // 1是需要排队
|
|
|
tipTpl = `<div class="list-item">
|
|
|
<p class="push-tip">
|
|
|
<span class="tip">${message.content}您也可以选择<a class="leave-msg">留言</a>!</span>
|
|
|
</p>
|
|
|
</div>`;
|
|
|
break;
|
|
|
case 2: // 2是接入人工成功
|
|
|
tipTpl = `<div class="list-item">
|
|
|
<p class="push-tip">
|
|
|
<span class="tip">${message.content}</span>
|
|
|
</p>
|
|
|
</div>`;
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
switch(recType) {
|
|
|
|
|
|
// 待重构
|
|
|
if (recType === 3 || recType === 103 || recType === 10003) {
|
|
|
case allTypes.LINK_SUCCESS:
|
|
|
|
|
|
if (recType === 3 || recType === 10003) {
|
|
|
message.newContent = message.newContent.replace(/src="(\d{3}).gif"/g, 'src="/img/service/emoji/$1.gif"');
|
|
|
message.content = message.content.replace(/src="(\d{3}).gif"/g, 'src="/img/service/emoji/$1.gif"');
|
|
|
}
|
|
|
_linkSuccess(msgType, message);
|
|
|
break;
|
|
|
|
|
|
if (recType === 3) {
|
|
|
tipTpl = `<div class="list-item host">
|
|
|
<img src="/img/service/cus-avatar.png" class="avatar">
|
|
|
<div class="item-detail">
|
|
|
<span class="time">18823562175 ${time}</span>
|
|
|
<div class="msg-bubble">
|
|
|
<div>${message.newContent}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>`;
|
|
|
}
|
|
|
case allTypes.CU_SEND:
|
|
|
|
|
|
if (recType === 103) {
|
|
|
_handleCusMsg(rec, msgType, message);
|
|
|
break;
|
|
|
|
|
|
case allTypes.ROBOT_SEND:
|
|
|
rec.csName = rec.csName || '客服机器人';
|
|
|
message.newContent = message.newContent || '机器人暂时无法提供服务';
|
|
|
tipTpl = `<div class="list-item guest">
|
|
|
<img src="/img/service/agent-avatar.png" class="avatar">
|
|
|
<div class="item-detail">
|
|
|
<span class="time">客服机器人 ${time}</span>
|
|
|
<div class="msg-bubble">
|
|
|
<div>${message.newContent}</div>
|
|
|
</div>
|
|
|
<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>
|
|
|
</div>`;
|
|
|
|
|
|
if (recType === 10003) {
|
|
|
break;
|
|
|
|
|
|
tipTpl = `<div class="list-item guest">
|
|
|
<img src="/img/service/agent-avatar.png" class="avatar">
|
|
|
<div class="item-detail">
|
|
|
<span class="time">客服助手 ${time}</span>
|
|
|
<div class="msg-bubble">
|
|
|
<div>${message.newContent}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>`;
|
|
|
}
|
|
|
}
|
|
|
case allTypes.CS_SEND:
|
|
|
|
|
|
_handleCsMsg(rec, msgType, message);
|
|
|
|
|
|
|
|
|
break;
|
|
|
|
|
|
case allTypes.EVAL_INVITE:
|
|
|
|
|
|
$('input[name=promoter]').val(2);
|
|
|
|
|
|
if (recType === 999999999) {
|
|
|
tipTpl = `<div class="list-item">
|
|
|
showEvalModal();
|
|
|
|
|
|
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>
|
|
|
<span class="tip">${message.content}<a class="red-tip reconnect">连线客服</a></span>
|
|
|
</p>
|
|
|
</div>`;
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
$('.msg-list').append(tipTpl);
|
|
|
$msgList.append(tipTpl);
|
|
|
|
|
|
$('.panel-main .main-body').scrollTop($('.panel-main .main-body')[0].scrollHeight);
|
|
|
$panelMainBody.scrollTop($panelMainBody[0].scrollHeight);
|
|
|
}
|
|
|
|
|
|
/**
|
...
|
...
|
@@ -518,7 +275,7 @@ function _sendMessage(e, msgType, msgContent) { |
|
|
cM.message.type = msgType || 1;
|
|
|
cM.uuid = uuid.v4(); // 用于标示当条消息
|
|
|
|
|
|
console.log(cM)
|
|
|
console.log(cM);
|
|
|
socketChat.send(JSON.stringify(Object.assign(cM)));
|
|
|
}
|
|
|
}
|
...
|
...
|
@@ -562,7 +319,7 @@ socketChat.init(Object.assign(socketConf, { |
|
|
}));
|
|
|
|
|
|
// 提交留言
|
|
|
$('#leaveMsg .submit').click(function() {
|
|
|
$leaveMsg.find('.submit').click(function() {
|
|
|
var lMsg = $('#leaveMsg'),
|
|
|
val = lMsg.find('textarea').val().trim();
|
|
|
|
...
|
...
|
@@ -599,7 +356,7 @@ $('#makeEvaluation .submit').click(function() { |
|
|
var reasonIds,
|
|
|
idArray = [];
|
|
|
|
|
|
$.each(reasonTypes, function(item) {
|
|
|
$.each(reasonTypes, function(index, item) {
|
|
|
idArray.push($(item).data('id'));
|
|
|
});
|
|
|
|
...
|
...
|
@@ -613,7 +370,7 @@ $('#makeEvaluation .submit').click(function() { |
|
|
csId: cM.csId,
|
|
|
pid: cM.platId,
|
|
|
promoter: promoter,
|
|
|
reasonIds: reasonIds,
|
|
|
reasonIds: reasonIds || '',
|
|
|
reasonMsgs: reason,
|
|
|
stars: star,
|
|
|
uid: uid
|
...
|
...
|
@@ -671,28 +428,137 @@ $('.msg-edit .msg-area').on('keydown', msgEnterAction); |
|
|
$('.qa-list .q').on('click', toggleAnswer);
|
|
|
|
|
|
// 发送订单信息
|
|
|
$('.send-order').on('click', sendOrderInfo);
|
|
|
$sendOrder.on('click', function(e) {
|
|
|
var tag = $(e.currentTarget),
|
|
|
no = tag.data('no'),
|
|
|
nm = tag.data('nm'),
|
|
|
time = tag.data('time'),
|
|
|
status = tag.data('status');
|
|
|
|
|
|
var msgContent = ['单号:', no,
|
|
|
'金额:', '¥' + nm,
|
|
|
'下单时间:', time,
|
|
|
'状态:', status];
|
|
|
|
|
|
_sendMessage(e, 10, msgContent);
|
|
|
});
|
|
|
|
|
|
// 发送图片
|
|
|
$sendImgInput.fileupload({
|
|
|
dataType: 'json',
|
|
|
url: common.domains.bjImUploadImg + '/fileManage/uploadFile',
|
|
|
done: function (e, res) {
|
|
|
res = res.result;
|
|
|
|
|
|
if(res && res.code === 200) {
|
|
|
// 上传成功后发送图片消息
|
|
|
cM.type = 3;
|
|
|
cM.message.content = res.data.filePath;
|
|
|
cM.message.type = 2;
|
|
|
cM.uuid = uuid.v4(); // 用于标示当条消息
|
|
|
|
|
|
socketChat.send(JSON.stringify(Object.assign(cM)));
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
|
|
|
// 订单信息、常见问题
|
|
|
$('.right-head .tab').on('click', switchTab);
|
|
|
$rightHeadTab.on('click', function(e) {
|
|
|
var $tt = $(e.target),
|
|
|
actOrder = $tt.hasClass('order');
|
|
|
|
|
|
if ($tt.hasClass('active')) return;
|
|
|
|
|
|
if (actOrder) {
|
|
|
$('.right-head .tab.order').toggleClass('active');
|
|
|
$('.right-head .tab.qa').toggleClass('active');
|
|
|
$('.right-body' + '.order').show();
|
|
|
$('.right-body' + '.qa').hide();
|
|
|
$('.right-footer' + '.qa').hide();
|
|
|
} else {
|
|
|
$('.right-head .tab.order').toggleClass('active');
|
|
|
$('.right-head .tab.qa').toggleClass('active');
|
|
|
$('.right-body' + '.order').hide();
|
|
|
$('.right-body' + '.qa').show();
|
|
|
$('.right-footer' + '.qa').show();
|
|
|
}
|
|
|
});
|
|
|
|
|
|
// 星评
|
|
|
$('.make-eval .stars .star').on('click', starComment);
|
|
|
$('.make-eval .stars .star').on('click', function (e) {
|
|
|
var tag = $(e.target);
|
|
|
var index = tag.index();
|
|
|
var list = $('.make-eval .stars .star');
|
|
|
|
|
|
var el;
|
|
|
for (var i = 0, len = list.length; i < len; i++) {
|
|
|
el = $(list[i]);
|
|
|
el.index() <= index && el.addClass('positive');
|
|
|
el.index() > index && el.removeClass('positive');
|
|
|
}
|
|
|
|
|
|
var starText = {
|
|
|
0: '非常不满意',
|
|
|
1: '不满意',
|
|
|
2: '一般',
|
|
|
3: '满意',
|
|
|
4: '非常满意'
|
|
|
};
|
|
|
|
|
|
var textEl = $('.make-eval .star-text');
|
|
|
textEl.text(starText[index]);
|
|
|
});
|
|
|
|
|
|
// 选择不满意类型
|
|
|
$('.discontent .dis-row .type').on('click', typeComment);
|
|
|
$(document).on('click', '.dis-row .type', function (e) {
|
|
|
$(e.target).toggleClass('chosen');
|
|
|
});
|
|
|
|
|
|
// 留言
|
|
|
$('.msg-list').on('click', '.leave-msg', leaveMsg);
|
|
|
$msgList.on('click', '.leave-msg', leaveMsg);
|
|
|
|
|
|
// 消息编辑框功能区
|
|
|
$('.msg-edit .util .icon').on('click', dispatchUtil);
|
|
|
$('.msg-edit .util .icon').on('click', function (e) {
|
|
|
var cTa = $(e.currentTarget),
|
|
|
index = cTa.index(),
|
|
|
comp = $('.emoji-component');
|
|
|
|
|
|
var utilMap = {
|
|
|
0: function() {
|
|
|
var topPo = cTa.offset().top,
|
|
|
leftPo = cTa.offset().left,
|
|
|
cTaHeight = cTa.height();
|
|
|
|
|
|
var isNone = comp.css('display') === 'none';
|
|
|
|
|
|
comp.css({display: 'inline-block'});
|
|
|
var compHeight = comp.height();
|
|
|
isNone && comp.css({
|
|
|
top: topPo - cTaHeight - compHeight - 5,
|
|
|
left: leftPo
|
|
|
});
|
|
|
|
|
|
!isNone && comp.hide();
|
|
|
},
|
|
|
|
|
|
2: function() {
|
|
|
showEvalModal();
|
|
|
},
|
|
|
|
|
|
3: function() {
|
|
|
connectService();
|
|
|
}
|
|
|
};
|
|
|
|
|
|
if (index === 1) return;
|
|
|
utilMap[index](e);
|
|
|
});
|
|
|
|
|
|
// 设置表情
|
|
|
$('.emoji-component .emoji').on('click', setEmoji);
|
|
|
|
|
|
// 重新连线
|
|
|
$('.msg-list').on('click', '.reconnect', function() {
|
|
|
$msgList.on('click', '.reconnect', function() {
|
|
|
|
|
|
socketChat.init(Object.assign(socketConf, {
|
|
|
|
...
|
...
|
@@ -721,7 +587,7 @@ $('.msg-edit .send').on('click', _sendMessage); |
|
|
// 关闭聊天窗口
|
|
|
$('.header .close').click(function() {
|
|
|
if (!operation.savedEval) { // 没有保存过评论
|
|
|
$('#makeEvaluation').modal('show');
|
|
|
showEvalModal();
|
|
|
} else {
|
|
|
window.close();
|
|
|
}
|
...
|
...
|
@@ -734,7 +600,7 @@ $('.msg-area').on('blur', function() { |
|
|
|
|
|
|
|
|
// 消息图片放大显示
|
|
|
$('.msg-list').on('click', '.msg-bubble img', function(e) {
|
|
|
$msgList.on('click', '.msg-bubble .img-msg', function(e) {
|
|
|
var msgZoomIn = $('.img-zoom-in');
|
|
|
msgZoomIn.find('img').attr('src', $(e.target).attr('src'));
|
|
|
msgZoomIn.fadeIn();
|
...
|
...
|
@@ -749,29 +615,244 @@ $('.about-his.has-his').click(function(e) { |
|
|
$(e.currentTarget).hide();
|
|
|
$('.list-item.his-msg').show();
|
|
|
|
|
|
$('.panel-main .main-body').scrollTop($('.panel-main .main-body')[0].scrollHeight);
|
|
|
$panelMainBody.scrollTop($panelMainBody[0].scrollHeight);
|
|
|
});
|
|
|
|
|
|
// $('.panel-main .main-body').scrollTop(10);
|
|
|
|
|
|
});
|
|
|
/**
|
|
|
* 链接建立
|
|
|
* @param msgType 内部消息类型
|
|
|
* @param message 内部消息对象
|
|
|
* @private
|
|
|
*/
|
|
|
function _linkSuccess(msgType, message) {
|
|
|
|
|
|
var OUT_SERVICE = 0,
|
|
|
LINE_UP = 1,
|
|
|
MANUAL_SERVICE = 2;
|
|
|
|
|
|
$('.panel-main .main-body').scroll(function(e) {
|
|
|
console.log($(e.target)[0].scrollHeight);
|
|
|
var liHtml;
|
|
|
|
|
|
});
|
|
|
var $msgList = $('.msg-list'),
|
|
|
$mainBody = $('.panel-main .main-body');
|
|
|
|
|
|
|
|
|
switch(msgType) {
|
|
|
|
|
|
case OUT_SERVICE: // 0是没上班
|
|
|
liHtml =
|
|
|
`<div class="list-item">
|
|
|
<p class="push-tip">
|
|
|
<span class="tip">${message.content}</span>
|
|
|
</p>
|
|
|
</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>`;
|
|
|
break;
|
|
|
|
|
|
case MANUAL_SERVICE: // 2是接入人工成功
|
|
|
liHtml =
|
|
|
`<div class="list-item">
|
|
|
<p class="push-tip">
|
|
|
<span class="tip">${message.content}</span>
|
|
|
</p>
|
|
|
</div>`;
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
// 添加消息
|
|
|
liHtml && $msgList.append(liHtml);
|
|
|
liHtml && $mainBody.scrollTop($mainBody[0].scrollHeight);
|
|
|
}
|
|
|
|
|
|
|
|
|
/**
|
|
|
* 处理客户消息
|
|
|
* @private
|
|
|
*/
|
|
|
function _handleCusMsg(rec, msgType, message) {
|
|
|
|
|
|
|
|
|
var liHtml,
|
|
|
$msgList = $('.msg-list'),
|
|
|
$mainBody = $('.panel-main .main-body');
|
|
|
|
|
|
message.newContent = _emojiPrefix(message.newContent);
|
|
|
|
|
|
// 图片添加标签
|
|
|
if(msgType === 2) {
|
|
|
message.newContent =
|
|
|
'<img class="img-msg" src="${message.newContent}">'
|
|
|
}
|
|
|
|
|
|
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>`;
|
|
|
|
|
|
// $('#sendImg').qupload({
|
|
|
// upload_url: common.domains.bjIm,
|
|
|
// file_post_name: 'fileData',
|
|
|
// button_text: '<span class="btn_upload_text">上传图片</span>',
|
|
|
// button_action: window.SWFUpload.BUTTON_ACTION.SELECT_FILE,
|
|
|
// file_size_limit: '5120',
|
|
|
// file_types: '*.jpg;*.jpeg;*.png;*.bmp',
|
|
|
// uploadSuccessed: function(data) {
|
|
|
// console.log(data)
|
|
|
// }
|
|
|
// });
|
|
|
$msgList.append(liHtml);
|
|
|
$mainBody.scrollTop($mainBody[0].scrollHeight);
|
|
|
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 处理客服消息
|
|
|
* @private
|
|
|
*/
|
|
|
function _handleCsMsg(rec, msgType, message) {
|
|
|
|
|
|
var liHtml,
|
|
|
$msgList = $('.msg-list'),
|
|
|
$mainBody = $('.panel-main .main-body');
|
|
|
|
|
|
message.newContent = _emojiPrefix(message.newContent);
|
|
|
|
|
|
if(msgType === 2) {
|
|
|
message.content =
|
|
|
'<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>`;
|
|
|
|
|
|
$msgList.append(liHtml);
|
|
|
$mainBody.scrollTop($mainBody[0].scrollHeight);
|
|
|
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 返回表情路径处理
|
|
|
* @param text 文本
|
|
|
* @private
|
|
|
*/
|
|
|
function _emojiPrefix(text) {
|
|
|
if(typeof text === "string") {
|
|
|
return text.replace(/src="(\d{3}).gif"/g, 'src="/img/service/emoji/$1.gif"');
|
|
|
}
|
|
|
|
|
|
return text;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 显示评价弹框
|
|
|
*/
|
|
|
function showEvalModal() {
|
|
|
var $evalModal = $('#makeEvaluation');
|
|
|
|
|
|
$.ajax({
|
|
|
type: 'GET',
|
|
|
url: urls.evalReason,
|
|
|
data: {
|
|
|
customerSettingId: 0 // todo
|
|
|
},
|
|
|
success: function(res) {
|
|
|
if (res && res.code === 200) {
|
|
|
var data = res.data,
|
|
|
len = data.length;
|
|
|
|
|
|
|
|
|
data = [
|
|
|
{
|
|
|
createTime: 1477657047,
|
|
|
customerSettingId: 40,
|
|
|
id: 26,
|
|
|
content: 123451,
|
|
|
status: 2
|
|
|
},
|
|
|
{
|
|
|
createTime: 1477657047,
|
|
|
customerSettingId: 40,
|
|
|
id: 28,
|
|
|
content: 123551,
|
|
|
status: 2
|
|
|
},
|
|
|
{
|
|
|
createTime: 1477657047,
|
|
|
customerSettingId: 40,
|
|
|
id: 28,
|
|
|
content: 123551,
|
|
|
status: 2
|
|
|
}
|
|
|
];
|
|
|
|
|
|
len = data.length;
|
|
|
if(len) {
|
|
|
var html = '',
|
|
|
ceilRows = Math.ceil(len / 2),
|
|
|
floorRows = Math.floor(len / 2);
|
|
|
|
|
|
if(ceilRows === floorRows) {
|
|
|
for(var r = 1, i = 0; r <= ceilRows; r++) {
|
|
|
|
|
|
html =
|
|
|
`<div class="dis-row">
|
|
|
<span class="type"data-id="${data[i].id}">
|
|
|
${data[i].content}
|
|
|
</span>
|
|
|
<span class="type"data-id="${data[i+1].id}">
|
|
|
${data[i+1].content}
|
|
|
</span>
|
|
|
</div>`;
|
|
|
|
|
|
i += 2;
|
|
|
}
|
|
|
} else {
|
|
|
|
|
|
for(var r = 1, i = 0; r <= ceilRows - 1; r++) {
|
|
|
|
|
|
html +=
|
|
|
`<div class="dis-row">
|
|
|
<span class="type"data-id="${data[i].id}">
|
|
|
${data[i].content}
|
|
|
</span>
|
|
|
<span class="type"data-id="${data[i+1].id}">
|
|
|
${data[i+1].content}
|
|
|
</span>
|
|
|
</div>`;
|
|
|
|
|
|
i += 2;
|
|
|
}
|
|
|
|
|
|
html +=
|
|
|
`<div class="dis-row">
|
|
|
<span class="type" data-id="${data[len-1].id}">
|
|
|
${data[len-1].content}
|
|
|
</span>
|
|
|
</div>`;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
$evalModal.find('.discontent').empty().append(html);
|
|
|
}
|
|
|
|
|
|
$evalModal.modal('show');
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
|
|
|
|
...
|
...
|
|