up

chat/src/components/index.vue

@@ -51,6 +51,30 @@
 
 					<!-- 和机器人会话 -->
 					<div v-for="(item,i) in robot" :key="'r'+i">
+						<!-- 和机器人会话互动 -->
+						<div v-if="item.type == 'error'" class="row allAlignment"
+							 style="margin-top:.3rem;">
+							<div class="HeadPortrait row center">
+								<img v-if="item.type == 'error'" :src="require('@/assets/headAdvent.png')">
+							</div>
+							<div class="messageWindow dialogueA col-w">
+								<!-- <div v-if="item.type == '1001'" class="customerService left"
+									 v-html="item.content.text"></div> -->
+								<!-- <div v-if="item.type == 'user'" class="user right imgSrc">
+									<yd-lightbox v-if="item.content.img" style="display:inline-block"
+												 class="row rightAlignment box-img">
+										<yd-lightbox-img :src=" img_http + item.content.img"></yd-lightbox-img>
+									</yd-lightbox> -->
+									<div v-if="item.type == 'error'" class="customerService left">{{item.content.text}}<div style="color:#5EA0F7;padding-left:.1rem;cursor:pointer;" @click="connectionService">转人工客服</div></div>
+								<!-- </div> -->
+							</div>
+							<div class="HeadPortrait row center">
+								<img v-if="item.type == 'user'"
+									 :src="require('@/assets/timg.jpg') ">
+							</div>
+						</div>
+
+
 						<!-- 和机器人会话互动 -->
 						<div v-if="item.type == 'service' || item.type == 'user'" class="row allAlignment"
 							 style="margin-top:.3rem;">
@@ -89,125 +113,138 @@
 					</div>
 				</div>
 
-				<!--历史消息-->
-				<div v-if="showHistory"  v-for="item in hisSviceChat" >
-					<!-- 客服信息 -->
-					<div v-if="item.to_id.startsWith('KF')">
-						<div class="row allAlignment" style="margin-top:.3rem;">
-							<div class="HeadPortrait row center">
-								<img v-if="service_info.avatar == '' " :src="avatar_imgs">
-								<img v-if="service_info.avatar != ''" :src="img_http + service_info.avatar ? img_http + service_info.avatar : require('@/assets/user2.png')">
+				<!-- ********************************************************** -->
+				<!-- 人工会话模版 -->
+				<div v-if="link_success">
+					<!--历史消息-->
+					<div v-if="showHistory"  v-for="item in hisSviceChat" >
+						<!-- 客服信息 -->
+						<div v-if="item.from_id.startsWith('KF')">
+							<div style="width: 100%;text-align: center;">
+								<span v-if="item.time_line">{{item.time_line}}</span>
 							</div>
-							<div class="messageWindow dialogueA col-w">
-								<div class="customerService left imgSrc">
-									<yd-lightbox v-if="item.content.img" style="display:inline-block"
-												 class="row rightAlignment">
-										<yd-lightbox-img :src=" img_http + item.content.img"></yd-lightbox-img>
-									</yd-lightbox>
-									<div v-html="item.content.text" v-else></div>
+							<div class="row allAlignment" style="margin-top:.3rem;margin-top: 0.3rem;">
+								<div class="HeadPortrait row center">
+									<img v-if="service_info.avatar == '' " :src="avatar_imgs">
+									<img v-if="service_info.avatar != ''" :src="img_http + service_info.avatar ? img_http + service_info.avatar : require('@/assets/user2.png')">
 								</div>
-							</div>
-							<div class="HeadPortrait row center">
+								<div class="messageWindow dialogueA col-w">
+									<div class="customerService left imgSrc">
+										<yd-lightbox v-if="item.content.img" style="display:inline-block"
+												class="row rightAlignment">
+											<yd-lightbox-img :src=" img_http + item.content.img"></yd-lightbox-img>
+										</yd-lightbox>
+										<div v-html="item.content.text" v-else></div>
+									</div>
+								</div>
+								<div class="HeadPortrait row center">
 
