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

english

Browse Source
master
taoshihan 2 months ago
parent 8406ba74c5
commit 05e8b3f788
4 changed files with 324 additions and 342 deletions
Show Stats Download Patch File Download Diff File

98
controller/visitor.go
Unescape View File

@ -10,55 +10,55 @@ import (
"strconv" "strconv"
) )
//func PostVisitor(c *gin.Context) { // func PostVisitor(c *gin.Context) {
// name := c.PostForm("name") // name := c.PostForm("name")
// avator := c.PostForm("avator") // avator := c.PostForm("avator")
// toId := c.PostForm("to_id") // toId := c.PostForm("to_id")
// id := c.PostForm("id") // id := c.PostForm("id")
// refer := c.PostForm("refer") // refer := c.PostForm("refer")
// city := c.PostForm("city") // city := c.PostForm("city")
// client_ip := c.PostForm("client_ip") // client_ip := c.PostForm("client_ip")
// if name == "" || avator == "" || toId == "" || id == "" || refer == "" || city == "" || client_ip == "" { // if name == "" || avator == "" || toId == "" || id == "" || refer == "" || city == "" || client_ip == "" {
// c.JSON(200, gin.H{ // c.JSON(200, gin.H{
// "code": 400, // "code": 400,
// "msg": "error", // "msg": "error",
// }) // })
// return // return
// } // }
// kefuInfo := models.FindUser(toId) // kefuInfo := models.FindUser(toId)
// if kefuInfo.ID == 0 { // if kefuInfo.ID == 0 {
// c.JSON(200, gin.H{ // c.JSON(200, gin.H{
// "code": 400, // "code": 400,
// "msg": "用户不存在", // "msg": "用户不存在",
// }) // })
// return // return
// } // }
// models.CreateVisitor(name, avator, c.ClientIP(), toId, id, refer, city, client_ip) // models.CreateVisitor(name, avator, c.ClientIP(), toId, id, refer, city, client_ip)
// //
// userInfo := make(map[string]string) // userInfo := make(map[string]string)
// userInfo["uid"] = id // userInfo["uid"] = id
// userInfo["username"] = name // userInfo["username"] = name
// userInfo["avator"] = avator // userInfo["avator"] = avator
// msg := TypeMessage{ // msg := TypeMessage{
// Type: "userOnline", // Type: "userOnline",
// Data: userInfo, // Data: userInfo,
// } // }
// str, _ := json.Marshal(msg) // str, _ := json.Marshal(msg)
// kefuConns := kefuList[toId] // kefuConns := kefuList[toId]
// if kefuConns != nil { // if kefuConns != nil {
// for k, kefuConn := range kefuConns { // for k, kefuConn := range kefuConns {
// log.Println(k, "xxxxxxxx") // log.Println(k, "xxxxxxxx")
// kefuConn.WriteMessage(websocket.TextMessage, str) // kefuConn.WriteMessage(websocket.TextMessage, str)
// }
// } // }
// c.JSON(200, gin.H{
// "code": 200,
// "msg": "ok",
// })
// } // }
// c.JSON(200, gin.H{
// "code": 200,
// "msg": "ok",
// })
//}
func PostVisitorLogin(c *gin.Context) { func PostVisitorLogin(c *gin.Context) {
ipcity := tools.ParseIp(c.ClientIP()) ipcity := tools.ParseIp(c.ClientIP())
avator:="" avator := ""
userAgent := c.GetHeader("User-Agent") userAgent := c.GetHeader("User-Agent")
if tools.IsMobile(userAgent) { if tools.IsMobile(userAgent) {
avator = "/static/images/1.png" avator = "/static/images/1.png"
@ -77,13 +77,21 @@ func PostVisitorLogin(c *gin.Context) {
city string city string
name string name string
) )
if ipcity != nil { if ipcity != nil {
city = ipcity.CountryName + ipcity.RegionName + ipcity.CityName city = ipcity.CountryName + ipcity.RegionName + ipcity.CityName
name = ipcity.CountryName + ipcity.RegionName + ipcity.CityName + "网友" name = ipcity.CountryName + ipcity.RegionName + ipcity.CityName
} else { } else {
city = "未识别地区" city = "未识别地区"
name = "匿名网友" name = "匿名网友"
} }
if city == "本机地址本机地址" {
name = "local address"
}
if ipcity.CountryName == "本机地址本机地址" {
name = "local visitor"
}
client_ip := c.ClientIP() client_ip := c.ClientIP()
extra := c.PostForm("extra") extra := c.PostForm("extra")
extraJson := tools.Base64Decode(extra) extraJson := tools.Base64Decode(extra)

478
static/templates/chat_main.html
Unescape View File

@ -1,9 +1,9 @@
<html lang="cn"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="description" content=""> <meta name="description" content="">
<meta name="author" content=""> <meta name="author" content="">
<title>GO语言开源客服系统-GOFLY</title> <title>GOFLY - Open Source Customer Support System</title>
<link rel="stylesheet" href="/static/cdn/element-ui/2.15.1/theme-chalk/index.min.css"> <link rel="stylesheet" href="/static/cdn/element-ui/2.15.1/theme-chalk/index.min.css">
<script src="/static/cdn/vue/2.6.11/vue.min.js"></script> <script src="/static/cdn/vue/2.6.11/vue.min.js"></script>
<script src="/static/cdn/element-ui/2.15.1/index.js"></script> <script src="/static/cdn/element-ui/2.15.1/index.js"></script>
@ -34,290 +34,278 @@
<body> <body>
<div id="app" class="chatMainPage"> <div id="app" class="chatMainPage">
<template> <template>
<el-row> <el-row>
<el-col :span="5"> <el-col :span="5">
<div class="chatBg chatLeft"> <div class="chatBg chatLeft">
<el-tabs v-model="leftTabActive" @tab-click="handleTabClick"> <el-tabs v-model="leftTabActive" @tab-click="handleTabClick">
<el-tab-pane label="在线用户" name="first"> <el-tab-pane label="Online Visitors" name="first">
<el-row v-for="item in users" :key="item.uid" class=""> <el-row v-for="item in users" :key="item.uid" class="">
<div :title="item.last_message" style="cursor:pointer" class="onlineUsers hasLastMsg" v-bind:class="{'cur': item.uid==currentGuest }" v-on:click="talkTo(item.uid,item.username)"> <div :title="item.last_message" style="cursor:pointer" class="onlineUsers hasLastMsg" v-bind:class="{'cur': item.uid==currentGuest }" v-on:click="talkTo(item.uid,item.username)">
<el-col :span="4"> <el-col :span="4">
<el-badge value="new" :hidden="item.hidden_new_message" class="item"> <el-badge value="new" :hidden="item.hidden_new_message" class="item">
<el-avatar :size="40" :src="item.avator"></el-avatar> <el-avatar :size="40" :src="item.avator"></el-avatar>
</el-badge> </el-badge>
</el-col> </el-col>
<el-col :span="16"> <el-col :span="16">
<div style="height:20px;overflow: hidden"><{item.username}></div> <div style="height:20px;overflow: hidden"><{item.username}></div>
<div class="lastNewMsg"><{item.last_message}></div> <div class="lastNewMsg"><{item.last_message}></div>
</el-col> </el-col>
</div>
</el-row>
</el-tab-pane>
<el-tab-pane label="已接访客" name="second">
<el-row v-for="item in visitors" :key="item.uid" class="">
<div style="cursor:pointer" class="onlineUsers" v-bind:class="{'cur': item.visitor_id==currentGuest }" v-on:click="talkTo(item.visitor_id,item.name)">
<el-col :span="4">
<el-avatar v-bind:class="{'imgGray': item.status==0 }" :size="40" :src="item.avator"></el-avatar>
</el-col>
<el-col style="height:40px;overflow: hidden" :span="16" v-bind:class="{'imgGray': item.status==0 }">
<{item.name}>
</el-col>
</div>
</el-row>
<el-pagination
v-show="visitorCount>visitorPageSize"
background
@current-change="visitorPage"
:current-page="visitorCurrentPage"
layout="prev,pager, next"
:page-size="visitorPageSize"
:total="visitorCount">
</el-pagination>
</el-tab-pane>
</el-tabs>
</div>
</el-col>
<el-col :span="13">
<div class="kefuMainBg chatBgContext">
<el-alert
:closable="false"
:type="chatTitleType"
show-icon
:title="chatTitle+chatInputing"
>
</el-alert>
<div class="kefuFuncBtns" v-if="visitor.visitor_id" style="display: none">
<el-button v-on:click="getMesssagesByVisitorId(visitor.visitor_id,true)" size="small" type="success" plain icon="el-icon-user">加载全部</el-button>
<el-button v-on:click="transKefu" size="small" type="success" plain icon="el-icon-position">转接</el-button>
<el-button v-on:click="closeVisitor(visitor.visitor_id)" size="small" type="success" plain icon="el-icon-close">结束</el-button>
</div>
<div class="chatBox">
<div style="text-align: center;" v-on:click="getHistoryMessage" v-show="showLoadMore">
<a href="javascript:;" class="chatNoticeContent" style="color: #07a9fe;">点击加载更多记录</a>
</div>
<el-row :gutter="2" v-for="v in msgList" v-bind:class="{'chatBoxMe': v.is_kefu==true}">
<div class="chatTime"><{v.time}></div>
<div class="chatRow">
<el-avatar v-if="v.is_kefu==false" class="chatRowAvator" :size="48" :src="v.avator"></el-avatar>
<div class="chatMsgContent">
<div class="chatUser"><{v.name}></div>
<div class="chatContent" v-html="v.content"></div>
</div>
<el-avatar v-if="v.is_kefu==true" class="chatRowAvator" :size="48" :src="v.avator"></el-avatar>
</div> </div>
</el-row> </el-row>
</el-tab-pane>
<el-tab-pane label="Recent Visitors" name="second">
<el-row v-for="item in visitors" :key="item.uid" class="">
<div style="cursor:pointer" class="onlineUsers" v-bind:class="{'cur': item.visitor_id==currentGuest }" v-on:click="talkTo(item.visitor_id,item.name)">
<el-col :span="4">
<el-avatar v-bind:class="{'imgGray': item.status==0 }" :size="40" :src="item.avator"></el-avatar>
</el-col>
<el-col style="height:40px;overflow: hidden" :span="16" v-bind:class="{'imgGray': item.status==0 }">
<{item.name}>
</el-col>
</div>
</el-row>
<el-pagination
v-show="visitorCount>visitorPageSize"
background
@current-change="visitorPage"
:current-page="visitorCurrentPage"
layout="prev,pager, next"
:page-size="visitorPageSize"
:total="visitorCount">
</el-pagination>
</el-tab-pane>
</el-tabs>
</div>
</el-col>
<el-col :span="13">
<div class="kefuMainBg chatBgContext">
<el-alert
:closable="false"
:type="chatTitleType"
show-icon
:title="chatTitle+chatInputing">
</el-alert>
<div class="kefuFuncBtns" v-if="visitor.visitor_id" style="display: none">
<el-button v-on:click="getMesssagesByVisitorId(visitor.visitor_id,true)" size="small" type="success" plain icon="el-icon-user">Load All</el-button>
<el-button v-on:click="transKefu" size="small" type="success" plain icon="el-icon-position">Transfer</el-button>
<el-button v-on:click="closeVisitor(visitor.visitor_id)" size="small" type="success" plain icon="el-icon-close">End Chat</el-button>
</div>
<div class="chatBox">
<div style="text-align: center;" v-on:click="getHistoryMessage" v-show="showLoadMore">
<a href="javascript:;" class="chatNoticeContent" style="color: #07a9fe;">Load More Messages</a>
</div> </div>
<div class="kefuFuncBox">
<div class="iconBtnsBox">
<div class="faceBox kefuFaceBox" v-show="showFaceIcon"> <el-row :gutter="2" v-for="v in msgList" v-bind:class="{'chatBoxMe': v.is_kefu==true}">
<ul class="faceBoxList"> <div class="chatTime"><{v.time}></div>
<li v-on:click="faceIconClick(i)" class="faceIcon" v-for="(v,i) in face" :title="v.name"><img :src=v.path></li> <div class="chatRow">
</ul> <el-avatar v-if="v.is_kefu==false" class="chatRowAvator" :size="48" :src="v.avator"></el-avatar>
<div class="clear"></div> <div class="chatMsgContent">
<div class="chatUser"><{v.name}></div>
<div class="chatContent" v-html="v.content"></div>
</div> </div>
<el-tooltip content="发送表情" placement="top"> <el-avatar v-if="v.is_kefu==true" class="chatRowAvator" :size="48" :src="v.avator"></el-avatar>
<div class="iconBtn iconfont icon-xiaolian" style="font-size: 24px;" @click.stop="showFaceIcon==true?showFaceIcon=false:showFaceIcon=true"></div> </div>
</el-tooltip> </el-row>
</div>
<el-tooltip content="上传图片" placement="top">
<div class="iconBtn el-icon-picture" id="uploadImg" v-on:click="uploadImg('/uploadimg')" style="font-size: 24px;"></div>
</el-tooltip>
<el-tooltip content="上传附件" placement="top">
<div class="iconBtn el-icon-upload" id="uploadFile" v-on:click="uploadFile('/uploadfile')" style="font-size: 26px;"></div>
</el-tooltip>
<div class="kefuFuncBox">
<div class="iconBtnsBox">
<div class="faceBox kefuFaceBox" v-show="showFaceIcon">
<ul class="faceBoxList">
<li v-on:click="faceIconClick(i)" class="faceIcon" v-for="(v,i) in face" :title="v.name"><img :src=v.path></li>
</ul>
<div class="clear"></div>
</div> </div>
<div class="clear"></div>
<el-button class="kefuSendBtn" :disabled="sendDisabled" size="mini" type="primary" v-on:click="chatToUser">发送</el-button> <el-tooltip content="Send Emoji" placement="top">
<el-input type="textarea" :autosize="{ minRows: 8, maxRows: 12}" class="chatArea" v-model="messageContent" v-on:keyup.enter.native="chatToUser" placeholder="请输入内容"></el-input> <div class="iconBtn iconfont icon-xiaolian" style="font-size: 24px;" @click.stop="showFaceIcon==true?showFaceIcon=false:showFaceIcon=true"></div>
</el-tooltip>
<el-tooltip content="Upload Image" placement="top">
<div class="iconBtn el-icon-picture" id="uploadImg" v-on:click="uploadImg('/uploadimg')" style="font-size: 24px;"></div>
</el-tooltip>
<el-tooltip content="Upload File" placement="top">
<div class="iconBtn el-icon-upload" id="uploadFile" v-on:click="uploadFile('/uploadfile')" style="font-size: 26px;"></div>
</el-tooltip>
</div> </div>
<div class="clear"></div>
<el-button class="kefuSendBtn" :disabled="sendDisabled" size="mini" type="primary" v-on:click="chatToUser">Send</el-button>
<el-input type="textarea" :autosize="{ minRows: 8, maxRows: 12}" class="chatArea" v-model="messageContent" v-on:keyup.enter.native="chatToUser" placeholder="Type your message here"></el-input>
</div> </div>
</el-col> </div>
<el-col :span="6" class="chatRight"> </el-col>
<div class="chatBg">
<el-tabs v-model="rightTabActive" @tab-click="handleTabClick"> <el-col :span="6" class="chatRight">
<el-tab-pane label="访客信息" name="visitorInfo"> <div class="chatBg">
<el-menu class="visitorInfo" v-show="visitor.visitor_id"> <el-tabs v-model="rightTabActive" @tab-click="handleTabClick">
<el-tooltip content="点击加入黑名单" placement="left"> <el-tab-pane label="Visitor Info" name="visitorInfo">
<el-menu-item v-on:click="addIpblack(visitor.source_ip)" title="点击加入黑名单" style="padding-left:2px;color: #666;"> <el-menu class="visitorInfo" v-show="visitor.visitor_id">
<i class="el-icon-user"></i> <el-tooltip content="Click to blacklist" placement="left">
<span slot="title">IP地址：<{visitor.source_ip}></span> <el-menu-item v-on:click="addIpblack(visitor.source_ip)" title="Click to blacklist" style="padding-left:2px;color: #666;">
</el-menu-item> <i class="el-icon-user"></i>
</el-tooltip> <span slot="title">IP: <{visitor.source_ip}></span>
<el-menu-item v-on:click="openUrl('https://www.baidu.com/s?wd='+visitor.client_ip)" style="padding-left:2px;color: #666;">
<i class="el-icon-map-location"></i>
<span slot="title">城市：<{visitor.city}></span>
</el-menu-item> </el-menu-item>
</el-tooltip>
<el-menu-item v-on:click="openUrl('https://www.baidu.com/s?wd='+visitor.client_ip)" style="padding-left:2px;color: #666;">
<i class="el-icon-map-location"></i>
<span slot="title">Location: <{visitor.city}></span>
</el-menu-item>
<el-menu-item style="padding-left:2px;color: #666;">
<i class="el-icon-time"></i>
<span slot="title">First Visit: <{visitor.created_at}></span>
</el-menu-item>
<el-menu-item style="padding-left:2px;color: #666;">
<i class="el-icon-time"></i>
<span slot="title">Last Active: <{visitor.updated_at}></span>
</el-menu-item>
<el-tooltip :content="visitor.refer" placement="left">
<el-menu-item style="padding-left:2px;color: #666;"> <el-menu-item style="padding-left:2px;color: #666;">
<i class="el-icon-time"></i> <i class="el-icon-guide"></i>
<span slot="title">首次访问：<{visitor.created_at}></span> <span slot="title">Referrer: <{visitor.refer}></span>
</el-menu-item> </el-menu-item>
</el-tooltip>
<el-tooltip v-for="v in visitorExtra" :content="v.val" placement="left">
<el-menu-item style="padding-left:2px;color: #666;"> <el-menu-item style="padding-left:2px;color: #666;">
<i class="el-icon-time"></i> <i class="el-icon-paperclip"></i>
<span slot="title">最后访问：<{visitor.updated_at}></span> <span slot="title"><{v.key}>: <{v.val}></span>
</el-menu-item> </el-menu-item>
<el-tooltip :content="visitor.refer" placement="left"> </el-tooltip>
<el-menu-item style="padding-left:2px;color: #666;"> </el-menu>
<i class="el-icon-guide"></i> </el-tab-pane>
<span slot="title" >来源标题：<{visitor.refer}></span>
</el-menu-item> <el-tab-pane label="Blacklist" name="blackList">
</el-tooltip> <el-row v-for="item in ipBlacks" :key="item.id" class="">
<el-tooltip v-for="v in visitorExtra" :content="v.val" placement="left"> <el-tooltip content="Click to remove" placement="left">
<el-menu-item style="padding-left:2px;color: #666;">
<i class="el-icon-paperclip"></i>
<span slot="title"><{v.key}>：<{v.val}></span>
</el-menu-item>
</el-tooltip>
</el-menu>
</el-tab-pane>
<el-tab-pane label="黑名单" name="blackList">
<el-row v-for="item in ipBlacks" :key="item.id" class="">
<el-tooltip content="点击删除黑名单" placement="left">
<div v-on:click="delIpblack(item.ip)" style="cursor:pointer" class="onlineUsers imgGray"> <div v-on:click="delIpblack(item.ip)" style="cursor:pointer" class="onlineUsers imgGray">
<{item.ip}> <{item.ip}>
</div> </div>
</el-tooltip> </el-tooltip>
</el-row> </el-row>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</div>
<div class="replyBox">
<div class="chatRightTitle">Quick Replies
<a href="javascript:void(0);" @click="replyGroupDialog = true">+ Add Group</a>
</div> </div>
<div class="replyBox">
<div class="chatRightTitle">快捷回复 <el-input placeholder="Search replies..." v-model="replySearch" class="replySearch" @keyup.enter="searchReply">
<a href="javascript:void(0);" @click="replyGroupDialog = true">+添加分组</a> <el-button slot="append" icon="el-icon-search" @click="searchReply"></el-button>
</div> </el-input>
<el-input placeholder="选中文字自动搜索" v-model="replySearch" class="replySearch" @keyup.enter="searchReply">
<el-button slot="append" icon="el-icon-search" @click="searchReply"></el-button> <div class="replyContent">
</el-input> <el-collapse v-show="replySearchList" v-model="replySearchListActive">
<div class="replyContent"> <el-collapse-item v-for="reply in replySearchList" :key="reply.group_id" :title="reply.group_name" :name="reply.group_id">
<el-collapse v-show="replySearchList" v-model="replySearchListActive"> <template slot="title">
<el-collapse-item v-for="reply in replySearchList" :key="reply.group_id" :title="reply.group_name" :name="reply.group_id"> <i class="el-icon-folder"></i>&nbsp;<{reply.group_name}>
<template slot="title"> </template>
<i class="el-icon-folder"></i>&nbsp;<{reply.group_name}> <div class="replyItem" @click="messageContent=item.item_content" v-for="item in reply.items">
</template> <{item.item_content}> &nbsp;&nbsp;
<div class="replyItem" @click="messageContent=item.item_content" v-for="item in reply.items" ><{item.item_content}> &nbsp;&nbsp;<el-button @click="deleteReplyContent(item.item_id)" type="text">删除</el-button></div> <el-button @click="deleteReplyContent(item.item_id)" type="text">Delete</el-button>
<el-button @click="replyContentDialog=true;groupName=reply.group_name;groupId=reply.group_id" type="text">+添加回复内容</el-button> </div>
<el-button @click="deleteReplyGroup(reply.group_id)" type="text">-删除组</el-button> <el-button @click="replyContentDialog=true;groupName=reply.group_name;groupId=reply.group_id" type="text">+ Add Reply</el-button>
</el-collapse-item> <el-button @click="deleteReplyGroup(reply.group_id)" type="text">- Delete Group</el-button>
</el-collapse> </el-collapse-item>
<el-collapse v-show="replySearchList.length==0"> </el-collapse>
<el-collapse-item v-for="reply in replys" :key="reply.group_id" :title="reply.group_name" :name="reply.group_id">
<template slot="title"> <el-collapse v-show="replySearchList.length==0">
<i class="el-icon-s-order"></i>&nbsp;<{reply.group_name}> <el-collapse-item v-for="reply in replys" :key="reply.group_id" :title="reply.group_name" :name="reply.group_id">
</template> <template slot="title">
<div class="replyItem" @click="messageContent=item.item_content" v-for="item in reply.items" > <i class="el-icon-s-order"></i>&nbsp;<{reply.group_name}>
<el-popover </template>
placement="left" <div class="replyItem" @click="messageContent=item.item_content" v-for="item in reply.items">
width="300" <el-popover placement="left" width="300" trigger="hover">
trigger="hover"> <div v-html="replaceContent(item.item_content)"></div>
<div v-html="replaceContent(item.item_content)"> <div class="replyItemTitle" slot="reference">
</div> <i class="header-icon el-icon-document"></i> <{item.item_name}>
<div class="replyItemTitle" slot="reference"><i class="header-icon el-icon-document"></i> <{item.item_name}></div>
</el-popover>
<el-button @click="editReplyContent('no',item.item_id,item.item_name,item.item_content)" type="text">编辑</el-button>
<el-button @click="deleteReplyContent(item.item_id)" type="text">删除</el-button></div>
<el-button @click="replyContentDialog=true;groupName=reply.group_name;groupId=reply.group_id" type="text">+添加回复内容</el-button>
<el-popover
placement="top"
width="100"
v-model="visible">
<p>确定删除吗？</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="visible = false">取消</el-button>
<el-button type="primary" size="mini" @click="visible = false;deleteReplyGroup(reply.group_id)">确定</el-button>
</div> </div>
<el-button slot="reference" type="text">-删除组</el-button>
</el-popover> </el-popover>
<el-button @click="editReplyContent('no',item.item_id,item.item_name,item.item_content)" type="text">Edit</el-button>
</el-collapse-item> <el-button @click="deleteReplyContent(item.item_id)" type="text">Delete</el-button>
</el-collapse> </div>
</div> <el-button @click="replyContentDialog=true;groupName=reply.group_name;groupId=reply.group_id" type="text">+ Add Reply</el-button>
<el-popover placement="top" width="100" v-model="visible">
<p>Confirm deletion?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="visible = false">Cancel</el-button>
<el-button type="primary" size="mini" @click="visible = false;deleteReplyGroup(reply.group_id)">Confirm</el-button>
</div>
<el-button slot="reference" type="text">- Delete Group</el-button>
</el-popover>
</el-collapse-item>
</el-collapse>
</div> </div>
</el-col> </div>
</el-row> </el-col>
<!--图片放大--> </el-row>
<!-- Image Preview -->
<div id="bigPic" class="bigPic"> <div id="bigPic" class="bigPic">
<img src="/static/images/3.jpg"/> <img src="/static/images/3.jpg"/>
</div> </div>
<!--//图片放大-->
<!-- Audio Elements -->
<audio id="chatMessageAudio"> <audio id="chatMessageAudio">
<source id="chatMessageAudioSource" src="/static/images/alert2.ogg" type="audio/mpeg" /> <source id="chatMessageAudioSource" src="/static/images/alert2.ogg" type="audio/mpeg" />
</audio> </audio>
<audio id="chatMessageSendAudio"> <audio id="chatMessageSendAudio">
<source id="chatMessageSendAudioSource" src="/static/images/sent.ogg" type="audio/mpeg" /> <source id="chatMessageSendAudioSource" src="/static/images/sent.ogg" type="audio/mpeg" />
</audio> </audio>
<!--转接-->
<el-dialog <!-- Transfer Dialog -->
title="转移客服" <el-dialog title="Transfer Conversation" :visible.sync="transKefuDialog" width="30%" top="0">
:visible.sync="transKefuDialog" <el-table :data="otherKefus" style="width: 100%">
width="30%" <el-table-column prop="nickname" label="Agent"></el-table-column>
top="0" <el-table-column prop="status" label="Action">
>
<el-table
:data="otherKefus"
style="width: 100%">
<el-table-column
prop="nickname"
label="客服">
</el-table-column>
<el-table-column
prop="status"
label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag v-show="scope.row.status=='offline'" <el-tag v-show="scope.row.status=='offline'" disable-transitions>Offline</el-tag>
disable-transitions>离线</el-tag> <el-button v-show="scope.row.status=='online'" type="primary" @click="transKefuVisitor(scope.row.name,visitor.visitor_id)">Transfer</el-button>
<el-button v-show="scope.row.status=='online'" type="primary" @click="transKefuVisitor(scope.row.name,visitor.visitor_id)">转移</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="transKefuDialog = false">取 消</el-button> <el-button @click="transKefuDialog = false">Cancel</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!--//转接-->
<!--回复分组--> <!-- Reply Group Dialog -->
<el-dialog <el-dialog title="Add Group" :visible.sync="replyGroupDialog" width="30%" top="0">
title="添加分组" <el-input v-model="groupName"></el-input>
:visible.sync="replyGroupDialog"
width="30%"
top="0"
>
<el-input v-model="groupName"></el-input>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="addReplyGroup">保 存</el-button> <el-button @click="addReplyGroup">Save</el-button>
<el-button @click="replyGroupDialog = false">取 消</el-button> <el-button @click="replyGroupDialog = false">Cancel</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!--//回复分组-->
<!--回复内容--> <!-- Reply Content Dialogs -->
<el-dialog <el-dialog title="Add Quick Reply" :visible.sync="replyContentDialog" width="30%" top="0">
title="添加回复内容" <el-input style="margin-bottom: 10px;" placeholder="Keyword" v-model="replyTitle"></el-input>
:visible.sync="replyContentDialog" <el-input placeholder="Content" type="textarea" v-model="replyContent"></el-input>
width="30%"
top="0"
>
<el-input style="margin-bottom: 10px;" placeholder="关键词" v-model="replyTitle"></el-input>
<el-input placeholder="内容" type="textarea" v-model="replyContent"></el-input>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="addReplyContent">保 存</el-button> <el-button @click="addReplyContent">Save</el-button>
<el-button @click="replyContentDialog = false">取 消</el-button> <el-button @click="replyContentDialog = false">Cancel</el-button>
</span> </span>
</el-dialog> </el-dialog>
<el-dialog
title="编辑回复内容" <el-dialog title="Edit Quick Reply" :visible.sync="editReplyContentDialog" width="30%" top="0">
:visible.sync="editReplyContentDialog" <el-input style="margin-bottom: 10px;" placeholder="Keyword" v-model="replyTitle"></el-input>
width="30%" <el-input placeholder="Content" type="textarea" v-model="replyContent"></el-input>
top="0"
>
<el-input style="margin-bottom: 10px;" placeholder="关键词" v-model="replyTitle"></el-input>
<el-input placeholder="内容" type="textarea" v-model="replyContent"></el-input>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="editReplyContent('yes')">保 存</el-button> <el-button @click="editReplyContent('yes')">Save</el-button>
<el-button @click="editReplyContentDialog = false">取 消</el-button> <el-button @click="editReplyContentDialog = false">Cancel</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!--//回复内容-->
</template> </template>
</div> </div>
</body> </body>
@ -340,7 +328,7 @@
messageContent:"", messageContent:"",
currentGuest:"", currentGuest:"",
msgList:[], msgList:[],
chatTitle:"暂时未处理咨询", chatTitle:"No pending inquiries",
chatInputing:"", chatInputing:"",
kfConfig:{ kfConfig:{
id : "kf_1", id : "kf_1",

49
static/templates/main.html
Unescape View File

@ -1,8 +1,8 @@
<html lang="cn"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="renderer" content="webkit"> <meta name="renderer" content="webkit">
<title>开源智能客服系统</title> <title>Open Source Customer Support System</title>
<link rel="stylesheet" href="/static/cdn/element-ui/2.15.1/theme-chalk/index.min.css"> <link rel="stylesheet" href="/static/cdn/element-ui/2.15.1/theme-chalk/index.min.css">
<script src="/static/cdn/vue/2.6.11/vue.min.js"></script> <script src="/static/cdn/vue/2.6.11/vue.min.js"></script>
<script src="/static/cdn/element-ui/2.15.1/index.js"></script> <script src="/static/cdn/element-ui/2.15.1/index.js"></script>
@ -49,10 +49,41 @@
<body class="text-center"> <body class="text-center">
<div id="app"> <div id="app">
<template> <template>
{{template "nav" }} <div class="mainLeftMenu">
<div class="mainRight"> <div style="margin: 20px auto;">
<el-badge :type="onlineType" is-dot class="item">
<el-avatar class="mainLogo" title="Customer Support" :size="45" src="/static/images/1.jpg"></el-avatar>
</el-badge>
</div>
<div class="menuLeftItem" v-on:click="openIframeUrl('/pannel')">
<i class="el-icon-platform-eleme"></i>
<span slot="title">Dashboard</span>
</div>
<div class="menuLeftItem active" v-on:click="haveNewMessage='';openIframeUrl('/chat_main')">
<el-badge :value="haveNewMessage" class="item">
<i class="el-icon-chat-dot-round"></i>
</el-badge>
<span slot="title">Chat</span>
</div>
<div style="display: none" class="menuLeftItem" v-on:click="openIframeUrl('/setting_deploy')">
<i class="el-icon-notebook-2"></i>
<span slot="title">Integration</span>
</div>
<iframe class="mainIframe" v-bind:src="iframeUrl" frameborder="0"></iframe> <div class="menuLeftItem" v-on:click="openIframeUrl('/setting')">
<i class="el-icon-setting"></i>
<span slot="title">Settings</span>
</div>
<div class="menuLeftItem menuLeftItemLogout" v-on:click="logout()">
<i class="el-icon-switch-button"></i>
<span slot="title">Logout</span>
</div>
</div>
<div class="mainRight">
<iframe class="mainIframe" v-bind:src="iframeUrl" frameborder="0"></iframe>
</div> </div>
</template> </template>
</div> </div>
@ -82,7 +113,6 @@
body: redata.body, body: redata.body,
icon: redata.icon icon: redata.icon
}, function(notification) { }, function(notification) {
//可直接打开通知notification相关联的tab窗口
window.focus(); window.focus();
notification.close(); notification.close();
_this.openIframeUrl("/chat_main"); _this.openIframeUrl("/chat_main");
@ -92,12 +122,10 @@
openIframeUrl(url){ openIframeUrl(url){
this.iframeUrl=url; this.iframeUrl=url;
}, },
//退出
logout(){ logout(){
localStorage.removeItem("token"); localStorage.removeItem("token");
this.openIframeUrl('/login'); this.openIframeUrl('/login');
}, },
//跳转
openUrl(url){ openUrl(url){
window.location.href=url; window.location.href=url;
}, },
@ -123,7 +151,7 @@
_this.iframeUrl = "/chat_main"; _this.iframeUrl = "/chat_main";
} }
} }
}); });
} }
}, },
created: function () { created: function () {
@ -141,5 +169,4 @@
//alert(1); //alert(1);
}); });
</script> </script>
</html>
</html>

