<#-- 评论列表  分页 -->
<#-- 本样式要引入 jquery.min.js   kindeditor  layer -->
<#--可接收参数 topicId:话题Id  commentId:评论Id  page:分页-->
<@function topicId="${url_topicId}" commentId="${url_commentId}" page="${url_page}" >
<#assign pageView =  topicRelated_comment_page> 

<#if pageView.records?exists && topicRelated_comment_page.records?size gt 0> 
	
	<div class="commentModule" >
		<ol class="commentList">
			<!-- #comment-## -->
			<#list pageView.records as comment>
				<div class="${(RequestParameters.reportModule != null && RequestParameters.reportModule=='20' && comment.id == RequestParameters.commentId)?string('commentInfo reportMark','commentInfo')}" id="anchor_${comment.id}">
					<div class="comment-author">
						<a href="user/control/home?userName=${comment.userName}">
						<#if comment.avatarName != null>
							<img src="${comment.avatarPath}100x100/${comment.avatarName}" >
						<#else>
							<!--[if (IE)]><img src="${commonPath}images/min_avata.png"><![endif]-->
							<!--[if !(IE)]><!--><img avatar="${(comment.nickname != null && comment.nickname??) ?string(comment.nickname , comment.account)}" ><!--<![endif]-->
						</#if> 
						<div class="info-container">
							<a class="userName" href="user/control/home?userName=${comment.userName}">
								${(comment.nickname != null && comment.nickname??) ?string(comment.nickname , comment.account)}
								
								<#if comment.account == null || comment.account == ''>
									&nbsp;
								</#if> 
							</a>
							<#list comment.userRoleNameList as roleName>
								<span class="userRoleName">${roleName}</span>
										
							</#list>
							<#if comment.isStaff>
								<span class="staff">官方人员</span>
							</#if>
							<#if comment.userName == topic.userName && comment.isStaff == topic.isStaff>
								<span class="master">作者</span>
							</#if>
							
						</div> 
					</div>
					<div class="commentTime">${comment.postTime}</div>
					<#if comment.quoteList?? && comment.quoteList?size gt 0> 
					<div class="quote">
						<#assign quoteContent = ""> 
						<#list comment.quoteList as quote>
							<#assign quoteCancelAccountHtml = "">
							<#if quote.account == null || quote.account == ''>
								<#assign quoteCancelAccountHtml = "<div class='cancelAccount'>此用户账号已注销</div>">
							</#if>
							<#assign avatarHtml = "<a class='avatarBox' href='user/control/home?userName="+quote.userName?html+"'>"+(quote.avatarName != null && quote.avatarName??) ?string("<img src='"+quote.avatarPath?html+"100x100/"+quote.avatarName?html+"'>" , "<img avatar='"+(quote.nickname != null && quote.nickname??) ?string(quote.nickname?html , quote.account?html)+"'>")+"</a>"> 
							<#assign quoteContent = "<div class='quoteComment'>"+quoteContent+"<span class='userName'>"+avatarHtml+"<a href='user/control/home?userName="+quote.userName?html+"'>"+(quote.nickname != null && quote.nickname??) ?string(quote.nickname?html , quote.account?html)+"</a>"+"&nbsp;的评论：</span><br/>"+quote.content+quoteCancelAccountHtml+"</div>"> 
							
						
						</#list>
						<#noescape>${quoteContent}</#noescape>
					</div>
					</#if> 
					<div class="commentContent">
						<#if comment.account == null || comment.account == ''>
							<div class="cancelAccount">此用户账号已注销</div>
						</#if>
						<#noescape>${comment.content}</#noescape>
					</div>
					<div class="clearfix"></div>
					<#if comment.totalReply gt 0> 
						<div class="replyList">
							<ul class="box">
								<#list comment.replyList as reply>
									<li id="anchor_reply_${reply.id}">
										<div class="${(RequestParameters.reportModule != null && RequestParameters.reportModule=='30' && reply.id == RequestParameters.replyId)?string('reply-reportMark','')}">
											<div class="reply-top" >
									        	<div class="reply-author">
											    	<a class="avatarBox" href="user/control/home?userName=${reply.userName}">
														<#if reply.avatarName != null>
															<img src="${reply.avatarPath}100x100/${reply.avatarName}" >
														<#else>
															<!--[if (IE)]><img src="${commonPath}images/min_avata.png"><![endif]-->
															<!--[if !(IE)]><!--><img avatar="${(reply.nickname != null && reply.nickname??) ?string(reply.nickname , reply.account)}" ><!--<![endif]-->
														</#if> 
													</a>
											    	<a class="userName" href="user/control/home?userName=${reply.userName}">
														${(reply.nickname != null && reply.nickname??) ?string(reply.nickname , reply.account)}
														<#if reply.account == null || reply.account == ''>
															&nbsp;
														</#if> 
													</a>
													
													<#if reply.userRoleNameList?size gt 0>
														<#list reply.userRoleNameList as roleName>
															<span class="userRoleName">${roleName}</span>
														</#list>
													</#if> 
													<#if reply.isStaff>
												        <span class="staff">官方人员</span>
													</#if>
													<#if reply.userName == topic.userName && reply.isStaff == topic.isStaff>
														<span class="master">作者</span>
													</#if>
													<div class="time">${reply.postTime}</div>
												</div>
												<#if reply.friendUserName != null && reply.friendUserName??>
													<div class="friendInfo">
		                                                <span class="arrow"><i class="cms-caret-right" ></i></span>
		                                                <#if reply.friendUserName!= null && reply.friendUserName??>
			                                            	<a class="friendAvatarBox" href="user/control/home?userName=${reply.friendUserName}">
			                                                    <#if reply.friendAvatarName != null>
																	<img src="${reply.friendAvatarPath}100x100/${reply.friendAvatarName}" class="img">
																<#else>
			                                                    	<img avatar="${(reply.friendNickname != null && reply.friendNickname??) ?string(reply.friendNickname , reply.friendAccount)}" width="20" height="20" class="img">
																</#if> 
			                                                </a>
		                                                </#if>
		                                                <h2 class="nameInfo" >
		                                                	<#if reply.friendAccount == null || !reply.friendAccount??>
		                                                    	<span class="cancelNickname">已注销</span>  
		                                                    </#if> 
		                                                    
		                                                    <#if reply.friendAccount != null && reply.friendAccount??>
			                                                    <a class="userName" href="user/control/home?userName=${reply.friendUserName}">
			                                                    	<#if reply.friendNickname != null && reply.friendNickname??>
																		${reply.friendNickname}
																	<#else>
																		${reply.friendAccount}
																	</#if> 
																	<#if reply.friendAccount == null || reply.friendAccount == ''>
																		&nbsp;
																	</#if> 
																</a>
															</#if>
		                                                    <#if reply.friendAccount != null && reply.friendAccount?? && reply.friendUserName == topic.userName && reply.isFriendStaff == topic.isStaff>
		                                                    	<span class="master">作者</span>
		                                                 	</#if>
		                                                </h2>
		                                            </div>
												</#if>
												<div class="ipAddress replyPopModule" >
													<#if reply.ipAddress != null && reply.ipAddress??>
														<i class="ipAddress-icon cms-map-pin-line"></i>
		                                               	<span class="ipAddress-text">${reply.ipAddress}</span>
	                                               	</#if>
	                                               	
	                                               	
													<span class="more hide" >
											    		<span>&nbsp;</span><i class="cms-ellipsis-v-solid"></i>
											    		<div class="nav-pop-list" >
													        <div class="ul-navlist">
													        	<#if systemUser != null>
																	<div class="li-list">
																		<a href="javascript:" onclick="addReplyFriendLayer('${comment.id}','${reply.id}');"><i class="cms-reply" ></i>回复</a>
																	</div>
																</#if>
												        		<#if systemUser != null && reply.userName ==  systemUser.userName>
																	<div class="li-list">
																		<a href="javascript:" onclick="editReplyLayer('${reply.id}','${(reply.nickname != null && reply.nickname??) ?string(reply.nickname , reply.userName)}');"><i class="cms-pencil-alt" ></i>编辑</a>
																	</div>
																</#if>
												        		<#if systemUser != null>
																	<div class="li-list">
																		<a href="javascript:" onclick="addReportUI('${reply.id}',30);"><i class="cms-error-warning-line" ></i>举报</a>
																	</div>
																</#if>
												        		<#if systemUser != null && reply.userName ==  systemUser.userName>
																	<div class="li-list">
																		<a href="javascript:" onclick="deleteReplyLayer('${reply.id}');"><i class="cms-trash" ></i>删除</a>
																	</div>
																</#if>
													        </div>
													    </div>
											    	</span>
												</div>
												
											</div>
											<div style="clear:both; height: 0; line-height: 0; font-size: 0;"></div>
											<div id="editCommentReply-replyContent_${reply.id}" class="replyContent">
												<#if reply.account == null || reply.account == ''>
													<div class="cancelAccount">此用户账号已注销</div>
												</#if>
												${reply.content}
											</div>
											<div id="commentReplyFriend-post_${reply.id}" ></div>
											<div id="editCommentReply-post_${reply.id}" ></div>
										</div>
									</li>
								</#list>
							</ul>
						</div> 
					</#if> 
					<div id="commentReply-post_${comment.id}" class="commentReply-post">
					
					</div>
					<div id="quote-post_${comment.id}" class="quote-post">
					
					</div>
					<div id="editComment-post_${comment.id}" class="editComment-post">
					
					</div>
					<div class="tipBottom">
						<span class="a-toolbar">
							<#if comment.ipAddress != null && comment.ipAddress??>
                              	<span class="ipAddress-text"><i class="ipAddress-icon cms-map-pin-line"></i>${comment.ipAddress}</span>
                            </#if>
						
							<a href="javascript:" onclick="replyLayer('${comment.id}','${(comment.nickname != null && comment.nickname??) ?string(comment.nickname , comment.userName)}');"><i class="cms-reply" ></i>回复</a>

							<a href="javascript:" onclick="quoteLayer('${comment.id}','${(comment.nickname != null && comment.nickname??) ?string(comment.nickname , comment.userName)}')"><i class="cms-quote" ></i>引用</a>
							<#if systemUser != null && comment.userName ==  systemUser.userName>
								<a href="javascript:" onclick="editCommentLayer('${comment.id}','${(comment.nickname != null && comment.nickname??) ?string(comment.nickname , comment.userName)}');"><i class="cms-pencil-alt" ></i>编辑</a>
							</#if>
							
							
							<#if systemUser != null>
								<a href="javascript:" onclick="addReportUI('${comment.id}',20);"><i class="cms-error-warning-line" ></i>举报</a>
							</#if>
							<#if systemUser != null && comment.userName ==  systemUser.userName>
								<a href="javascript:" onclick="deleteCommentLayer('${comment.id}');"><i class="cms-trash" ></i>删除</a>
							</#if>
							<!-- 是否登录 -->
							<input type="hidden" id="isLogin" value="<#if systemUser != null>true<#else>false</#if>">
							
							
						</span>
					</div>
				</div>
			</#list>
		</ol>
		<div class="commentPage">
		   	<#-- 分页 公共页(生成新引用页)-->
			<@include action="${newPublic_1}"/>
		</div>
	</div>