+								</div>
 							</div>
 						</div>
-					</div>
-					<!-- 用户信息 -->
-					<div v-else>
-
-						<div class="row allAlignment" style="margin-top:.3rem;">
-							<div class="HeadPortrait row center">
-
+						<!-- 用户信息 -->
+						<div v-else>
+							<div style="width: 100%;text-align: center;margin-top: 0.3rem;">
+								<span v-if="item.time_line">{{item.time_line}}</span>
 							</div>
-							<div class="messageWindow dialogueA col-w" style="text-align: right;">
-								<div class="user right imgSrc">
-									<yd-lightbox v-if="item.content.img" style="display:inline-block"
-												 class="row rightAlignment">
-										<yd-lightbox-img :src="img_http+item.content.img"></yd-lightbox-img>
-									</yd-lightbox>
-									<span v-html="item.content.text" v-else>{{item.content.text}}</span>
+							<div class="row allAlignment" style="margin-top:.3rem;">
+								<div class="HeadPortrait row center">
+
+								</div>
+								<div class="messageWindow dialogueA col-w" style="text-align: right;">
+									<div class="user right imgSrc">
+						
+										<yd-lightbox v-if="item.content.img" style="display:inline-block" class="row rightAlignment">
+											<yd-lightbox-img :src="img_http+item.content.img"></yd-lightbox-img>
+										</yd-lightbox>
+										<span v-html="item.content.text" v-else></span>
+									</div>
+								</div>
+								<div class="HeadPortrait row center">
+									<img :src="require('@/assets/timg.jpg') ">
 								</div>
-							</div>
-							<div class="HeadPortrait row center">
-								<img :src="require('@/assets/timg.jpg') ">
 							</div>
 						</div>
 					</div>
-				</div>
-
+			
+					<div  v-for="(item,index) in chat" :key="index">
 
-				<!-- ********************************************************** -->
-				<!-- 人工会话模版 -->
-				<div v-if="link_success" v-for="(item,index) in chat" :key="index">
-
-					<!-- 历史消息 -->
-					<div class="promptBox" v-if="item.type == 'historyMsg'">
-						<div class="prompt help">
-							<span>{{historyMsgtext}}</span>
+						<!-- 历史消息 -->
+						<div class="promptBox" v-if="item.type == 'historyMsg'">
+							<div class="prompt help">
+								<span>{{historyMsgtext}}</span>
+							</div>
 						</div>
-					</div>
-					<!-- 客服会话 -->
-					<div v-if="item.type == 'service'">
-						<div class="row allAlignment" style="margin-top:.3rem;">
-							<div class="HeadPortrait row center">
-								<img id="123" v-if="service_info.avatar == '' " :src="avatar_imgs">
-								<img id="321" v-if="service_info.avatar != '' " :src="img_http + service_info.avatar ? img_http + service_info.avatar : img_http + service_info.avatar">
+						<!-- 客服会话 -->
+						<div v-if="item.type == 'service'">
+							<div style="width: 100%;text-align: center;margin-top: 0.3rem;">
+								<span v-if="item.time ">{{item.time}}</span>
 							</div>
-							<div class="messageWindow dialogueA col-w">
-								<div class="customerService left imgSrc">
-									<yd-lightbox v-if="item.content.img" style="display:inline-block"
-												 class="row rightAlignment">
-										<yd-lightbox-img :src="img_http + item.content.img"></yd-lightbox-img>
-									</yd-lightbox>
-									<div v-html="item.content.text" v-else></div>
+							<div class="row allAlignment" style="margin-top:.3rem;">
+								<div class="HeadPortrait row center">
+									<img id="123" v-if="service_info.avatar == '' " :src="avatar_imgs">
+									<img id="321" v-if="service_info.avatar != '' " :src="img_http + service_info.avatar ? img_http + service_info.avatar : img_http + service_info.avatar">
 								</div>
