up

service/src/pages/TheCurrentSession.vue

@@ -103,9 +103,8 @@
 
 							<!-- 用户消息 -->
 							<div style="padding:0 10px;margin-top:20px;" v-if="item.type == 'user'">
-								<div
-										style="height:37px;font-size:.12px;color:#bbb;"
-										class="row item-center"
+								<div style="height:37px;font-size:.12px;color:#bbb;"
+									class="row item-center"
 								>{{item.time}}
 								</div>
 								<div class="row">
@@ -214,7 +213,6 @@
 							</div> -->
 						</div>
 
-
 						<!-- </li> -->
 
 						<div @click="getLanguage(item.content)" class="row cursor_text item-center"
@@ -253,7 +251,7 @@
 						<div class="user_info_box">
 							<span>账号：</span>
 							<input class="user_text" style="background: #ECF4FF;"
-								   v-model="session_user_info.account_name" readonly type="text">
+								v-model="session_user_info.account_name" readonly type="text">
 						</div>
 						<div class="user_info_box">
 							<span>标签：</span>
@@ -293,16 +291,32 @@
 					<div class=" row rightAlignment">
 						<div class="userBtn row center" @click="bt_update()">保存</div>
 					</div>
-
-
 				</div>
 			</div>
+			<el-dialog
+			:close-on-click-modal="true"
+			:close-on-press-escape ="true"
+			title="是否发送图片"
+			:visible.sync="dialogPaste"
+			width="35%">
+			<!-- :before-close="handleClose" -->
+			
+			<!-- <span>这是一段信息</span> -->
+			<el-image 
+                :src="pasteUrl" :fit="fit"></el-image>
+
+			<span slot="footer" class="dialog-footer">
+				<el-button @click="dialogPaste = false">取 消</el-button>
+				<el-button type="primary" @click="handleClose()">确 定</el-button>
+			</span>
+			</el-dialog>
 		</div>
 	</div>
 </template>
 
 <script>
 	import "@/css/index.css";
+	// import "../../static/paste.js";
 	import {mapState, mapGetters} from 'vuex'; //先要引入
 	import leftNav from "@/components/leftNav";
 	import hader from "@/components/hader";
@@ -345,10 +359,12 @@
 				options: [],
 				label_id: '',
 				value: '请选择',
-
+				dialogPaste: false,
 				dialogVisible: false, //图片放大
 				dialogImageUrl: '', // 放大的图片
 				dialogUrl: false,
