Browse Source

update pc_chat

luke 6 years ago
parent
commit
f2c3b52853

BIN
pc_chat/src/assets/st-img/off_icon.png


BIN
pc_chat/src/assets/st-img/on_icon.png


+ 34 - 19
pc_chat/src/components/chat.vue

@@ -4,10 +4,14 @@
 			<!-- ************************* 头部消息 ************************* -->
 			<el-header height='80px'>
 				<el-row type="flex" justify='space-between' align='middle' style="height:100%;">
-					<el-col class="tit nopd" v-if="machineAndAtl == 10"><img id="logo" :src="url + logo" alt=""><span>智能客服</span>
+					<el-col class="tit nopd" v-if="machineAndAtl == 10">
+						<img id="logo" :src="url + logo" alt="">
+						<span>智能客服</span>
 					</el-col>
-					<el-col class="tit nopd" v-else-if="machineAndAtl == 100"><img id="logo" :src="url + logo"
-																				   alt=""><span v-if="service">{{service.serverInfo.name}}</span>
+					<el-col class="tit nopd" v-else-if="machineAndAtl == 100">
+						<img id="logo" :src="url + logo"  alt="">
+						<span v-if="service">{{service.serverInfo.name}}</span>
+						<span style="margin-left: 5px;"><img src="./../assets/st-img/on_icon.png" alt=""></span>
 					</el-col>
 					<el-col>
 						<div class="imgBox">
@@ -43,14 +47,14 @@
 						<div v-if="machineAndAtl == 10">
 
 							<!--··············· 欢迎语 ············-->
-							<div class="conversationBox" v-if="machine != ''">
-								<div class=" row">
+							<div class="conversationBox">
+								<div class="row" v-for="(item,index) in machine" :key="index">
 									<div class="conversation row">
 										<div class="headImg">
 											<img src="./../assets/st-img/headAdvent.png" alt="">
 										</div>
 										<div class="cont left">
-											<div>{{machine.content}}</div>
+											<div v-html="item"></div>
 										</div>
 									</div>
 									<div style="width:66px;"></div>
@@ -201,7 +205,7 @@
 							<div v-for="item in customerSviceChat" :key="item.id">
 								<!-- tem.cont != '' -->
 								<div class="conversationBox" v-if="item.type == 'service' ">
-									<div class="timer">{{item.time}}</div>
+									<div class="timer" v-html="item.time"></div>
 									<div class="row">
 										<div class="conversation row">
 											<div class="headImg">
@@ -473,7 +477,8 @@
 				websock: null, //会话初始值
 				currTime: "", //获取系统时间
 				apiToken: '',//系统Token
-				machine: '', //机器会话信息
+				machine: [], //机器会话信息
+
 				advert: '', // 广告语
 				problem: '', //机器智能问题
 				macNotPro: false, //机器人问题无法解决显示
@@ -486,8 +491,8 @@
 				userConversation: {}, //用户当前会话
 				machineAndAtl: 10, //默认为机器人,100为人工
 				satisfaction: 1, //评价满意度,1为满意,2为一般,3为不满意
-				url: 'http://kfadmin.bocai186.com', // 域名地址
-				// url: 'http://192.168.2.187:8090', // 域名地址
+				// url: 'http://kfadmin.bocai186.com', // 域名地址
+				url: 'http://192.168.2.187:8090', // 域名地址
 				user_info: '', // 用户信息
 				// 人工客服信息
 				service: '',
@@ -861,8 +866,8 @@
 			initWebSocket() {
 				let _this = this;
 				let apiToken = this.$md5.hex_md5('customer-service' + this.currTime + window.location.origin);
-				this.websock = new WebSocket('ws://103.108.43.176:9101?apiToken=' + apiToken);
-				// this.websock = new WebSocket('ws://192.168.2.187:9101?apiToken=' + apiToken);
+				// this.websock = new WebSocket('ws://103.108.43.176:9101?apiToken=' + apiToken);
+				this.websock = new WebSocket('ws://192.168.2.187:9101?apiToken=' + apiToken);
 				this.websock.debug = true;
 				// 数据接收
 				this.websock.onmessage = this.websocketonmessage;
@@ -907,7 +912,7 @@
 				}
 				// 欢迎语
 				if (redata.message_type == 'helloMessage') {
-					this.machine = redata.data;
+					this.machine.push(redata.data.content)
 				}
 				// 广告语
 				if (redata.message_type == 'advertisement') {
@@ -1218,7 +1223,7 @@
 
 			/**************匿名注册**************** */
 			registered() {
-				let token = sessionStorage.getItem('token');
+				let token = localStorage.getItem('token');
 
 				let data = {
 					token: token != null ? token : '',//
@@ -1233,7 +1238,7 @@
 				this.$axios.post('/api/index/register/autoReg', data, obj).then(res => {
 					if (res.data.code == 1) {
 						this.user_info = res.data.data;
-						sessionStorage.setItem("token", res.data.data.token);
+						localStorage.setItem("token", res.data.data.token);
 						setTimeout(() => {
 							//关闭加载条
 							this.allLoadingClose();
@@ -1649,6 +1654,16 @@
 	.nopd {
 		padding: 0;
 	}
+	.nopd i{
+		margin-left: 10px;
+		width: 8px;
+		height: 8px;
+		background: #cdcdcd;
+		background: #81d981;
+		display: inline-block;
+		border-radius: 50%;
+	}
+
 
 	.evaluate .btn {
 		display: block;
@@ -2047,13 +2062,13 @@
 
 	#logo {
 		margin-right: 10px;
-		width: 30px;
-		height: 30px;
-		line-height: 30px;
+		width: 40px;
+		height: 40px;
+		line-height: 40px;
 		display: inline-block;
 		border-radius: 50%;
 		vertical-align: sub;
 		position: relative;
-		top: 4px;
+		top: 10px;
 	}
 </style>