-							</div>
-							<div class="HeadPortrait row center">
+								<div class="messageWindow dialogueA col-w">
+									<div class="customerService left imgSrc">
+										
+										<yd-lightbox v-if="item.content.img" style="display:inline-block"
+													class="row rightAlignment">
+											<yd-lightbox-img :src="img_http + item.content.img"></yd-lightbox-img>
+										</yd-lightbox>
+										<div v-html="item.content.text" v-else></div>
+									</div>
+								</div>
+								<div class="HeadPortrait row center">
 
+								</div>
 							</div>
 						</div>
-					</div>
-
-					<!-- 用户会话 -->
-					<div v-if="item.type == 'user'">
-
-						<div class="row allAlignment" style="margin-top:.3rem;">
-							<div class="HeadPortrait row center">
 
+						<!-- 用户会话 -->
+						<div v-if="item.type == 'user'">
+							<div style="width: 100%;text-align: center;margin-top: 0.3rem;">
+								<span v-if="item.time">{{item.time}}</span>
 							</div>
-							<div class="messageWindow dialogueA col-w" style="text-align: right;">
-								<div class="user right imgSrc">
-									<yd-lightbox v-if="item.content.img" style="display:inline-block"
-												 class="row rightAlignment">
-										<yd-lightbox-img :src="img_http+item.content.img"></yd-lightbox-img>
-									</yd-lightbox>
-									<span v-html="item.content.text" v-else>{{item.content.text}}</span>
+							<div class="row allAlignment" style="margin-top:.3rem;">
+								<div class="HeadPortrait row center">
+
+								</div>
+								<div class="messageWindow dialogueA col-w" style="text-align: right;">
+									
+									<div class="user right imgSrc">
+										<yd-lightbox v-if="item.content.img" style="display:inline-block"
+													class="row rightAlignment">
+											<yd-lightbox-img :src="img_http+item.content.img"></yd-lightbox-img>
+										</yd-lightbox>
+										<span v-html="item.content.text" v-else>{{item.content.text}}</span>
+									</div>
+								</div>
+								<div class="HeadPortrait row center">
+									<img v-if="item.type == 'user'"
+										:src="require('@/assets/timg.jpg') ">
 								</div>
-							</div>
-							<div class="HeadPortrait row center">
-								<img v-if="item.type == 'user'"
-									 :src="require('@/assets/timg.jpg') ">
 							</div>
 						</div>
-					</div>
 
-					<!-- 常规系统消息评价 -->
-					<div class="row center " v-if="item.type== 'system' ">
-						<div class="column item-center "
-							 style="margin: 0.3rem 0; background: #fff; width:100% ;padding: 0.1rem 0;"
-							 v-if="item.content.state  =='getEvaluate' && !haveEvaluation ">
-							<p class="row center wrap">{{item.content.text}}</p>
-							<button class="evaluateBtn" style="margin-top:.2rem;" @click="is_show_evaluate()">评价
-							</button>
-						</div>
+						<!-- 常规系统消息评价 -->
+						<div class="row center " v-if="item.type== 'system' ">
+							<div class="column item-center "
+								style="margin: 0.3rem 0; background: #fff; width:100% ;padding: 0.1rem 0;"
+								v-if="item.content.state  =='getEvaluate' && !haveEvaluation ">
+								<p class="row center wrap">{{item.content.text}}</p>
+								<button class="evaluateBtn" style="margin-top:.2rem;" @click="is_show_evaluate()">评价
+								</button>
+							</div>
 
-						<div class="column item-center"
-							 style="margin: 0.3rem 0; background: #fff; width:100% ;padding: 0.1rem 0.5rem;"
-							 v-if="item.content.state  == 'closeInform' ">
-							<p class="row center wrap">{{item.content.text}}</p>
-						</div>
+							<div class="column item-center"
+								style="margin: 0.3rem 0; background: #fff; width:100% ;padding: 0.1rem 0.5rem;"
+								v-if="item.content.state  == 'closeInform' ">
+								<p class="row center wrap">{{item.content.text}}</p>
+							</div>
 
 
+						</div>
 					</div>
 				</div>
 