</#if>	
</@function>



<script type="text/javascript">


//滚动到描点(当上级跳转来后台'我的评论' '我的回复'时)
$(function() {
	var commentId = getUrlParam("commentId");//URL中的评论Id
	var replyId = getUrlParam("replyId");//URL中的回复Id
	if(commentId != null && commentId != "" && (replyId == null || replyId == '')){
		var anchor = $("#anchor_" + commentId); //获得锚点   
		
	    if (anchor.length > 0) {//判断对象是否存在   
	        var pos = anchor.offset().top;  
	      //  var poshigh = anchor.height();  
	        $("html,body").animate({ scrollTop: pos }, 500);  
	    }
	}
	if(replyId != null && replyId != ''){
		var anchor_reply = $("#anchor_reply_" + replyId); //获得锚点   
		if (anchor_reply.length > 0) {//判断对象是否存在   
	        var pos = anchor_reply.offset().top;  
	        $("html,body").animate({ scrollTop: pos }, 500);  
	    }
	}
 });  


//回复展开层
function replyLayer(commentId,userName){
	//判断是否已登录
	var isLogin = document.getElementById("isLogin").value;
	if(isLogin == "false"){
		layer.open({
		    type: 1, 
		    title:"提示",
		    content: "<div style='line-height: 36px; font-size: 15px;text-align:center; margin-left: 8px;margin-right: 8px;'>请先登录</div>", 
		    area: ['260px', '120px'],//宽高
			success: function(layero, index){
				 
			}
		});
		return false;
	}
	
	var parameter = "";//URI参数
	parameter += "commentId="+commentId;
	
	
	//回复页面
	get_request(function(value){
		if(value != ""){
			$("#commentReply-post_"+commentId).html(value);
		}
	},
	getBasePath()+"comment_reply?"+parameter+"&timestamp=" + new Date().getTime(), true);
	
}
function cancelReply(commentId,replyId){
	if(commentId){
		$("#commentReply-post_"+commentId).html("");
	}
	if(replyId){
		$("#commentReplyFriend-post_"+replyId).html("");
	}
	
}