41
static/templates/nav.html
Unescape View File

@ -1,41 +0,0 @@
{{define "nav"}}
<div class="mainLeftMenu">
<div style="margin: 20px auto;">
<el-badge :type="onlineType" is-dot class="item">
<el-avatar class="mainLogo" title="智能客服" :size="45" src="/static/images/1.jpg"></el-avatar>
</el-badge>
</div>
<div class="menuLeftItem" v-on:click="openIframeUrl('/pannel')">
<i class="el-icon-platform-eleme"></i>
<span slot="title">面板</span>
</div>
<div class="menuLeftItem active" v-on:click="haveNewMessage='';openIframeUrl('/chat_main')">
<el-badge :value="haveNewMessage" class="item">
<i class="el-icon-chat-dot-round"></i>
</el-badge>
<span slot="title">对话</span>
</div>
<div style="display: none" class="menuLeftItem" v-on:click="openIframeUrl('/setting_deploy')">
<i class="el-icon-notebook-2"></i>
<span slot="title">对接</span>
</div>
<div class="menuLeftItem" v-on:click="openIframeUrl('/setting')">
<i class="el-icon-setting"></i>
<span slot="title">设置</span>
</div>
<div class="menuLeftItem menuLeftItemLogout" v-on:click="logout()">
<i class="el-icon-switch-button"></i>
<span slot="title">退出</span>
</div>
</div>
{{end}}
Write Preview
Loading…
Cancel
Save