@@ -339,10 +376,10 @@
 			</yd-popup>
 			<!-- 底部输入框 -->
 			<div class="footer row wrap" id='input_box'>
+					<!-- @keydown="inputNumFun()" -->
 				<textarea
-						id="textarea"
+					id="textarea"
 					v-model.trim="text_info"
-					@keydown="inputNumFun()"
 					placeholder="请输入你的问题："
 					maxlength="100"
 				>
@@ -490,7 +527,7 @@
 					avatar: '/static/customer/images/robot.png',
 					job_name: '001',
 					name: '智能客服',
-					signature: "万人在线，万人赛事，告别拼爹，只拼实力！注册就送5000游戏币！"
+					signature: ""
 				},
 				link_success: false,//人工链接成功
 				conversationId: '',//会话工单
@@ -508,6 +545,14 @@
 				hisSviceChat: [],
 				showHistory:true,
 				avatar_imgs:avatarImgs,
+				webTime:'',//人工会话上一次发送消息时间
+				chatIndex:'',//人工会话上一次下标
+				/*****************websockt心跳变量*******************/
+				reconnectData: null,
+				lockReconnect: false,    //避免重复连接，因为onerror之后会立即触发 onclose
+				timeout: 5000,          //5s一次心跳检测
+				timeoutObj: null,
+				serverTimeoutObj: null,
 			};
 		},
 		// 方法
@@ -524,10 +569,12 @@
 						type: 6,
 					}
 				}));
-				this.socket_close(this.user_info.id);
-				this.setInit();
-				this.initWebsocket()
-				this.isExit = false;
+
+
+				// this.websock.close()
+				// this.setInit();
+				// this.initWebsocket()
+				
 
 			},
 			/*******************************************/
@@ -540,12 +587,11 @@
 
 			/*******************************************/
 			//初始化Websocket链接