//回复对方展开层
function addReplyFriendLayer(commentId,replyId){
	//判断是否已登录
	var isLogin = document.getElementById("isLogin").value;
	if(isLogin == "false"){
		layer.open({
		    type: 1, 
		    title:"提示",
		    content: "<div style='line-height: 36px; font-size: 15px;text-align:center; margin-left: 8px;margin-right: 8px;'>请先登录</div>", 
		    area: ['260px', '120px'],//宽高
			success: function(layero, index){
				 
			}
		});
		return false;
	}

	var parameter = "";//URI参数
	parameter += "commentId="+commentId;
	parameter += "&replyId="+replyId;
	
	//回复页面
	get_request(function(value){
		if(value != ""){
			$("#commentReplyFriend-post_"+replyId).html(value);
		}
	},
	getBasePath()+"comment_reply?"+parameter+"&timestamp=" + new Date().getTime(), true);

}


//修改回复展开层
function editReplyLayer(replyId,userName){
	//判断是否已登录
	var isLogin = document.getElementById("isLogin").value;
	if(isLogin == "false"){
		layer.open({
		    type: 1, 
		    title:"提示",
		    content: "<div style='line-height: 36px; font-size: 15px;text-align:center; margin-left: 8px;margin-right: 8px;'>请先登录</div>", 
		    area: ['260px', '120px'],//宽高
			success: function(layero, index){
				 
			}
		});
		return false;
	}
	
	$("#editCommentReply-replyContent_"+replyId).hide();
	$("#editCommentReply-post_"+replyId).show();
	
	var parameter = "";//URI参数
	parameter += "replyId="+replyId;
	
	
	
	//回复页面
	get_request(function(value){
		if(value != ""){
			$("#editCommentReply-post_"+replyId).html(value);
		}
	},
	getBasePath()+"user/editCommentReply?"+parameter+"&timestamp=" + new Date().getTime(), true);
	
}
function cancelEditReply(replyId){
	$("#editCommentReply-replyContent_"+replyId).show();
	$("#editCommentReply-editContent_"+replyId).hide();
	$("#editCommentReply-post_"+replyId).html("");
}

