mirror of
https://github.com/201206030/novel-plus.git
synced 2025-04-26 17:20:52 +00:00
feat: 手机端我的书架页面适配
This commit is contained in:
xiongxiaoyang
parent
c63b4d617e
commit
18f5fbf508
@ -115,6 +115,14 @@ public class PageController extends BaseController {
|
||||
return ThreadLocalUtil.getTemplateDir() + "user/userinfo";
|
||||
}
|
||||
|
||||
/**
|
||||
* 我的书架页
|
||||
*/
|
||||
@RequestMapping("user/favorites.html")
|
||||
public String favorites() {
|
||||
return ThreadLocalUtil.getTemplateDir() + "user/favorites";
|
||||
}
|
||||
|
||||
/**
|
||||
* 作品页
|
||||
*/
|
||||
|
||||
@ -4,6 +4,7 @@ import com.fasterxml.jackson.annotation.JsonFormat;
|
||||
import com.java2nb.novel.entity.UserBookshelf;
|
||||
import lombok.Data;
|
||||
|
||||
import javax.annotation.Generated;
|
||||
import java.util.Date;
|
||||
|
||||
/**
|
||||
@ -19,9 +20,19 @@ public class BookShelfVO extends UserBookshelf {
|
||||
private String lastIndexName;
|
||||
private String bookName;
|
||||
|
||||
@JsonFormat(timezone = "GMT+8", pattern = "MM/dd HH:mm:ss")
|
||||
|
||||
private String picUrl;
|
||||
|
||||
private Long authorId;
|
||||
|
||||
private String authorName;
|
||||
|
||||
private String bookDesc;
|
||||
|
||||
private Date lastIndexUpdateTime;
|
||||
|
||||
private Byte bookStatus;
|
||||
|
||||
|
||||
@Override
|
||||
public String toString() {
|
||||
|
||||
@ -4,7 +4,8 @@
|
||||
<mapper namespace="com.java2nb.novel.mapper.FrontUserBookshelfMapper">
|
||||
|
||||
<select id="listBookShelf" parameterType="long" resultType="com.java2nb.novel.vo.BookShelfVO">
|
||||
select t1.book_id,t1.pre_content_id,t2.book_name,t2.cat_id,t2.cat_name,t2.last_index_id,t2.last_index_name,t2.last_index_update_time
|
||||
select t1.book_id,t1.pre_content_id,t2.book_name,t2.cat_id,t2.cat_name,t2.last_index_id,t2.last_index_name,t2.last_index_update_time,
|
||||
t2.pic_url,t2.author_id,t2.author_name,t2.book_desc,t2.book_status
|
||||
from user_bookshelf t1 inner join book t2 on t1.book_id = t2.id and t1.user_id = #{userId}
|
||||
order by t1.create_time desc
|
||||
|
||||
|
||||
@ -0,0 +1,268 @@
|
||||
<!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">
|
||||
|
||||
|
||||
.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;
|
||||
}
|
||||
</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="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>
|
||||
$("#body").css("min-height",($(window).height() - 110)+"px")
|
||||
|
||||
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 class=\"layui-row\" style=\"margin-bottom:10px;padding:10px;background: #f2f2f2\">\n" +
|
||||
" <a href='/book/"+book.bookId+"/"+book.preContentId+".html'>\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" +
|
||||
"\n" +
|
||||
" </div>\n" +
|
||||
" </a>\n" +
|
||||
" <div style=\"padding: 10px\" class=\"layui-col-xs6 layui-col-sm8 layui-col-md8 layui-col-lg8\">\n" +
|
||||
" <a href='/book/"+book.bookId+"/"+book.preContentId+".html'>\n" +
|
||||
" <div class=\"line-limit-length\" style=\";color: #000;font-size: 15px\">"+book.bookName+"</div>\n" +
|
||||
" </a>\n" +
|
||||
" <div style=\";color: #4c6978;float: right;\"><i style=\"color: red\"></i></div>\n" +
|
||||
" <a href='/book/"+book.bookId+"/"+book.preContentId+".html'>\n" +
|
||||
" <div style=\";color: #a6a6a6;\" class=\"line-limit-length\">作者："+book.authorName+"</div>\n" +
|
||||
" </a>\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);
|
||||
|
||||
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 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);
|
||||
}
|
||||
|
||||
</script>
|
||||
<script>
|
||||
|
||||
|
||||
|
||||
|
||||
function toMyCollect() {
|
||||
var token = localStorage.getItem("token");
|
||||
if (token) {
|
||||
window.location.href = "/book/search?token=" + token;
|
||||
} else {
|
||||
window.location.href = "/user/login.html";
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
</html>
|
||||
@ -62,7 +62,7 @@
|
||||
<div th:replace="mobile/common/js :: js">
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$("#form1").css("height",($(window).height() - 140)+"px")
|
||||
$("#form1").css("min-height",($(window).height() - 140)+"px")
|
||||
if(localStorage.getItem("autoLogin")==1){
|
||||
$("#autoLogin").prop("checked",'true');
|
||||
layui.form.render('checkbox','loginForm');
|
||||
|
||||
@ -68,7 +68,7 @@
|
||||
<div th:replace="mobile/common/js :: js">
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$("#form1").css("height",($(window).height() - 140)+"px")
|
||||
$("#form1").css("min-height",($(window).height() - 140)+"px")
|
||||
$("#chkd").click();
|
||||
|
||||
$("#btnRegister").click(function () {
|
||||
|
||||
@ -160,7 +160,7 @@
|
||||
|
||||
|
||||
<script>
|
||||
$("#body").css("height",($(window).height() - 50)+"px")
|
||||
$("#body").css("min-height",($(window).height() - 50)+"px")
|
||||
|
||||
//查询用户信息
|
||||
$.ajax({
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user