-			initWebsocket() {
-
-				let sock_ip = 'ws://103.108.43.176:9101'; // 线上
+			initWebsocket(apiToken) {
+				let sock_ip = ''; // 线上
 				// let sock_ip = 'ws://192.168.2.187:9101';  // 本地
 
-				this.websock = new WebSocket(sock_ip + "?apiToken=" + this.apiToken);
+				this.websock = new WebSocket("ws://103.108.43.176:9101?apiToken=" + apiToken);
 				//数据返回
 				this.websock.onmessage = this.socket_message;
 				//数据发送
@@ -559,15 +605,16 @@
 			/*******************************************/
 			//连接建立之后执行send方法发送数据
 			socket_open() {
-				// let actions = {"test":"12345"};
 				console.log('我链接了');
-				//this.socket_send(JSON.stringify(actions));
 			},
 
 			/*******************************************/
 			//连接建立失败重连
 			socket_error() {
-				this.initWebSocket();
+				console.log('连接建立失败重连');
+				// this.initWebSocket();
+				// this.setInit();
+				// this.reconnect();
 			},
 
 			/*******************************************/
@@ -576,6 +623,8 @@
 				if (!e.data) return;
 				const redata = JSON.parse(e.data);
 				console.log(redata);
+				//心跳检测
+				this.heatBeat();
 				//欢迎语
 				if (redata.message_type == 'helloMessage') {
 					this.isTurnArtifcial = true;
@@ -594,16 +643,18 @@
 					// console.log(redata);
 					if (redata.data.content == "error") {
 						this.robot.push({
-							type: this.error_num,
+							type:'error',
+							content: {text: "您的问题暂无法处理"}
 						})
-						this.error_num++;
+						// this.error_num++;
 					} else {
 						this.robot.push({
 							type: 'service',
 							content: {text: redata.data.content}
 						})
 					}
-					this.automaticRolling();
+					console.log(this.robot);
+					// this.automaticRolling();
 					//data
 					//this.robot =
 				}
@@ -644,28 +695,51 @@
 				//人工会话回复
 				if (redata.message_type == "chatMessage") {
 					// 转接的时候清除历史信息
-					this.hisSviceChat = [];
+					// this.hisSviceChat = [];
 					// this.getHistory = false;
 					this.$dialog.loading.close();
 					let obj = {};
+					let isSession = false;
 					if (this.$public.isJSON(redata.data.content)) {
 						obj = JSON.parse(redata.data.content);
-						obj.text = this.turnFace(obj.text)
+						obj.text = this.turnFace(obj.text);
+						isSession = true;
 					} else {
 						obj.text = redata.data.content;
 					}
+
+					let thisTime ='';
+					let newTime = redata.data.time.split(':');
+					if(this.webTime){
+						let lastTime  = this.webTime.split(":");
+							if(newTime[0] == lastTime[0] &&  newTime[1] < (lastTime[1]+2)){
+								thisTime = ''
+							}else{
+								thisTime = redata.data.time;
+							}
+					}else{
+						if(isSession){
+							thisTime = redata.data.time;
+						}
+					}
+					if(isSession){
+						this.webTime = redata.data.time;
+					}
 					this.chat.push({
 						type: 'service',
+						time: thisTime  ? thisTime: '',
 						content: obj
 					})
 					// this.setNum++;
 				}
-
 				//系统消息通知客户结束通话
 				if (redata.message_type == 'closeBysever') {
-					this.showHistory = false
 					this.setInit();
+					this.showHistory = false;
+					this.link_success = false;
+					this.isTurnArtifcial =true;
 				}
+
 				if(redata.message_type == "changeKeFuSuccess"){
 					this.$dialog.alert({
 						mes: redata.data.content
@@ -680,11 +754,11 @@
 					this.$dialog.alert({
 						mes: redata.content, callback: () => {
 							this.initData = 100;
-							_this.$dialog.loading.open('数据加载中...');
-							setTimeout(() => {
-								_this.$dialog.loading.close();
-								_this.registered();
-							}, 2000);
+							// _this.$dialog.loading.open('数据加载中...');
+							// setTimeout(() => {
+							// 	_this.$dialog.loading.close();
+							// 	// _this.registered();
+							// }, 2000);
 						}
 					});
 				}
@@ -715,7 +789,7 @@
 
 				// 历史信息
 				if (redata.message_type == 'toOld') {
-					console.log(redata, '历史信息')
+					// console.log(redata, '历史信息')
 					this.hisSviceChat = [];
 					let obj = redata;
 					this.historyMsgtext = obj.data.content;
@@ -725,14 +799,50 @@
 							text: this.historyMsgtext,
 						}
 					})
+					let historyTime = '';
 					obj.data.chatLog.forEach(res => {
-						res.content = JSON.parse(res.content)
-						this.hisSviceChat.push(res)
+						// console.log(res,'历史信息');
+						res.content = JSON.parse(res.content);
+						let time_line = this.$public.customFormatDateTime(res.time_line,'',3);
+						// res.time_line  = 
+						if(!historyTime){
+							res.time_line  = time_line
+						}else{
+							let newTime = time_line.split(':');
+							let lastTime = historyTime.split(':');
+							if(newTime[0]==lastTime[0] && newTime[1] < (lastTime[1]+2)){
+								res.time_line = '';
+							}else{
+								res.time_line  = time_line
+							}
+						}
+						historyTime = time_line; 
+						this.hisSviceChat.push(res);
 					})
 
 
 				}
 
+				//获取发送时间
+				if(redata.message_type  == "webTime"){
+					if(this.webTime){
+						let newTime = redata.data.webTime.split(':');
+						let time = this.webTime.split(':');
+					
+						if(newTime[0]*1 > time[0]*1 ){
+							// console.log('newTime[0]')
+							this.$set(this.chat[this.chatIndex],'time',redata.data.webTime);
+						}else if(newTime[0]*1  ==  time[0]*1 && (newTime[1]*1 - time[1]*1) > 2 ){
+							this.$set(this.chat[this.chatIndex],'time',redata.data.webTime);
+							// console.log('newTime[1]')
+						}
+					}else{
+						this.chat[this.chatIndex].time =  redata.data.webTime;
+						// this.$set(this.chat[this.chatIndex],'time',redata.data.webTime);	
+					}
+					this.webTime = redata.data.webTime
+				}
+
 				//屏幕滚动
 				this.automaticRolling();
 			},