//删除评论回复弹出层
function deleteReplyLayer(replyId){
	layer.confirm('是否删除？', {
		title:"回复",
		btn: ['删除','取消'] //按钮
	}, function(){
		deleteReply(replyId);
	}, function(){
		 
	});

}
//删除回复层
function deleteReply(replyId){
	var parameter = "";
	//回复Id
	parameter += "&replyId="+replyId;
	//从meta标签获取令牌
	parameter += "&token="+getCsrf();
   	//删除第一个&号,防止因为多了&号而出现警告: Parameters: Invalid chunk ignored.信息
	if(parameter.indexOf("&") == 0){
		parameter = parameter.substring(1,parameter.length);
	}
   	post_request(function(value){
   		if(value != ""){
			var data = JSON.parse(value);
			for(var returnValue in data){
				
				if(returnValue == "success"){
        			if(data[returnValue] == "true"){
        				layer.msg('删除成功', 
							{
							  time: 3000 //3秒关闭（如果不配置，默认是3秒）
							},function(){
								//关闭后的操作
								//刷新页面
							    document.location.reload();
							}
						);
        			}
        		}else if(returnValue == "error"){
        			var errorValue = data[returnValue];
					var htmlValue = "";
					var i = 0;
					for(var error in errorValue){
						if(error != ""){	
							i++;
							htmlValue += "&nbsp;&nbsp;"+i+"、"+errorValue[error]+"<br>";
						}
					}
					
					layer.open({
					  type: 1,
					  title: '错误', 
					  skin: 'layui-layer-rim', //加上边框
					  area: ['300px', '150px'], //宽高
					  content: "<div style='line-height: 36px; font-size: 15px; margin-left: 8px;margin-right: 8px;'>"+htmlValue+"</div>"
					});
        		}
        	}
       	}
	},
		"user/control/comment/deleteReply?timestamp=" + new Date().getTime(), true,parameter);
	
}


