| 
					
					
					
				 | 
				@ -1,20 +1,21 @@ | 
			
		
		
	
		
			
				 | 
				 | 
				<style> | 
				 | 
				 | 
				<style> | 
			
		
		
	
		
			
				 | 
				 | 
					.chat-container { padding:  20px 40px; height: calc(100vh - 160px) } | 
				 | 
				 | 
					.chat-container { padding:  20px 40px; height: calc(100vh - 160px) } | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-chat { | 
				 | 
				 | 
					.msg-chat { | 
			
		
		
	
		
			
				 | 
				 | 
						position: relative; background-color: white; padding: 40px 20px 50px 20px; | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
						position: relative; background-color: white; padding: 40px 20px 90px 20px; | 
			
		
		
	
		
			
				 | 
				 | 
						border-top-right-radius: 8px; border-bottom-right-radius: 8px; height: 100%; | 
				 | 
				 | 
						border-top-right-radius: 8px; border-bottom-right-radius: 8px; height: 100%; | 
			
		
		
	
		
			
				 | 
				 | 
					} | 
				 | 
				 | 
					} | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-chat-list {  height: 100%; overflow-y: auto; overflow-x: hidden; padding-bottom: 20px; } | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
					.msg-chat-list {  height: 100%; overflow-y: auto; overflow-x: hidden; padding-bottom: 20px; padding-right: 20px; } | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-user { margin: 5px 0px; line-height: 30px; } | 
				 | 
				 | 
					.msg-user { margin: 5px 0px; line-height: 30px; } | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-name { display: inline-block; font-size: 14px; font-weight: bold; padding: 0px 5px; } | 
				 | 
				 | 
					.msg-name { display: inline-block; font-size: 14px; font-weight: bold; padding: 0px 5px; } | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-avatar { display: inline-block; } | 
				 | 
				 | 
					.msg-avatar { display: inline-block; } | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-avatar img { width: 30px; height: 30px; border-radius: 50%; } | 
				 | 
				 | 
					.msg-avatar img { width: 30px; height: 30px; border-radius: 50%; } | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-content { display: inline-block; background-color: #f4f4f4; padding: 20px; border-radius: 10px; }
 | 
				 | 
				 | 
					.msg-content { display: inline-block; background-color: #f4f4f4; padding: 20px; border-radius: 10px; }
 | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-content-image { max-width: 120px; max-height: 120px; } | 
				 | 
				 | 
					.msg-content-image { max-width: 120px; max-height: 120px; } | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-send { position: absolute; bottom: 0; left: 0; z-index: 999; height: 50px; } | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-send .input-group-addon { width: 40px; border: none; line-height: 2.7; background-color: #dbe3e6; cursor: pointer; }
 | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-send .input-group-addon.msg-text { background-color: #586cb1; color: white; padding: 5px 10px; width: 60px; line-height: 2.8; }
 | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
					.msg-send { position: absolute; bottom: 0; left: 0; z-index: 999; height: 90px; } | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
					.msg-send .input-group-addon { width: 40px; border: none; line-height: 5.4; background-color: #dbe3e6; cursor: pointer; }
 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
					.msg-send .input-group-addon.msg-text { background-color: #586cb1; color: white; padding: 5px 10px; width: 60px; line-height: 5.5; }
 | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-time { padding: 0 5px; color: gray; font-size: 12px; margin: 5px 0; } | 
				 | 
				 | 
					.msg-time { padding: 0 5px; color: gray; font-size: 12px; margin: 5px 0; } | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
					.msg-image { line-height: 90px; } | 
			
		
		
	
		
			
				 | 
				 | 
				
 | 
				 | 
				 | 
				
 | 
			
		
		
	
		
			
				 | 
				 | 
					.msg-list { | 
				 | 
				 | 
					.msg-list { | 
			
		
		
	
		
			
				 | 
				 | 
						position: relative; background-color: white; | 
				 | 
				 | 
						position: relative; background-color: white; | 
			
		
		
	
	
		
			
				| 
					
						
							
						
					
					
						
							
						
					
					
				 | 
				@ -77,7 +78,8 @@ | 
			
		
		
	
		
			
				 | 
				 | 
							<div class="text-center">暂无工单数据</div> | 
				 | 
				 | 
							<div class="text-center">暂无工单数据</div> | 
			
		
		
	
		
			
				 | 
				 | 
						@else | 
				 | 
				 | 
						@else | 
			
		
		
	
		
			
				 | 
				 | 
							<div class="input-group input-group-lg msg-send"> | 
				 | 
				 | 
							<div class="input-group input-group-lg msg-send"> | 
			
		
		
	
		
			
				 | 
				 | 
								<input name="msg-input" type="text" class="form-control" style="border-radius: 0; border-color: #dbe3e6; text-align: center;"> | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
								<textarea name="msg-input" id="msg-input" type="text" class="form-control" rows="3" style="height: 90px; border-radius: 0; border-color: #dbe3e6; text-align: left; padding-left: 5px;"></textarea> | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
				{{--				<input name="msg-input" type="text" class="form-control" style="border-radius: 0; border-color: #dbe3e6; text-align: left; padding-left: 5px;">--}} | 
			
		
		
	
		
			
				 | 
				 | 
								<div class="input-group-addon msg-image"><span class="fa fa-picture-o"></span></div> | 
				 | 
				 | 
								<div class="input-group-addon msg-image"><span class="fa fa-picture-o"></span></div> | 
			
		
		
	
		
			
				 | 
				 | 
								<div class="input-group-addon msg-text">发送</div> | 
				 | 
				 | 
								<div class="input-group-addon msg-text">发送</div> | 
			
		
		
	
		
			
				 | 
				 | 
								<input type="file" class="hidden image" name="image"> | 
				 | 
				 | 
								<input type="file" class="hidden image" name="image"> | 
			
		
		
	
	
		
			
				| 
					
						
							
						
					
					
						
							
						
					
					
				 | 
				@ -234,20 +236,29 @@ | 
			
		
		
	
		
			
				 | 
				 | 
								}); | 
				 | 
				 | 
								}); | 
			
		
		
	
		
			
				 | 
				 | 
							}); | 
				 | 
				 | 
							}); | 
			
		
		
	
		
			
				 | 
				 | 
				
 | 
				 | 
				 | 
				
 | 
			
		
		
	
		
			
				 | 
				 | 
							$('input[name=msg-input]').on('keyup', function (e) { | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
								if (e.keyCode == 13) { | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
							$('#msg-input').on('keyup', function (event) { | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
								// 只按下ctrl情况,等待enter键的按下
 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
								let stat = false; | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
								if (event.keyCode === 17) { | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
									stat = true; | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
									//取消等待
 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
									setTimeout(function(){ | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
										stat = false; | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
									},300); | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
								} | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
								if (event.keyCode === 13 && (stat || event.ctrlKey)) { | 
			
		
		
	
		
			
				 | 
				 | 
									$('.msg-text').click() | 
				 | 
				 | 
									$('.msg-text').click() | 
			
		
		
	
		
			
				 | 
				 | 
								} | 
				 | 
				 | 
								} | 
			
		
		
	
		
			
				 | 
				 | 
							}); | 
				 | 
				 | 
							}); | 
			
		
		
	
		
			
				 | 
				 | 
				
 | 
				 | 
				 | 
				
 | 
			
		
		
	
		
			
				 | 
				 | 
							$('.msg-text').on('click', function (e) { | 
				 | 
				 | 
							$('.msg-text').on('click', function (e) { | 
			
		
		
	
		
			
				 | 
				 | 
								let msgText = $('input[name=msg-input]').val() | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
								let msgText = $('#msg-input').val() | 
			
		
		
	
		
			
				 | 
				 | 
								let workorderId = $('input[name=workorder-id]').val() | 
				 | 
				 | 
								let workorderId = $('input[name=workorder-id]').val() | 
			
		
		
	
		
			
				 | 
				 | 
				
 | 
				 | 
				 | 
				
 | 
			
		
		
	
		
			
				 | 
				 | 
								if (msgText == '') { | 
				 | 
				 | 
								if (msgText == '') { | 
			
		
		
	
		
			
				 | 
				 | 
									$('input[name=msg-input]').css('border-color', 'red').focus(); | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
									$('#msg-input').css('border-color', 'red').focus(); | 
			
		
		
	
		
			
				 | 
				 | 
									setTimeout(function () { | 
				 | 
				 | 
									setTimeout(function () { | 
			
		
		
	
		
			
				 | 
				 | 
										$('input[name=msg-input]').css('border-color', '#dbe3e6'); | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
										$('#msg-input').css('border-color', '#dbe3e6'); | 
			
		
		
	
		
			
				 | 
				 | 
									}, 3000) | 
				 | 
				 | 
									}, 3000) | 
			
		
		
	
		
			
				 | 
				 | 
								} | 
				 | 
				 | 
								} | 
			
		
		
	
		
			
				 | 
				 | 
				
 | 
				 | 
				 | 
				
 | 
			
		
		
	
	
		
			
				| 
					
					
					
						
							
						
					
				 | 
				@ -268,7 +279,7 @@ | 
			
		
		
	
		
			
				 | 
				 | 
										templateHtml = templateHtml.replace('#contents', msgText) | 
				 | 
				 | 
										templateHtml = templateHtml.replace('#contents', msgText) | 
			
		
		
	
		
			
				 | 
				 | 
										templateHtml = templateHtml.replace('#times', msgTime) | 
				 | 
				 | 
										templateHtml = templateHtml.replace('#times', msgTime) | 
			
		
		
	
		
			
				 | 
				 | 
										$(".msg-chat-list").append(templateHtml) | 
				 | 
				 | 
										$(".msg-chat-list").append(templateHtml) | 
			
		
		
	
		
			
				 | 
				 | 
										$('input[name=msg-input]').val('') | 
				 | 
				 | 
				 | 
			
		
		
	
		
			
				 | 
				 | 
				 | 
				 | 
				 | 
										$('#msg-input').val('') | 
			
		
		
	
		
			
				 | 
				 | 
										$(".msg-chat-list").animate({ scrollTop: $(".msg-chat-list")[0].scrollHeight - $('.msg-chat-list').height() }, 1) | 
				 | 
				 | 
										$(".msg-chat-list").animate({ scrollTop: $(".msg-chat-list")[0].scrollHeight - $('.msg-chat-list').height() }, 1) | 
			
		
		
	
		
			
				 | 
				 | 
									}, | 
				 | 
				 | 
									}, | 
			
		
		
	
		
			
				 | 
				 | 
									error: function (error) { | 
				 | 
				 | 
									error: function (error) { | 
			
		
		
	
	
		
			
				| 
					
						
							
						
					
					
					
				 | 
				
  |