@@ -744,16 +854,51 @@
 			},
 
 
+
 			/*******************************************/
 			//关闭
 			socket_close(e) {
-				// console.log('断开连接', e);
+				console.log('断开连接', e);
 				this.initData = 100;
 				this.link_success = false;
-				this.registered();
+				this.setInit();
+				this.reconnect();
+				// this.registered();
 				// this.websock.close()
 			},
 
+
+			/***************************************/
+			//socket重连
+			reconnect() {
+				if (this.lockReconnect) {       //这里很关键，因为连接失败之后之后会相继触发 连接关闭，不然会连接上两个 WebSocket
+					return
+				}
+				this.lockReconnect = true;
+				this.reconnectData && clearTimeout(this.reconnectData);
+				this.reconnectData = setTimeout(() => {
+					this.initWebSocket(this.apiToken);
+					//this.registered()
+					console.log('-----lail-----');
+					this.lockReconnect = false;
+				}, 2000)
+			},
+
+			/*************************************/
+			//心跳检测
+			heatBeat() {
+				this.timeoutObj && clearTimeout(this.timeoutObj);
+				this.serverTimeoutObj && clearTimeout(this.serverTimeoutObj);
+				this.timeoutObj = setTimeout(() => {
+					// console.log('发送', {type: 'ping'});
+					this.socket_send(JSON.stringify({type: 'ping'}))   //根据后台要求发送
+					this.serverTimeoutObj = setTimeout(() => {
+						// console.log('------close-------') 
+						this.websock.close(); //如果 4秒之后我们没有收到 后台返回的心跳检测数据 断开socket，断开后会启动重连机制
+					}, 4000);
+				}, this.timeout)
+			},
+
 			/*****************************************/
 			//用户匿名注册
 			registered() {
@@ -788,7 +933,7 @@
 						});
 					}else if (res.data.code == 1) {
 						this.user_info = res.data.data;
-						console.log(this.user_info)
+						// console.log(this.user_info)
 						// 游客 token
 						localStorage.setItem("token", res.data.data.token);
 						localStorage.setItem("tutype", res.data.tutype);
@@ -796,7 +941,7 @@
 
 						setTimeout(() => {
 							this.$dialog.loading.close();
-							this.initWebsocket();
+							this.initWebsocket(this.apiToken);
 						}, 2000)
 						//console.log(res.data.data)
 					}
