var uinfo = { id: 'KF' + uid, username: uname, avatar: avatar, group: group }; const heartTime = 20 * 1000; // 删除离线用户 var del_offline_user_list_time = 1 * 1000 * 60 * 60; var del_offline_user_num = 50; var del_offline_user_time = 1000 * 60; var del_offline_tmp_time_obj = null; // var del_offline_user_list_time = 6000; var wsUrl = socket_server; var ws; //websocket实例 var lockReconnect = false; //避免重复连接 // 确定用户收到消息 var user_receive_msg = false; // 当前对话用户的信息 var user_info_tmp = {}; // 是否占线 var repetition_line = false; // 本地消息存储方式localStorage/indexDB var msg_save_type = "indexDB"; var limit = 50; var page = 1; // indexdb初始化 var db = inquiryDB(uinfo.id, 'chat_data', 1); // // 1console.log("service/mylink"); // var id_payment = (new Date()).valueOf(); // 返回结果如果为true的话那么就创建新链接反之不创建 // checkSocketLogin(uid, token, wsUrl); // var check_line = false; // setTimeout(function () { // check_line = sessionStorage.getItem('kf_check_line_' + uid); // // console.log(check_line); // if (check_line) { // sessionStorage.removeItem('kf_check_line_' + uid); // createWebSocket(wsUrl); // } // }, 500); $.get(`/service/index/checkUserOnline`, function (res) { if (res.online == false) { createWebSocket(wsUrl); } else { layui.use('layer', function () { var layer = layui.layer; layer.alert('聊天室链接已存在,请点击右上角下班,退出登录后再重新登录'); }); } }); // 创建一个Socket实例 function createWebSocket(url) { try { ws = new WebSocket(url); eventHandle(); } catch (e) { reconnect(url); } } function eventHandle() { ws.onclose = function () { if (ws.readyState != 1) { userStatus(2); setTimeout(function () { reconnect(wsUrl); }, 1000); } }; ws.onerror = function () { // layer.alert('连接失败,正在尝试重连...', { icon: 2, title: '错误提示' }); userStatus(2); reconnect(wsUrl); }; ws.onopen = function () { layui.use(['layer'], function () { var layer = layui.layer; layer.ready(function () { userStatus(1); //layer.msg('链接成功', { time: 1000 }); }); layer.closeAll(); }); // 登录 var login_data = '{"path":"api\/init","param":{"type":"kf","group_id" : ' + uinfo.group + '},"access_token" : "' + token + '"}'; ws.send(login_data); //心跳检测重置 heartCheck.reset().start(); }; ws.onmessage = function (res) { var data = eval("(" + res.data + ")"); // console.log(data); user_receive_msg = false; switch (data['message_type']) { // 服务端ping客户端 case 'ping': ws.send('{"type":"ping"}'); break; // 添加用户 case 'connect': var timerId = sessionStorage.getItem('timerid_' + uinfo.id + '_' + data.data.user_info.id) // onlineOrOffIdent(data.data.user_info.id, 1); addUser(data.data.user_info); // 离线用户切换为在线用户 var checkuser = 'f-' + data.data.user_info.id; $("#offline_user_list li").each(function () { if ($(this).attr('id') == checkuser) { delOffUser(data.data.user_info); } }); // 如果在线用户tab为折叠状态,则tab上显示新消息提醒 showTabNotice('on'); if (timerId != null) { clearTimeout(timerId) // addUser(data.data.user_info); sessionStorage.removeItem('timerid_' + uinfo.id + '_' + data.data.user_info.id) onlineOrOffIdent(data.data.user_info.id, 1); } break; // 移除访客到主面板 case 'delUser': var timerId = setTimeout(function () { delUser(data.data); $("#on_span").attr('class', 'fold'); sessionStorage.removeItem('timerid_' + uinfo.id + '_' + data.data.id) // }, 1000); }, 1 * 60 * 1000); sessionStorage.setItem('timerid_' + uinfo.id + '_' + data.data.id, timerId) systemHint(data.data.userinfo.uid, `系统提示: ${data.data.userinfo.name} 已离线!`); onlineOrOffIdent(data.data.userinfo.uid, 2); // layer.msg('用户:' + data.data.userinfo.name + '已离线!'); break; // 监测聊天数据 case 'text': var chekc_msg = checkMsgIsRepeat(user_info_tmp.u_id, data.data.msg_id); if (chekc_msg) return; showUserMessage(data.data, data.data.content); break; case 'img': // 1console.log("收到用户消息"); var chekc_msg = checkMsgIsRepeat(user_info_tmp.u_id, data.data.msg_id); if (chekc_msg) return; showUserMessage(data.data, data.data.content); break; // 处理转接结果通知 case 'changeGroupResult': var chekc_msg = checkMsgIsRepeat(user_info_tmp.u_id, data.data.msg_id); if (chekc_msg) return; // 转接成功 if (data.data.status) { // 将该会员从我的会话中移除 var id = $("#active-user").attr('data-id'); delUser({ id: id }); } // 提示结果信息 layer.msg(data.data.content); break; // 提示信息 case 'alert': var chekc_msg = checkMsgIsRepeat(user_info_tmp.u_id, data.data.msg_id); if (chekc_msg) return; layer.msg(data.data.content); break; // 确定用户收到发送的消息 case 'received': // user_receive_msg = true; // 消息状态 // sessionStorage.setItem('send_time_receive_msg_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + data.data.msg_id, true); // 清除定时器 // var send_time = sessionStorage.getItem('send_time_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + data.data.msg_id); // // 1console.log(send_time); // clearTimeout(send_time); // 移除重发消息次数 // reSendMsgNum(data.data.msg_id, 'del'); // 1console.log("对方已成功接收到客服发送的信息"); // 1console.log(data); // if (user_info_tmp.u_id == data.data.id) { // console.log(data.data.msg_id); if (data.data.to_uid_is_online == 1) { receivedStatusShow(data.data.msg_id, 2); db.updateMsgStatus('msg_id', data.data.msg_id, 2, function (e) { // console.log(e); }) } // } break; // 确定用户收到发送的消息 case 'server_received': // user_receive_msg = true; // 消息状态 sessionStorage.setItem('send_time_receive_msg_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + data.data.msg_id, true); // 清除定时器 var send_time = sessionStorage.getItem('send_time_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + data.data.msg_id); // // 1console.log(send_time); clearTimeout(send_time); // 移除重发消息次数 reSendMsgNum(data.data.msg_id, 'del'); // 1console.log("对方已成功接收到客服发送的信息"); // 1console.log(data); // if (user_info_tmp.u_id == data.data.id) { receivedStatusShow(data.data.msg_id, 1); // } db.updateMsgStatus('msg_id', data.data.msg_id, 1, function (e) { // console.log(e); }) break; // 自动回复 case 'auto_reply': var chekc_msg = checkMsgIsRepeat(user_info_tmp.u_id, data.data.msg_id); if (chekc_msg) return; id_payment = (new Date()).valueOf(); // sendMessage(data.data.content) var msg = data.data.content; var msg_id = uuid(); if (data.data.payment != "" && data.data.payment != null) { sessionStorage.setItem("data", JSON.stringify(data.data)); var payment = data.data.payment; switch (payment) { case 'wexin': var msg = "img[" + "/static/service/images/payment/ic_bg_payment1.png" + "]" break; case 'alipay': var msg = "img[" + "/static/service/images/payment/ic_bg_payment.png" + "]" break; case 'huabei': var msg = "img[" + "/static/service/images/payment/ic_bg_payment34.png" + "]" break; case 'credit': var msg = "img[" + "/static/service/images/payment/ic_bg_payment6.png" + "]" break; case 'bank': var msg = "img[" + "/static/service/images/payment/ic_bg_payment2.png" + "]" break; case 'cloud_pay': var msg = "img[" + "/static/service/images/payment/ic_bg_payment7.png" + "]" break; case 'baitiao': var msg = "img[" + "/static/service/images/payment/ic_bg_payment8.png" + "]" break; default: break; } } var word = msgFactory(msg, 'mine', uinfo, payment, msg_id); // var uid = $("#active-user").attr('data-id'); // var uname = $("#active-user").attr('data-name'); var uid = data.data.data.to_id; var uname = data.data.data.to_name; //微信缓存 if (data.data.payment != "" && data.data.payment != null && data.data.payment == 'wexin') { sessionStorage.setItem("payment_wexin", JSON.stringify(data.data)); } //支付宝缓存 if (data.data.payment != "" && data.data.payment != null && data.data.payment == 'alipay') { sessionStorage.setItem("payment_alipay", JSON.stringify(data.data)); } //花呗缓存 if (data.data.payment != "" && data.data.payment != null && data.data.payment == 'huabei') { sessionStorage.setItem("payment_huabei", JSON.stringify(data.data)); } //信用卡缓存 if (data.data.payment != "" && data.data.payment != null && data.data.payment == 'credit') { sessionStorage.setItem("payment_credit", JSON.stringify(data.data)); } //银行卡缓存 if (data.data.payment != "" && data.data.payment != null && data.data.payment == 'bank') { sessionStorage.setItem("payment_bank", JSON.stringify(data.data)); } //云闪付缓存 if (data.data.payment != "" && data.data.payment != null && data.data.payment == 'cloud_pay') { sessionStorage.setItem("payment_cloud_pay", JSON.stringify(data.data)); } //京东白条缓存 if (data.data.payment != "" && data.data.payment != null && data.data.payment == 'baitiao') { sessionStorage.setItem("payment_baitiao", JSON.stringify(data.data)); } if (data.data.payment != '' && data.data.payment != null) { var payment_type = data.data.payment if (payment_type == 'wexin') { var wexin = sessionStorage.payment_wexin; var wexin = JSON.parse(wexin).payment; $("#" + id_payment).attr("payment", wexin) } else if (payment_type == 'alipay') { var alipay = sessionStorage.payment_alipay; var alipay = JSON.parse(alipay).payment; $("#" + id_payment).attr("payment", alipay) } else if (payment_type == 'huabei') { var huabei = sessionStorage.payment_huabei; var huabei = JSON.parse(huabei).payment; $("#" + id_payment).attr("payment", huabei) } else if (payment_type == 'credit') { var credit = sessionStorage.payment_credit; var credit = JSON.parse(credit).payment; $("#" + id_payment).attr("payment", credit) } else if (payment_type == 'bank') { var bank = sessionStorage.payment_bank; var bank = JSON.parse(bank).payment; $("#" + id_payment).attr("payment", bank) } else if (payment_type == 'cloud_pay') { var cloud_pay = sessionStorage.payment_cloud_pay; var cloud_pay = JSON.parse(cloud_pay).payment; $("#" + id_payment).attr("payment", cloud_pay) } else if (payment_type == 'baitiao') { var baitiao = sessionStorage.payment_baitiao; var baitiao = JSON.parse(baitiao).payment; $("#" + id_payment).attr("payment", baitiao) } } ws.send(JSON.stringify({ path: 'api\/chat', param: { type: 'kf', payment: data.data.payment, data: data.data.data, to_id: uid, to_name: uname, content: data.data.content, from_name: uinfo.username, from_id: uinfo.id, from_avatar: uinfo.avatar, msg_id: msg_id, }, access_token: token })); if (user_info_tmp.u_id == uid) { $("#u-" + uid).append(word); $(".msg-area").val(''); } // var uid = $("#active-user").attr('data-id'); // var uname = $("#active-user").attr('data-name'); // var time = getTime(); var time = data.data.time; // db.addMsg({ type: 'mine', from_id: uinfo.id, from_name: uinfo.username, time_line: time, to_name: uname, to_id: uid, img_id: id_payment, payment: data.data.payment, data: data.data.data, content: data.data.content, from_avatar: uinfo.avatar, msg: msg, msg_id: msg_id }, function (e) { // setTimeout(function () { // // if (e.readyState == 'done') console.log('成功'); // // console.log(e.readyState); // }, 50); // }); saveMsg(`${uinfo.id}-${uid}`, { type: 'mine', from_id: uinfo.id, from_name: uinfo.username, time_line: time, to_name: uname, to_id: uid, img_id: id_payment, payment: data.data.payment, data: data.data.data, content: data.data.content, from_avatar: uinfo.avatar, msg: msg, msg_id: msg_id, uid: uid }); // var save_data = { key: `${uinfo.id}-${uid}`, data: } // cacheChat(save_data); // console.log(data.data.content); // var key = uinfo.id + '-' + uid; // if (typeof (Storage) !== "undefined") { // var localMsg = msgQueueCheck(getCache(key)); // if (localMsg == null || localMsg.length == 0) { // localMsg = []; // } // localMsg.push({ type: 'mine', from_id: uinfo.id, from_name: uinfo.username, time_line: time, to_name: uname, to_id: uid, img_id: id_payment, payment: data.data.payment, data: data.data.data, content: data.data.content, from_avatar: uinfo.avatar, msg: msg, msg_id: msg_id }); // cacheChat({ key: key, data: localMsg }); // } clickpayment(); // 滚动条自动定位到最底端 wordBottom(); checkUserReceiveMsg(`${msg_id}`, 2); break; case 'repetition_line': repetition_line = true; // layer.msg('账号重复登录链接已断开'); layer.alert('该账号已在别处登录, 请重新登录!', { title: false, closeBtn: 0 }, function () { userStatus(2); window.parent.location.href = '/service/login/loginout?type=2'; }); break; } //如果获取到消息,心跳检测重置 //拿到任何消息都说明当前连接是正常的 heartCheck.reset().start(); } } /** * 过滤消息队列 * @param {*} msg_list 消息列表 * @param {*} length 长度 */ function msgQueueCheck(msg_list, length = 50) { if (typeof msg_list == "undefined" || msg_list == null || msg_list == "") return msg_list; if (msg_list.length < length) return msg_list; // $new_list = msg_list.slice(msg_list.length - length, length); $new_list = msg_list.slice(msg_list.length - length); return $new_list; } /** * 客服状态 */ function userStatus(type = 1) { var color = type == 1 ? '#5dea85' : '#f73939'; setTimeout(function () { parent.$('#user_status').css('cssText', `background-color: ${color} !important`); }, 1000); } /** * 系统提示 * @param {*} uid 用户id * @param {*} content 提示内容 * @date 20190413 */ function systemHint(uid, content) { var msg_box = $('#u-' + uid); if (!msg_box) return false; var hint_html = ``; msg_box.append(hint_html); wordBottom(); } /** * 用户上线或者下线提示标识 * @param {*} uid 用户id * @param {*} type 提示类型: 1: 上线, 2: 下线 */ function onlineOrOffIdent(uid, type) { var user_dom = $('#f-' + uid); user_dom.find('.ident').remove(); switch (type) { case 1: user_dom.append(``); break; case 2: user_dom.append(``); break; } } function reconnect(url) { if (lockReconnect || repetition_line == true) return; lockReconnect = true; //没连接上会一直重连,设置延迟避免请求过多 setTimeout(function () { createWebSocket(url); lockReconnect = false; }, 2000); } function clickpayment() { // // 1console.log(6754213423); // payShowLayer(); // $(".layui-mylink-photos").on('click', function () { // $(".layui-mylink-photos").on('click', function () { // }); } /** * 支付显示 * @param {*} _this 当前点击对象 */ function payShowLayer(_this) { sessionStorage.getItem("payment"); //支付宝 var alipay_data = sessionStorage.payment_alipay; // 1console.log(this); if (alipay_data) { var src = JSON.parse(alipay_data).content var length = src.length var img_alipay = src.substring(4, length - 1) var alipay = JSON.parse(alipay_data).payment var name = JSON.parse(alipay_data).data.name var account_num = JSON.parse(alipay_data).data.account_num } else { var alipay = '' } //微信 var wexin = sessionStorage.payment_wexin; if (wexin) { var src = JSON.parse(wexin).content var length = src.length var img_wexin = src.substring(4, length - 1) var wexin = JSON.parse(wexin).payment } else { var wexin = '' } //花呗 var huabei = sessionStorage.payment_huabei; if (huabei) { var src = JSON.parse(huabei).content var length = src.length var img_huabei = src.substring(4, length - 1) var huabei = JSON.parse(huabei).payment } else { var huabei = '' } //信用卡 var credit = sessionStorage.payment_credit; if (credit) { var src = JSON.parse(credit).content var length = src.length var img_credit = src.substring(4, length - 1) var credit = JSON.parse(credit).payment } else { var credit = '' } //银行卡 var bank_data = sessionStorage.payment_bank; if (bank_data) { var bank = JSON.parse(bank_data).payment var name = JSON.parse(bank_data).data.name var account_num = JSON.parse(bank_data).data.account_num var branch_bank = JSON.parse(bank_data).data.branch_bank var open_bank = JSON.parse(bank_data).data.open_bank } else { var bank = '' } //云闪付 var cloud_pay = sessionStorage.payment_cloud_pay; if (cloud_pay) { var src = JSON.parse(cloud_pay).content var length = src.length var img_cloud_pay = src.substring(4, length - 1) var cloud_pay = JSON.parse(cloud_pay).payment } else { var cloud_pay = '' } //京东白条 var baitiao = sessionStorage.payment_baitiao; if (baitiao) { var src = JSON.parse(baitiao).content var length = src.length var img_baitiao = src.substring(4, length - 1) var baitiao = JSON.parse(baitiao).payment } else { var baitiao = '' } var data = sessionStorage.data; if (data) { var src = JSON.parse(data).content var length = src.length var img = src.substring(4, length - 1) } else { var src = '' } if ($(_this).attr('payment') == '' && $(_this).attr('payment') == 'undefined') { // // showBigPic(); } else { if (wexin == $(_this).attr('payment')) { var _html = ""; _html += "
" _html += "

