update theme and user top
This commit is contained in:
@@ -45,13 +45,21 @@
|
||||
</div>
|
||||
|
||||
<div class="ui labeled button" tabindex="0" style=" margin-top: 30px;">
|
||||
<div class="ui red button">
|
||||
<div class="ui red button" id="likeBtn" onclick="voteDiscussion('like')">
|
||||
<i class="heart icon"></i> 赞这个主题
|
||||
</div>
|
||||
<a class="ui basic red left pointing label">
|
||||
<a class="ui basic red left pointing label" id="likeCount">
|
||||
${discussions.likeCount!0}
|
||||
</a>
|
||||
</div>
|
||||
<div class="ui labeled button" tabindex="0" style="margin-left:8px; margin-top: 30px;">
|
||||
<div class="ui grey button" id="dislikeBtn" onclick="voteDiscussion('dislike')">
|
||||
<i class="thumbs down icon"></i> 踩
|
||||
</div>
|
||||
<a class="ui basic grey left pointing label" id="dislikeCount">
|
||||
${discussions.dislikeCount!0}
|
||||
</a>
|
||||
</div>
|
||||
<span style="margin-left:12px; color:#888; font-size:0.9em;">
|
||||
<i class="eye icon"></i> ${discussions.viewCount!0} 浏览
|
||||
<i class="comment icon"></i> ${discussions.commentsCount!0} 回复
|
||||
@@ -90,7 +98,14 @@
|
||||
</div>
|
||||
|
||||
<div class="ui threaded comments">
|
||||
<h3 class="ui dividing header">评论区</h3>
|
||||
<h3 class="ui dividing header">
|
||||
评论区
|
||||
<div class="ui mini buttons" style="float:right; font-size:0.75em;">
|
||||
<a class="ui button <#if sort == 'oldest'>active</#if>" href="?id=${discussions.id}&sort=oldest">最早</a>
|
||||
<a class="ui button <#if sort == 'newest'>active</#if>" href="?id=${discussions.id}&sort=newest">最新</a>
|
||||
<a class="ui button <#if sort == 'hot'>active</#if>" href="?id=${discussions.id}&sort=hot">最热</a>
|
||||
</div>
|
||||
</h3>
|
||||
<input type="hidden" name="postId" id="postId" value=""/>
|
||||
|
||||
<!-- 定义遍历方法 -->
|
||||
@@ -105,15 +120,20 @@
|
||||
<img src="/static/assets/images/logo.png">
|
||||
</a>
|
||||
<div class="content">
|
||||
<a class="author">${post.username}</a>
|
||||
<a class="author user-card-trigger" data-user-id="${post.createId!''}">${post.username}</a>
|
||||
<span style="color:#aaa; font-size:0.8em; margin-left:6px;">#${post.number!''}</span>
|
||||
<div class="metadata">
|
||||
<span class="date">${post.createTime}</span>
|
||||
<#if post.ipRegion?? && post.ipRegion != ""><span style="margin-left:6px;"><i class="map marker alternate icon"></i>${post.ipRegion}</span></#if>
|
||||
<#if post.browser?? && post.browser != ""><span style="margin-left:6px;"><i class="chrome icon"></i>${post.browser}</span></#if>
|
||||
</div>
|
||||
<div class="text">
|
||||
${post.content}
|
||||
</div>
|
||||
<div class="actions">
|
||||
<a class="reply" onclick="replyThis('${post.username}', '${post.id}')">回复</a>
|
||||
<a onclick="votePost(${post.id}, 'like')" style="cursor:pointer;"><i class="thumbs up outline icon"></i>${(post.likeCount!0)?c}</a>
|
||||
<a onclick="votePost(${post.id}, 'dislike')" style="cursor:pointer;"><i class="thumbs down outline icon"></i>${(post.dislikeCount!0)?c}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments">
|
||||
@@ -127,15 +147,20 @@
|
||||
<img src="/static/assets/images/logo.png">
|
||||
</a>
|
||||
<div class="content">
|
||||
<a class="author">${post.username}</a>
|
||||
<a class="author user-card-trigger" data-user-id="${post.createId!''}">${post.username}</a>
|
||||
<span style="color:#aaa; font-size:0.8em; margin-left:6px;">#${post.number!''}</span>
|
||||
<div class="metadata">
|
||||
<span class="date">${post.createTime}</span>
|
||||
<#if post.ipRegion?? && post.ipRegion != ""><span style="margin-left:6px;"><i class="map marker alternate icon"></i>${post.ipRegion}</span></#if>
|
||||
<#if post.browser?? && post.browser != ""><span style="margin-left:6px;"><i class="chrome icon"></i>${post.browser}</span></#if>
|
||||
</div>
|
||||
<div class="text">
|
||||
${post.content}
|
||||
</div>
|
||||
<div class="actions">
|
||||
<a class="reply" onclick="replyThis('${post.username}', '${post.id}')">回复</a>
|
||||
<a onclick="votePost(${post.id}, 'like')" style="cursor:pointer;"><i class="thumbs up outline icon"></i>${(post.likeCount!0)?c}</a>
|
||||
<a onclick="votePost(${post.id}, 'dislike')" style="cursor:pointer;"><i class="thumbs down outline icon"></i>${(post.dislikeCount!0)?c}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -263,28 +288,23 @@
|
||||
|
||||
|
||||
<div class="mobile only sixteen wide column">
|
||||
<div class="ui segment">Jiscuss手机可见，内容正在编写中，pc端可正常访问</div>
|
||||
<div class="ui pagination menu">
|
||||
<a class="icon item">
|
||||
<i class="left chevron icon"></i>
|
||||
</a>
|
||||
<a class="item">
|
||||
1
|
||||
</a>
|
||||
<a class="item">
|
||||
2
|
||||
</a>
|
||||
<div class="disabled item">
|
||||
...
|
||||
<div id="context2" style="padding: 1em; background: #fff; border-radius: 0.28571429rem; border: 1px solid rgba(34, 36, 38, 0.15);">
|
||||
<h3 class="ui header"><i class="edit outline icon"></i>${discussions.title}</h3>
|
||||
<div class="ui main text container">${discussions.content}</div>
|
||||
<div style="margin-top:1em; color:#888; font-size:0.85em;">
|
||||
<i class="eye icon"></i> ${discussions.viewCount!0} 浏览
|
||||
<i class="comment icon"></i> ${discussions.commentsCount!0} 回复
|
||||
</div>
|
||||
<div class="ui threaded comments" style="margin-top:1em;">
|
||||
<h4 class="ui dividing header">评论区</h4>
|
||||
<@bpTree posts=posts />
|
||||
<form class="ui reply form" style="margin-top:1em;">
|
||||
<div class="field"><textarea id="postContentMobile"></textarea></div>
|
||||
<div class="ui blue labeled submit icon button" onclick="addPostMobile()">
|
||||
<i class="icon edit"></i> 添加评论
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<a class="item">
|
||||
10
|
||||
</a>
|
||||
<a class="item">
|
||||
11
|
||||
</a>
|
||||
<a class="icon item"> <i class="right chevron icon"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -303,8 +323,72 @@
|
||||
console.log('已经登陆：' + username);
|
||||
</#if>
|
||||
setDiscussionsId('${discussions.id}');
|
||||
|
||||
// User card — custom fixed-position tooltip (more reliable than Semantic UI popup)
|
||||
var cardCache = {};
|
||||
var $card = $('<div id="jUserCard" style="position:fixed;background:#fff;border:1px solid #ddd;border-radius:6px;padding:12px 16px;box-shadow:0 4px 16px rgba(0,0,0,.15);z-index:9999;min-width:180px;display:none;pointer-events:none;"></div>').appendTo('body');
|
||||
|
||||
function showCard(u, x, y) {
|
||||
$card.html(
|
||||
'<div style="font-weight:700;font-size:1em;margin-bottom:4px;">' + (u.username || '') + '</div>' +
|
||||
'<div style="color:#888;font-size:.88em;">发帖: ' + (u.discussionsCount || 0) +
|
||||
' 回复: ' + (u.commentsCount || 0) + '</div>'
|
||||
).css({ left: x + 14, top: y + 14 }).show();
|
||||
}
|
||||
|
||||
$(document).on('mouseenter', '.user-card-trigger', function(e) {
|
||||
var userId = $(this).data('user-id');
|
||||
if (!userId) return;
|
||||
if (cardCache[userId]) { showCard(cardCache[userId], e.clientX, e.clientY); return; }
|
||||
$.getJSON('/user_api/user/' + userId, function(res) {
|
||||
if (res && res.code === 10000 && res.data) {
|
||||
cardCache[userId] = res.data;
|
||||
showCard(res.data, e.clientX, e.clientY);
|
||||
}
|
||||
});
|
||||
}).on('mousemove', '.user-card-trigger', function(e) {
|
||||
if ($card.is(':visible')) $card.css({ left: e.clientX + 14, top: e.clientY + 14 });
|
||||
}).on('mouseleave', '.user-card-trigger', function() {
|
||||
$card.hide();
|
||||
});
|
||||
});
|
||||
|
||||
function voteDiscussion(action) {
|
||||
var token = $("meta[name='_csrf']").attr("content");
|
||||
var header = $("meta[name='_csrf_header']").attr("content");
|
||||
$.ajax({
|
||||
url: '/api/discussions/${discussions.id}/vote?action=' + action,
|
||||
type: 'POST',
|
||||
beforeSend: function(xhr) { xhr.setRequestHeader(header, token); },
|
||||
success: function(res) {
|
||||
if (res.code === 10000) {
|
||||
location.reload();
|
||||
} else {
|
||||
alert(res.msg || '操作失败，请先登录');
|
||||
}
|
||||
},
|
||||
error: function() { alert('请先登录'); }
|
||||
});
|
||||
}
|
||||
|
||||
function votePost(postId, action) {
|
||||
var token = $("meta[name='_csrf']").attr("content");
|
||||
var header = $("meta[name='_csrf_header']").attr("content");
|
||||
$.ajax({
|
||||
url: '/api/posts/' + postId + '/vote?action=' + action,
|
||||
type: 'POST',
|
||||
beforeSend: function(xhr) { xhr.setRequestHeader(header, token); },
|
||||
success: function(res) {
|
||||
if (res.code === 10000) {
|
||||
location.reload();
|
||||
} else {
|
||||
alert(res.msg || '操作失败，请先登录');
|
||||
}
|
||||
},
|
||||
error: function() { alert('请先登录'); }
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" charset="UTF-8" src="/static/js/user/discussions.js"></script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user