|
|
<!DOCTYPE html>
|
|
|
<html lang="en">
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
<title>微信会话存档</title>
|
|
|
<link rel="stylesheet" href="/css/information-system3.css?v=201508112" type="text/css"/>
|
|
|
<script type="text/javascript" src="/min/?f=/js/information-system3.min.js,/js/common.js&v=20190128"></script>
|
|
|
<link rel="shortcut icon" href="/bootstrap/img/glyphicons_290_skull.png">
|
|
|
<style type="text/css">
|
|
|
<?php echo empty($userid)?'':'.useridandhidden{display:none;}'; ?>
|
|
|
</style>
|
|
|
|
|
|
</head>
|
|
|
<body>
|
|
|
|
|
|
<div class="container-fluid">
|
|
|
<div class="row">
|
|
|
|
|
|
<div class="col-md-5 useridandhidden">
|
|
|
<h4>成员列表</h4>
|
|
|
<div class="list-group" id="permit_user_list">
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="col-md-5 useridandhidden">
|
|
|
<H4>客户列表 <span class="badge" id="externalcontact_count">0</span> <small class="pull-right">
|
|
|
<a>私聊信息</a> |
|
|
|
<a>群聊信息</a>
|
|
|
</small></h4>
|
|
|
<div class="well well-sm">
|
|
|
<form class="form-inline">
|
|
|
<div class="form-group">
|
|
|
<input type="text" class="form-control" id="contact_search_username" placeholder="搜索客人">
|
|
|
</div>
|
|
|
<button type="button" class="btn btn-default"
|
|
|
onclick="get_externalcontact_list(0,$('#contact_search_username').val());">搜索
|
|
|
</button>
|
|
|
</form>
|
|
|
</div>
|
|
|
<div class="list-group" id="externalcontact_list" style="overflow-y: scroll;max-height: 680px;">
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="col-md-14">
|
|
|
<h4>聊天记录</h4>
|
|
|
<div class="well well-sm useridandhidden">
|
|
|
<form class="form-inline">
|
|
|
<a>近一周</a> |
|
|
|
<a>近一月</a>
|
|
|
<div class="form-group">
|
|
|
<input name="potential_customers_ApplydateStart" id="potential_customers_ApplydateStart"
|
|
|
type="text"
|
|
|
placeholder="开始日期"
|
|
|
class="form-control ShowMeTheDatePicker_cn"
|
|
|
value="<?php echo date('Y-m-d', strtotime('-1 week last monday')); ?>">
|
|
|
</div>
|
|
|
<div class="form-group">
|
|
|
<input name="potential_customers_ApplydateStart" id="potential_customers_ApplydateStart"
|
|
|
type="text"
|
|
|
placeholder="结束时间"
|
|
|
class="form-control ShowMeTheDatePicker_cn"
|
|
|
value="<?php echo date('Y-m-d', strtotime('-1 week last monday')); ?>">
|
|
|
</div>
|
|
|
<div class="form-group">
|
|
|
<input type="text" class="form-control" id="exampleInputName2" placeholder="搜索关键词">
|
|
|
</div>
|
|
|
<button type="button" class="btn btn-default" disabled>搜索</button>
|
|
|
</form>
|
|
|
</div>
|
|
|
|
|
|
<div id="chat_msg_list" class="row" style="overflow-y: scroll;max-height: 680px;">
|
|
|
</div>
|
|
|
|
|
|
<nav aria-label="Page navigation" class="text-center">
|
|
|
<ul class="pagination" id="chat_msg_list_page_nav">
|
|
|
</ul>
|
|
|
</nav>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
//ES6转ES5,HT只能调用IE来显示 https://babeljs.io/repl
|
|
|
$(document).ready(function () {
|
|
|
<?php echo empty($userid) ? 'get_permit_user_list();' : "get_chat_msg_list('{$userid}',0);" ?>
|
|
|
});
|
|
|
|
|
|
let g_permit_user = '';//当前选择的顾问
|
|
|
let g_externalcontact_user = '';//当前选中的客人
|
|
|
|
|
|
|
|
|
//获取会话存档的用户列表
|
|
|
function get_permit_user_list() {
|
|
|
$.ajax({
|
|
|
type: "post",
|
|
|
dataType: "json",
|
|
|
url: "<?php echo site_url('weixinchat/show_me_the_data')?>",
|
|
|
data: {
|
|
|
"url": '/weixin/wxwork/get_permit_user_list'
|
|
|
},
|
|
|
success: function (data, textStatus) {
|
|
|
document.getElementById('permit_user_list').innerHTML = '';
|
|
|
permit_user_list = '';
|
|
|
data.Result && data.errcode == '0' && data.Result.forEach(function (item) {
|
|
|
permit_user_list += `
|
|
|
<a href="javascript:void(0);" onclick="get_externalcontact_list('${item.userid}');g_permit_user='${item.userid}';" class="list-group-item">
|
|
|
<div class="row">
|
|
|
<div class="col-md-4" style="padding: 0 0 0 15px;">
|
|
|
<img src="${item.avatar}" class="img-responsive">
|
|
|
</div>
|
|
|
<div class="col-md-20">
|
|
|
<div>
|
|
|
<div class="list-group-item-heading">${item.username}</div>
|
|
|
<p class="list-group-item-text">${item.userid}</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</a>
|
|
|
`;
|
|
|
})
|
|
|
document.getElementById('permit_user_list').innerHTML = permit_user_list;
|
|
|
},
|
|
|
error: function () {
|
|
|
$.modaldialog.error("\u53d1\u751f\u9519\u8bef\uff0c\u8bf7\u8054\u7cfbYCC")
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
|
|
|
//获取客户列表
|
|
|
function get_externalcontact_list(permit_user, username = '') {
|
|
|
if (!permit_user && g_permit_user) {
|
|
|
permit_user = g_permit_user;
|
|
|
}
|
|
|
$.ajax({
|
|
|
type: "post",
|
|
|
dataType: "json",
|
|
|
url: "<?php echo site_url('weixinchat/show_me_the_data')?>",
|
|
|
data: {
|
|
|
"url": '/weixin/wxwork/get_externalcontact_list?userid=' + permit_user + '&searchstr=' + username,
|
|
|
},
|
|
|
success: function (data, textStatus) {
|
|
|
document.getElementById('chat_msg_list').innerHTML = '';
|
|
|
document.getElementById('externalcontact_count').innerHTML = '0';
|
|
|
externalcontact_list = '';
|
|
|
data.Result && data.errcode == '0' && data.Result.forEach(item => {
|
|
|
externalcontact_list += `
|
|
|
<a href="javascript:void(0);" onclick="get_chat_msg_list('${item.userid}',0);g_externalcontact_user='${item.userid}';" class="list-group-item">
|
|
|
<div class="row">
|
|
|
<div class="col-md-4" style="padding: 0 0 0 15px;">
|
|
|
<img src="${item.avatar}" class="img-responsive">
|
|
|
</div>
|
|
|
<div class="col-md-20">
|
|
|
<div>
|
|
|
<div class="list-group-item-heading">${item.username}</div>
|
|
|
<p class="list-group-item-text"></p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</a>
|
|
|
`;
|
|
|
})
|
|
|
document.getElementById('externalcontact_list').innerHTML = externalcontact_list;
|
|
|
document.getElementById('externalcontact_count').innerHTML = data.Result.length;
|
|
|
},
|
|
|
error: function () {
|
|
|
$.modaldialog.error("\u53d1\u751f\u9519\u8bef\uff0c\u8bf7\u8054\u7cfbYCC")
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
|
|
|
//获取聊天记录
|
|
|
const chat_page_count = 20;//每页消息数
|
|
|
function get_chat_msg_list(user_id, chat_page) {
|
|
|
$.ajax({
|
|
|
type: "post",
|
|
|
dataType: "json",
|
|
|
url: "<?php echo site_url('weixinchat/show_me_the_data')?>",
|
|
|
data: {
|
|
|
"url": `/weixin/wxwork/GetChatmsg?external_userid=${user_id}&Page_count=${chat_page_count}&curr_page=${chat_page}`,
|
|
|
},
|
|
|
success: function (data, textStatus) {
|
|
|
//消息框内容
|
|
|
document.getElementById('chat_msg_list').innerHTML = '';
|
|
|
let chat_msg_list = '';
|
|
|
data.chatmsg && data.errcode == '0' && data.chatmsg.forEach(item => {
|
|
|
let content = '';//消息内容
|
|
|
switch (item.msgtype) {
|
|
|
case 'image':
|
|
|
content = `<img src="${item.content.imageurl}" class="img-responsive">`;
|
|
|
break;
|
|
|
case 'text':
|
|
|
content = item.content.text;
|
|
|
break;
|
|
|
case 'link':
|
|
|
content = `<a href="${item.content.link_url}" target="_blank" title="${item.content.description}">${item.content.title}</a>`;
|
|
|
break;
|
|
|
case 'revoke':
|
|
|
content = `<small>撤回了一条消息</small>`;
|
|
|
break;
|
|
|
case 'file':
|
|
|
content = `<a href="${item.content.fileurl}" target="_blank" title="${item.content.filename}">${item.content.filename}</a>`;
|
|
|
break;
|
|
|
case 'emotion':
|
|
|
content = `<img src="${item.content.emotion}" class="img-responsive">`;
|
|
|
break;
|
|
|
default://未识别的内容,提示识别
|
|
|
content = '未识别的消息类型:' + item.msgtype;
|
|
|
}
|
|
|
|
|
|
chat_msg_list += `
|
|
|
<div class="col-md-2" style="padding: 0 0 0 10px;">
|
|
|
<img src="${item.from_avatar}"
|
|
|
class="img-responsive">
|
|
|
</div>
|
|
|
<div class="col-md-22">
|
|
|
<p class="ptext-muted">${item.from_name} <small>${timestamp_to_date(item.msgtime)}</small></p>
|
|
|
<div class="panel panel-default">
|
|
|
<div class="panel-body">
|
|
|
${content}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
`;
|
|
|
})
|
|
|
document.getElementById('chat_msg_list').innerHTML = chat_msg_list;
|
|
|
|
|
|
//滚动条到最底部
|
|
|
document.getElementById('chat_msg_list').scrollTop = document.getElementById('chat_msg_list').scrollHeight;
|
|
|
|
|
|
//分页导航
|
|
|
let chat_msg_list_page_nav = '';
|
|
|
document.getElementById('chat_msg_list_page_nav').innerHTML = '';
|
|
|
if (data.chatpage && data.errcode == '0') {
|
|
|
let external_userid = data.external_userid;
|
|
|
let chat_page_curr = data.chatpage.currpage;
|
|
|
let chat_page_total = data.chatpage.totalpage;
|
|
|
for (let page_nav_index = 0; page_nav_index < chat_page_total; page_nav_index++) {
|
|
|
chat_msg_list_page_nav += `<li class="${chat_page_curr == page_nav_index + 1 ? 'active' : ''}"><a href="javascript:void(0);" onclick="get_chat_msg_list('${external_userid}',${page_nav_index + 1})">${page_nav_index + 1}</a></li>`;
|
|
|
}
|
|
|
document.getElementById('chat_msg_list_page_nav').innerHTML = chat_msg_list_page_nav;
|
|
|
}
|
|
|
|
|
|
},
|
|
|
error: function () {
|
|
|
$.modaldialog.error("\u53d1\u751f\u9519\u8bef\uff0c\u8bf7\u8054\u7cfbYCC")
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
|
|
|
function timestamp_to_date(timestamp) {
|
|
|
let date = new Date(timestamp);
|
|
|
return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate() + ' ' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds();
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
</body>
|
|
|
</html>
|