" + ' ' + "微信二维码收款


" _html += "

保存二维码到相册,微信|扫一扫|付钱

" _html += "
" layer.open({ title: false, content: _html, btn: false, skin: "wexin", isOutAnim: false }); } else if (alipay == $(_this).attr('payment')) { var _html = ""; _html += "
" _html += "

" + ' ' + "支付宝二维码收款


" _html += "

保存二维码到相册,支付宝|扫一扫|付钱

" _html += "
" _html += "
" _html += "

" + ' ' + "支付宝账号转账


" _html += "

可用支付宝,支付宝[转账]付钱

" _html += "" _html += "
支付宝账号" + name + "
支付宝姓名" + account_num + "
" layer.open({ title: false, content: _html, auto: ['500px', '500px'], btn: false, skin: "alipay", isOutAnim: false }); } else if (huabei == $(_this).attr('payment')) { var _html = ""; _html += "
" _html += "

" + ' ' + "蚂蚁花呗二维码收款


" _html += "

保存二维码到相册,支付宝|扫一扫|付钱

" _html += "
" _html += "
" _html += "

" + ' ' + "温馨提示


" _html += "

**花呗充值会收取手续费,详情请咨询专业**

" _html += "

为避免扫码失败,使用支付宝扫码之前,请关闭wifi,用手机流量来扫码支付

" _html += "
" layer.open({ title: false, content: _html, auto: ['500px', '500px'], btn: false, skin: "huabei", isOutAnim: false }); } else if (credit == $(_this).attr('payment')) { var _html = ""; _html += "
" _html += "

" + ' ' + "信用卡二维码收款


" _html += "

保存二维码到相册,支付宝|扫一扫|付钱

" _html += "
" _html += "
" _html += "

" + ' ' + "温馨提示


" _html += "

**信用卡充值会收取手续费,详情请咨询专业**

" _html += "

同时支持支付宝与微信扫码

" _html += "

为避免扫码失败,使用支付宝扫码之前,请关闭wifi,用手机流量来扫码支付

" _html += "

若进行大额支付,使用微信扫码会比支付宝成功率高哦~

" _html += "
" layer.open({ title: false, content: _html, auto: ['500px', '500px'], btn: false, skin: "credit", isOutAnim: false }); } else if (bank == $(_this).attr('payment')) { var _html = ""; _html += "
" _html += "

" + ' ' + "银行卡收款


" _html += "

可用支付宝,微信[转账到银行卡]功能付钱

" _html += "" _html += "" _html += "" _html += "
银行卡姓名" + name + "
银行卡号" + account_num + "
开户银行" + open_bank + "
开户支行" + branch_bank + "
" _html += "
" _html += "

" + ' ' + "温馨提示


" _html += "

**信用卡充值会收取手续费,详情请咨询专业**

" _html += "

同时支持支付宝与微信扫码

" _html += "

为避免扫码失败,使用支付宝扫码之前,请关闭wifi,用手机流量来扫码支付

" _html += "

若进行大额支付,使用微信扫码会比支付宝成功率高哦~

" _html += "
" layer.open({ title: false, content: _html, auto: ['500px', '500px'], btn: false, skin: "credit", isOutAnim: false }); } else if (cloud_pay == $(_this).attr('payment')) { var _html = ""; _html += "
" _html += "

" + ' ' + "云闪付二维码收款


" _html += "

保存二维码到相册,云闪付|扫一扫|付钱

" _html += "
" _html += "
" _html += "

" + ' ' + "温馨提示


" _html += "

**云闪付充值,详情请咨询专业**

" _html += "

为避免扫码失败,使用云闪付扫码之前,请关闭wifi,用手机流量来扫码支付

" _html += "
" layer.open({ title: false, content: _html, auto: ['500px', '500px'], btn: false, skin: "cloud_pay", isOutAnim: false }); } else if (baitiao == $(_this).attr('payment')) { var _html = ""; _html += "
" _html += "

" + ' ' + "京东白条二维码收款


" _html += "

保存二维码到相册,京东|扫一扫|付钱

" _html += "
" _html += "
" _html += "

" + ' ' + "温馨提示


" _html += "

**京东白条充值,详情请咨询专业**

" _html += "

为避免扫码失败,使用京东扫码之前,请关闭wifi,用手机流量来扫码支付

