feat(mobile): 完善移动端个人中心

2026-10-20 07:33:57 +08:00
1 parent efc589a11d
commit da02449149
@@ -8,6 +8,7 @@ import com.java2nb.novel.core.utils.IpUtil;
 import com.java2nb.novel.core.utils.RandomValidateCodeUtil;
 import com.java2nb.novel.entity.User;
 import com.java2nb.novel.entity.UserBuyRecord;
+import com.java2nb.novel.service.BookParagraphCommentService;
 import com.java2nb.novel.service.BookService;
 import com.java2nb.novel.service.UserService;
 import io.github.xxyopen.model.resp.RestResult;
@@ -39,6 +40,8 @@ public class UserController extends BaseController {

    private final BookService bookService;

+    private final BookParagraphCommentService bookParagraphCommentService;
+
    /**
     * 登录
     */
@@ -266,6 +269,19 @@ public class UserController extends BaseController {
        return RestResult.ok(bookService.listCommentByPage(userDetails.getId(), null, page, pageSize));
    }

+    /**
+     * 分页查询用户段评
+     */
+    @GetMapping("listParagraphCommentByPage")
+    public RestResult<?> listParagraphCommentByPage(@RequestParam(value = "curr", defaultValue = "1") int page,
+        @RequestParam(value = "limit", defaultValue = "10") int pageSize, HttpServletRequest request) {
+        UserDetails userDetails = getUserDetails(request);
+        if (userDetails == null) {
+            return RestResult.fail(ResponseStatus.NO_LOGIN);
+        }
+        return RestResult.ok(bookParagraphCommentService.listMyParagraphCommentByPage(userDetails.getId(), page, pageSize));
+    }
+

    /**
     * 购买小说章节
@@ -139,6 +139,22 @@ public class PageController extends BaseController {
        return ThreadLocalUtil.getTemplateDir() + "user/read_history";
    }

+    /**
+     * 我的书评页
+     */
+    @RequestMapping("user/comment.html")
+    public String userComment() {
+        return ThreadLocalUtil.getTemplateDir() + "user/comment";
+    }
+
+    /**
+     * 我的段评页
+     */
+    @RequestMapping("user/paragraph_comment.html")
+    public String userParagraphComment() {
+        return ThreadLocalUtil.getTemplateDir() + "user/paragraph_comment";
+    }
+
    /**
     * 账号设置页
     */
@@ -32,6 +32,11 @@ public interface FrontBookParagraphCommentMapper {
     */
    BookParagraphCommentVO getById(@Param("id") Long id);

+    /**
+     * 查询用户发布的全部段评（含回复，带书名/封面/章节名，按时间倒序）
+     */
+    List<BookParagraphCommentVO> listMyParagraphComment(@Param("userId") Long userId);
+
    /**
     * 顶层评论回复数+1
     */
@@ -2,6 +2,7 @@ package com.java2nb.novel.service;

 import com.java2nb.novel.entity.BookParagraphComment;
 import com.java2nb.novel.vo.BookParagraphCommentVO;
+import io.github.xxyopen.model.page.PageBean;

 import java.util.List;
 import java.util.Map;
@@ -29,4 +30,9 @@ public interface BookParagraphCommentService {
     * 新增段落评论
     */
    void addParagraphComment(Long userId, BookParagraphComment comment);
+
+    /**
+     * 分页查询我的段评（含回复，按时间倒序）
+     */
+    PageBean<BookParagraphCommentVO> listMyParagraphCommentByPage(Long userId, int page, int pageSize);
 }
@@ -1,11 +1,14 @@
 package com.java2nb.novel.service.impl;

 import com.github.houbb.sensitive.word.core.SensitiveWordHelper;
+import com.github.pagehelper.PageHelper;
 import com.java2nb.novel.core.enums.ResponseStatus;
 import com.java2nb.novel.entity.BookParagraphComment;
 import com.java2nb.novel.mapper.FrontBookParagraphCommentMapper;
 import com.java2nb.novel.service.BookParagraphCommentService;
 import com.java2nb.novel.vo.BookParagraphCommentVO;
+import io.github.xxyopen.model.page.PageBean;
+import io.github.xxyopen.model.page.builder.pagehelper.PageBuilder;
 import io.github.xxyopen.web.exception.BusinessException;
 import lombok.RequiredArgsConstructor;
 import org.apache.commons.lang3.StringUtils;
@@ -128,4 +131,10 @@ public class BookParagraphCommentServiceImpl implements BookParagraphCommentServ
        bookParagraphCommentMapper.insert(comment);
        bookParagraphCommentMapper.addReplyCount(rootId);
    }
+
+    @Override
+    public PageBean<BookParagraphCommentVO> listMyParagraphCommentByPage(Long userId, int page, int pageSize) {
+        PageHelper.startPage(page, pageSize);
+        return PageBuilder.build(bookParagraphCommentMapper.listMyParagraphComment(userId));
+    }
 }
