msb-public
/
go-fly
mirror of https://github.com/taoshihan1991/go-fly.git
1
0
Code Issues Projects Releases Wiki Activity

客服显示当前处理

Browse Source
pull/30/head
陶士涵 5 years ago
parent 2471436796
commit 060fc93ced
2 changed files with 100 additions and 43 deletions
Show Stats Download Patch File Download Diff File

24
controller/chat.go
Unescape View File

@ -85,6 +85,9 @@ func ChatServer(w *websocket.Conn) {
msgData, _ :=json.Marshal(typeMsg.Data) msgData, _ :=json.Marshal(typeMsg.Data)
switch msgType { switch msgType {
//获取当前在线的所有用户
case "getOnlineUsers":
getOnlineUser(w)
//用户上线 //用户上线
case "userInit": case "userInit":
json.Unmarshal(msgData,&userMsg) json.Unmarshal(msgData,&userMsg)
@ -109,6 +112,7 @@ func ChatServer(w *websocket.Conn) {
//客服接手 //客服接手
case "kfConnect": case "kfConnect":
json.Unmarshal(msgData,&kfMsg) json.Unmarshal(msgData,&kfMsg)
kefuList[kfMsg.Kf_id] = w
SendKefuOnline(kfMsg,clientList[kfMsg.Guest_id]) SendKefuOnline(kfMsg,clientList[kfMsg.Guest_id])
case "kfChatMessage": case "kfChatMessage":
json.Unmarshal(msgData,&kfMsg) json.Unmarshal(msgData,&kfMsg)
@ -151,14 +155,12 @@ func SendUserAllNotice(uid string){
if len(kefuList)!=0{ if len(kefuList)!=0{
//发送给客服通知 //发送给客服通知
for _, conn := range kefuList { for _, conn := range kefuList {
result := make([]map[string]string, 0)
userInfo := make(map[string]string) userInfo := make(map[string]string)
userInfo["uid"] = uid userInfo["uid"] = uid
userInfo["username"]=clientNameList[uid] userInfo["username"]=clientNameList[uid]
result = append(result, userInfo)
msg:=NoticeMessage{ msg:=NoticeMessage{
Type: "notice", Type: "notice",
Data:result, Data:userInfo,
} }
str,_:=json.Marshal(msg);sendStr:=string(str) str,_:=json.Marshal(msg);sendStr:=string(str)
websocket.Message.Send(conn,sendStr) websocket.Message.Send(conn,sendStr)
@ -197,6 +199,22 @@ func SendOnekfuAllNotice(conn *websocket.Conn){
str,_:=json.Marshal(msg);sendStr:=string(str) str,_:=json.Marshal(msg);sendStr:=string(str)
websocket.Message.Send(conn,sendStr) websocket.Message.Send(conn,sendStr)
} }
//获取当前的在线用户
func getOnlineUser(w *websocket.Conn){
result := make([]map[string]string, 0)
for uid, _ := range clientList {
userInfo := make(map[string]string)
userInfo["uid"] = uid
userInfo["username"]=clientNameList[uid]
result = append(result, userInfo)
}
msg:=NoticeMessage{
Type: "getOnlineUsers",
Data:result,
}
str,_:=json.Marshal(msg);sendStr:=string(str)
websocket.Message.Send(w,sendStr)
}
func SendUserChat(){} func SendUserChat(){}
func SendKefuChat(){} func SendKefuChat(){}
var clientList = make(map[string]*websocket.Conn) var clientList = make(map[string]*websocket.Conn)

103
static/html/chat_main.html
Unescape View File

@ -13,7 +13,7 @@
<style> <style>
html, body {height: 100%;padding: 0;margin: 0;background-color: #f5f5f5;} html, body {height: 100%;padding: 0;margin: 0;background-color: #f5f5f5;}
.el-row{width:100%}#app{margin-top: 10px;} .el-row{width:100%}#app{margin-top: 10px;}
.chatLeft{border-bottom: solid 1px #e6e6e6;overflow: hidden;} .chatLeft{min-height: 100%;border-bottom: solid 1px #e6e6e6;overflow: hidden;border-top: solid 1px #e6e6e6;}
.sw-bg{background: #fff;border: solid 1px #e6e6e6;boder-top:none;padding:5px 10px;} .sw-bg{background: #fff;border: solid 1px #e6e6e6;boder-top:none;padding:5px 10px;}
.chatContext .el-row{margin-bottom: 5px;} .chatContext .el-row{margin-bottom: 5px;}
.chatUser{ .chatUser{
@ -31,6 +31,7 @@
min-height: 35px; min-height: 35px;
word-break: break-all; word-break: break-all;
position: relative; position: relative;
border-radius: 5px;
} }
.chatContent:after { .chatContent:after {
content: ''; content: '';
@ -46,6 +47,8 @@
border-top-style: solid; border-top-style: solid;
border-top-color: rgb(166,212,242); border-top-color: rgb(166,212,242);
} }
.chatBoxMe .chatContent{background-color: rgb(152,225,101);border: 1px solid rgb(145, 215, 96);}
.chatBoxMe .chatContent:after{border-top-color: rgb(152,225,101);}
.chatBoxMe .el-col-3{float: right;text-align: right;} .chatBoxMe .el-col-3{float: right;text-align: right;}
.chatBoxMe .chatUser{text-align: right} .chatBoxMe .chatUser{text-align: right}
.chatBoxMe .chatContent:after{left:auto;right: -10px;} .chatBoxMe .chatContent:after{left:auto;right: -10px;}
@ -58,8 +61,12 @@
<template> <template>
<el-row :gutter="5"> <el-row :gutter="5">
<el-col :span="6"> <el-col :span="6">
<el-menu class="chatLeft"> <el-menu class="chatLeft" :default-active="currentGuest">
<el-menu-item v-for="v in users" v-bind:key="v.uid" v-on:click="talkTo(v.uid)"> <el-menu-item>
<i class="el-icon-s-promotion"></i>
<span slot="title">在线用户</span>
</el-menu-item>
<el-menu-item :index="v.uid" v-for="v in users" v-bind:key="v.uid" v-on:click="talkTo(v.uid)">
<i class="el-icon-user"></i> <i class="el-icon-user"></i>
<span slot="title"><{v.username}></span> <span slot="title"><{v.username}></span>
</el-menu-item> </el-menu-item>
@ -67,6 +74,10 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<div class="sw-bg chatContext"> <div class="sw-bg chatContext">
<el-alert
:title="chatTitle"
type="success">
</el-alert>
<div class="chatBox"> <div class="chatBox">
<el-row :gutter="2" v-for="v in msgList" v-bind:class="{'chatBoxMe': v.is_kefu==true}"> <el-row :gutter="2" v-for="v in msgList" v-bind:class="{'chatBoxMe': v.is_kefu==true}">
<el-col :span="3"><el-avatar :size="60" :src="v.avatar"></el-avatar></el-col> <el-col :span="3"><el-avatar :size="60" :src="v.avatar"></el-avatar></el-col>
@ -81,9 +92,13 @@
</div> </div>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<div class="sw-bg"> <el-menu class="chatLeft">
常用功能 <el-menu-item>
</div> <i class="el-icon-s-tools"></i>
<span slot="title">常用工具</span>
</el-menu-item>
</el-menu>
</el-col> </el-col>
</el-row> </el-row>
</template> </template>
@ -102,12 +117,14 @@
data: { data: {
fullscreenLoading:true, fullscreenLoading:true,
users:[], users:[],
usersMap:[],
server:"ws://127.0.0.1:8080/chat_server", server:"ws://127.0.0.1:8080/chat_server",
socket:null, socket:null,
messageContent:"", messageContent:"",
currentGuest:"", currentGuest:"",
msgList:[], msgList:[],
msgListUser:[], msgListUser:[],
chatTitle:"暂时未处理咨询",
}, },
methods: { methods: {
//跳转 //跳转
@ -115,13 +132,16 @@
window.location.href = url; window.location.href = url;
}, },
getOnlineUsers() { getOnlineUsers() {
let _this = this; let mes = {}
$.get('/chat_users',function (rs) { mes.type = "getOnlineUsers";
_this.users=rs.result mes.data = kfConfig;
_this.fullscreenLoading=false; this.socket.send(JSON.stringify(mes));
}).then(()=>{ },
_this.fullscreenLoading=false; sendKefuOnline(){
}); let mes = {}
mes.type = "kfOnline";
mes.data = kfConfig;
this.socket.send(JSON.stringify(mes));
}, },
//初始化websocket //初始化websocket
initConn() { initConn() {
@ -131,35 +151,41 @@
this.socket.onopen = this.OnOpen; this.socket.onopen = this.OnOpen;
}, },
OnOpen() { OnOpen() {
let mes = {} this.getOnlineUsers();
mes.type = "kfOnline";
mes.data = kfConfig;
this.socket.send(JSON.stringify(mes));
}, },
OnMessage(e) { OnMessage(e) {
const redata = JSON.parse(e.data); const redata = JSON.parse(e.data);
if (redata.type == "notice") { switch (redata.type){
case "getOnlineUsers":
this.handleOnlineUsers(redata.data);
break;
case "notice":
if(!this.usersMap[redata.data.uid]){
this.$notify({ this.$notify({
title: "通知", title: "通知",
message: "新客户访问", message: "新客户访问",
type: 'success', type: 'success',
duration: 0, duration: 0,
}); });
//this.users = redata.data;
this.currentGuest = redata.data[0].uid;
for(i=0;i<redata.data.length;i++){
if (typeof (this.msgListUser[redata.data[i].uid]) == "undefined") {
this.msgListUser[redata.data[i].uid] = [];
} }
this.getOnlineUsers();
this.sendKefuOnline();
break;
} }
// if (redata.type == "notice") {
// this.$notify({
// title: "通知",
// message: "新客户访问",
// type: 'success',
// duration: 0,
// });
//发送给客户我在线 //发送给客户我在线
let mes = {} // let mes = {}
mes.type = "kfConnect"; // mes.type = "kfConnect";
kfConfig.guest_id=redata.data[0].uid; // kfConfig.guest_id=redata.data[0].uid;
mes.data = kfConfig; // mes.data = kfConfig;
this.socket.send(JSON.stringify(mes)); // this.socket.send(JSON.stringify(mes));
//}
}
if (redata.type == "chatMessage") { if (redata.type == "chatMessage") {
let msg = redata.data let msg = redata.data
@ -184,6 +210,7 @@
//接手客户 //接手客户
talkTo(guestId) { talkTo(guestId) {
this.currentGuest = guestId; this.currentGuest = guestId;
this.chatTitle=this.usersMap[guestId]+guestId+",正在处理中...";
this.msgList = []; this.msgList = [];
let buf = []; let buf = [];
var i = this.msgListUser[guestId].length; var i = this.msgListUser[guestId].length;
@ -192,7 +219,7 @@
} }
this.msgList = buf; this.msgList = buf;
//发送给客户我在线 //发送给客户
let mes = {} let mes = {}
mes.type = "kfConnect"; mes.type = "kfConnect";
kfConfig.guest_id=guestId; kfConfig.guest_id=guestId;
@ -223,10 +250,22 @@
$('.chatBox').scrollTop($(".chatBox")[0].scrollHeight); $('.chatBox').scrollTop($(".chatBox")[0].scrollHeight);
}); });
}, },
//处理当前在线用户列表
handleOnlineUsers:function (retData) {
this.users = retData;
if (this.currentGuest == "") {
this.chatTitle = "连接成功,等待处理中...";
}
for(let i=0;i<retData.length;i++){
this.usersMap[retData[i].uid]=retData[i].username;
if (typeof (this.msgListUser[retData[i].uid]) == "undefined") {
this.msgListUser[retData[i].uid] = [];
}
}
},
}, },
created: function () { created: function () {
this.initConn(); this.initConn();
this.getOnlineUsers();
} }
}) })

Write Preview
Loading…
Cancel
Save