" _html += "
" layer.open({ title: false, content: _html, auto: ['500px', '500px'], btn: false, skin: "cloud_pay", isOutAnim: false }); } } } //心跳检测 var heartCheck = { timeout: heartTime, timeoutObj: null, serverTimeoutObj: null, reset: function () { clearTimeout(this.timeoutObj); clearTimeout(this.serverTimeoutObj); return this; }, start: function () { var self = this; this.timeoutObj = setTimeout(function () { self.serverTimeoutObj = setTimeout(function () { //如果超过一定时间还没重置,说明后端主动断开了 reconnect(wsUrl); }, self.timeout); //发送心跳 ws.send(JSON.stringify({ path: 'ping', param: { 'type': 'kf' } })); }, this.timeout); } }; /** * 缓存用户数据 * @param data */ function cacheUserData(data) { var uid = data.id; // 1console.log(uid + '用户数据:'); //存储订单数据 // sessionStorage.setItem("f-"+uid, JSON.stringify(data.data)); } /** * 商品与订单模板渲染 * @param id */ function order_view(id, type) { // 1console.log('order_view'); // layui.use('laytpl', function(){ // var laytpl = layui.laytpl; // var data = sessionStorage.getItem('f-'+id); // if(!data) return false; // data = JSON.parse(data); // //渲染模版 // var getTpl = $('#'+data.type+'_tpl').html(); // laytpl(getTpl).render(data[data.type], function(html){ // if(type == 'del') html = ''; // $('#order_list').html(html); // }); // }; // }); } $(function () { // 获取服务用户列表(在线用户) $.getJSON('/service/index/getUserList', function (res) { // 1console.log('----'); // 1console.log(res); // 1console.log('------'); if (1 == res.code) { if (res.data.length > 0) { showUserListOnLine(res.data); } } // 初始化选择者 initChatBox(); }); // 离线用户列表 // $.getJSON('/service/index/getOfflineUserList', function (res) { // // 1console.log('----'); // // 1console.log(res); // // 1console.log('------'); // if (res.code == 1) { // if (res.data.length > 0) { // // console.log(res.data); // showUserListOffLine(res.data); // } // } // // 初始化选择者 // // initChatBox(); // }); getOfflineUserPage(1); // 监听快捷键发送 document.getElementById('msg-area').addEventListener('keydown', function (e) { // if (e.keyCode != 13) return; if (event.keyCode == 13) { e.preventDefault(); // 取消事件的默认动作 sendMessage(); } }); // 点击表情 var index; $("#face").click(function (e) { e.stopPropagation(); layui.use(['layer'], function () { var layer = layui.layer; var isShow = $(".layui-mylink-face").css('display'); if ('block' == isShow) { layer.close(index); return; } var height = $(".chat-box").height() - 110; layer.ready(function () { index = layer.open({ type: 1, offset: [height + 'px', $(".layui-side").width() + 'px'], shade: false, title: false, closeBtn: 0, area: '395px', content: showFaces() }); }); }); }); $(document).click(function (e) { layui.use(['layer'], function () { var layer = layui.layer; if (isShow) { layer.close(index); return false; } }); }); // 发送消息 $("#send").click(function () { sendMessage(); }); // hover用户 $(".layui-unselect li").hover(function () { $(this).find('i').show(); }, function () { $(this).find('i').hide(); }); // 关闭用户 $('.close').click(function () { var uid = $(this).parent().data('id'); $(this).parent().remove(); // 清除左侧的用户列表 $('#u-' + uid).remove(); // 清除右侧的聊天详情 }); // 检测滚动,异步加载更多聊天数据 $(".chat-box").scroll(function () { var top = $(".chat-box").scrollTop(); }); // 会员转接 $("#scroll-link").click(function () { return false; var id = $("#active-user").attr('data-id'); var name = $("#active-user").attr('data-name'); var avatar = $("#active-user").attr('data-avatar'); var ip = $("#active-user").attr('data-ip'); if (id == '' || name == '') { layer.msg("请选择要转接的会员"); } // 二次确认 var layerIndex = null; layerIndex = layer.confirm('确定转接', { title: '转接提示', closeBtn: 0, icon: 3, btn: ['确定', '取消'] // 按钮 }, function () { layer.close(layerIndex); layerIndex = layer.open({ title: '', type: 1, area: ['30%', '40%'], content: $("#change-box") }); // 监听选择 layui.use(['form'], function () { var form = layui.form; form.on('select(group)', function (data) { if (uinfo.group == data.value) { layer.msg("已经在该分组,不需要转接!"); } else { layer.close(layerIndex); var group = data.value; // 分组 // 交换分组 var change_data = '{' + '"path":"api/changeGroup", ' + '"param":{"type":"kf", "uer_id":"' + id + '", "user_name" : "' + name + '", "avatar" : "' + avatar + '", "group_id": ' + group + ', "ip" : "' + ip + '"},' + '"access_token" : "' + token + '"}'; // 1console.log(change_data); ws.send(change_data); // layer.msg('转接成功'); } }); }); }, function () { }); }); //账号选择 $("#change-account").click(function () { var id = $("#active-user").attr('data-id'); var name = $("#active-user").attr('data-name'); var avatar = $("#active-user").attr('data-avatar'); var ip = $("#active-user").attr('data-ip'); // if(id == '' || name == ''){ // layer.msg("请选择要转接的会员"); // } // 二次确认 var layerIndex = null; // layerIndex = layer.confirm('确定更换支付账号?', { // title: '转接提示', // closeBtn: 0, // icon: 3, // btn: ['确定', '取消'] // 按钮 // }, function(){ // layer.close(layerIndex); // layerIndex = layer.open({ // title: '', // type: 1, // area: ['30%', '40%'], // content: $("#account-box") // }); layer.open({ title: '选择账号', type: 2, content: '/service/dialogue/selectAccount', // content: $("#account-box"), area: ['600px', '400px'] }); return; // 监听选择 layui.use(['form'], function () { var form = layui.form; form.on('select(type)', function (data) { $.getJSON('/service/index/changeType', { id: data.value }, function (res) { var option = ''; option += ''; $("#payment").html(); $.each(res.data, function (key, val) { if (val.id == 0) { option += '' $("#payment").html(option) form.render('select') } else { if (val.is_use == 1 && val.status == 1) { option += '' } else { option += '' } $("#payment").html(option) form.render('select') } }) $("#payment").get(0).selectIndex = 0 }); }) form.on('submit(changePayment)', function (data) { $.getJSON('/service/index/changeAccount', { id: data.field.payment, type: data.field.type }, function (res) { // // 1console.log(res); if (1 == res.code) { layer.closeAll(); layer.msg('更换成功,请刷新页面!'); } else if (0 == res.code) { layer.msg(res.msg); } }); // layer.close(layerIndex); }); }); // }, function(){ // }); }); // 添加拖拽上传事件 dragUploadFile('body'); // 添加粘贴上传事件 pasteUploadFile(); }); /** * 渲染在线用户列表 * @param {*} data 列表数据 */ function showUserListOnLine(data) { if (data.length < 1 || data == '') return false; // 如果有在线用户则展开tab $("#on_span").attr('class', 'unfold'); // 添加用户 $.each(data, function (k, v) { addUser(v, false); }); //添加数量 $('#line-user-num').find('span').text(data.length); // var id = $(".layui-unselect").find('li').eq(0).data('id'); // var name = $(".layui-unselect").find('li').eq(0).data('name'); // // var avatar = $(".layui-unselect").find('li').eq(0).data('avatar'); // var ip = $(".layui-unselect").find('li').eq(0).data('ip'); // 默认设置第一个用户为当前对话的用户 // $("#active-user").attr('data-id', id).attr('data-name', name).attr('data-avatar', avatar).attr('data-ip', ip); // $(".all_user_list").find('li').eq(0).addClass('active').find('span:eq(1)').removeClass('layui-badge').text(''); // $("#f-user").val(name); // $("#f-user-id").val(id); // $("#coin_uid").val(id); // $("#f-ip").val(ip); // 储存用户信息 // user_info_tmp = { // u_id: id, // u_name: name, // u_avatar: avatar, // u_ip: ip, // } // $.getJSON('/service/index/getCity', { ip: ip }, function (res) { // $("#f-area").val(data); // }); // 链接数据库 // db = inquiryDB(`${uinfo.id}-${id}`, 'chat_data', 1); // 渲染首个订单模板 // order_view(id); } /** * 渲染离线用户列表 * @param {*} data 列表数据 */ function showUserListOffLine(data) { if (data.length < 1 || data == '') return false; $.each(data, function (k, v) { // 重置离线状态缓存 sessionStorage.removeItem('timerid_' + uinfo.id + '_' + v.id); addOffLineUser(v, 1); }); } /** * 搜索用户 * @param {*} type 搜索类型 */ function searchUser(type) { if (!type) { layer.msg('参数错误'); return; } switch (type) { // 在线 case 'on': var keyword = $('#keyword-on').val(); $.getJSON(`/service/index/getUserList?keyword=${keyword}`, function (res) { if (1 == res.code) { $("#user_list").find('li').remove(); showUserListOnLine(res.data); // 初始化选择者 initChatBox(); } }); break; // 离线 case 'off': var keyword = $('#keyword-off').val(); $.getJSON(`/service/index/getOfflineUserList?keyword=${keyword}&page=${page}&limit=${limit}`, function (res) { if (1 == res.code) { $("#offline_user_list").find('li').remove(); showUserListOffLine(res.data); // 初始化选择者 initChatBox(); } }); break; } } /** * 初始化聊天框 */ function initChatBox() { var checked_user = $('.active').data('id'); if (!checked_user) return false; $('.chat-box').find('ul').attr('id', 'u-' + checked_user); // $(`#u-${checked_user}`).addClass('show-chat-detail').siblings().removeClass('show-chat-detail'); getChatLog(checked_user, 1); // changeUserTab($(`#f-${checked_user}`)); } /** * 支付选择账号 */ function paySelect() { // 1console.log(1111); layer.open({ title: '选择账号', type: 2, content: '/service/dialogue/selectAccount', // content: $("#account-box"), area: ['600px', '400px'], // 检测关闭层 cancel: function (index, layero) { if (select_pay_type) { // // console.log(select_pay_type);return; window.location.reload(); } } }); } function send_qrcode() { var qrcode = $('#payment_img').attr('src'); var payment_type = $('#payment_type').val() var payment_name = $('#payment_name').val() var payment_num = $('#payment_num').val() var payment_bank = $('#payment_bank').val() var payment_open = $('#payment_open').val() // // console.log(qrcode); // if (!payment_type) { // layer.msg('支付账号不能为空'); // return; // } // console.log(qrcode, payment_type); if (payment_type != '银行卡支付') { if (qrcode != undefined) { sendMessage('img[' + qrcode + ']'); } sendMessage(`支付方式: ${payment_type} \n 收款姓名: ${payment_name} \n 收款账号: ${payment_num}`); } else { var content = "支付方式:" + payment_type + '\n' + "银行卡姓名:" + payment_name + "\n" + "银行卡号:" + payment_num + "\n" + "开户银行:" + payment_bank + "\n" + "开户支行:" + payment_open // 1console.log('发送的内容:' + content) sendMessage(content) } } var isShow = false; layui.use(['element', 'form'], function () { var element = layui.element; var form = layui.form; }); // 图片 文件上传 layui.use(['upload', 'layer'], function () { var upload = layui.upload; var layer = layui.layer; // 执行实例 var uploadInstImg = upload.render({ elem: '#image' // 绑定元素 , accept: 'images', exts: 'jpg|jpeg|png|gif', url: '/service/upload/uploadImg' // 上传接口 , done: function (res) { sendMessage('img[' + res.data.src + ']'); // showBigPic(); }, error: function () { // 请求异常回调 } }); var uploadInstFile = upload.render({ elem: '#file' // 绑定元素 , accept: 'file', exts: 'zip|rar', url: '/service/upload/uploadFile' // 上传接口 , done: function (res) { sendMessage('file(' + res.data.src + ')[' + res.msg + ']'); }, error: function () { // 请求异常回调 } }); }); // 展示表情数据 function showFaces() { isShow = true; var alt = getFacesIcon(); var _html = ''; return _html; } // 选择表情 function checkFace(obj) { var word = $(".msg-area").val() + ' face' + $(obj).attr('title') + ' '; // 1console.log('word') // 1console.log(word) // 1console.log('word') $(".msg-area").val(word).focus(); } // 发送消息 function sendMessage(sendMsg) { var msg = (typeof (sendMsg) == 'undefined') ? $(".msg-area").val() : sendMsg; msg = htmlEncode(msg); var msg_id = uuid(); if ('' == msg) { layui.use(['layer'], function () { var layer = layui.layer; return layer.msg('请输入回复内容', { time: 1000 }); }); return false; } if (repetition_line == true) { return layer.msg('当前链接已断线'); } // 1console.log('msg') // 1console.log(msg) // 1console.log('msg') var word = msgFactory(msg, 'mine', uinfo, null, msg_id); var uid = $("#active-user").attr('data-id'); var uname = $("#active-user").attr('data-name'); var time = getTime(); // 1console.log('我是消息'); if (!uid) { layui.use(['layer'], function () { var layer = layui.layer; return layer.msg('请先选择要发送的用户', { time: 1000 }); }); return false; } if (uid != user_info_tmp.u_id) { layui.use(['layer'], function () { var layer = layui.layer; return layer.msg('请重新选择发送用户', { time: 1000 }); }); return false; } ws.send(JSON.stringify({ path: 'api\/chat', param: { type: 'kf', to_id: uid, to_name: uname, content: msg, from_name: uinfo.username, msg_id: msg_id, from_id: uinfo.id, from_avatar: uinfo.avatar }, access_token: token })); //本地缓存 // db = inquiryDB(`${uinfo.id}-${uid}`, 'chat_data', 1); // db.addMsg({ type: 'mine', from_id: uinfo.id, from_name: uinfo.username, time_line: time, msg_id: msg_id, to_name: uname, to_id: uid, img_id: '', payment: '', content: msg, from_avatar: uinfo.avatar, msg: msg }, function (e) { // setTimeout(function () { // // if (e.readyState == 'done') console.log('成功'); // // console.log(e.readyState); // }, 50); // }); // var save_data = { key: `${uinfo.id}-${uid}`, data: { type: 'mine', from_id: uinfo.id, from_name: uinfo.username, time_line: time, msg_id: msg_id, to_name: uname, to_id: uid, img_id: '', payment: '', content: msg, from_avatar: uinfo.avatar, msg: msg } } // cacheChat(save_data); saveMsg(`${uinfo.id}-${uid}`, { type: 'mine', from_id: uinfo.id, from_name: uinfo.username, time_line: time, msg_id: msg_id, to_name: uname, to_id: uid, img_id: '', payment: '', content: msg, from_avatar: uinfo.avatar, msg: msg, uid: uid }); // 1console.log("开始添加") $("#u-" + uid).append(word); $(".msg-area").val(''); // 滚动条自动定位到最底端 wordBottom(); // 检测是否发送成功 checkUserReceiveMsg(`${msg_id}`); // 显示最后消息 lastMsg(uid, msg); } // 缓存聊天记录到本地 function cacheChat(obj) { if (typeof (Storage) !== "undefined") { // setTimeout(function () { // f1的任务代码 var list = getCache(obj.key); var len = 20; if (list != null && list.length >= len) { var s_num = list.length - len; // var start = s_num > 0 ? s_num - 1 : 0; // list.slice(start, list.length); list = list.slice(s_num); } list = list == null ? [] : list; // console.log(list, list.length, len); list.push(obj.data); localStorage.setItem(obj.key, JSON.stringify(list)); //   }, 100); } } // 从本地缓存中,拿出数据 function getCache(key) { var list = JSON.parse(localStorage.getItem(key)); list = list == null ? [] : list; return list; } // 缓存未读消息数 key: 'unread-' + kf_id + '-' + uid, number : 数量 function cacheUnread(key, number) { if (typeof (Storage) !== "undefined") { if (number) { localStorage.setItem(key, parseInt(number)); } else { localStorage.removeItem(key); // 传过来的数量为空则删除该缓存 } } } // 从本地获取未读消息数 function getUnread(key) { var result = localStorage.getItem(key) ? parseInt(localStorage.getItem(key)) : 0; return result; } //获取时间 function getTime() { var myDate = new Date(); var year = myDate.getFullYear(); var month = myDate.getMonth() + 1; var date = myDate.getDate(); var hour = myDate.getHours(); var minute = myDate.getMinutes(); var s = myDate.getSeconds(); if (date < 10) date = '0' + date; if (month < 10) month = '0' + month; if (hour < 10) hour = '0' + hour; if (minute < 10) minute = '0' + minute; if (s < 10) s = '0' + s; return year + '-' + month + "-" + date + " " + hour + ':' + minute + ':' + s; } // 展示用户发送来的消息 function showUserMessage(userInfo, content) { content = htmlEncode(content); // console.log(content) // 1console.log("成功收到对方消息,开始发送确认收到的回执消息"); var msg_id = uuid(); ws.send(JSON.stringify({ path: 'api\/sendReceiptMsg', param: { type: 'kf', msg_id: userInfo.msg_id }, access_token: token })); //消息提示音 sendWarnAudio('msg'); //添加用户到用户列表 if ($('#f-' + userInfo.id).length == 0) { addUser(userInfo); //存储订单数据 // sessionStorage.setItem("f-"+userInfo.id, JSON.stringify(userInfo.data)); order_view(userInfo.id); } // 如果 在线用户tab为折叠状态,则tab上显示新消息提醒 showTabNotice('on'); // 未读条数计数 if (!$('#f-' + userInfo.id).hasClass('active')) { let unread_num = getUnread(makeUnreadKey(uid, userInfo.id)); var unread_html = $('#f-' + userInfo.id).find('.layui-badge'); var num = $(unread_html).text(); if (unread_html.length > 0) { num = parseInt(unread_num) + 1; $(unread_html).removeClass('layui-badge').addClass('layui-badge').text(num); cacheUnread(makeUnreadKey(uid, userInfo.id), num); } else { num = 1; var html = `${num}`; $('#f-' + userInfo.id).append(html); cacheUnread(makeUnreadKey(uid, userInfo.id), num + unread_num); } } // console.log(user_info_tmp.u_id == userInfo.id, user_info_tmp.u_id + '-' + userInfo.id); if (user_info_tmp.u_id == userInfo.id) { var word = msgFactory(content, 'user', userInfo, null, userInfo.msg_id); // setTimeout(function () { $("#u-" + userInfo.id).append(word); // 滚动条自动定位到最底端 wordBottom(); } var time = userInfo.time; //本地存储 // 链接数据库 // db = inquiryDB(`${uinfo.id}-${userInfo.id}`, 'chat_data', 1); // console.log(userInfo.id, db); // db.addMsg({ type: 'user', from_id: userInfo.id, from_name: userInfo.name, time_line: time, to_name: uname, to_id: uid, img_id: '', payment: '', content: content, from_avatar: userInfo.avatar, msg: '' }, function (e) { // setTimeout(function () { // // if (e.readyState == 'done') console.log('成功'); // // console.log(e.readyState); // }, 50); // }); // var save_data = { key: `${uinfo.id}-${userInfo.id}`, data: { type: 'user', from_id: userInfo.id, from_name: userInfo.name, time_line: time, to_name: uname, to_id: uid, img_id: '', payment: '', content: content, from_avatar: userInfo.avatar, msg: '' } } // cacheChat(save_data); saveMsg(`${uinfo.id}-${userInfo.id}`, { type: 'user', from_id: userInfo.id, from_name: userInfo.name, time_line: time, to_name: uname, to_id: uid, img_id: '', payment: '', content: content, from_avatar: userInfo.avatar, msg: '', uid: userInfo.id }); // 显示最后一条消息 lastMsg(userInfo.id, content); } // 消息发送工厂 function msgFactory(content, type, uinfo, payment, msg_id = '') { if (payment != "" && payment != null) { var payment = payment width = '120px' height = '50px' } else { width = '110px' height = '100px' } var id_payment = id_payment var _html = ''; if ('mine' == type) { _html += '
  • '; } _html += ''; _html += '
  • '; return _html; } // 获取日期 function getDate() { var d = new Date(new Date()); return d.getFullYear() + '-' + digit(d.getMonth() + 1) + '-' + digit(d.getDate()) + ' ' + digit(d.getHours()) + ':' + digit(d.getMinutes()) + ':' + digit(d.getSeconds()); } //补齐数位 var digit = function (num) { return num < 10 ? '0' + (num | 0) : num; }; // 滚动条自动定位到最底端 function wordBottom() { var box = $(".chat-box"); box.scrollTop(box[0].scrollHeight); } // 切换在线用户 function changeUserTab(obj) { $("#user_list li").removeClass('active'); $("#offline_user_list li").removeClass('active'); obj.addClass('active').siblings().removeClass('active'); wordBottom(); } // 添加在线用户到面板 function addUser(data, new_user = true) { //缓存用户数据 cacheUserData(data); if (!$('#user_list').find(`#f-${data.id}`).html()) { var _html = '
  • '; _html += ''; _html += '' + data.name + ''; if (new_user == true) { _html += 'new'; } let unread_num = parseInt(getUnread(makeUnreadKey(uid, data.id)) + data.unread); if (unread_num > 0) { _html += `${unread_num}`; cacheUnread(makeUnreadKey(uid, data.id), unread_num); // 存未读消息 } _html += ''; _html += '
  • '; // 添加左侧列表 if (new_user == true) { var form_html = $("#user_list").find('form').prop('outerHTML') $("#user_list").find('form').remove(); _html = _html + $("#user_list").html(); $("#user_list").html(form_html + _html); //添加数量 var user_text = $('#line-user-num').find('span').text(); var user_num = parseInt(user_text) + 1; $('#line-user-num').find('span').text(user_num); } else { $("#user_list").append(_html); } showLastMsg(data.id); } // 添加离线消息 if (data.offline_msg.length > 0) { // 链接数据库 for (var i = 0; i <= data.offline_msg.length - 1; i++) { // if (data.offline_msg[i].type != 'user') { // continue; // } // db.addMsg(data.offline_msg[i], function (e) { // }); // var save_data = { key: `${uinfo.id}-${data.id}`, data: data.offline_msg[i] } // cacheChat(save_data); data.offline_msg[i].uid = data.id; saveMsg(`${uinfo.id}-${data.id}`, data.offline_msg[i]); } // 添加最后消息 lastMsg(data.id, data.offline_msg[data.offline_msg.length - 1].content); } } // 如果没有选中人,选中第一个 // var hasActive = 0; // $("#all_user_list li").each(function(){ // if($(this).hasClass('active')){ // hasActive = 1; // } // }); // if (!document.getElementById(`u-${data.id}`)) { // var _html2 = ''; // _html2 += ''; // // 添加主聊天面板 // $('.chat-box').append(_html2); // } // if(0 == hasActive){ // $("#all_user_list").find('li').eq(0).addClass('active').find('span:eq(1)').removeClass('layui-badge').text(''); // $("#u-" + data.id).addClass('show-chat-detail'); // var id = $(".layui-unselect").find('li').eq(0).data('id'); // var name = $(".layui-unselect").find('li').eq(0).data('name'); // var ip = $(".layui-unselect").find('li').eq(0).data('ip'); // var avatar = $(".layui-unselect").find('li').eq(0).data('avatar'); // // 设置当前会话用户 // $("#active-user").attr('data-id', id).attr('data-name', name).attr('data-avatar', avatar).attr('data-ip', ip); // $("#f-user").val(name); // $("#f-user-id").val(id); // $("#coin_uid").val(id); // $("#f-ip").val(ip); // $.getJSON('/service/index/getCity', {ip: ip}, function(res){ // $("#f-area").val(res.data); // }); // //第一个用户默认展示 // order_view(data.id); // } if ($("#user_list").prop('hidden') == false) { // getChatLog(data.id, 1); // checkUser(); } else { // checkUser(); } /** * 拼接本地缓存未读消息key * @param kfId 客服id * @param userId 用户id */ function makeUnreadKey(kfId, userId) { return 'unread-' + kfId + '-' + userId; } /** * 显示在线、离线未读提示 * @param type 在线、离线类型 */ function showTabNotice(type) { if ($('#' + type + '_span').hasClass('fold')) { $('#' + type + 'line_user .layui-badge').show(); } } /** * 添加离线用户到面板 * @param data * @param type 添加类型:1 初始加载; 2 在线转离线 */ function addOffLineUser(data, type) { // 列表数量 if (type == 2) { var user_text = $('#offline-user-num').find('span').text(); var user_num = parseInt(user_text) + 1; $('#offline-user-num').find('span').text(user_num); var user_text = $('#line-user-num').find('span').text(); var user_num = parseInt(user_text) - 1; $('#line-user-num').find('span').text(user_num); } cacheUserData(data); let unread = type == 1 ? $("#user_list #f-" + data.id).find('span:eq(1)').text() : 0; let _html = '
  • '; _html += ''; _html += '' + data.name + ''; // 初始加载离线用户列表 if (type == 1) { let old_unread = getUnread(makeUnreadKey(uid, data.id)); // 1console.log(old_unread); unread = old_unread + parseInt(data.unread); if (unread) { cacheUnread(makeUnreadKey(uid, data.id), unread); // 存未读消息 // 如果 离线tab折叠,则显示 离线未读提示 showTabNotice('off'); } } if (!unread) { _html += ''; } else { _html += '' + unread + ''; } _html += 'x'; // _html += ''; _html += '
  • '; // 1console.log(111); // 添加左侧列表 if (type == 2) { var form_html = $("#offline_user_list").find('form').prop('outerHTML') var p_html = $("#offline_user_list").find('p').prop('outerHTML') $("#offline_user_list").find('form').remove(); $("#offline_user_list").find('p').remove(); _html = _html + $("#offline_user_list").html(); $("#offline_user_list").html(form_html + p_html + _html); } else { $("#offline_user_list").append(_html); } showLastMsg(data.id, '', 'offline'); // 添加离线消息 if (data.offline_msg.length > 0) { for (var i = 0; i <= data.offline_msg.length - 1; i++) { // db.addMsg(data.offline_msg[i], function (e) { // }); // var save_data = { key: `${uinfo.id}-${data.id}`, data: data.offline_msg[i] } // cacheChat(save_data); data.offline_msg[i].uid = data.id; saveMsg(`${uinfo.id}-${data.id}`, data.offline_msg[i]); // 添加最后消息 lastMsg(data.id, data.offline_msg[i].content); } } // 如果没有选中人,选中第一个 // var hasActive = 0; // $("#all_user_list li").each(function(){ // if($(this).hasClass('active')){ // hasActive = 1; // } // }); if (!document.getElementById(`u-${data.id}`)) { // let _html2 = ''; // _html2 += ''; // //添加主聊天面板 // $('.chat-box').append(_html2); } if ($("#offline_user_list").prop('hidden') == false) { // getChatLog(data.id, 1); // checkUser(); } else { // checkUser(); } } // 删除离线用户 function offline_user_del(userId, e) { // 阻止点击事件冒泡 window.event ? window.event.cancelBubble = true : e.stopPropagation(); $.getJSON('/service/index/delOfflineUser?user_id=' + userId, function (res) { if (1 == res.code) { layer.msg('删除成功'); var key = 'KF' + uid + '-' + userId; localStorage.removeItem(key); //清除客服对离线用户的本地缓存 var key_last = uinfo.id + '-' + userId + '-lastMsg'; localStorage.removeItem(key_last); //清除客服对离线用户的本地缓存 sessionStorage.removeItem('timerid_' + uid + '_' + userId) $("#offline_user_list #f-" + userId).remove(); // 清除左侧的用户列表 // $('#u-' + userId).remove(); // 清除右侧的聊天详情 cacheUnread(makeUnreadKey(uid, userId), 0); window.indexedDB.deleteDatabase(`${uinfo.id}-${userId}`); db.delUserData('uid', userId, function (e) { }); // 清除右侧的访客信息 $('#f-user').val(''); $("#coin_uid").val(''); $('#f-ip').val(''); $('#f-area').val(''); if (user_info_tmp.u_id == userId) { $('.show-chat-detail').html(''); } // 减去数量 var user_text = $('#offline-user-num').find('span').text(); var user_num = parseInt(user_text) - 1; $('#offline-user-num').find('span').text(user_num); } else { layer.msg(res.msg); return; } }); } function user_over(data) { data.css('background-color', 'red'); } function user_out(data) { data.css('background-color', '#aaa'); } /** * 选择用户 */ function checkUser() { $("#all_user_list").find('li').unbind("click"); // 防止事件叠加 // 切换用户 $(".layui-unselect").find('li').bind('click', function () { // 1console.log($(this).data('name')); var userId = $(this).data('id'); var avatar = $(this).data('avatar'); var name = $(this).data('name'); var ip = $(this).data('ip'); // 链接数据库 // db = inquiryDB(`${uinfo.id}-${userId}`, 'chat_data', 1); if ($(this).attr('class') == 'layui-nav-item active') { return; } changeUserTab($(this)); // 展示相应的对话信息 $('.chat-box ul').each(function () { if ('u-' + userId == $(this).attr('id')) { $(this).addClass('show-chat-detail').siblings().removeClass('show-chat-detail'); } }); // 去除消息提示 $(this).find('span:eq(1)').removeClass('layui-badge').text(''); // 清除本地未读消息缓存 makeUnreadKey(parseInt(uid), userId) cacheUnread(makeUnreadKey(uid, userId), 0); // 设置当前会话的用户 $("#active-user").attr('data-id', userId).attr('data-name', name).attr('data-avatar', avatar).attr('data-ip', ip); // 储存用户信息 user_info_tmp = { u_id: userId, u_name: name, u_avatar: avatar, u_ip: ip, } // 右侧展示详情 $("#f-user").val(name); $("#f-user-id").val(userId); $("#coin_uid").val(userId); $("#f-ip").val(ip); // $.getJSON('/service/index/getCity', { ip: ip }, function (res) { // $("#f-area").val(res.data); // }); //重新渲染商品订单模板 order_view(userId); // console.log("点击更换了"); getChatLog(userId, 1); wordBottom(); }); } /** * 选择用户 * @param {*} _this */ function selectUser(_this) { // 1console.log($(this).data('name')); var userId = $(_this).data('id'); var avatar = $(_this).data('avatar'); var name = $(_this).data('name'); var ip = $(_this).data('ip'); // 链接数据库 // db = inquiryDB(`${uinfo.id}-${userId}`, 'chat_data', 1); if ($(_this).attr('class') == 'layui-nav-item active') { return; } changeUserTab($(_this)); // 展示相应的对话信息 // $('.chat-box ul').each(function (e) { // var chat_ul = $('.chat-box ul')[e]; // if ('u-' + userId == $(chat_ul).attr('id')) { // $(chat_ul).addClass('show-chat-detail').siblings().removeClass('show-chat-detail'); // } // }); $('.chat-box').find('ul').attr('id', 'u-' + userId).html(''); // 去除消息提示 $(_this).find('.layui-badge').removeClass('layui-badge').text(''); // 清除本地未读消息缓存 makeUnreadKey(parseInt(uid), userId) cacheUnread(makeUnreadKey(uid, userId), 0); // 设置当前会话的用户 $("#active-user").attr('data-id', userId).attr('data-name', name).attr('data-avatar', avatar).attr('data-ip', ip); // 储存用户信息 user_info_tmp = { u_id: userId, u_name: name, u_avatar: avatar, u_ip: ip, } // 右侧展示详情 $("#f-user").val(name); $("#f-user-id").val(userId); $("#coin_uid").val(userId); $("#f-ip").val(ip); //重新渲染商品订单模板 order_view(userId); // setTimeout(function () { // console.log("点击更换了"); getChatLog(userId, 1); // $.getJSON('/service/index/getCity', { ip: ip }, function (res) { // $("#f-area").val(res.data); // }); checkIsPayUser(userId); // }, 100); wordBottom(); } // 删除离线用户聊天面板(离线转换成在线) function delOffUser(data) { var user_text = $('#offline-user-num').find('span').text(); var user_num = parseInt(user_text) - 1; $('#offline-user-num').find('span').text(user_num); // 获取 该用户是否为当前聊天用户 let active = $("#offline_user_list #f-" + data.id).hasClass('active'); $("#offline_user_list #f-" + data.id).remove(); // 清除左侧的用户列表 // $('#u-' + data.id).remove(); // 清除右侧的聊天详情 if ($("#offline_user_list li").length == 0) { $("#off_span").attr('class', 'fold'); } // 清除右侧的访客信息 if (user_info_tmp.u_id == data.id) { $('#f-user').val(''); $('#f-user-id').val(''); $("#coin_uid").val(''); $('#f-ip').val(''); $('#f-area').val(''); } // 如果该用户为当前聊天用户 if (active) { $("#on_span").attr('class', 'unfold'); // 展开在线用户tab $("#user_list").prop('hidden', false); // 显示在线用户列表 $("#off_span").attr('class', 'fold'); // 折叠离线用户tab $("#offline_user_list").prop('hidden', true); // 隐藏离线用户列表 $('#user_list #f-' + data.id).click(); } } // 删除在线用户聊天面板 function delUser(data) { addOffLineUser(data.userinfo, 2); // 查看在线tab是否折叠,如果折叠则查看是否有未读的在线消息,有则不消除tab上的消息提醒 if ($('#on_span').hasClass('fold')) { $('#user_list li').each(function () { if ($(this).find('span:eq(1)').text()) { // 1console.log($(this).find('span:eq(1)').text()); // 隐藏消息提示 $('#online_user .layui-badge').hide(); return false; } }); } $("#user_list #f-" + data.id).remove(); // 清除左侧的用户列表 // $('#u-' + data.id).remove(); // 清除右侧的聊天详情 // // 清除右侧的访客信息 if (user_info_tmp.u_id == data.id) { $('#f-user').val(''); $('#f-user-id').val(''); $("#coin_uid").val(''); $('#f-ip').val(''); $('#f-area').val(''); } layer.msg('用户:' + data.userinfo.name + '已离线!'); //重新渲染商品订单模板 // order_view(data.uid,'del'); } // 发送快捷语句 function sendWord(obj) { var msg = $(obj).data('word'); layer.closeAll(); sendMessage(msg); } /** * 获取聊天记录 * @param {*} uid * @param {*} page * @param {*} flag */ function getChatLogPage(uid, page, limit = 15, _this = '') { // db = inquiryDB(`${uinfo.id}-${uid}`, 'chat_data', 1); // db.getDataByPager(page, limit, 'uid', uid, function (e) { // show(e.data, e.total_page, e.r_page); // }); db.getDataIndexKeys('uid', uid, function (e) { show(e.data, 1, 1); }) // 渲染 function show(data, total_page, r_page) { if (data.length < 1) return false; if (r_page == total_page) { // var _html = '
    没有更多了
    '; var _html = ''; } else { var _html = '
    更多记录
    `; } var len = data.length; if (len > 80) { _html += ``; } var tmp_arr = []; for (var i = 0; i < len; i++) { var v = data[i]; if (v.payment != null && v.payment != '') { var content = v.msg width = '120px' height = '50px' } else { var content = v.content width = '110px' height = '100px' } if ('mine' == v.type) { _html += '
  • '; } _html += ''; _html += '
  • '; tmp_arr[i] = v; } // console.log(tmp_arr); // key = uinfo.id + '-' + uid; // localStorage.setItem(key, JSON.stringify(tmp_arr)); // 隐藏加载更多 if (_this) { $(_this).hide(); var box = $(".chat-box"); var show_height = box.height(); box.scrollTop(show_height + 550); var user_msg_log_box = $("#u-" + uid).html(); $("#u-" + uid).html(_html + user_msg_log_box); } else { var user_msg_log_box = $("#u-" + uid).html(); $("#u-" + uid).html(user_msg_log_box + _html); wordBottom(); } } } // 获取聊天记录 function getChatLog(uid, page, flag, width, height) { switch (msg_save_type) { case "localStorage": // 显`示local数据库数据 showLocalDataMsg(uid); break; case "indexDB": // 获取本地数据 getChatLogPage(uid, 1, 15); break; } } /** * 显示local数据库的聊天记录 * @param {*} uid */ function showLocalDataMsg(uid) { var key = uinfo.id + '-' + uid; var list = getCache(key); if (list == '' || list == null) return false; if (list.length < 1) return false; for (var i = 0; i <= list.length - 1; i++) { var _html = ''; var v = list[i]; if (v.payment != null && v.payment != '') { var content = v.msg width = '120px' height = '50px' } else { var content = v.content width = '110px' height = '100px' } if ('mine' == v.type) { _html += '
  • '; } _html += ''; _html += '
  • '; var user_msg_log_box = $("#u-" + uid).html(); $("#u-" + uid).html(user_msg_log_box + _html); wordBottom(); } } $(".layui-mylink-photos").on('click', function (obj) { var value = $(this).attr('payment'); var src = this.src; if (value == 123) { layer.photos({ photos: { data: [{ "alt": "大图模式", "src": src }] }, shade: 0.5, closeBtn: 2, anim: 0, resize: false, success: function (layero, index) { } }); } }); // 显示大图 function showBigPic(obj) { // console.log(obj); var src = obj.src; layer.photos({ photos: { data: [{ "alt": "大图模式", "src": src }] }, shade: 0.5, closeBtn: 2, anim: 0, resize: false, success: function (layero, index) { } }); } // 获取更多的的记录 function getMore(obj) { $(obj).remove(); var page = $(obj).attr('data-page'); var uid = $(".layui-unselect").find('li').eq(0).data('id'); getChatLog(uid, page, 1); } // 删除历史聊天记录 function removeLocalStorage(key) { localStorage.removeItem(key); } function sendWarnAudio(type) { var turnAudio = document.getElementById("myWarnAudio"); if (!turnAudio) { // 1console.log('初始化'); turnAudio = document.createElement("audio"); document.body.appendChild(turnAudio); turnAudio.id = "myWarnAudio"; turnAudio.controls = false; turnAudio.loop = false; turnAudio.hidden = true; } if (type == 'msg') { turnAudio.src = "/static/common/mp3/msn.mp3"; } turnAudio.play(); } /** * 生成uuid * @param {*} prefix 前缀 */ function uuid(prefix = '') { // 生成随机值 function S4() { return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1); } var id = prefix + (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4()); return id; } /** * 检测消息是否发送成功 * @param {*} msg_id 消息id * @param {*} type 消息类型, 1: 常规消息, 2: 自动回复,支付消息 */ function checkUserReceiveMsg(msg_id, type = 1) { // 定时1秒是否有返回成功接收消息 sessionStorage.setItem('send_time_receive_msg_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id, false); var send_time = setTimeout(function () { var user_receive_msg = sessionStorage.getItem('send_time_receive_msg_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id); if (user_receive_msg == true) { sessionStorage.removeItem('send_time_receive_msg_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id); return true; } // 第一次进行自动重发 var re_send_msg_num = reSendMsgNum(msg_id, 'get'); if (!re_send_msg_num || re_send_msg_num < 1) { autoReSendMsg(msg_id, type); return; } // 用户没有接收到, 进行提示 sessionStorage.removeItem('send_time_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id); $('#' + msg_id).find('.mylink-chat-text').append(`发送失败 `); // systemHint(user_info_tmp.u_id, '消息发送失败, 请重新发送!'); // 1console.log('自动发送消息失败, 显示重新发送'); }, 4000); // 消息入队 sessionStorage.setItem('send_time_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id, send_time); } /** * 重新发送消息 * @param {*} msg_id 消息id * @param {*} type 消息类型, 1: 常规消息, 2: 自动回复,支付消息 */ function reSendMsg(msg_id, _this = null, type) { layer.confirm('确定重新发送吗?', { title: false, btn: ['确定', '取消'] //按钮 }, function (ind) { layer.close(ind); switch (msg_save_type) { case "localStorage": // 获取本地数据 var key = uinfo.id + '-' + user_info_tmp.u_id; var msg_list = msgQueueCheck(getCache(key)); // if (msg_list == null || msg_list.length == 0) return false; // // 找出发送的数据 var msg_data = null; msg_list.forEach(vo => { if (vo.msg_id == msg_id) { msg_data = vo; } }); break; case "indexDB": db.getDataIndexKey('msg_id', msg_id, function (e) { show(e.data); }); break; } function show(msg_data) { if (!msg_data) return false; // socket再次推送并检测是否发送成功 switch (type) { case 1: ws.send(JSON.stringify({ path: 'api\/chat', param: { type: 'kf', to_id: user_info_tmp.u_id, to_name: user_info_tmp.u_name, content: msg_data.msg, from_name: uinfo.username, msg_id: msg_data.msg_id, from_id: uinfo.id, from_avatar: uinfo.avatar }, access_token: token })); break; case 2: ws.send(JSON.stringify({ path: 'api\/chat', param: { type: 'kf', payment: msg_data.payment, data: msg_data.data, to_id: msg_data.to_id, to_name: msg_data.to_name, content: msg_data.content, from_name: msg_data.from_name, from_id: msg_data.from_id, from_avatar: msg_data.from_avatar, msg_id: msg_data.msg_id, }, access_token: token })); break; } } if (_this != null) $(_this).parent().remove(); checkUserReceiveMsg(`${msg_id}`, type); }, function (inds) { layer.close(inds); }); } /** * 自动重新发送消息 * @param {*} msg_id 消息id * @param {*} type 消息类型, 1: 常规, 2: 支付 */ function autoReSendMsg(msg_id, type) { switch (msg_save_type) { case "localStorage": // 获取本地数据 var key = uinfo.id + '-' + user_info_tmp.u_id; var msg_list = msgQueueCheck(getCache(key)); // if (msg_list == null || msg_list.length == 0) return false; // // 找出发送的数据 var msg_data = null; msg_list.forEach(vo => { if (vo.msg_id == msg_id) { msg_data = vo; } }); show(msg_data); break; case "indexDB": db.getDataIndexKey('msg_id', msg_id, function (e) { show(e.data); }); break; } function show(msg_data) { if (!msg_data) return false; // socket再次推送并检测是否发送成功 switch (type) { case 1: ws.send(JSON.stringify({ path: 'api\/chat', param: { type: 'kf', to_id: user_info_tmp.u_id, to_name: user_info_tmp.u_name, content: msg_data.msg, from_name: uinfo.username, msg_id: msg_data.msg_id, from_id: uinfo.id, from_avatar: uinfo.avatar }, access_token: token })); break; case 2: ws.send(JSON.stringify({ path: 'api\/chat', param: { type: 'kf', payment: msg_data.payment, data: msg_data.data, to_id: msg_data.to_id, to_name: msg_data.to_name, content: msg_data.content, from_name: msg_data.from_name, from_id: msg_data.from_id, from_avatar: msg_data.from_avatar, msg_id: msg_data.msg_id, }, access_token: token })); break; } } // 更新发送次数 reSendMsgNum(msg_id, 'update'); checkUserReceiveMsg(`${msg_id}`, type); // 1console.log('发送消息失败, 正在自动重新发送'); } /** * 重新发送消息次数操作 * @param {*} msg_id 消息id * @param {*} type 操作类型, get: 获取操作次数, update(更新或新建), del: 删除 */ function reSendMsgNum(msg_id, type = 'get') { if (!msg_id) return false; switch (type) { case 'get': return sessionStorage.getItem('re_send_msg_num_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id); break; case 'update': var re_send_msg_num = sessionStorage.getItem('re_send_msg_num_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id); if (!re_send_msg_num) { var save = sessionStorage.setItem('re_send_msg_num_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id, 1); } else { var save = sessionStorage.setItem('re_send_msg_num_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id, re_send_msg_num + 1); } return save; break; case 'del': return sessionStorage.removeItem('re_send_msg_num_' + uinfo.id + '_' + user_info_tmp.u_id + '_' + msg_id); break; default: return false; break; } } /** * 检测消息是否重复 * @param {*} uid 用户id * @param {*} msg_id 消息id */ function checkMsgIsRepeat(uid, msg_id) { if (!uid || !msg_id) return false; var dom = $('u-' + uid).find('#' + msg_id); if (!dom || dom.length == 0) return false; return true; } /** * 拖拽上传文件 * @param {*} class_name */ function dragUploadFile(class_name) { if (class_name == '') return false; $(class_name).upload({ beforeSend: onBeforeSend, action: '/service/upload/uploadImg', dataType: 'json', multiple: true, }) .on("filestart.upload", onFileStart) .on("fileerror.upload", onFileError) .on("filecomplete.upload", onFileComplete); function onBeforeSend(formData, file) { if (user_info_tmp.u_id == undefined) { return "请选择发送用户"; } // 是否是图片 if (file.file.type != 'image/png' && file.file.type != 'image/jpg' && file.file.type != 'image/gif' && file.file.type != 'image/jpeg') { return "请发送jpg, gif, jpeg, png的图片"; } formData.file = file.file; return formData; } function onFileStart(e, file) { // console.log(file); } function onFileComplete(e, file, res) { // console.log(res); if (res.code == 1) { sendMessage('img[' + res.data.src + ']'); } else { layer.msg(res.msg); } } function onFileError(e, file, error) { layer.msg('网络错误!'); } } /** * 粘贴上传图片, 仅支持从微信或浏览器中复制的图片, 本地复制的站不支持 */ function pasteUploadFile() { document.addEventListener('paste', function (e) { var items = ((e.clipboardData || window.clipboardData).items) || []; var file = null; if (items && items.length) { for (var i = 0; i < items.length; i++) { if (items[i].type.indexOf('image') !== -1) { file = items[i].getAsFile(); break; } } } if (!file) { // layer.msg('粘贴内容非图片!'); return false; } if (user_info_tmp.u_id == undefined) { layer.msg('请选择发送用户'); return false; } var formData = new FormData(); formData.append('file', file); var xhr = new XMLHttpRequest(); xhr.onload = function () { try { var res = JSON.parse(this.responseText); if (res.code == 1) { sendMessage('img[' + res.data.src + ']'); } else { layer.msg(res.msg); } } catch (e) { layer.msg('网络错误!'); } }; xhr.onerror = function () { layer.msg('网络错误!'); }; xhr.open('POST', '/service/upload/uploadImg', true); xhr.send(formData); }); } /** * 保存最后一条消息 * @param {*} uid 客户id * @param {*} data 消息内容 */ function lastMsg(uid, data) { if (msg_save_type == 'indexDB') { if (!uid || data == '') return false; var key = uinfo.id + '-' + uid + '-lastMsg'; var date = getNowDate('date'); var time = getNowDate('time'); var save_data = { msg: data, date: date, time: time }; localStorage.setItem(key, JSON.stringify(save_data)); showLastMsg(uid, save_data); } } /** * 显示最后一条消息 * @param {*} key */ function showLastMsg(uid, data = '', type = 'line') { var key = uinfo.id + '-' + uid + '-lastMsg'; if (data === '') data = JSON.parse(localStorage.getItem(key)); if (data == null || data == '' || data.length == 0) return false; var text_align = type == 'line' ? 'right' : 'center'; $(`#${key}-msg`).remove(); $(`#${key}-date`).remove(); var now_date = getNowDate('date'); var date = now_date === data.date ? data.time : data.date; $(`#f-${uid}`).append(`${data.msg}`); $(`#f-${uid}`).append(`${date}`); $('#f-' + uid).find('.ident').remove(); } /** * 获取现在时间 * @param {*} type 获取类型, date: 日期, time: 时间, 默认: 日期时间 */ function getNowDate(type = "datetime") { var myDate = new Date(); var year = myDate.getFullYear(); var month = myDate.getMonth() + 1; var day = myDate.getDate(); var hour = myDate.getHours(); var minute = myDate.getMinutes(); var s = myDate.getSeconds(); // if (day < 10) day = '0' + day; // if (month < 10) month = '0' + month; // if (hour < 10) hour = '0' + hour; // if (minute < 10) minute = '0' + minute; // if (s < 10) s = '0' + s; var result; switch (type) { case 'date': result = `${month}/${day}`; break; case 'time': result = `${hour}:${minute}`; break; default: result = `${year}/${month}/${day} ${hour}:${minute}:${s}`; } return result; } /** * 标记用户为已充值用户 */ $('#mark-pay-user').on('click', function () { if (user_info_tmp.u_id == undefined) { layer.msg('请选择用户'); return false; } layer.confirm('确定标记为已充值吗?', function (index) { $.ajax({ url: '/service/index/payUserConfrim', type: "post", data: { uid: user_info_tmp.u_id }, async: false, dataType: "json", success: function (res) { if (res.code == 1) { layer.msg('标记成功'); $('#mark-pay-user').attr('disabled', true); $('#mark-pay-user').html('已充值'); } else { layer.msg(res.msg); } }, error: function (res) { layer.msg('网络错误'); } }); }); }) /** * 检测是否是充值客户 * @param {*} uid */ function checkIsPayUser_former(uid) { $.ajax({ url: '/service/index/checkIsPayUser', type: "post", data: { uid: uid }, async: false, dataType: "json", success: function (res) { if (res.code == 1) { $('#mark-pay-user').html('已充值'); $('#mark-pay-user').attr('disabled', true); } else { $('#mark-pay-user').html('未充值'); $('#mark-pay-user').attr('disabled', false); } }, error: function (res) { layer.msg('网络错误'); } }); } /** * 检测是否是充值客户 * @param {*} uid */ function checkIsPayUser(uid) { var check = $(`#f-${uid}`).data('is_pay_user'); // console.log(check); if (check == true) { $('#mark-pay-user').html('已充值'); $('#mark-pay-user').attr('disabled', true); } else { $('#mark-pay-user').html('未充值'); $('#mark-pay-user').attr('disabled', false); } } /** * 提示标签 * @param {*} _this 当前元素 * @param {*} text 提示内容 */ function tipsHint(_this, id_name, text) { // console.log(text); var tips = layer.tips(text, id_name, { time: 0, tips: 3 }); $(_this).on('mouseout', function () { layer.close(tips); }) } /** * 添加充值记录 */ function addRechargeLog() { if (user_info_tmp.u_id == undefined) { layer.msg('请选择用户'); return false; } var payment_type = $('#recharge_type').val(); var money = $('#recharge_money').val(); var bank_user_name = $('#bank-user-name').val(); var bank_number = $('#bank-number').val(); if (money < 1) { layer.msg('请输入充值金额'); return; } if (!payment_type) { layer.msg('请选择支付类型'); return; } if ((!bank_user_name || !bank_number) && payment_type == '银行卡支付') { layer.msg('请输入银行卡信息'); return; } layer.confirm("确定记录吗?", { title: "添加充值记录" }, function () { $.post('/service/index/addRechargeRecord', { id: user_info_tmp.u_id, user_name: user_info_tmp.u_name, amount: money, payment_type: payment_type, bank_user_name: bank_user_name, bank_number: bank_number, }, function (res) { if (res.code == 1) { $('#recharge_money').val(''); sendMessage(`亲, 您的充值金额(${money})已到账, 请前往保险箱查收`); layer.msg('记录成功'); // layer.close(index); } else { layer.msg(res.msg); } }); }); } $("#recharge_type").on('change', function (res) { $type = $(this).val(); if ($type == '银行卡支付') { $('#bank-user-name').show(); $('#bank-number').show(); } else { $('#bank-user-name').hide(); $('#bank-number').hide(); } console.log(); }); /** * 打开工具栏中的常用语 */ function openCommonLang() { var html = $('#common-lang').html(); $(html).find('thead').attr('id', 'thead'); var index = layer.open({ title: "常用语", type: 1, area: '600px', content: html, }); } /** * 保存消息 * @param {*} key 键 * @param {*} data 保存数据 */ function saveMsg(key, data) { switch (msg_save_type) { case "localStorage": var save_data = { key: key, data: data } cacheChat(save_data); break; case "indexDB": // db = inquiryDB(key, 'chat_data', 1); data.uid = parseInt(data.uid); db.addMsg(data, function (e) { setTimeout(function () { // if (e.readyState == 'done') console.log('成功'); // console.log(e.readyState); }, 50); }); break; default: console.log('请指定存储类型'); break; } } /** * 获取离线用户分页 * @param {*} page * @param {*} limit * @param {*} _this */ function getOfflineUserPage(page, limit = 50, _this = '') { page = page; limit = limit; $.get(`/service/index/getOfflineUserList?page=${page}&limit=${limit}`, function (res) { $('#offline-user-num').find('span').text(`${res.count}`); showUserListOffLine(res.data); if (page != res.total_page && res.data.length != 0) { // layer.msg('没有更多了'); // return false; var _html = `
    查看更多
    `; $("#offline_user_list").append(_html); } if (_this && res.data.length < 1) { layer.msg('没有更多了'); } // 隐藏加载更多 if (_this) { $(_this).hide(); } }); } /** * 打开弹层 * @param {*} title 标题 * @param {*} url 地址 * @param {*} w 宽 * @param {*} h 高 */ function openWindow(title, url, w = '100%', h = "100%") { layer.open({ title: title, type: 2, content: url, // content: $("#account-box"), area: [w, h], }); } /** * 检测是否是充值客户 */ function delOfflineUserList() { var key = `${uinfo.id}-offline-user-list`; var list = getCache(key); if (list != undefined && list.length > 0) { delLocalOfflineUser(); return; } $.ajax({ url: '/service/index/getOfflineUserDelList', type: "post", data: {}, async: false, dataType: "json", success: function (res) { if (res.data.length > 0) { localStorage.setItem(key, JSON.stringify(res.data)); delLocalOfflineUser(); } }, error: function (res) { // layer.msg('网络错误'); } }); } /** * 删除本地离线列表 */ function delLocalOfflineUser() { del_offline_tmp_time_obj = setInterval(function () { var key_offline = `${uinfo.id}-offline-user-list`; var list = getCache(key_offline); if (list == undefined || list.length < 1) { clearTimeout(del_offline_tmp_time_obj) return false; } if (list.length > del_offline_user_num) { var forlist = list.splice(list.length - del_offline_user_num, del_offline_user_num); } else { var forlist = list; list = []; } for (var i = 0; i < forlist.length - 1; i++) { // var key = 'KF' + uid + '-' + forlist[i].id; // window.indexedDB.deleteDatabase(key); // var key_last = 'KF' + uid + '-' + forlist[i].id + '-lastMsg'; // localStorage.removeItem(key_last); //清除客服对离线用户的本地缓存 // localStorage.removeItem(key); //清除客服对离线用户的本地缓存 // delOffUser({ id: res.data[i].id }); // console.log(forlist[i].id); db.delUserData('uid', parseInt(forlist[i].id), function (e) { }); // sendMessage('测试消息') } localStorage.setItem(key_offline, JSON.stringify(list)); }, del_offline_user_time); } delOfflineUserList(); setInterval(function () { delOfflineUserList(); }, del_offline_user_list_time); window.onbeforeunload = function () { if (window.event.screenX == undefined) { delOfflineUserList(); } }; /** * 发送消息发送状态显示 * @param {*} num 显示数量 1: 服务端收到, 2: 客户端收到 */ function receivedStatusShow(msg_id, num) { var css_num = -(num * 12); var bg_w = 22; if (num == 1) { css_num = -(19); bg_w = 20; } var html = ``; // for (var i = 0; i < num; i++) { // html += ``; html += ``; // } html += ``; $('#' + msg_id).find('.send-status').remove(); $('#' + msg_id).find('.send-error').remove(); $('#' + msg_id).find('.mylink-chat-text').append(html); return html; } /** * html内容加密 * @param str * @returns {string} */ function htmlEncode(str) { var s = ""; if(str.length == 0) return ""; s = str.replace(/&/g,"&"); s = s.replace(//g,">"); // s = s.replace(/ /g," "); // s = s.replace(/\'/g,"'"); // s = s.replace(/\"/g,"""); return s; } /** * html内容解密 * @param str * @returns {string} */ function htmlDecode(str) { var s = ""; if(str.length == 0) return ""; s = str.replace(/&/g,"&"); s = s.replace(/</g,"<"); s = s.replace(/>/g,">"); s = s.replace(/ /g," "); s = s.replace(/'/g,"\'"); s = s.replace(/"/g,"\""); return s; }