@@ -834,7 +979,6 @@
 				this.group = id;
 				this.$dialog.loading.open('转接中...')
 				if (this.isTurnArtifcial) {
-
 					let data = {
 						'type': 'userInit',
 						data: {
@@ -855,7 +999,6 @@
 				if (this.text_info == '') return;
 				let str = this.text_info;
 				let formatStr = str.replace(/\n|\r\n/g, "<br>");
-
 				let type = 'toRobot';
 				let data = {};
 				let obj = {
@@ -880,8 +1023,10 @@
 						conversationId: this.conversationId,
 					}
 					type = 'chatMessage';
+					this.chatIndex = this.chat.length;
 					this.chat.push({
 						type: 'user',
+						time:'',
 						content: {text: this.turnFace(obj.text)}
 					})
 				} else {//和机器人聊天
@@ -891,7 +1036,7 @@
 						robotgroups_id: '1',
 					}
 
-					console.log(this.turnFace(formatStr));
+					// console.log(this.turnFace(formatStr));
 					type = 'toRobot';
 					//本地存放数据
 					this.robot.push({
@@ -908,13 +1053,13 @@
 			/*******************************************/
 			//获取转接人工客服列表
 			connectionService() {
-				if (!this.isConnection) return
+				// if (!this.isConnection) return
 				let obj = {
 					headers: {
 						"apiToken": this.setApiToken('index', 'groups', this.currentTime[0], 'index')
 					}
 				}
-				this.isConnection = false;
+				// this.isConnection = false;
 				//api
 				this.get('api/index/groups/index', obj).then(res => {
 					if (res.data.code == 1) {
@@ -937,7 +1082,7 @@
 					// let input_box = document.getElementById('input_box') // 获取对象
 
 					//判断是否是苹果手机自代浏览器
-					if (/Safari/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent)) {
+					if (/Safari/.test(navigator.userAgent) && /Chrome/.test(navigator.userAgent)) {
 						this.box_height = true; //input_box+'px';
 					}
 
@@ -954,13 +1099,20 @@
 				let files = e.target.files || e.dataTransfer.files;
 				if (!files.length) return;
 				let picavalue = files[0];
-				//console.log(picavalue);
-				if (picavalue.size / 1000 > 20000) {
-					this.$message({
-						message: "图片过大不支持上传",
-						type: "warning"
+				const isJPG = file.type == 'image/jpeg' || 'image/jpg' || 'image/png' || 'image/svg';
+				const isLt2M = picavalue.size / 1000 / 1000 > 2;
+
+				if (isLt2M) {
+					this.$dialog.notify({
+						mes: '图片过大不支持上传哦！',
+						timeout: 2000,
 					});
-				} else {
+				}else if(!isJPG){
+					this.$dialog.notify({
+						mes: '只能上传图片哦！',
+						timeout: 2000,
+					});
+				}else {
 					this.$public.imgPreview(picavalue, function (imgSrc, formData) {
 						// let img = imgSrc;
 
@@ -1007,7 +1159,7 @@
 									});
 								}
 								self.socket_send(JSON.stringify({type, data}))
-								this.automaticRolling();
+								self.automaticRolling();
 							}
 						})
 					});
@@ -1106,24 +1258,32 @@
 			/*******************************************/
 			//提交评价信息
 			evaluateEsc() {
-				this.get('/api/index/evaluate/putEvaluate', {
-					params: {
-						'evaluateId': this.evaluateState,
-						'conversationId': this.conversationId,
-					}, headers: {
-						'Content-Type': 'application/x-www-form-urlencoded',
-						'apiToken': this.setApiToken('putevaluate', 'evaluate', this.currentTime[0], 'index')
-					}
-				}).then(res => {
-					if (res.data.code == 1) {
-						console.log(res.data.data,'评价')
-						this.bottomShow = false;
-						//this.hintSwitch.evaluateOnOff = true;
-						this.haveEvaluation = true; // 标识已评价
-
-					}
-				})
-
+				console.log();
+				if(this.evaluateState != 100){
+					this.bottomShow = false;
+					this.haveEvaluation = true; // 标识已评价
+					this.socket_send(JSON.stringify({type:'evaluate', data:{
+						evaluate_id:this.evaluateState,
+						conversationId:this.conversationId ,
+						// evaluate_content:'' 
+					}}))
+
+					this.$dialog.notify({
+						mes: '感谢你的评价！',
+						timeout: 2000,
+						callback: () => {
+							//console.log('我走咯！');
+						}
+					});
+				}else{
+					this.$dialog.notify({
+						mes: '亲，请选择评价类型...',
+						timeout: 2000,
+						callback: () => {
+							//console.log('我走咯！');
+						}
+					});
+				}
 			},
 
 			/************************************************/
@@ -1132,14 +1292,16 @@
 				this.haveEvaluation = false;
 				this.chat = [];
 				this.evaluateState = 100;
+				this.hisSviceChat = [];
 				this.meme = false
-				this.frceArr = [];//表情包代码
+				// this.frceArr = [];//表情包代码
 				this.isConnection = true;
+				this.isExit = false;
 				this.service_info = {
 					avatar: '/static/customer/images/robot.png',
 					job_name: '001',
 					name: '智能客服',
-					signature: "万人在线，万人赛事，告别拼爹，只拼实力！注册就送5000游戏币！"
+					signature: " "
 				}
 			},
 
@@ -1158,25 +1320,19 @@
 			},
 			// 留言知识库返回到主页
 			returnIndex(data) {
+				console.log(data)
 				this.knowledge = data
 			}
 
 		},
 
-		/**
-		 * 组件挂载阶段
-		 */
-		created() {
-			this.frceArr = frce.frce;
-			// this.initialLoginCode();
-		},
-
 		/**
 		 * 视图挂载前
 		 */
 		mounted() {
 			this.source.appuid = this.$public.getQueryString('appuid');//用户标识
 			this.source.appid = this.$public.getQueryString('appid');//用户来源
+			this.frceArr = frce.frce;
 			//console.log(this.source);
 			//页面初始化获取系统时间第一步
 			//console.log(this.$md5('userwordscustomer-servicewords1562169600service'));
@@ -1199,6 +1355,15 @@
 				}
 			})
 		},