@@ -27,6 +27,16 @@ public class BookCommentVO extends BookComment {

    private Long unLikesCount;

+    /**
+     * 所属书籍名称
+     */
+    private String bookName;
+
+    /**
+     * 所属书籍封面
+     */
+    private String picUrl;
+
    public String getCreateTimeFormat() {
        return DateUtil.formatTimeAgo(getCreateTime());
    }
@@ -36,6 +36,21 @@ public class BookParagraphCommentVO extends BookParagraphComment {
     */
    private List<BookParagraphCommentVO> replies;

+    /**
+     * 所属书籍名称
+     */
+    private String bookName;
+
+    /**
+     * 所属书籍封面
+     */
+    private String picUrl;
+
+    /**
+     * 所属章节名称
+     */
+    private String indexName;
+
    @Override
    public String toString() {
        return super.toString();
@@ -4,16 +4,18 @@
 <mapper namespace="com.java2nb.novel.mapper.FrontBookCommentMapper">

    <select id="listCommentByPage"  resultType="com.java2nb.novel.vo.BookCommentVO">
-        select t1.id,t1.book_id,t1.comment_content,t1.location,t1.reply_count,t1.create_time,t2.username create_user_name,t2.user_photo create_user_photo
+        select t1.id,t1.book_id,t1.comment_content,t1.location,t1.reply_count,t1.create_time,t2.username create_user_name,t2.user_photo create_user_photo,
+        t3.book_name,t3.pic_url
        from book_comment t1 inner join user t2 on t1.create_user_id = t2.id
-        <trim>
+        left join book t3 on t1.book_id = t3.id
+        <where>
            <if test="bookId != null">
                and t1.book_id = #{bookId}
            </if>
            <if test="userId != null">
                and t1.create_user_id = #{userId}
            </if>
-        </trim>
+        </where>
        order by t1.create_time desc

    </select>
@@ -38,6 +38,17 @@
        where id = #{id}
    </update>

+    <select id="listMyParagraphComment" resultType="com.java2nb.novel.vo.BookParagraphCommentVO">
+        select t1.id, t1.book_id, t1.book_index_id, t1.paragraph_idx, t1.root_id, t1.reply_user_name,
+               t1.reply_count, t1.comment_content, t1.location, t1.create_user_id, t1.create_time,
+               t2.book_name, t2.pic_url, t3.index_name
+        from book_paragraph_comment t1
+        left join book t2 on t1.book_id = t2.id
+        left join book_index t3 on t1.book_index_id = t3.id
+        where t1.create_user_id = #{userId}
+        order by t1.create_time desc
+    </select>
+
    <select id="countGroupByParagraph" resultType="java.util.Map">
        select paragraph_idx as idx, count(1) as num
        from book_paragraph_comment
@@ -0,0 +1,244 @@
+<!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>
+
+    <div th:include="mobile/common/css :: css"></div>
+
+    <style>
+        body {
+            background: #f5f7f6;
+        }
+
+        #commentList {
+            padding-top: 10px;
+        }
+
+        /* 书评卡片 */
+        .comment-item {
+            margin: 0 12px 10px;
+            padding: 12px;
+            background: #fff;
+            border-radius: 10px;
+            box-shadow: 0 2px 8px rgba(62, 175, 124, .08);
+            -webkit-tap-highlight-color: transparent;
+        }
+
+        .comment-item .ci-head {
+            display: -webkit-flex;
+            display: flex;
+            -webkit-align-items: center;
+            align-items: center;
+            padding-bottom: 10px;
+            border-bottom: 1px solid #f5f7f6;
+            -webkit-tap-highlight-color: transparent;
+        }
+
+        .comment-item .ci-head:active {
+            opacity: .88;
+        }
+
+        .comment-item .ci-cover {
+            -webkit-flex: 0 0 auto;
+            flex: 0 0 auto;
+            width: 36px;
+            height: 50px;
+            border-radius: 4px;
+            object-fit: cover;
+            background: #f0f2f1;
+        }
+
+        .comment-item .ci-book {
+            -webkit-flex: 1;
+            flex: 1;
+            min-width: 0;
+            margin-left: 10px;
+        }
+
+        .comment-item .ci-book-name {
+            font-size: 14px;
+            font-weight: 600;
+            color: #1f2d26;
+            line-height: 20px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+
+        .comment-item .ci-go {
+            -webkit-flex: 0 0 auto;
+            flex: 0 0 auto;
+            width: 7px;
+            height: 7px;
+            border-right: 1.5px solid #c4cec9;
+            border-top: 1.5px solid #c4cec9;
+            -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+            margin-left: 8px;
+        }
+
+        .comment-item .ci-content {
+            margin-top: 10px;
+            font-size: 14px;
+            color: #333;
+            line-height: 21px;
+            word-break: break-all;
+            white-space: pre-wrap;
+        }
+
+        .comment-item .ci-foot {
+            display: -webkit-flex;
+            display: flex;
+            -webkit-align-items: center;
+            align-items: center;
+            margin-top: 10px;
+            font-size: 12px;
+            color: #98a8a1;
+        }
+
+        .comment-item .ci-meta {
+            -webkit-flex: 1;
+            flex: 1;
+            min-width: 0;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+
+        .comment-item .ci-num {
+            -webkit-flex: 0 0 auto;
+            flex: 0 0 auto;
+            margin-left: 12px;
+            color: #8a968f;
+        }
+
+        .comment-item .ci-num.zan {
+            color: #2e8b62;
+        }
+
+        /* 空态 */
+        .empty-tip {
+            text-align: center;
+            color: #98a8a1;
+            font-size: 14px;
+            line-height: 24px;
+            padding: 60px 20px;
+        }
+
+        .empty-tip .empty-link {
+            display: inline-block;
+            margin-top: 12px;
+            padding: 6px 20px;
+            background: rgba(62, 175, 124, .1);
+            color: #2e8b62;
+            font-size: 13px;
+            border-radius: 16px;
+        }
+
+        /* 分页 */
+        .page-box {
+            text-align: center;
+            padding: 6px 12px 16px;
+        }
+    </style>
+</head>
+<body>
+<div id="body">
+
+    <div th:replace="mobile/common/header :: pageHeader('我的书评', null)"></div>
+
+    <div id="commentList"></div>
+    <div id="commentPage" class="page-box"></div>
+
+</div>
+
+<div th:replace="mobile/common/footer :: footer"></div>
+
+<div th:replace="mobile/common/js :: js"></div>
+
+<script>
+    search(1, 10);
+
+    function search(curr, limit) {
+        $.ajax({
+            type: "get",
+            url: "/user/listCommentByPage",
+            data: {'curr': curr, 'limit': limit},
+            dataType: "json",
+            success: function (data) {
+                if (data.code == 200) {
+                    renderCommentList(data.data);
+                } else if (data.code == 1001) {
+                    //未登录
+                    location.href = '/user/login.html?originUrl=' + encodeURIComponent(location.href);
+                } else {
+                    layer.alert(data.msg);
+                }
+            },
+            error: function () {
+                layer.alert('网络异常');
+            }
+        });
+    }
+
+    function renderCommentList(pageBean) {
+        var commentList = pageBean.list;
+        if (!commentList || commentList.length == 0) {
+            $("#commentList").html("<div class=\"empty-tip\">还没有发表过书评，快去写下你的阅读感悟吧~<br><a href=\"/\" class=\"empty-link\">去书城逛逛</a></div>");
+            $("#commentPage").html("");
+            return;
+        }
+        var html = "";
+        for (var i = 0; i < commentList.length; i++) {
+            html += buildCommentItem(commentList[i]);
+        }
+        $("#commentList").html(html);
+
+        layui.use('laypage', function () {
+            layui.laypage.render({
+                elem: 'commentPage'
+                , count: pageBean.total
+                , curr: pageBean.pageNum
+                , limit: pageBean.pageSize
+                , layout: ['prev', 'page', 'next']
+                , jump: function (obj, first) {
+                    if (!first) {
+                        search(obj.curr, obj.limit);
+                    }
+                }
+            });
+        });
+    }
+
+    function buildCommentItem(comment) {
+        var cover = comment.picUrl ? comment.picUrl : '/images/default.gif';
+        var bookName = comment.bookName ? comment.bookName : '书籍已下架';
+        var meta = comment.createTime + (comment.location ? ' · ' + comment.location : '');
+        return ('<div class="comment-item">' +
+            '<div class="ci-head" onclick="toBookComment(\'' + comment.bookId + '\')">' +
+            '<img class="ci-cover" src="' + cover + '" onerror="this.src=\'/images/default.gif\'" alt="">' +
+            '<div class="ci-book">' +
+            '<div class="ci-book-name">' + bookName + '</div>' +
+            '<div style="font-size:11px;color:#98a8a1;margin-top:2px;">点击查看该书评区</div>' +
+            '</div>' +
+            '<span class="ci-go"></span>' +
+            '</div>' +
+            '<div class="ci-content">' + comment.commentContent + '</div>' +
+            '<div class="ci-foot">' +
+            '<span class="ci-meta">' + meta + '</span>' +
+            '<span class="ci-num zan">赞 ' + comment.likesCount + '</span>' +
+            '<span class="ci-num">回复 ' + comment.replyCount + '</span>' +
+            '</div>' +
+            '</div>');
+    }
+
+    function toBookComment(bookId) {
+        location.href = '/book/comment-' + bookId + '.html';
+    }
+</script>
+
+</body>
+</html>
@@ -0,0 +1,268 @@
+<!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>
+
+    <div th:include="mobile/common/css :: css"></div>
+
+    <style>
+        body {
+            background: #f5f7f6;
+        }
+
+        #paraCommentList {
+            padding-top: 10px;
+        }
+
+        /* 段评卡片 */
+        .para-item {
+            margin: 0 12px 10px;
+            padding: 12px;
+            background: #fff;
+            border-radius: 10px;
+            box-shadow: 0 2px 8px rgba(62, 175, 124, .08);
+            -webkit-tap-highlight-color: transparent;
+        }
+
+        .para-item .pi-head {
+            display: -webkit-flex;
+            display: flex;
+            -webkit-align-items: center;
+            align-items: center;
+            padding-bottom: 10px;
+            border-bottom: 1px solid #f5f7f6;
+            -webkit-tap-highlight-color: transparent;
+        }
+
+        .para-item .pi-head:active {
+            opacity: .88;
+        }
+
+        .para-item .pi-cover {
+            -webkit-flex: 0 0 auto;
+            flex: 0 0 auto;
+            width: 36px;
+            height: 50px;
+            border-radius: 4px;
+            object-fit: cover;
+            background: #f0f2f1;
+        }
+
+        .para-item .pi-book {
+            -webkit-flex: 1;
+            flex: 1;
+            min-width: 0;
+            margin-left: 10px;
+        }
+
+        .para-item .pi-book-name {
+            font-size: 14px;
+            font-weight: 600;
+            color: #1f2d26;
+            line-height: 20px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+
+        .para-item .pi-index-name {
+            font-size: 11px;
+            color: #98a8a1;
+            margin-top: 2px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+
+        .para-item .pi-go {
+            -webkit-flex: 0 0 auto;
+            flex: 0 0 auto;
+            width: 7px;
+            height: 7px;
+            border-right: 1.5px solid #c4cec9;
+            border-top: 1.5px solid #c4cec9;
+            -webkit-transform: rotate(45deg);
+            transform: rotate(45deg);
+            margin-left: 8px;
+        }
+
+        .para-item .pi-content {
+            margin-top: 10px;
+            font-size: 14px;
+            color: #333;
+            line-height: 21px;
+            word-break: break-all;
+            white-space: pre-wrap;
+        }
+
+        /* 回复标记 */
+        .para-item .pi-reply-tag {
+            display: inline-block;
+            font-size: 10px;
+            line-height: 16px;
+            padding: 0 7px;
+            border-radius: 8px;
+            background: rgba(62, 175, 124, .12);
+            color: #2e8b62;
+            margin-right: 6px;
+            vertical-align: 2px;
+        }
+
+        .para-item .pi-foot {
+            display: -webkit-flex;
+            display: flex;
+            -webkit-align-items: center;
+            align-items: center;
+            margin-top: 10px;
+            font-size: 12px;
+            color: #98a8a1;
+        }
+
+        .para-item .pi-meta {
+            -webkit-flex: 1;
+            flex: 1;
+            min-width: 0;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+
+        .para-item .pi-num {
+            -webkit-flex: 0 0 auto;
+            flex: 0 0 auto;
+            margin-left: 12px;
+            color: #8a968f;
+        }
+
+        /* 空态 */
+        .empty-tip {
+            text-align: center;
+            color: #98a8a1;
+            font-size: 14px;
+            line-height: 24px;
+            padding: 60px 20px;
+        }
+
+        .empty-tip .empty-link {
+            display: inline-block;
+            margin-top: 12px;
+            padding: 6px 20px;
+            background: rgba(62, 175, 124, .1);
+            color: #2e8b62;
+            font-size: 13px;
+            border-radius: 16px;
+        }
+
+        /* 分页 */
+        .page-box {
+            text-align: center;
+            padding: 6px 12px 16px;
+        }
+    </style>
+</head>
+<body>
+<div id="body">
+
+    <div th:replace="mobile/common/header :: pageHeader('我的段评', null)"></div>
+
+    <div id="paraCommentList"></div>
+    <div id="paraCommentPage" class="page-box"></div>
+
+</div>
+
+<div th:replace="mobile/common/footer :: footer"></div>
+
+<div th:replace="mobile/common/js :: js"></div>
+
+<script>
+    search(1, 10);
+
+    function search(curr, limit) {
+        $.ajax({
+            type: "get",
+            url: "/user/listParagraphCommentByPage",
+            data: {'curr': curr, 'limit': limit},
+            dataType: "json",
+            success: function (data) {
+                if (data.code == 200) {
+                    renderParaCommentList(data.data);
+                } else if (data.code == 1001) {
+                    //未登录
+                    location.href = '/user/login.html?originUrl=' + encodeURIComponent(location.href);
+                } else {
+                    layer.alert(data.msg);
+                }
+            },
+            error: function () {
+                layer.alert('网络异常');
+            }
+        });
+    }
+
+    function renderParaCommentList(pageBean) {
+        var commentList = pageBean.list;
+        if (!commentList || commentList.length == 0) {
+            $("#paraCommentList").html("<div class=\"empty-tip\">还没有发表过段评，去章节里对感兴趣的一段话吐槽吧~<br><a href=\"/\" class=\"empty-link\">去书城逛逛</a></div>");
+            $("#paraCommentPage").html("");
+            return;
+        }
+        var html = "";
+        for (var i = 0; i < commentList.length; i++) {
+            html += buildParaCommentItem(commentList[i]);
+        }
+        $("#paraCommentList").html(html);
+
+        layui.use('laypage', function () {
+            layui.laypage.render({
+                elem: 'paraCommentPage'
+                , count: pageBean.total
+                , curr: pageBean.pageNum
+                , limit: pageBean.pageSize
+                , layout: ['prev', 'page', 'next']
+                , jump: function (obj, first) {
+                    if (!first) {
+                        search(obj.curr, obj.limit);
+                    }
+                }
+            });
+        });
+    }
+
+    function buildParaCommentItem(comment) {
+        var cover = comment.picUrl ? comment.picUrl : '/images/default.gif';
+        var bookName = comment.bookName ? comment.bookName : '书籍已下架';
+        var indexName = comment.indexName ? comment.indexName : '章节已删除';
+        // 回复（root_id!=0）带回复标记
+        var replyTag = '';
+        if (comment.rootId && comment.rootId != 0) {
+            var replyTo = comment.replyUserName ? comment.replyUserName : '某书友';
+            replyTag = '<span class="pi-reply-tag">回复 @' + replyTo + '</span>';
+        }
+        var meta = comment.createTime + (comment.location ? ' · ' + comment.location : '');
+        return ('<div class="para-item">' +
+            '<div class="pi-head" onclick="toChapter(\'' + comment.bookId + '\', \'' + comment.bookIndexId + '\')">' +
+            '<img class="pi-cover" src="' + cover + '" onerror="this.src=\'/images/default.gif\'" alt="">' +
+            '<div class="pi-book">' +
+            '<div class="pi-book-name">' + bookName + '</div>' +
+            '<div class="pi-index-name">' + indexName + '</div>' +
+            '</div>' +
+            '<span class="pi-go"></span>' +
+            '</div>' +
+            '<div class="pi-content">' + replyTag + comment.commentContent + '</div>' +
+            '<div class="pi-foot">' +
+            '<span class="pi-meta">' + meta + '</span>' +
+            (comment.replyCount > 0 ? '<span class="pi-num">回复 ' + comment.replyCount + '</span>' : '') +
+            '</div>' +
+            '</div>');
+    }
+
+    function toChapter(bookId, bookIndexId) {
+        location.href = '/book/' + bookId + '/' + bookIndexId + '.html';
+    }
+</script>
+
+</body>
+</html>
@@ -192,64 +192,34 @@

    <div class="menu-card">
    <a class="menu-item" href="/pay/index.html">
-        <span class="mi-icon">
-                <svg t="1697073258970" class="icon" viewBox="0 0 1024 1024" version="1.1"
-                     xmlns="http://www.w3.org/2000/svg" p-id="4079" width="25px" height="25px">
-                    <path d="M768 30.72 283.306667 30.72c-51.2 0-98.986667 44.373333-98.986667 98.986667l0 747.52c0 51.2 44.373333 95.573333 98.986667 95.573333l300.373333 0c0 0 71.68 0 116.053333 23.893333 3.413333 0 3.413333 3.413333 6.826667 3.413333 6.826667 0 10.24-3.413333 13.653333-6.826667 3.413333-6.826667 0-17.066667-6.826667-20.48-51.2-30.72-126.293333-30.72-129.706667-30.72L283.306667 942.08c-37.546667 0-64.853333-30.72-64.853333-64.853333L218.453333 129.706667c0-37.546667 30.72-64.853333 64.853333-64.853333l484.693333 0c37.546667 0 68.266667 30.72 68.266667 64.853333l0 747.52c0 37.546667-30.72 64.853333-68.266667 64.853333-6.826667 0-17.066667 6.826667-17.066667 17.066667s6.826667 17.066667 17.066667 17.066667c51.2 0 98.986667-44.373333 98.986667-95.573333L866.986667 129.706667C866.986667 78.506667 819.2 30.72 768 30.72z"
-                          fill="#3eaf7c" p-id="4080"></path>
-                    <path d="M604.16 102.4 443.733333 102.4c-6.826667 0-17.066667 6.826667-17.066667 17.066667S436.906667 136.533333 443.733333 136.533333l160.426667 0c6.826667 0 17.066667-6.826667 17.066667-17.066667S610.986667 102.4 604.16 102.4z"
-                          fill="#3eaf7c" p-id="4081"></path>
-                    <path d="M344.746667 307.2c-6.826667 6.826667-6.826667 17.066667 0 20.48l81.92 81.92c3.413333 3.413333 6.826667 3.413333 10.24 3.413333s6.826667 0 10.24-3.413333c6.826667-6.826667 6.826667-17.066667 0-20.48L365.226667 307.2C358.4 300.373333 351.573333 300.373333 344.746667 307.2z"
-                          fill="#3eaf7c" p-id="4082"></path>
-                    <path d="M604.16 409.6c3.413333 3.413333 6.826667 3.413333 10.24 3.413333s6.826667 0 10.24-3.413333l81.92-81.92c6.826667-6.826667 6.826667-17.066667 0-20.48s-17.066667-6.826667-20.48 0l-81.92 81.92C597.333333 395.946667 597.333333 402.773333 604.16 409.6z"
-                          fill="#3eaf7c" p-id="4083"></path>
-                    <path d="M716.8 460.8c6.826667 0 17.066667-6.826667 17.066667-17.066667s-6.826667-17.066667-17.066667-17.066667L334.506667 426.666667c-6.826667 0-17.066667 6.826667-17.066667 17.066667s6.826667 17.066667 17.066667 17.066667L512 460.8l0 105.813333L334.506667 566.613333c-6.826667 0-17.066667 6.826667-17.066667 17.066667s6.826667 17.066667 17.066667 17.066667L512 600.746667l0 139.946667c0 6.826667 6.826667 17.066667 17.066667 17.066667s17.066667-6.826667 17.066667-17.066667l0-139.946667L716.8 600.746667c6.826667 0 17.066667-6.826667 17.066667-17.066667s-6.826667-17.066667-17.066667-17.066667l-174.08 0 0-105.813333L716.8 460.8z"
-                          fill="#3eaf7c" p-id="4084"></path>
-                </svg>
-        </span>
+        <span class="mi-icon"><i class="layui-icon">&#xe65e;</i></span>
        <span class="mi-text">充值</span>
        <span class="mi-arrow"></span>
    </a>

    <a class="menu-item" href="/user/favorites.html">
-        <span class="mi-icon">
-                <svg t="1693622464904" class="icon" viewBox="0 0 1097 1024" version="1.1"
-                     xmlns="http://www.w3.org/2000/svg" p-id="3653" width="25px" height="25px">
-                    <path d="M998.58390632 852.14701166H126.84569332A41.51236 41.51236 0 0 0 85.33333332 893.65937166v62.26854a41.51236 41.51236 0 0 0 41.51236 41.51236h871.738213a41.51236 41.51236 0 0 0 41.51236-41.51236v-62.26854a41.51236 41.51236 0 0 0-41.51236-41.51236z m-29.293426 83.014048h-813.172704a8.537246 8.537246 0 0 1-8.537246-8.537246v-3.681687a8.537246 8.537246 0 0 1 8.537246-8.537247h813.172704a8.537246 8.537246 0 0 1 8.537246 8.537247v3.681687a8.537246 8.537246 0 0 1-8.537246 8.537246zM126.84569332 810.63465166h124.537079a41.51236 41.51236 0 0 0 41.51236-41.51236V229.47228566a41.51236 41.51236 0 0 0-41.51236-41.51236H126.84569332A41.51236 41.51236 0 0 0 85.33333332 229.47228566v539.650006a41.51236 41.51236 0 0 0 41.51236 41.51236zM156.72605532 246.49342066h64.883071a12.805869 12.805869 0 0 1 12.805869 12.805869v479.995998a12.805869 12.805869 0 0 1-12.805869 12.80587H156.72605532a12.805869 12.805869 0 0 1-12.80587-12.80587V259.29928966a12.805869 12.805869 0 0 1 12.80587-12.805869z m239.939305 564.141231h124.53708a41.51236 41.51236 0 0 0 41.51236-41.51236V278.62548066l291.653674 510.335237 0.266789 0.480221a41.619075 41.619075 0 0 0 56.826045 15.527116l107.932136-62.962191A42.600859 42.600859 0 0 0 1034.18422332 684.02729066L727.73976932 147.49337866l-0.266789-0.48022a41.619075 41.619075 0 0 0-56.826045-15.527116l-107.932135 62.962191V84.17902666A41.51236 41.51236 0 0 0 521.20244032 42.66666666h-124.53708a41.51236 41.51236 0 0 0-41.51236 41.51236v684.943265a41.51236 41.51236 0 0 0 41.51236 41.51236z m296.295802-597.938055a3.735045 3.735045 0 0 1 5.122348 1.376631l259.841761 454.608363a12.805869 12.805869 0 0 1-4.663471 17.415982l-56.271124 32.825712a12.805869 12.805869 0 0 1-17.544041-4.663471L624.11894332 267.59109066a12.805869 12.805869 0 0 1 4.663471-17.415983zM426.49236432 101.20016166h64.883072a12.805869 12.805869 0 0 1 12.805869 12.805869v625.289257a12.805869 12.805869 0 0 1-12.805869 12.80587h-64.883072a12.805869 12.805869 0 0 1-12.805869-12.80587V114.00603066a12.805869 12.805869 0 0 1 12.805869-12.805869z m0 0"
-                          p-id="3654" fill="#3eaf7c"></path>
-                </svg>
-        </span>
+        <span class="mi-icon"><i class="layui-icon">&#xe705;</i></span>
        <span class="mi-text">我的书架</span>
        <span class="mi-arrow"></span>
    </a>

    <a class="menu-item" href="/user/read_history.html">
-        <span class="mi-icon">
-                <svg t="1693621172669" class="icon" viewBox="0 0 1024 1024" version="1.1"
-                     xmlns="http://www.w3.org/2000/svg"
-                     p-id="1877" width="25px" height="25px">
-                    <path d="M876.8 709.12H738.56V591.36c0-15.36-10.24-25.6-25.6-25.6-15.36 0-25.6 10.24-25.6 25.6v143.36c0 15.36 10.24 25.6 25.6 25.6H876.8c15.36 0 25.6-10.24 25.6-25.6s-12.8-25.6-25.6-25.6zM705.28 463.36c-153.6 0-279.04 125.44-279.04 279.04 0 153.6 125.44 279.04 279.04 279.04 153.6 0 279.04-125.44 279.04-279.04 0-153.6-125.44-276.48-279.04-279.04z m0 506.88c-125.44 0-227.84-102.4-227.84-227.84s102.4-227.84 227.84-227.84 227.84 102.4 227.84 227.84c-2.56 128-102.4 227.84-227.84 227.84z m25.6-622.08c0-15.36-10.24-25.6-25.6-25.6h-473.6c-15.36 0-25.6 10.24-25.6 25.6 0 15.36 10.24 25.6 25.6 25.6h473.6c12.8 0 25.6-10.24 25.6-25.6z m-307.2 207.36c0-15.36-10.24-25.6-25.6-25.6h-166.4c-15.36 0-25.6 10.24-25.6 25.6s10.24 25.6 25.6 25.6h166.4c15.36 0 25.6-12.8 25.6-25.6z m-192 153.6c-15.36 0-25.6 10.24-25.6 25.6s10.24 25.6 25.6 25.6h128c15.36 0 25.6-10.24 25.6-25.6s-10.24-25.6-25.6-25.6h-128zM482.56 972.8H90.88V51.2h174.08v38.4c0 33.28 25.6 64 58.88 64 12.8 0 343.04 2.56 373.76 0 33.28 0 58.88-28.16 56.32-61.44v-38.4H928v437.76c0 15.36 10.24 25.6 25.6 25.6 15.36 0 25.6-10.24 25.6-25.6V28.16c0-15.36-10.24-25.6-25.6-25.6H728.32c-15.36 0-25.6 10.24-25.6 25.6v64c0 7.68-5.12 12.8-10.24 12.8H326.4c-7.68 0-12.8-5.12-12.8-12.8V25.6C313.6 10.24 303.36 0 288 0H65.28c-15.36 0-25.6 10.24-25.6 25.6v972.8c0 15.36 10.24 25.6 25.6 25.6h417.28c15.36 0 25.6-10.24 25.6-25.6 0-15.36-12.8-25.6-25.6-25.6zM395.52 51.2h230.4c15.36 0 25.6-10.24 25.6-25.6 0-15.36-10.24-25.6-25.6-25.6h-230.4c-15.36 0-25.6 10.24-25.6 25.6 0 15.36 12.8 25.6 25.6 25.6z"
-                          fill="#3eaf7c" p-id="1878"></path>
-                </svg>
-        </span>
+        <span class="mi-icon"><i class="layui-icon">&#xe637;</i></span>
        <span class="mi-text">阅读历史</span>
        <span class="mi-arrow"></span>
    </a>

-    <!--<a
-            href="/user/comment.html">
+    <a class="menu-item" href="/user/comment.html">
+        <span class="mi-icon"><i class="layui-icon">&#xe611;</i></span>
+        <span class="mi-text">我的书评</span>
+        <span class="mi-arrow"></span>
+    </a>

-        <blockquote class="layui-elem-quote"
-                    style="background-color:#fafafa;border-left:0px;margin-bottom: 0px;text-align: left;padding:15px 10px;color: #000;font-size: 18px">
-            <i style="font-size: 25px;padding-right: 20px;color:#3eaf7c"
-               class="layui-icon">&#xe611;
-            </i>
-            我的书评
-            <div style="float: right; margin-right: 20px"><i style="font-size: 14px;color:#666"
-                                                             class="layui-icon">&#xe602;</i>
-            </div>
-        </blockquote>
-    </a>-->
+    <a class="menu-item" href="/user/paragraph_comment.html">
+        <span class="mi-icon"><i class="layui-icon">&#xe63a;</i></span>
+        <span class="mi-text">我的段评</span>
+        <span class="mi-arrow"></span>
+    </a>


    <a class="menu-item" href="/booklist/mine.html">