content.html 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>gfast博客</title>
  6. <link href="${.domain}plugin/blog/css/base.css" rel="stylesheet">
  7. <meta name="viewport" content="width=device-width,initial-scale=1.0">
  8. <script src="${.domain}js/jquery/jquery.js"></script>
  9. <script src="${.domain}plugin/blog/js/nav.js"></script>
  10. <script type="text/javascript">
  11. $(function () {
  12. // 提交评论后在页面弹框显示返回的添加信息
  13. $('#addComment').submit(function () {
  14. $.post($(this).attr('action'), $(this).serializeArray(), function (data) {
  15. alert(data.msg);
  16. $('.com_content').val(""); // 把评论中的内容置为空
  17. // window.location.reload(); // 添加后刷新一下页面
  18. });
  19. return false;
  20. });
  21. });
  22. $(document).ready(function () {
  23. // 重置按钮功能
  24. $('.reset_button').click(function () {
  25. $('.hidden_commentPid').attr('value', '0');
  26. $('.hidden_replyName').attr('value', "");
  27. $('.com_content').attr('placeholder', "请输入评论");
  28. });
  29. // 点击回复
  30. $('.reply').each(function (index) {
  31. $(this).click(function () {
  32. const ph1 = $('.comment_nickname');
  33. const r = $('.reply_id');
  34. $('.com_content').attr('placeholder', "@"+$(ph1[index]).text());
  35. // 将.hidden_commentPid所属标签的value值改为所回复评论的id
  36. // 用回复span的id把父评论的id值传过来
  37. $('.hidden_commentPid').attr('value', $(this).attr('id'));
  38. // 将所回复对象的id放入隐藏的input中
  39. $('.hidden_replyId').attr("value", $(r[index]).text());
  40. // 将所回复的对象的昵称放入隐藏的input中提交,$(ph1[index]).text()从评论的div中获取所回复对象的昵称
  41. $('.hidden_replyName').attr('value', $(ph1[index]).text());
  42. $('.com_content').focus();
  43. });
  44. });
  45. // 点击查看更多
  46. $('.click_view').each(function (index) {
  47. $(this).click(function () {
  48. const rb = $('.reply_box');
  49. $(rb[index]).find('.reply_item').removeClass("reply_item");
  50. const vm = $('.view_more');
  51. $(vm[index]).addClass("reply_item");
  52. });
  53. });
  54. })
  55. </script>
  56. </head>
  57. <body>
  58. ${template "header" .}
  59. <main>
  60. ${if and (ne .classification nil) (eq .classification.ClassificationType 4)}
  61. <p class="weizhi">您现在的位置是:<a href="${.domain}plugin/blog/index">网站首页</a> > <a href="${.domain}plugin/blog/blogList?cateId=${.classification.ClassificationId}">${.classification.ClassificationName}</a> </p>
  62. <article>
  63. <div class="container">
  64. <h1>${.classification.ClassificationName}</h1>
  65. <div class="content">
  66. ${.classification.ClassificationContent}
  67. </div>
  68. </div>
  69. </article>
  70. ${else}
  71. <p class="weizhi">您现在的位置是:<a href="${.domain}plugin/blog/index">网站首页</a> > <a href="${.domain}plugin/blog/blogList?cateId=${.log.LogType}">${.log.ClassificationName}</a> > ${.log.LogTitle}</p>
  72. <article>
  73. <div class="container">
  74. <h1>${.log.LogTitle}</h1>
  75. <p class="blog_info">
  76. <span>${timeFormatYear .log.CreatTime}</span>
  77. <span>${.log.LogAuthor}</span>
  78. <span><a href="${.domain}plugin/blog/blogList?cateId=${.log.LogType}" target="_blank">${.log.ClassificationName}</a></span>
  79. <span>${.log.LogHits}</span>
  80. </p>
  81. <div class="content">
  82. ${.log.LogContent}
  83. </div>
  84. <div class="otherlink">
  85. <h2>相关文章</h2>
  86. <div class="relevant_article">
  87. ${range $index,$article := .relevantList}
  88. ${if ne $.log.LogId $article.LogId}
  89. <div>
  90. <a href="${$.domain}plugin/blog/content?logId=${$article.LogId}"><img src="${$.domain}${$article.LogThumbnail}"></a>
  91. </div>
  92. ${end}
  93. ${end}
  94. </div>
  95. </div>
  96. <div class="pinglun_box">
  97. <div>
  98. <h2>文章评论</h2>
  99. ${range $index,$comment := .commentList}
  100. <div class="comment">
  101. <div class="comment_nickname">${$comment.CommentNickname}</div>
  102. <div class="comment_create_time">
  103. (${timeFormatYear $comment.CreateTime})
  104. </div>
  105. <div class="comment_content">
  106. ${$comment.CommentContent}
  107. </div>
  108. <div class="reply_id">${$comment.CommentId}</div>
  109. <div class="comment_reply"><span class="reply" id="${$comment.CommentId}">回复</span></div>
  110. <!-- 二级评论 -->
  111. <div class="reply_box">
  112. ${range $index2, $item := $comment.Children}
  113. <!-- 小于或者等于3条回复则显示,大于3条的隐藏 -->
  114. ${if lt $index2 3}
  115. <div>
  116. <div class="comment_nickname">${$item.CommentNickname}</div>
  117. <div class="comment_create_time">
  118. (${timeFormatYear $item.CreateTime})
  119. </div>
  120. <div class="comment_content">
  121. @${$item.ReplyName}:${$item.CommentContent}
  122. </div>
  123. <div class="reply_id">${$item.CommentId}</div>
  124. <div class="comment_reply"><span class="reply" id="${$comment.CommentId}">回复</span></div>
  125. </div>
  126. ${else}
  127. <div class="reply_item">
  128. <div class="comment_nickname">${$item.CommentNickname}</div>
  129. <div class="comment_create_time">
  130. (${timeFormatYear $item.CreateTime})
  131. </div>
  132. <div class="comment_content">
  133. @${$item.ReplyName}:${$item.CommentContent}
  134. </div>
  135. <div class="reply_id">${$item.CommentId}</div>
  136. <div class="comment_reply"><span class="reply" id="${$comment.CommentId}">回复</span></div>
  137. </div>
  138. ${end}
  139. ${end}
  140. </div>
  141. ${if gt $comment.CommentNum 3}
  142. <div class="view_more">
  143. 共<b>${$comment.CommentNum}</b>条回复,<span class="click_view">点击查看</span>
  144. </div>
  145. ${else}
  146. <div class="view_more reply_item">
  147. 共<b>${$comment.CommentNum}</b>条回复,<span class="click_view">点击查看</span>
  148. </div>
  149. ${end}
  150. </div>
  151. ${end}
  152. ${if ne .commentList nil}
  153. <div class="paging">
  154. ${$.pageStyle}
  155. </div>
  156. ${else}
  157. <div class="no_comment">还没有人发表评论</div>
  158. ${end}
  159. </div>
  160. <div>
  161. <h2>发表评论</h2>
  162. <form id="addComment" action="${.domain}plugin/blog/addComment" method="post">
  163. <input type="hidden" name="commentLogId" value="${.log.LogId}">
  164. <input type="hidden" class="hidden_commentPid" name="commentPid" value="0">
  165. <input type="hidden" class="hidden_replyName" name="replyName" value="">
  166. <input type="hidden" class="hidden_replyId" name="replyId" value="">
  167. <div class="guest_tit">
  168. <input type="text" name="commentNickname" placeholder="请输入昵称"><label>&ensp;昵称</label>
  169. </div>
  170. <div class="guest_txt">
  171. <textarea class="com_content" name="commentContent" placeholder="请输入评论"></textarea>
  172. </div>
  173. <div class="guest_s">
  174. <button class="btn" type="submit">提交</button>
  175. <button class="btn reset_button" type="reset">重置</button>
  176. </div>
  177. </form>
  178. </div>
  179. </div>
  180. </div>
  181. </article>
  182. ${end}
  183. <!--article end-->
  184. ${template "aside" .}
  185. <!--aside end-->
  186. </main>
  187. ${template "footer" .}
  188. </body>
  189. </html>