+				pasteUrl:'',//截屏图片
+				fit:'contain',//
 			}
 		},
 		/**
@@ -392,6 +408,8 @@
 				// 用户接入数据
 				if (redata.message_type == "connect") {
 					let _this = this;
+
+					this.webTime = redata.data.user_info.intime;
 					let arr = [
 						redata.data,
 						this.offlineList,
@@ -482,31 +500,6 @@
 					})
 				}
 
-				// //接收用户消息数据
-				// if(redata.message_type == "chatMessage"){
-				// 	let _this =this;
-				// 	this.$public.receivesMessage(redata.data,this.sessionList,this.$frce,
-				// 	function(data,chatList,dataIndex){
-
-				// 		//判断是否是当前对话信息
-				// 		if(dataIndex == _this.dataIndex){
-				// 		    _this.data =[];
-				// 		    _this.data = chatList.data;
-				// 		}else{
-				// 		    let num = Number.isInteger(chatList.num) ? chatList.num : 0;
-				// 		    _this.$set(chatList,'num',num+1)
-				// 		}
-				// 		//更新会话时间
-				// 		_this.$set(chatList,'intime',data.time);
-
-				// 		//更新会话列表中最新回复消息
-				// 		if(data.content.text){
-				// 			_this.$set(chatList,'text',data.content.text)
-				// 		}
-				// 	})
-				// 	console.log(_this.data);
-				// }
-
 
 				//获取标签数据信息
 				if (redata.message_type == "userlabeall") {
@@ -527,6 +520,7 @@
 
 				//接收会话时间
 				if (redata.message_type == "webTime") {
+					// console.log(this.data);
 					this.$set(this.data[this.session_marked], 'time', redata.data.webTime);
 				}
 
@@ -578,48 +572,56 @@
 					});
 				} else {
 					this.$public.imgPreview(picavalue, function (imgSrc, formData) {
-						// 数据结构请求
-						self.post('api/' + self.$ports.uploadImg, formData).then(res => {
-							//console.log(res.data.data.src)
-							if (res.data.code == 1) {
-								let isFirst = true;
-								//判断客服是否发送的第一句话
-								if (self.data.length > 0) {
-									for (let i = 0; i < self.data.length; i++) {
-										if (self.data[i].type == 'service') {
-											isFirst = false;
-											break;
-										}
-									}
-								}
-								let obj = {
-									text: '',
-									img: res.data.data.src,
-									type: false,
-								};
-								let chatList = self.sessionList[self.dataIndex];
-								chatList.data.push({type: 'service', content: obj, time: self.time[1]});
-								self.data = [];
-								self.data = chatList.data;
-								let type = 'chatMessage';
-								let data = {
-									from_name: self.user_info.user_name,//发送者
-									from_avatar: self.user_info.avatar,//发送者头像
-									from_id: "KF" + self.user_info.id,//发送者id
-									content: JSON.stringify(obj),
-									to_id: self.sessionList[self.dataIndex].id,
-									to_name: self.sessionList[self.dataIndex].name,
-									conversationId: self.sessionList[self.dataIndex].conversationId,
-									isFirst: isFirst,//是否是第一句话
-									sensitiveNumber: 0,//敏感词次数
+						self.upImg(formData)
+					});
+				}
+			},
+
+			/****/
+			upImg(formData){
+				let self = this;
+				// 数据结构请求
+				self.post('api/' + self.$ports.uploadImg, formData).then(res => {
+					//console.log(res.data.data.src)
+					if (res.data.code == 1) {
+						let isFirst = true;
+						//判断客服是否发送的第一句话
+						if (self.data.length > 0) {
+							for (let i = 0; i < self.data.length; i++) {
+								if (self.data[i].type == 'service') {
+									isFirst = false;
+									break;
 								}
-								self.websocketsend(JSON.stringify({type, data}))
+							}
+						}
+						let obj = {
+							text: '',
+							img: res.data.data.src,
+							type: false,
+						};
+						let chatList = self.sessionList[self.dataIndex];
+						chatList.data.push({type: 'service', content: obj, time:self.webTime});
+						// self.data = [];
+						// self.data = chatList.data;
+						// self.$store.dispatch("SET_CURRENT", []);
+						self.$store.dispatch("SET_CURRENT", chatList.data);
+						let type = 'chatMessage';
+						let data = {
+							from_name: self.user_info.user_name,//发送者
+							from_avatar: self.user_info.avatar,//发送者头像
+							from_id: "KF" + self.user_info.id,//发送者id
+							content: JSON.stringify(obj),
+							to_id: self.sessionList[self.dataIndex].id,
+							to_name: self.sessionList[self.dataIndex].name,
+							conversationId: self.sessionList[self.dataIndex].conversationId,
+							isFirst: isFirst,//是否是第一句话
+							sensitiveNumber: 0,//敏感词次数
+						}
+						self.websocketsend(JSON.stringify({type, data}))
 
 
-							}
-						})
-					});
-				}
+					}
+				})
 			},
 
 			/*****************转接会话用户确认******************/
@@ -1004,6 +1006,62 @@
 					this.isTrue = true;
 				})
 
+			},
+
+			/***qq截图粘贴************/
+			paste(){
+				let _this = this;
+				var imgReader = function( item ){
+					var blob = item.getAsFile(),reader = new FileReader();
+					// 读取文件后将其显示在网页中
+					reader.onload = function( e ){
+						var img = new Image();
+				
+						img.src = e.target.result;
+						_this.dialogPaste =true;
+						_this.pasteUrl = e.target.result;
+						// console.log(img.src)
+						//document.body.appendChild( img );
+					};
+					// 读取文件
+					reader.readAsDataURL( blob );
+				};
+				document.getElementById( 'input' ).addEventListener( 'paste', function( e ){
+					// 添加到事件对象中的访问系统剪贴板的接口
+					let clipboardData = e.clipboardData,
+						i = 0,
+						items, item, types;
+				
+					if( clipboardData ){
+						items = clipboardData.items;
+						if( !items ){
+						return;
+						}
+						item = items[0];
+						// 保存在剪贴板中的数据类型
+						types = clipboardData.types || [];
+						for( ; i < types.length; i++ ){
+						if( types[i] === 'Files' ){
+							item = items[i];
+							break;
+						}
+						}
+						// 判断是否为图片数据
+						if( item && item.kind === 'file' && item.type.match(/^image\//i) ){
+						imgReader( item );
+						}
+					}
+				});
+			},
+
+			/*****发送截图******/
+			handleClose(done) {
+				this.dialogPaste = false; 
+				let blob = this.$public.dataURItoBlob(this.pasteUrl)
+				let self = this;
+				var formData = new FormData();
+                    formData.append("file", blob);
+				self.upImg(formData);
 			}
 		},
 		/**
@@ -1035,6 +1093,11 @@
 			//获取敏感词
 			this.getSensitive();
 			this.frceArr = this.$frce;
+			this.paste();
+			
+		},
+		beforeDestroy(){
+			document.getElementById( 'input' ).removeEventListener('paste')
 		},
 
 		/**