今天是团队编程冲刺的第八天:
昨天完成了讨论的主页面的基本格式布局
今天任务:实现讨论界面的回复界面
编程时间:3.5h 代码行数:110
1 <% this.title = article.title + ' - 帖子'; %> 2 <% include header %> 3 <style type="text/css" xmlns:style="http://www.w3.org/1999/xhtml"> 4 .small{ 5 font-size: 0.7em; 6 } 7 </style> 8 <div class="padding"> 9 <div class="ui breadcrumb"> 10 <div class="section">讨论</div> 11 <i class="right angle icon divider"></i> 12 <% if (problem) { %> 13 <div class="section"><a href="<%= syzoj.utils.makeUrl(['discussion', 'problems']) %>">题目</a></div> 14 <i class="right angle icon divider"></i> 15 <a href="<%= syzoj.utils.makeUrl(['discussion', 'problem', problem.id]) %>" class="active section"><%= problem.title %></a> 16 <% } else { %> 17 <a href="<%= syzoj.utils.makeUrl(['discussion', 'global']) %>" class="section">全局板块</a> 18 <% } %> 19 </div> 20 <h1><%= article.title %></h1> 21 <p style="margin-bottom: -5px; "> 22 <img style="vertical-align: middle; margin-bottom: 2px; margin-right: 2px; " src="#" width="17" height="17"> 23 <b style="margin-right: 30px; "><a class="black-link" href="#"><%= article.user.username %></a><% if (article.user.nameplate) { %><%- article.user.nameplate %><% } %></b> 24 <b style="margin-right: 30px; "><i class="calendar icon"></i> #</b> 25 <% if (article.public_time !== article.update_time) { %><b style="margin-right: 30px; "><i class="edit icon"></i> #</b><% } %> 26 <% if (article.allowedEdit) { %> 27 <a style="margin-top: -4px; " class="ui mini right floated labeled icon button" href="# %>"><i class="ui edit icon"></i>编辑</a> 28 <a style="margin-top: -4px; margin-right: 3px; " class="ui mini red right floated labeled icon button" onclick="$('#modal-delete').modal('show')"><i class="ui trash icon"></i>删除</a> 29 <div class="ui basic modal right floated" id="modal-delete"> 30 <div class="ui icon header"> 31 <i class="trash icon"></i> 32 <p style="margin-top: 15px; ">删除文章</p> 33 </div> 34 <div class="content" style="text-align: center; "> 35 <p>确认删除这篇文章吗?</p> 36 </div> 37 <div class="actions"> 38 <div class="ui red basic cancel inverted button"> 39 <i class="remove icon"></i> 40 否 41 </div> 42 <a class="ui green ok inverted button" href-post="<%= syzoj.utils.makeUrl(['article', article.id, 'delete']) %>"> 43 <i class="checkmark icon"></i> 44 是 45 </a> 46 </div> 47 </div> 48 <% } %> 49 </p> 50 <div class="ui existing segment"> 51 <div id="content" class="font-content"><%- article.content %></div> 52 </div> 53 <% if (comments.length) { %> 54 <div class="ui comments" style="max- none;"> 55 <h3 class="ui dividing header">共 <%= commentsCount %> 条回复</h3> 56 <% for (let comment of comments) { %> 57 <div class="comment"> 58 <a class="avatar"> 59 <img src="<%= syzoj.utils.gravatar(comment.user.email, 120) %>"> 60 </a> 61 <div class="content"> 62 <a class="author" href="#"><%= comment.user.username %></a><% if (comment.user.nameplate) { %><%- comment.user.nameplate %><% } %> 63 <div class="metadata"> 64 <span class="date">#</span> 65 </div> 66 <div class="text font-content" style="min-height: 19.5px; "><%- comment.content %></div> 67 <% if (comment.allowedEdit) { %> 68 <div class="actions"><a onclick="$('#modal-delete-<%= comment.id %>').modal('show')">删除</a></div> 69 <div class="ui basic modal" id="modal-delete-<%= comment.id %>"> 70 <div class="ui icon header"> 71 <i class="trash icon"></i> 72 <p style="margin-top: 15px; ">删除评论</p> 73 </div> 74 <div class="content" style="text-align: center; "> 75 <p>确认删除这条评论吗?</p> 76 </div> 77 <div class="actions"> 78 <div class="ui red basic cancel inverted button"> 79 <i class="remove icon"></i> 80 否 81 </div> 82 <a class="ui green ok inverted button" href-post="#"> 83 <i class="checkmark icon"></i> 84 是 85 </a> 86 </div> 87 </div> 88 <% } %> 89 </div> 90 </div> 91 <% } %> 92 </div> 93 <div style="margin-bottom: 50px; "> 94 <% include page %> 95 </div> 96 <% } %> 97 <% if (article.allowedComment) { %> 98 <form class="ui reply form" method="post" action="#"> 99 <div class="field"> 100 <textarea name="comment" class="markdown-edit"></textarea> 101 </div> 102 <div style="text-align: center; "> 103 <button id="submit_button" type="submit" class="ui labeled submit icon button"> 104 <i class="icon edit"></i> 回复 105 </button> 106 </div> 107 </form> 108 <% } %> 109 </div> 110 <% include footer %>