github/cosin
1
0
Fork 0
mirror of https://github.com/chatopera/cosin.git synced 2025-08-01 16:38:02 +08:00
Code Issues Releases Wiki Activity

#153 支持 button 类型消息

Browse Source
This commit is contained in:
mukaiu 2018-11-16 13:57:35 +08:00
parent 8e5e44ab3f
commit c1ac1ff2c3
1 changed files with 83 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
contact-center/app/src/main/resources/templates/apps/im/chatbot/index.html
View File

@ -257,6 +257,18 @@
</script>
<!-- kindeditor -->
<style>
.msg-btn{
border: #4598ee 1px solid;
padding: 5px;
margin: 5px;
min-width: 125px;
text-align: center;
display: inline-block;
background-color: #e6f2ff;
cursor: default;
}
</style>
</head>
<body style="overflow:hidden;" class="ukefu-point-text">
<div class="large ukefu-im-theme <#if type?? && type='text'>ukefu-theme-border-${inviteData.consult_dialog_color!''}</#if>">
@ -501,7 +513,12 @@
if(data.calltype == "呼入"){
output('<div class="chat-right"> <img class="user-img" src="/im/img/user.png" alt=""><div class="chat-message"><label class="time">'+data.createtime+'</label><label class="user">' + data.username + '</label></div><div class="chatting-right"><i class="arrow arrow${inviteData.consult_dialog_color!''}"></i><div class="chat-content theme${inviteData.consult_dialog_color!''}">'+chat+'</div></div>' , "chat-block");
}else if(data.calltype == "呼出"){
output('<div class="chat-left"> <img class="user-img" src="<#if inviteData?? && inviteData.consult_dialog_headimg??>/res/image.html?id=${inviteData.consult_dialog_headimg?url}<#else>/images/agent.png</#if>" alt=""><div class="chat-message"><label class="user">'+data.username+'</label><label class="time">'+data.createtime+'</label> </div><div class="chatting-left"><i class="arrow"></i><div class="chat-content">'+chat+'</div></div>' , "chat-block");
if(data.expmsg){
showExtmsg(data.username, data.createtime,data.message ,data.expmsg);
}
else{
output('<div class="chat-left"> <img class="user-img" src="<#if inviteData?? && inviteData.consult_dialog_headimg??>/res/image.html?id=${inviteData.consult_dialog_headimg?url}<#else>/images/agent.png</#if>" alt=""><div class="chat-message"><label class="user">'+data.username+'</label><label class="time">'+data.createtime+'</label> </div><div class="chatting-left"><i class="arrow"></i><div class="chat-content">'+chat+'</div></div>' , "chat-block");
}
R3Ajax.audioplayer('audioplane', newmessage, false); // 播放
}
});
@ -509,6 +526,67 @@
socket.on('disconnect',function() {
output('<span id="connect-message">连接坐席失败，在线咨询服务不可用</span>' , 'message connect-message');
});
function createButton(message, data) {
var element = $('<div><p>' + message + '</p><div class="button-box"></div></div>')
var list = element.find('.button-box');
for (let i = 0; i < data.length; i++) {
var item = data[i];
var allowClick = true;
var btn = $('<div class="msg-btn" style="background-color: #e6f2ff !important;">' + item.label + '</div>');
var regClick = function (key) {
btn.click(function () {
if (allowClick) {
allowClick = false;
socket.emit('message', {
appid: "${appid!''}",
userid: "${userid!''}",
type: "message",
session: "${sessionid!''}",
orgi: "${orgi!''}",
message: key
});
}
});
}
regClick(item.text);
list.append(btn);
}
return element;
}
function createQList(message,data){
for (let i = 0; i < data.length; i++) {
}
}
function createCard(message,data){
for (let i = 0; i < data.length; i++) {
}
}
function showExtmsg(username,createtime,message,json) {
var expmsg = JSON.parse(json);
var type = expmsg[0].type;
var content;
if (type == 'button') {
content = createButton(message,expmsg);
} else if (type == 'qlist') {
content = createQList(message,expmsg);
} else if (type == 'card') {
content = createCard(message,expmsg);
}
var box = $('<div class="chat-left"> <img class="user-img" src="<#if inviteData?? && inviteData.consult_dialog_headimg??>/res/image.html?id=${inviteData.consult_dialog_headimg?url}<#else>/images/agent.png</#if>" alt=""><div class="chat-message"><label class="user">'+username+'</label><label class="time">'+createtime+'</label> </div><div class="chatting-left"><i class="arrow"></i><div class="chat-content"></div></div>');
box.find('.chat-content').append(content);
output(box,'chat-block')
}
function sendDisconnect(){
socket.disconnect();
}
@ -540,8 +618,10 @@
inx++ ;
}
}
var element = ("<div class='clearfix "+clazz+"'>" +" " + message + "</div>");
document.getElementById('above').innerHTML= (document.getElementById('above').innerHTML + element);
var element = $("<div class='clearfix "+clazz+"'></div>");
element.append(message);
$('#above').append(element);
if(scroll == null || scroll == true){
document.getElementById('above').scrollTop = document.getElementById('above').scrollHeight ;
}