script(language='javascript'). cursession = '#{curagentuser.userid}'; curHeadImgUrl = '!{curagentuser.headimgurl}'; var userid = '#{curagentuser.userid}', agentserviceid = '#{curagentuser.agentserviceid}', agentuserid = '#{curagentuser.id}', masscuragentuser = '#{masscuragentuser}', isAisuggest = '#{aisuggest}'; .main-agentuser .chat-agent h1.site-h1 if curagentuser div(style="width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap: break-word;word-break: break-all;") | #{curagentuser.username} .ukefu-service-btn(style="float:right;") a(href="/agent/summary.html?userid=" + curagentuser.userid + "&agentserviceid=" + curagentuser.agentserviceid + "&agentuserid=" + curagentuser.id + "&channel=" + curagentuser.channel, data-toggle="ajax", data-width="950", data-height="450", title="记录服务小结") button.layui-btn.layui-btn-small i.kfont  | 服务小结 a(href="/agent/transfer.html?userid=" + curagentuser.userid + "&agentserviceid=" + curagentuser.agentserviceid + "&agentuserid=" + curagentuser.id, data-toggle="ajax", data-width="750", data-height="550", title="选择转接对象") button.layui-btn.layui-btn-small(style="margin:0 5px") i.kfont  | 转接坐席 a(href="javascript:void(0)", onclick="submitEndAgentUser('#{curagentuser.id}','#{curagentuser.username}')") button.layui-btn.layui-btn-small.layui-btn-danger i.kfont  | 结束对话 #chat_msg_list.chat-message.chat_msg_list(style='position: relative') if agentUserMessageList && agentUserMessageList.content for chatmessage in pugHelper.reverse(agentUserMessageList.content) .clearfix.chat-block(name=chatmessage.createtime) div(class=(chatmessage.calltype && chatmessage.calltype == '呼出' ? 'chat-right' : 'chat-left')) img.user-img(alt="", src=(chatmessage.calltype && chatmessage.calltype == '呼出' ? '/images/agent.png' : curagentuser.headimgurl && curagentuser.headimgurl != '' ? curagentuser.headimgurl : '/images/im/user.png'), style="width:45px;height:45px;") .chat-message span(class=(chatmessage.calltype && chatmessage.calltype == '呼出' ? 'rateright' : 'rateleft')) i.layui-icon.iconclick(id=chatmessage.id, name=(chatmessage.islabel == true ? 'yeslabe' : 'nolabe'), style="font-size:30px;cursor:pointer;color: #{chatmessage.islabel == true ? '#46cad4' : '#aaaaaa'}") | #{chatmessage.islabel == true ? '' : 'စ'} span.user if chatmessage && chatmessage.calltype && chatmessage.calltype == '呼出' if chatmessage.intervented | #{chatmessage.supervisorname} else | #{chatmessage.username} else | #{chatmessage.username} span.time= pugHelper.formatDate('yyyy-MM-dd HH:mm:ss', chatmessage.createtime) span(class=(chatmessage.calltype && chatmessage.calltype == '呼出' ? 'rateleft' : 'rateright'), style="cursor: pointer; font-size: 30px") i.layui-icon.iconclick(id=chatmessage.id, name=(chatmessage.islabel == true ? 'yeslabe' : 'nolabe'), style="cursor:pointer;font-size:30px;color: #{chatmessage.islabel == true ? '#46cad4' : '#aaaaaa'}") | #{chatmessage.islabel == true ? '' : 'စ'} div(class=(chatmessage.calltype && chatmessage.calltype == '呼出' ? 'chatting-right' : 'chatting-left')) i.userarrow .chat-content include /apps/agent/media/message.pug else if curagentuser if curagentuser.status && curagentuser.status == "end" #agentuser-curstatus.clearfix.chat-block.connect-end span.connect-message 用户#{curagentuser.username}已经离开 else #agentuser-curstatus.clearfix.chat-block.connect-begin span.connect-message 用户#{curagentuser.username}开始对话 .chat-bottom #agentAnswer(style='width: 50%;min-width:310px;height: 180px;border: 1px solid #eee;position: absolute;top: -180px;right:0px;background: #ffffff;display: none') h1.site-h1(style='background-color:#EEEEEE;padding: 0px 10px') | 知识库联想 i.layui-icon(style='position: absolute;top: 0px;right: 5px;font-size:16px;z-index: 10', onclick='showOrHide(\'none\')') ဆ div(style='width: calc(100% - 19px);height: 129px;position: absolute;top: 31px;overflow-y: scroll;padding: 10px 10px') ul.info-list.ukefu-quick-reply#quickReplyAgentBox(style='width: 100%;height: auto'). .row .col-lg-12 textarea#message(name='message') button.send-btn(type='button', onclick='sendMessage()') | 发送 style. .ke-container { border: 0px solid #E0E0E0 !important; } script(language='javascript'). var editor, layer; KindEditor.plugin('evaluation', function (K) { var editor = this, name = 'evaluation'; editor.clickToolbar(name, function () { $.post('/agent/evaluation', {agentuserid: agentuserid}).success(function () { top.layer.msg('发送满意度调研成功!', {icon: 1, time: 3000}) }); }); }); KindEditor.lang({ evaluation: '满意度评价' }); $(document).ready(function () { // KindEditor.ready(function(K) { var K = KindEditor; editor = K.create('#message', { height: "160px", themeType: 'simple', width: "100%", items: ['emoticons', 'image', 'insertfile', 'evaluation'], resizeType: 0, uploadJson: "/agent/image/upload.html?id=" + "#{curagentuser.id}", allowFileManager: false, newlineTag: "br", fontsize: 16, allowFileUpload: true, allowInsertUpload: false, //增加的参数,上传图片后是否插入到当前区域 allowImageRemote: false, afterUpload: function (url) { return false; }, afterCreate: function () { //设置编辑器创建后执行的回调函数 var self = this; if ('#{sessionConfig}' && '#{sessionConfig.agentctrlenter}' && '#{sessionConfig.agentctrlenter}' == true) { //Ctrl+Enter提交表单 K.ctrl(document, 13, function () { self.sync(); sendMessage(); }); K.ctrl(self.edit.doc, 13, function () { self.sync(); sendMessage(); }); } else { var kindEditorIframe = $("iframe").contents().find("body"); kindEditorIframe.keydown(function (event) { if (event.keyCode == 13 && !event.ctrlKey) { self.sync(); sendMessage(); return false; } else if (event.keyCode == 13 && event.ctrlKey) { editor.insertHtml('
'); } }); //Ctrl+Enter提交表单 K.ctrl(document, 13, function () { editor.insertHtml('
'); }); K.ctrl(self.edit.doc, 13, function () { editor.insertHtml('
'); }); } } }); // }); KindEditor.options.cssData = "body {font - size: 15px; font-family:'Microsoft Yahei', 'Helvetica', 'Simsun', 'Arial';}"; var agentEnterInput = $("iframe").contents().find("body"); agentEnterInput.keyup(function (event) { if (isAisuggest && isAisuggest == "true") { debouncefun(); } }) var debouncefun = _.debounce(agentQuickReply, 500) function agentQuickReply() { restApiRequest({ silent: true, path: 'chatbot', data: { ops: 'faq', snsaccountid: "#{curagentuser.appid}", userId: "#{curagentuser.userid}", textMessage: editor.html() } }).then(function (result) { if (result.rc === 0) { if (result.data.length > 0) { $("#quickReplyAgentBox").html(""); $.each(sortByKey(result.data, 'score'), function (j, n) { var answerList = result.data[j].replies; var answer; for (var i = 0; i < answerList.length; i++) { if (answerList[i].rtype == 'plain' && answerList[i].enabled == true) { answer = answerList[i] break; } } if (answer) { var li = '
  • \n' + '
    问题:' + result.data[j].post + '
    \n' + '
    \n' + '

    答案:' + answer.content + '

    \n' + ' \n' + '
    \n' + '
  • ' $("#quickReplyAgentBox").append(li); } if (i > 4) { return false; } }); showOrHide('block') } else { showOrHide('none') } } else { showOrHide('none') } }, function (error) { console.log("error", error); // 服务器异常 top.layer.msg('服务器抽风,请稍后再试!', {icon: 2, time: 3000}) }) } }); .ukefu-chat-prop .ukefu-prop-list .layui-side-scroll .layui-tab(style='margin-top:0px;') ul.layui-tab-title li.layui-this 访客 if aisuggest && aisuggest == true li#robot(onclick="$('#dot').css('display','none')") span 智能机器人 span#dot(style=" width: 7px;height: 7px;background: red;-moz-border-radius: 50%;-webkit-border-radius: 50%;border-radius: 50%;position: absolute;top: 5px;display: none") li 历史 li 搜索历史消息 .layui-tab-content(style='padding: 5px 0px 0px;') .layui-tab-item.layui-show .box .box-title h1.site-h1(style='background-color:#EEEEEE;') | 访问信息 div(style='float:right;') button.layui-btn.layui-btn-small.layui-btn-radius.layui-btn-danger(href='/agent/blacklist/add.html?userid=#{curagentuser.userid}&agentserviceid=#{curagentuser.agentserviceid}&agentuserid=#{curagentuser.id}×=#{serviceCount ? serviceCount : 0}&chattime=#{(onlineUser && onlineUser.betweentime ? onlineUser.betweentime : 0)}', data-toggle='ajax', data-title='拉黑访客', data-width='900') 拉黑访客 .box-body(style='padding:0px 10px;position: relative;') if curagentuser.channel && curagentuser.channel == "webim" include /apps/agent/channel/webim.pug else if curagentuser.channel && curagentuser.channel == "messenger" include /apps/agent/channel/messenger.pug //else if curagentuser.channel && curagentuser.channel == "skype" // include /apps/agent/channel/skype.pug if curagentuser.name ul.info-list li | 姓名: span.tgreen = curagentuser.name if curagentuser.phone li | 电话: span.tgreen = curagentuser.phone if curagentuser.email li | 邮件: span.tgreen = curagentuser.email if curagentuser.resion li | 来访原因: span.tgreen = curagentuser.resion if curAgentService && curAgentService.trans && curAgentService.trans == true ul.info-list li | 转接: span.tgreen i.layui-icon(style="color:#19a55d;")  if curAgentService.transtime li | 转接时间: span.tgreen | #{pugHelper.formatDate('HH:mm:ss', curAgentService.transtime)} if curAgentService.transmemo li | 转接附言: span.tgreen = curAgentService.transmemo if models.contains("contacts") .box .box-title h1.site-h1(style="background-color:#EEEEEE;") | 联系人 div(style="float:right;") button.layui-btn.layui-btn-small.layui-btn-normal(href="/apps/contacts/embed/index.html?userid=#{curagentuser.userid}&agentserviceid=#{curagentuser.agentserviceid}&agentuserid=#{curagentuser.id}×=#{(serviceCount ? serviceCount : 0)}&chattime=#{(onlineUser && onlineUser.betweentime ? onlineUser.betweentime : 0)}", data-toggle="ajax", title="请选择联系人", data-width="950", data-height="500") 关联联系人 #ukefu_contacts_info.box-body(style="padding:0px 10px;") include /apps/agent/contacts.pug if aisuggest && aisuggest == true .layui-tab-item .box .box-title h1.site-h1(style="background-color:#EEEEEE;") | 知识库快捷 .box-body(style="padding:0px 10px;") ul#quickReplyBox.info-list.ukefu-quick-reply li(style="list-style: none;background-image: url();padding: 50px 0 50px;") .ukefu-empty(style="background: none") i.layui-icon  div(style="") 未触发知识库查询 .layui-tab-item .box .box-title h1.site-h1(style="background-color:#EEEEEE;") | 历史记录 .box-body(style="padding:0px 10px;") ul.info-list.ukefu-quick-reply if agentServiceList && !agentServiceList.empty() for agentService in agentServiceList li.ukefu-agentservice-list a(href="/service/online/chatmsg.html?id=" + agentService.id + "&title=false", data-toggle="ajax", data-width="950", data-height="500", data-title="服务记录") span.quick-reply(style="overflow: hidden;text-overflow: ellipsis;white-space:nowrap;max-width:48%;display: inline-block;", data-id="content_" + agentService.id, title=agentService.username)= agentService.username .ukefu-agentservice-his(style="overflow: hidden;text-overflow: ellipsis;white-space:nowrap;max-width:48%;", title=agentService.agentusername) 坐席:#{agentService.agentusername} div(style="color:#333;position: relative;") | #{pugHelper.formatDate('yyyy-MM-dd HH:mm:ss', agentService.servicetime)} .ukefu-agentservice-his | 时长:#{pugHelper.padRight(agentService.sessiontimes / (1000 * 60 * 60), "00")}:#{pugHelper.padRight((agentService.sessiontimes % (1000 * 60 * 60)) / (1000 * 60), "00")}:#{pugHelper.padRight((agentService.sessiontimes % (1000 * 60)) / (1000), "00")} else li(style="list-style: none;background-image: url();padding: 50px 0 50px;") .ukefu-empty(style="background: none") i.layui-icon  div(style="") 还没有咨询记录 .layui-tab-item .box .box-title h1.site-h1(style='background-color:#ffffff;') div(style='width:60%;height:40px;margin:0 auto ;display: -webkit-flex;display: flex;-webkit-justify-content:space-between;justify-content: space-between;') #all.unselected(style='margin-top: 5px;height:30px;') i.layui-icon(style='cursor: pointer;font-size:18px; float: left;margin:0 2px;')  p(style='line-height: 30px') 全部 #searchlabel.unselected(style='margin-top: 5px;height:30px;') i.layui-icon(style='cursor: pointer;font-size:18px; float: left;margin:0 2px;') စ p(style='line-height: 30px') 标注 .searchbox(style='width: 300px;height:30px;border-radius: 5px;background:#f2f3f5; margin: 0 auto 10px;clear: both;border: 1px solid rgb(210, 210, 210);overflow: hidden;') i#search.csfont(style='cursor: pointer;float: left;margin:0 0 0 50px;font-size: 24px;color: #757575')  input#searchconter(style='width: 150px;height: 30px;border: none;background:#f2f3f5;', type='text', name='title', required, lay-verify='required', placeholder=' 请输入搜索内容', autocomplete='off') #searchSubmit(style='cursor:pointer') 搜索 #nothing(style='margin-top: 150px') div(style='width: 120px;height: 120px;margin: 0 auto') i.csfont(style='font-size: 120px;color:#00a65a')  p#nothingTxt(style='text-align: center;color: #7e8790') 请输入搜索内容 // ${agentUserMessageNum!''} .box-body(style='padding:0px 10px;margin-top: 20px') ul.info-list.ukefu-quick-reply#searchlist. style. .ke-icon-evaluation { background-image: url(/im/img/evaluationa.png); background-position: 0px 0px; width: 20px; height: 16px; } .layui-flow-more { position: absolute; top: 0; left: 45%; } .chat-left .chat-message .rateright { display: inline-block; } .chat-left .chat-message .rateleft { display: none; } .chat-right .chat-message .rateright { display: inline-block; } .chat-right .chat-message .rateleft { display: none; } #numSearches { text-align: left; clear: both; color: #7e8790; margin-left: 10px; } #numSearches span { color: #000; } #searchSubmit { float: right; width: 50px; background: #25c571; text-align: center; color: #fff; } .unselected { margin-left: 10px; width: 55px; height: 30px; float: left; font-size: 16px; text-align: center; line-height: 30px; color: #fff; border-radius: 5px; font-weight: 400; } .unselected i, .unselected p { color: #000; } .selected i, .selected p { color: #00a65a; font-weight: bold; } .nowrap { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: calc(100% - 40px); } script. if (#{models.contains("chatbot")}) { $(document).ready(function () { if (isAisuggest && isAisuggest == "true") { switchQuickReply(); } }) } chatScorllBottom('chat_msg_list'); layui.use('element', function () { var element = layui.element(); }); layui.use('layer', function () { layer = layui.layer; $('#tag').click(function () { $('#taglist').show(); }) $('.tag-switch').click( function () { if ($('#tag_' + $(this).data("id")).length > 0) { $('#tag_' + $(this).data("id")).remove(); } else { $("#tags").append( "" + $(this).data("name") + ""); } loadURL($(this).data("href")); }); $("#taglist").hover(null, function () { $(this).hide(); }); $('.quick-reply').click(function () { var target = $(this).data("id"); if ($('#' + target).is(":hidden")) { $('#' + target).show(); } else { $('#' + target).hide(); } }); $('.quick-reply-content').click(function () { if (editor != null) { var quickReply = $(this).html(); if (editor.count("text") == 0) { editor.html(quickReply); } else { top.layer.confirm("您已经输入了内容,覆盖当前输入框中内容?", {icon: 3, title: '覆盖提示'}, function (index) { top.layer.close(index); editor.html(quickReply); }); } } }); }); function sendMessage() { editor.sync(); var count = editor.count("text"); if (count > 0) { var message = document.getElementById('message').value; top.WebIM.sendMessage(message, "#{user.id}", "#{curagentuser.appid}", "#{user.sessionid}", "#{orgi ? orgi : ''}", "#{curagentuser.userid}", "#{user.username}"); } editor.html(''); showOrHide('none'); }; // function chooseAnswer(data){ // editor.html(data) // } function showOrHide(data) { $("#agentAnswer").css("display", data) } // 排序 function sortByKey(array, key) { return array.sort(function (a, b) { var x = a[key]; var y = b[key]; return ((x < y) ? -1 : ((x > y) ? 1 : 0)); }); } function switchQuickReply() { var hatContentHtml = $("#chat_msg_list .chat-block").last().find(".chatting-left .chat-content").html(); if ($.trim(hatContentHtml)) { restApiRequest({ silent: true, path: 'chatbot', data: { ops: 'faq', snsaccountid: '#{curagentuser.appid}', userId: "#{curagentuser.userid}", textMessage: hatContentHtml } }).then(function (result) { if (result.rc === 0) { if (result.data.length > 0) { $("#quickReplyBox").html(""); $.each(sortByKey(result.data, 'score'), function (j, n) { var answerList = result.data[j].replies; var answer; for (var i = 0; i < answerList.length; i++) { if (answerList[i].rtype == 'plain' && answerList[i].enabled == true) { answer = answerList[i] break; } } if (answer) { var li = '
  • \n' + '
    问题:' + result.data[j].post + '
    \n' + '
    \n' + '

    答案:' + answer.content + '

    \n' + ' \n' + '
    \n' + '
  • ' $("#quickReplyBox").append(li); } if (i > 4) { return false; } }); if (!$("#robot").hasClass('layui-this')) { $("#dot").css("display", "inline-block") } } else { $("#dot").css("display", "none") $("#quickReplyBox").html('
  • \n' + '
    \n' + ' \n' + '
    在知识库中未得到相关问题
    \n' + '
    \n' + '
  • '); } } }, function (error) { console.log("error", error); // 服务器异常 top.layer.msg('服务器抽风,请稍后再试!', {icon: 2, time: 3000}) }) } } $("#searchconter").keyup(function (event) { if (event.keyCode == 13) { $("#search").click(); } }); var current = 0; var pieces = 0; var searchSwitch = false; $("#searchconter").focus(function () { $(this).attr('placeholder', ' ') $(".searchbox").css({"border": "1px solid #3b99fc", 'box-shadow': ' 0 0 3px 0 #3b99fc'}); $("#search").css('margin-left', '20px'); }); $("#searchconter").blur(function () { $(this).attr('placeholder', ' 请输入搜索内容') $(".searchbox").css({"border": "1px solid #d2d2d2", 'box-shadow': 'none'}); $("#search").css('margin-left', '50px'); }); $('#searchSubmit').click(function () { $("#search").click(); }) function search(conditionalParameter) { $.ajax({ url: '/agent/agentusersearch.html', data: {'search': $('#searchconter').val(), 'id': '#{curagentuser.id}', 'condition': conditionalParameter}, type: "post", success: function (data) { $('#searchlist').html(data); var pieces = $('#numSearches').html() if (pieces > 0) { $('#nothing').css('display', 'none') $('.chatblock').click(function () { $.ajax({ url: '/agent/agentusersearchdetails.html', data: { 'createtime': $(this).attr('name'), 'id': '#{curagentuser.id}', 'thisid': $(this).attr('id') }, type: "post", success: function (data) { $('.chat-block').remove(); $('#chat_msg_list').prepend(data); var element = document.getElementById("agentusersearchdetails"); element.scrollIntoView(); current = parseInt($('#numSearches').html()) - 11 } }); }) } else if (pieces == 0) { $('#nothingTxt').html('无"' + $('#searchconter').val() + '"搜索结果') $('#nothing').css('display', 'block') } } }); } // 点击全部 $('#all').click(function () { searchSwitch = false; search('all') $('#searchlabel .layui-icon').html('စ') $("#searchlabel").removeClass('selected') $("#all").addClass('selected') }) //点击标注 $('#searchlabel').click(function () { searchSwitch = !searchSwitch; if (searchSwitch) { $('#searchlabel .layui-icon').html('') $("#all").removeClass('selected') $("#searchlabel").addClass('selected') search('label') } else { $('#searchlabel .layui-icon').html('စ') $("#searchlabel").removeClass('selected') $("#all").addClass('selected') search('all') } }) //点击搜索 $('#search').click(function () { if (searchSwitch) { $('#searchlabel .layui-icon').html('') $("#searchlabel").addClass('selected') $("#all").removeClass('selected') search('label') } else { $("#all").addClass('selected') search('all') } }) layui.use('flow', function () { var flow = layui.flow; flow.load({ elem: '#chat_msg_list' //流加载容器 , scrollElem: '#chat_msg_list' //流加载容器 , end: '没有更多了' , isAuto: false , done: function (page, next) { //执行下一页的回调 //模拟数据插入 current += 20; setTimeout(function () { var lis = []; var pages = 0; $.ajax({ url: '/agent/agentuserpage.html', data: {'current': current, 'id': '#{curagentuser.id}'}, type: "post", success: function (data) { var element = document.getElementsByClassName("chat-block")[0]; if (page != 1) { element.scrollIntoView(); } lis = lis + data; $('#chat_msg_list').prepend(data) } }); //执行下一页渲染,第二参数为:满足“加载更多”的条件,即后面仍有分页 //pages为Ajax返回的总页数,只有当前页小于总页数的情况下,才会继续出现加载更多 pages = '#{agentUserMessageList.totalElements}' / 20 next(lis.join(''), page < pages); //假设总页数为 10 }, 500); } }); }); $('#quickReplyAgentBox').on('click', '.chooseAnswer', function () { editor.html($(this).data('title') + "") }); $('#quickReplyBox').on('click', '.chooseAnswer', function () { editor.html($(this).data('title') + "") });