+
+		destroyed() {
+			this.setInit();
+			this.websock.close() //离开路由之后断开websocket连接
+			this.lockReconnect = true;
+			clearTimeout(this.reconnectData);      //离开清除 timeout
+			clearTimeout(this.timeoutObj);         //离开清除 timeout
+			clearTimeout(this.serverTimeoutObj);   //离开清除 timeout
+		},
 		// 计算
 		computed: {
 			inputmsg() {

chat/src/components/knowledgeLibrary.vue

@@ -357,6 +357,7 @@
 							apiToken: this.setApiToken("LeavingMessage", "User", this.currentTime[0], "index")
 						}
 					}
+					
 					let formData = new FormData();
 					formData.append("file",this.setImgList);
 					formData.append("name",this.leave.call);

chat/src/publicMethods.js

@@ -67,15 +67,35 @@ export default {
         console.log([ia]);
         return new Blob([ia], { type: mimeString },);
     },
-    getDate(){
-        let myDate = new Date();
-        myDate.getFullYear(); //获取完整的年份(4位,1970-????)
-        myDate.getMonth(); //获取当前月份(0-11,0代表1月)
-        myDate.getDate(); //获取当前日(1-31)
-        myDate.getDay(); //获取当前星期X(0-6,0代表星期天)
-        myDate.getHours(); //获取当前小时数(0-23)
-        myDate.getMinutes(); //获取当前分钟数(0-59)
-        myDate.getSeconds(); //获取当前秒数(0-59)
+    /**
+     * 时间戳转日期自定义时间格式
+     * timeStamp:时间戳
+     * custom:转换日期时定义年月日用是什么符号隔开
+     * isDtae:0=月份、1=日期、3=时间、
+     */
+    customFormatDateTime(timeStamp,custom,isDtae) {
+        var date = new Date();
+        date.setTime(timeStamp * 1000);
+        var y = date.getFullYear();
+        var m = date.getMonth() + 1;
+        m = m < 10 ? ('0' + m) : m;
+        var d = date.getDate();
+        d = d < 10 ? ('0' + d) : d;
+        var h = date.getHours();
+        h = h < 10 ? ('0' + h) : h;
+        var minute = date.getMinutes();
+        var second = date.getSeconds();
+        minute = minute < 10 ? ('0' + minute) : minute;
+        second = second < 10 ? ('0' + second) : second;
+        if (isDtae == 0){
+            return y + custom + m //+'student';
+        }else if (isDtae ==1){
+            return y + custom + m + custom + d;
+        }else if(isDtae == 3){
+            return  h + ':' + minute //+ ':' + second;
+        }else{
+            return y + '-' + m + '-' + d + ' ' + h + ':' + minute //+ ':' + second;
+        }
     },
 
     //检查字符串是否JSON格式