//引用弹出层
function quoteLayer(commentId,userName){
	//判断是否已登录
	var isLogin = document.getElementById("isLogin").value;
	if(isLogin == "false"){
		layer.open({
		    type: 1, 
		    title:"提示",
		    content: "<div style='line-height: 36px; font-size: 15px;text-align:center; margin-left: 8px;margin-right: 8px;'>请先登录</div>", 
		    area: ['260px', '120px'],//宽高
			success: function(layero, index){
				 
			}
		});
		return false;
	}
	
	var parameter = "";//URI参数
	parameter += "commentId="+commentId;
	
	
	//引用页面
	get_request(function(value){
		if(value != ""){
			$("#quote-post_"+commentId).html(value);
		}
	},
	getBasePath()+"comment_quote?"+parameter+"&timestamp=" + new Date().getTime(), true);



}
function cancelQuote(commentId){
	$("#quote-post_"+commentId).html("");
}


//修改评论弹出层
function editCommentLayer(commentId,userName){
	//判断是否已登录
	var isLogin = document.getElementById("isLogin").value;
	if(isLogin == "false"){
		layer.open({
		    type: 1, 
		    title:"提示",
		    content: "<div style='line-height: 36px; font-size: 15px;text-align:center; margin-left: 8px;margin-right: 8px;'>请先登录</div>", 
		    area: ['260px', '120px'],//宽高
			success: function(layero, index){
				 
			}
		});
		return false;
	}
	
	var parameter = "";//URI参数
	parameter += "commentId="+commentId;
	
	
	//修改评论页面
	get_request(function(value){
		if(value != ""){
			$("#editComment-post_"+commentId).html(value);
		}
	},
	getBasePath()+"user/editComment?"+parameter+"&timestamp=" + new Date().getTime(), true);



}
function cancelEditComment(commentId){
	$("#editComment-post_"+commentId).html("");
}


//删除评论弹出层
function deleteCommentLayer(commentId){
	layer.confirm('是否删除？', {
		title:"评论",
		btn: ['删除','取消'] //按钮
	}, function(){
		deleteComment(commentId);
		//  layer.msg('删除成功');
	}, function(){
		 
	});

}


//删除评论
function deleteComment(commentId){

	var parameter = "";
	//评论Id
	parameter += "&commentId="+commentId;
	//从meta标签获取令牌
	parameter += "&token="+getCsrf();
   	//删除第一个&号,防止因为多了&号而出现警告: Parameters: Invalid chunk ignored.信息
	if(parameter.indexOf("&") == 0){
		parameter = parameter.substring(1,parameter.length);
	}
   	post_request(function(value){
   		if(value != ""){
			var data = JSON.parse(value);
			for(var returnValue in data){
				
				if(returnValue == "success"){
        			if(data[returnValue] == "true"){
        				layer.msg('删除成功', 
							{
							  time: 3000 //3秒关闭（如果不配置，默认是3秒）
							},function(){
								//关闭后的操作
								//刷新页面
							    document.location.reload();
							}
						);
        			}
        		}else if(returnValue == "error"){
        			var errorValue = data[returnValue];
					var htmlValue = "";
					var i = 0;
					for(var error in errorValue){
						if(error != ""){	
							i++;
							htmlValue += "&nbsp;&nbsp;"+i+"、"+errorValue[error]+"<br>";
						}
					}
					
					layer.open({
					  type: 1,
					  title: '错误', 
					  skin: 'layui-layer-rim', //加上边框
					  area: ['300px', '150px'], //宽高
					  content: "<div style='line-height: 36px; font-size: 15px; margin-left: 8px;margin-right: 8px;'>"+htmlValue+"</div>"
					});
        		}
        	}
       	}
	},
		"user/control/comment/delete?timestamp=" + new Date().getTime(), true,parameter);
}


</script> 

