Commit 20e61a7f by 施宇

111

parent 2af625b9
......@@ -6,12 +6,15 @@ $(function () {
defaultName: "18664936975",
templateObj: JSON.parse(Util.getCookie('template') || "{}"),
isLoginSuccess: false,
img: "",
name: "",
id: "",
init: function () {
this.ieFun();
this.connection();
this.connListen();
this.bindFunction();
this.getHistoryUsers();
this.getUserInfo();
},
getUserInfo: function () { //获取用户的基本信息
var self = this;
......@@ -19,7 +22,10 @@ $(function () {
"token": Util.getCookie('token') || '',
}, function (res) {
if (res.err_code == 0) {
self.login(res.data.im_username, res.data.im_password)
self.img = res.data.avatar;
self.name = res.data.company_name;
self.id = res.data.user_id + '';
self.login(res.data.im_username, res.data.im_password);
} else {
console.log('获取用户名失败');
layer.msg('聊天系统出错');
......@@ -34,16 +40,16 @@ $(function () {
}, function (res) {
if (res.errcode === 0) {
self.rendChatSection(res.data);
self.getUserInfo();
self.singleChat();
} else {
layer.msg('获取历史纪录失败');
}
});
},
addChatMember:function(id){
addChatMember: function (id) {
IcController.getData(apis.addrecord, 'GET', {
"token": Util.getCookie('token') || '',
"im_username":id
"user_id": id
}, function (res) {
if (res.errcode === 0) {
......@@ -53,10 +59,9 @@ $(function () {
});
},
rendChatSection: function (data) {
this.addUser(this.defaultName);
for(var i=0;i<data.length;i++){
this.addUser(data[i].im_username)
this.addUser({}, true);
for (var i = 0; i < data.length; i++) {
this.addUser(data[i])
}
},
singleChat: function () {
......@@ -64,26 +69,47 @@ $(function () {
$(".notice_classify[userid=" + this.defaultName + "]").click();
} else {
Util.delCookie('template', cookieHostname);
this.addUser(this.templateObj.userId);
$(".notice_classify[userid=" + this.templateObj.userId + "]").attr('isTemplate',true);//先获取历史纪录再发送模板,否则可能出现发送的消息显示两条
this.addUser({}, false, true);
$(".notice_classify[userid=" + this.templateObj.userId + "]").attr('isTemplate', true); //先获取历史纪录再发送模板,否则可能出现发送的消息显示两条
$(".notice_classify[userid=" + this.templateObj.userId + "]").click();
}
},
addUser: function (id) {
addUser: function (obj, isDefault, isFirst) {
var id, name, img;
if (isDefault) {
id = this.defaultName;
name = this.defaultName;
img = dist + "/images/default.jpg";
} else {
if (isFirst) {
id = this.templateObj.userId;
name = this.templateObj.userName;
img = this.templateObj.img || (dist + "/images/default.jpg")
} else {
id = obj.im_username;
name = obj.company_name;
img = obj.avatar || (dist + "/images/default.jpg")
}
}
var userLen = $('.chat_item_content').find('#' + id).length;
if (userLen) { //用户存在
return;
} else { //用户不存在
var lefthtml = '<div class="notice_classify" userid="' + id + '">' + this.userHtml(0, id, '') + '</div>';;
var lefthtml = '<div class="notice_classify" userid="' + id + '">' + this.userHtml(0, {
name: name,
id: id,
img: img
}, '') + '</div>';;
var righthtml = '<div class="chat_item" id="' + id + '">' +
'<div class="title clr">' +
// '<div class="fr btn btn_border">' +
// '<span class="icon iconfont iconjuxing23"></span>' +
// '<i>' + id + '</i>' +
// '</div>' +
'<h3 class="bold boxsiz">' + id + '</h3>' +
'<h3 class="bold boxsiz">' + name + '</h3>' +
'</div>' +
'<div class="notice_list boxsiz">' +
'<div class="notice_item_content">' +
......@@ -192,33 +218,36 @@ $(function () {
clock += ss;
return (clock);
},
userHtml: function (num, user, message) {
userHtml: function (num, obj, message) {
//左边用户的dom拼接
if (num == 0) {
return '<img src="' + dist + '/images/default.jpg" alt="" class="user_logo">' +
return '<img src="' + obj.img + '" alt="" class="user_logo">' +
'<div class="user_right">' +
'<div class="clr">' +
'<h3 class="boxsiz ellipsis">' + user + '</h3>' +
'<h3 class="boxsiz ellipsis">' + obj.name + '</h3>' +
'</div>' +
'<div class="message ellipsis">' + message + '</div>' +
'</div>'
} else {
return '<img src="' + dist + '/images/default.jpg" alt="" class="user_logo">' +
return '<img src="' + obj.img + '" alt="" class="user_logo">' +
'<div class="user_right">' +
'<div class="clr">' +
'<span class="num fr">' + num + '</span>' +
'<h3 class="boxsiz ellipsis">' + user + '</h3>' +
'<h3 class="boxsiz ellipsis">' + obj.name + '</h3>' +
'</div>' +
'<div class="message ellipsis">' + message + '</div>' +
'</div>'
}
},
messageHtml: function (leftOrRight, html, isTemplate,isHistory,time) {
messageHtml: function (leftOrRight, html, isTemplate, isHistory, time) {
//右边消息的dom拼接 isTemplate 是否是模板
var htmlp = '<p>' + html + '</p>';
var htmlp = '<p>' + html.message + '</p>';
var img = html.img || (dist + '/images/default.jpg')
if (isTemplate) {
var htmlp = '<div class="template lineBlock boxsiz">' +
'<img src="'+html.image+'" alt="">' +
'<img src="' + (html.goodImage || dist + "/images/defaultgood.png") + '" alt="">' +
'<div class="template_right">' +
'<div class="template_right_top clr">' +
'<h3 class="bold fl">' + html.type + '</h3>' +
......@@ -232,7 +261,7 @@ $(function () {
'</div>' +
'<div class="desc2 clr">' +
'<div class="num fl">数量:<i class="bold">' + html.num + '</i></div>' +
'<div class="time fl">时间:<i>'+html.time+'</i></div>' +
'<div class="time fl">时间:<i>' + html.time + '</i></div>' +
'</div>' +
'</div>' +
'</div>' +
......@@ -241,11 +270,11 @@ $(function () {
if (leftOrRight == 1) { //右边
if (html) {
return '<div class="notice_item right clr">' +
'<img src="' + dist + '/images/default.jpg" alt="" class="fr user_logo">' +
'<img src="' + img + '" alt="" class="fr user_logo">' +
'<div class="notice_content">' +
htmlp +
'<div>' +(isHistory?time:this.curentTime()) + '</div>' +
'</div>'+
'<div>' + (isHistory ? time : this.curentTime()) + '</div>' +
'</div>' +
'</div>'
} else {
return ''
......@@ -257,8 +286,8 @@ $(function () {
'<img src="' + dist + '/images/default.jpg" alt="" class="fl user_logo">' +
'<div class="notice_content">' +
htmlp +
'<div>' + (isHistory?time:this.curentTime()) + '</div>' +
'</div>'+
'<div>' + (isHistory ? time : this.curentTime()) + '</div>' +
'</div>' +
'</div>'
} else {
return ''
......@@ -273,17 +302,17 @@ $(function () {
var self = this;
if (type == 1) {
if (isTemplate) {
regContent = message.ext.type + ' ' + message.ext.price;
htmlStr = message.ext;
regContent = message.type + ' ' + message.price;
htmlStr = message;
} else {
regContent = message.data;
htmlStr = message.data;
regContent = message.message;
htmlStr = message.message;
}
} else if (type == 2) {
regContent = '[图片]';
htmlStr = '<img src ="' + message.url + '" class="edit_img"/>';
} else {
var data = message.data;
var data = message.message;
for (var i = 0, l = data.length; i < l; i++) {
if (data[i].type == 'emoji') {
regContent += '[表情]';
......@@ -299,22 +328,22 @@ $(function () {
'<div class="title clr">' +
// '<div class="fr btn btn_border">' +
// '<span class="icon iconfont iconjuxing23"></span>' +
// '<i>' + message.from + '</i>' +
// '<i>' + message.to + '</i>' +
// '</div>' +
'<h3 class="bold boxsiz">' + message.from + '</h3>' +
'<h3 class="bold boxsiz">' + message.name + '</h3>' +
'</div>' +
'<div class="notice_list boxsiz">' +
'<div class="notice_item_content">' +
self.messageHtml(2, htmlStr, isTemplate) +
self.messageHtml(2, message, isTemplate) +
'</div>' +
'</div>' +
'</div>';
if (!len) {
//新用户
var userStr = '<div class="notice_classify active" userid="' + message.from + '">' +
self.userHtml(0, message.from, regContent) + '</div>';
var messageStr = '<div class="chat_item active" id="' + message.from + '">' +
var userStr = '<div class="notice_classify active" userid="' + message.to + '">' +
self.userHtml(0, message, regContent) + '</div>';
var messageStr = '<div class="chat_item active" id="' + message.to + '">' +
messageSigleStr + '</div>'
$('.notice_left_content').append(userStr);
$('.chat_item_content').append(messageStr)
......@@ -322,11 +351,11 @@ $(function () {
$('.notice_classify').each(function (index) {
var userId = $(this).attr('userid');
var isNowChat = $('.notice_classify').eq(index).hasClass('active');
if (userId == message.from) {
if (userId == message.to) {
//已有用户
if (isNowChat) {
//当前用户
$(this).html(self.userHtml(0, message.from, regContent));
$(this).html(self.userHtml(0, message, regContent));
$('#' + userId).find('.notice_item_content').append(self.messageHtml(2,
htmlStr, isTemplate));
var contentHeight = $('#' + userId).find('.notice_item_content')
......@@ -336,7 +365,7 @@ $(function () {
} else {
//非当前用户
var num = Number($(this).find('.num').text());
$(this).html(self.userHtml(num + 1, message.from, regContent));
$(this).html(self.userHtml(num + 1, message.to, regContent));
$('#' + userId).find('.notice_item_content').append(self.messageHtml(2,
htmlStr, isTemplate));
}
......@@ -346,10 +375,10 @@ $(function () {
if (index == len - 1) {
//新用户
var userStr = '<div class="notice_classify" userid="' +
message.from + '">' +
self.userHtml(1, message.from, regContent) + '</div>';
message.to + '">' +
self.userHtml(1, message, regContent) + '</div>';
var messageStr = '<div class="chat_item" id="' +
message.from + '">' +
message.to + '">' +
messageSigleStr + '</div>'
$('.notice_left_content').append(userStr);
$('.chat_item_content').append(messageStr)
......@@ -365,20 +394,43 @@ $(function () {
onOpened: function (message) {
console.log('登入成功')
self.isLoginSuccess = true;
self.singleChat();
self.getHistoryUsers();
},
onTextMessage: function (message) {
self.receiveData(1, message, false)
self.receiveData(1, {
name: message.ext.name,
id: message.ext.id,
img: message.ext.img,
message: message.data,
from: message.to
}, false)
}, //收到文本消息;
onEmojiMessage: function (message) {
self.receiveData(3, message, false)
self.receiveData(3, {
name: message.ext.name,
id: message.ext.id,
img: message.ext.img,
message: message.data,
to: message.to,
}, false)
}, //收到表情消息;
onCmdMessage: function (message) {
self.receiveData(1, message, true);
self.addChatMember(message.from)
self.receiveData(1, {
name: message.ext.name,
id: message.ext.id,
img: message.ext.img,
to: message.to,
type:message.ext.type,
price:message.ext.price,
goodImage:message.ext.goodImage,
brand:message.ext.brand,
hq:message.ext.hq,
num:message.ext.num,
hq:message.ext.hq,
time:message.ext.time
}, true);
self.addChatMember(message.ext.id)
}, //收到命令消息;
onPictureMessage: function (message) {
var options = {
......@@ -386,7 +438,14 @@ $(function () {
};
options.onFileDownloadComplete = function () {
// 图片下载成功;
self.receiveData(2, message, false)
self.receiveData(2, {
name: message.ext.name,
id: message.ext.id,
img: message.ext.img,
to: message.to,
from: message.to,
url: message.url
}, false)
};
......@@ -437,15 +496,24 @@ $(function () {
var id = this.conn.getUniqueId();
var msg = new WebIM.default.message('txt', id);
var emojiMessage = WebIM.default.utils.parseEmoji(content); //表情解析工具
var ext = {
timer: self.curentTime(),
id: self.id,
name: self.name,
img: self.img
};
console.log(ext)
msg.set({
msg: content, // 消息内容;
to: userId, // 接收消息对象;
ext:{
timer:self.curentTime()
},
ext: ext,
success: function (id, serverMsgId) {
$('#' + userId).find('.notice_item_content').append(self.messageHtml(1,
emojiMessage, false));
$('#' + userId).find('.notice_item_content').append(self.messageHtml(1, {
message: emojiMessage,
name: self.name,
img: self.img,
id: self.id
}, false));
var contentHeight = $('#' + userId).find('.notice_item_content')
.height();
$('#' + userId).find('.notice_list').scrollTop(contentHeight);
......@@ -464,14 +532,19 @@ $(function () {
var userId = $('.notice_left ').find('.active').attr('userid');
var id = this.conn.getUniqueId();
var msg = new WebIM.default.message('cmd', id);
var params = $.extend({},templateObj,{timer:self.curentTime()});
var params = $.extend({}, templateObj, {
timer: self.curentTime(),
name: self.name,
id: self.id,
img: self.img
});
msg.set({
msg: 'template',
to: userId,
action: "template",
ext: params,
success: function () {
self.addChatMember(userId);
self.addChatMember(templateObj.id);
$('#' + userId).find('.notice_item_content').append(self.messageHtml(1,
params, true));
var contentHeight = $('#' + userId).find('.notice_item_content')
......@@ -499,8 +572,11 @@ $(function () {
apiUrl: WebIM.config.apiURL,
file: file,
to: userId,
ext:{
timer:self.curentTime()
ext: {
timer: self.curentTime(),
id: self.id,
name: self.name,
img: self.img
},
flashUpload: WebIM.flashUpload,
onFileUploadError: function () {
......@@ -511,8 +587,12 @@ $(function () {
},
success: function () {
var htmlStr = '<img src ="' + file.url + '" class="edit_img"/>';
$('#' + userId).find('.notice_item_content').append(self.messageHtml(1,
htmlStr, false));
$('#' + userId).find('.notice_item_content').append(self.messageHtml(1, {
message: htmlStr,
name: self.name,
img: self.img,
id: self.id
}, false));
var contentHeight = $('#' + userId).find('.notice_item_content')
.height();
$('#' + userId).find('.notice_list').scrollTop(contentHeight);
......@@ -573,11 +653,11 @@ $(function () {
$('#' + id).addClass('active').siblings('.chat_item').removeClass('active');
$(this).find('.num').remove();
$(this).addClass('active').siblings('.notice_classify').removeClass('active');
if(isTemplate){
if (isTemplate) {
$(this).removeAttr('isTemplate');
}
if (self.isLoginSuccess) { //登入成功 获取聊天记录
self.getHistoryData(id,isTemplate)
self.getHistoryData(id, isTemplate)
} else {
layer.msg('聊天系统出错');
return;
......@@ -588,14 +668,15 @@ $(function () {
})
},
getHistoryData: function (id,isTemplate) {
getHistoryData: function (id, isTemplate) {
var self = this;
this.conn.fetchHistoryMessages({
queue: id,
count: "50",
count: '50',
success: function (data) {
console.log(data)
self.rendHistoryMessage(id, data)
if(isTemplate){
if (isTemplate) {
self.sendCmd(self.templateObj);
}
},
......@@ -616,7 +697,12 @@ $(function () {
}
if (data[i].data) { //消息或者表情
if (typeof (data[i].data) == 'string') {
chatCon += this.messageHtml(rightOrLeft, data[i].data,false,true,data[i].ext.timer);
chatCon += this.messageHtml(rightOrLeft, {
message: data[i].data,
name: data[i].ext.name,
img: data[i].ext.img,
id: data[i].ext.id
}, false, true, data[i].ext.timer);
} else {
for (var j = 0; j < data[i].data.length; j++) {
if (data[i].data[j].type == "txt") {
......@@ -625,15 +711,23 @@ $(function () {
emojiTxt += '<img src ="' + data[i].data[j].data + '" width=25 height=25/>';
}
}
chatCon += this.messageHtml(rightOrLeft, emojiTxt,false,true,data[i].ext.timer);
chatCon += this.messageHtml(rightOrLeft, {
message: emojiTxt,
name: data[i].ext.name,
img: data[i].ext.img,
id: data[i].ext.id
}, false, true, data[i].ext.timer);
}
} else if (data[i].url) { //图片
chatCon += this.messageHtml(rightOrLeft, '<img src ="' + data[i].url + '" class="edit_img"/>',false,true,data[i].ext.timer);
chatCon += this.messageHtml(rightOrLeft, {
message: '<img src ="' + data[i].url + '" class="edit_img"/>',
name: data[i].ext.name,
img: data[i].ext.img,
id: data[i].ext.id
}, false, true, data[i].ext.timer);
} else if (data[i].action == 'template') { //模板
chatCon += this.messageHtml(rightOrLeft, data[i].ext,true,true,data[i].ext.timer);
chatCon += this.messageHtml(rightOrLeft, data[i].ext, true, true, data[i].ext.timer);
}
}
......
......@@ -101,9 +101,9 @@ $(function () {
num: num,
hq: hq,
time: time,
image: img,
goodImage: img,
userName: name,
id:id
targetId:id
};
Util.setCookie('template', JSON.stringify(obj), 1, cookieHostname)
window.location.href = '/chat'
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment