mirror of
https://github.com/201206030/novel-plus.git
synced 2025-04-26 17:20:52 +00:00
368 lines
12 KiB
Java
368 lines
12 KiB
Java
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||
<title th:text="${application.website.name}+'列表'"></title>
|
||
|
||
<meta name="keywords"
|
||
th:content="${application.website.name}+',精品小说,弹幕网站,弹幕,弹幕小说网站,免费小说,小说阅读,小说排行,轻小说,txt小说下载,电子书下载,动漫轻小说,日本轻小说'">
|
||
|
||
<meta name="description"
|
||
th:content="${application.website.name}+'是国内优秀的小说弹幕网站,'+${application.website.name}+'提供海量热门网络小说,日本轻小说,国产轻小说,动漫小说,轻小说在线阅读和TXT小说下载,致力于网络精品小说的收集,智能计算小说评分,打造小说精品排行榜,致力于无广告无弹窗的小说阅读环境。'">
|
||
|
||
|
||
<div th:include="mobile/common/css :: css"></div>
|
||
|
||
</div>
|
||
|
||
<style type="text/css">
|
||
|
||
body {
|
||
|
||
-webkit-user-select: none; /* Chrome, Safari, Opera */
|
||
|
||
|
||
-moz-user-select: none; /* Firefox */
|
||
|
||
|
||
-ms-user-select: none; /* Internet Explorer/Edge */
|
||
|
||
|
||
user-select: none; /* Non-prefixed version, currently supported by Chrome, Opera, and Firefox */
|
||
|
||
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
.line-limit-length {
|
||
|
||
overflow: hidden;
|
||
|
||
text-overflow: ellipsis;
|
||
|
||
white-space: nowrap;
|
||
|
||
}
|
||
|
||
.indexP p a {
|
||
color: #4c6978;
|
||
}
|
||
|
||
.Readarea {
|
||
font-size: 18px;
|
||
line-height: 35px;
|
||
padding: 10px;
|
||
color: #333;
|
||
}
|
||
|
||
div, p {
|
||
wrap-work: break-word;
|
||
word-break: break-all;
|
||
word-wrap: break-word;
|
||
word-break: normal;
|
||
-moz-box-sizing: border-box;
|
||
-webkit-box-sizing: border-box;
|
||
box-sizing: border-box;
|
||
-ms-box-sizing: border-box;
|
||
}
|
||
|
||
.indexDiv a {
|
||
margin-left: 20px;
|
||
}
|
||
|
||
img {
|
||
width: 130px;
|
||
height: 180px;
|
||
}
|
||
|
||
#tipLayer {
|
||
display: none;
|
||
position: absolute;
|
||
background-color: rgba(255, 0, 0, 0.8);
|
||
color: white;
|
||
padding: 5px 10px;
|
||
border-radius: 3px;
|
||
cursor: pointer;
|
||
z-index: 1000;
|
||
}
|
||
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<input type="hidden" id="limit" th:value="${limit}"/>
|
||
<input type="hidden" id="curr" th:value="${curr}"/>
|
||
<input type="hidden" id="total" th:value="${total}"/>
|
||
<input type="hidden" id="ids" th:value="${ids}"/>
|
||
<input type="hidden" id="bookStatus" th:value="${bookStatus}"/>
|
||
<input type="hidden" id="token" th:value="${token}"/>
|
||
<input type="hidden" id="keyword" th:value="${keyword}"/>
|
||
<input type="hidden" id="catId" th:value="${catId}"/>
|
||
<input type="hidden" id="sortBy" th:value="${sortBy}"/>
|
||
<input type="hidden" id="sort" th:value="${sort}"/>
|
||
|
||
<div style="height: 50px;line-height: 50px;text-align: center" class="layui-header header header-doc layui-bg-cyan">
|
||
|
||
<div style="width:10%;float: left;margin-left: 10px">
|
||
<a href="javascript:history.go(-1)">
|
||
<i style="font-size: 20px;color: #fff;" class="layui-icon"></i></a>
|
||
</div>
|
||
<b class="layui-icon">我的书架</b>
|
||
<div style="width:10%;float: right;margin-right: 10px"><a href="/">
|
||
<i style="font-size: 20px;color: #fff;" class="layui-icon"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div id="body">
|
||
<div id="bookList">
|
||
|
||
|
||
</div>
|
||
<div id="tipLayer"
|
||
style="display:none; position:absolute; background-color:rgba(255, 0, 0, 0.8); color:white; padding:5px; border-radius:3px; cursor:pointer;">
|
||
移出书架
|
||
</div>
|
||
|
||
|
||
<div id="books" style="text-align: center;"></div>
|
||
|
||
</div>
|
||
<div th:replace="mobile/common/footer :: footer">
|
||
</div>
|
||
|
||
<a name="buttom"></a>
|
||
</body>
|
||
<div th:replace="mobile/common/js :: js"></div>
|
||
|
||
<script>
|
||
|
||
var timeout, isLongPress = false;
|
||
|
||
search(1, 20);
|
||
|
||
function search(curr, limit) {
|
||
|
||
|
||
$.ajax({
|
||
type: "get",
|
||
url: "/user/listBookShelfByPage",
|
||
data: {'curr': curr, 'limit': limit},
|
||
dataType: "json",
|
||
success: function (data) {
|
||
if (data.code == 200) {
|
||
var bookList = data.data.list;
|
||
var bookListHtml = "";
|
||
for (var i = 0; i < bookList.length; i++) {
|
||
var book = bookList[i];
|
||
|
||
/*var end = book.bookDesc.indexOf("<");
|
||
if(end != -1) {
|
||
book.bookDesc = book.bookDesc.substring(0,end);
|
||
}*/
|
||
|
||
if (book.bookDesc) {
|
||
book.bookDesc = book.bookDesc.replace(/<[^>]+>/g, "").replace(/\s+/g, "").replace(/ /g, "");
|
||
}
|
||
|
||
bookListHtml += ("<div id='"+book.bookId+"' onclick='read(\""+book.bookId+"\",\""+book.preContentId+"\")' class=\"item layui-row\" style=\"margin-bottom:10px;padding:10px;background: #f2f2f2\">\n" +
|
||
" <div class=\"layui-col-xs6 layui-col-sm3 layui-col-md2 layui-col-lg2\" style=\"text-align: center\">\n" +
|
||
" <img style='width: 130px;height: 180px' align=\"center\"\n" +
|
||
" src=\"" + book.picUrl + "\"/>\n" +
|
||
" </div>\n" +
|
||
" \n" +
|
||
" <div style=\"padding: 10px\" class=\"layui-col-xs6 layui-col-sm8 layui-col-md8 layui-col-lg8\">\n" +
|
||
" <div class=\"line-limit-length\" style=\";color: #000;font-size: 15px\">" + book.bookName + "</div>\n" +
|
||
" <div style=\";color: #4c6978;float: right;\"><i style=\"color: red\"></i></div>\n" +
|
||
" <div style=\";color: #a6a6a6;\" class=\"line-limit-length\">作者：" + book.authorName + "</div>\n" +
|
||
" <div style=\"margin-top: 5px;color: #a6a6a6;\">类别：" + book.catName + "</div>\n" +
|
||
" <div style=\"margin-top: 5px;color: #a6a6a6;\">状态：" + (book.bookStatus == 0 ? '连载' : '完结') + "</div>\n" +
|
||
" <div style=\"margin-top: 5px;color: #a6a6a6;\">更新：<i style='color: red'>" + book.lastIndexUpdateTime.substr(0, 11) + "</i>\n" +
|
||
" </div>\n" +
|
||
" <div style=\"margin-top: 5px;color: #a6a6a6;\">简介：" + (book.bookDesc ? (book.bookDesc.length > 15 ? (book.bookDesc.substr(0, 15) + "...") : book.bookDesc) : book.bookDesc) + "</div>\n" +
|
||
"\n" +
|
||
"\n" +
|
||
" </div>\n" +
|
||
"\n" +
|
||
" </div>");
|
||
}
|
||
$("#bookList").html(bookListHtml);
|
||
|
||
|
||
$(".item").on('touchstart', function(e) {
|
||
var element = $(this);
|
||
// 清除可能存在的定时器
|
||
clearTimeout(timeout);
|
||
isLongPress = false;
|
||
|
||
// 获取触摸点位置
|
||
var touch = e.originalEvent.touches[0];
|
||
|
||
// 设置一个定时器，在500ms后触发（可以根据需要调整时间）
|
||
timeout = setTimeout(function() {
|
||
e.preventDefault();
|
||
showTip(touch, element);
|
||
}, 1000);
|
||
}).on('touchend', function(e) {
|
||
if (!isLongPress) {
|
||
// 如果没有发生长按，则执行点击事件的逻辑
|
||
clearTimeout(timeout);
|
||
}
|
||
}).on('touchmove', function() {
|
||
clearTimeout(timeout);
|
||
hideTip();
|
||
}).on('contextmenu', function(e) {
|
||
e.preventDefault();
|
||
});
|
||
|
||
$('#tipLayer').click(function() {
|
||
// 点击tips层时删除对应的.item元素
|
||
removeFromBookShelf($(this).data('target').attr("id"));
|
||
$(this).data('target').remove();
|
||
hideTip();
|
||
});
|
||
|
||
|
||
|
||
|
||
layui.use('laypage', function () {
|
||
var laypage = layui.laypage;
|
||
|
||
//执行一个laypage实例
|
||
laypage.render({
|
||
elem: 'books' //注意，这里的 test1 是 ID，不用加 # 号
|
||
, count: data.data.total //数据总数，从服务端得到,
|
||
, curr: data.data.pageNum
|
||
, limit: data.data.pageSize
|
||
, jump: function (obj, first) {
|
||
|
||
|
||
//obj包含了当前分页的所有参数，比如：
|
||
console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
|
||
console.log(obj.limit); //得到每页显示的条数
|
||
|
||
|
||
//首次不执行
|
||
if (!first) {
|
||
search(obj.curr, obj.limit);
|
||
} else {
|
||
|
||
}
|
||
}
|
||
});
|
||
});
|
||
} else {
|
||
layer.alert(data.msg);
|
||
}
|
||
|
||
},
|
||
error: function () {
|
||
layer.alert('网络异常');
|
||
}
|
||
})
|
||
|
||
}
|
||
|
||
function showTip(touchEvent, element) {
|
||
isLongPress = true;
|
||
// 根据触摸点位置设置弹出层的位置
|
||
$('#tipLayer')
|
||
.css({
|
||
top: touchEvent.pageY - 100, // 调整这个值以改变弹出层相对于触摸点的位置
|
||
left: touchEvent.pageX - ($('#tipLayer').outerWidth() / 2)
|
||
})
|
||
.data('target', element) // 存储目标元素以便后续操作
|
||
.show();
|
||
}
|
||
|
||
function hideTip() {
|
||
isLongPress = false;
|
||
$('#tipLayer').hide().removeData('target'); // 隐藏tips并清除数据
|
||
}
|
||
|
||
|
||
function searchByAllCondition(curr, limit, newKeyword) {
|
||
var toUrl = "/book/search?curr=" + curr + "&limit=" + limit;
|
||
var ids = $("#ids").val();
|
||
if (ids) {
|
||
toUrl += ("&historyBookIds=" + ids);
|
||
}
|
||
var token = $("#token").val();
|
||
if (token) {
|
||
toUrl += ("&token=" + token);
|
||
}
|
||
var keyword = $("#keyword").val();
|
||
if (newKeyword) {
|
||
toUrl += encodeURI("&keyword=" + newKeyword);
|
||
} else if (keyword) {
|
||
toUrl += encodeURI("&keyword=" + keyword);
|
||
}
|
||
var bookStatus = $("#bookStatus").val();
|
||
if (bookStatus) {
|
||
toUrl += ("&bookStatus=" + bookStatus);
|
||
}
|
||
var catId = $("#catId").val();
|
||
if (catId) {
|
||
toUrl += ("&catId=" + catId);
|
||
}
|
||
|
||
var sortBy = $("#sortBy").val();
|
||
if (sortBy) {
|
||
toUrl += ("&sortBy=" + sortBy);
|
||
}
|
||
|
||
var sort = $("#sort").val();
|
||
if (sort) {
|
||
toUrl += ("&sort=" + sort);
|
||
}
|
||
|
||
window.location.href = toUrl;
|
||
}
|
||
|
||
function searchBooks() {
|
||
var keywords = $("#title").val();
|
||
$("#keyword").val("");
|
||
searchByAllCondition(1, 20, keywords);
|
||
}
|
||
|
||
function read(bookId,contentId){
|
||
if(isLongPress){
|
||
return false;
|
||
}
|
||
location.href = '/book/'+bookId+"/"+contentId+".html"
|
||
hideTip();
|
||
}
|
||
|
||
</script>
|
||
<script>
|
||
|
||
|
||
function removeFromBookShelf(bookId) {
|
||
|
||
$.ajax({
|
||
type: "delete",
|
||
url: "/user/removeFromBookShelf/" + bookId,
|
||
data: {},
|
||
dataType: "json",
|
||
success: function (data) {
|
||
if (data.code == 200) {
|
||
$("#shelf" + bookId).remove();
|
||
}
|
||
}
|
||
});
|
||
|
||
}
|
||
|
||
|
||
</script>
|
||
|
||
|
||
</html> |