Forráskód Böngészése

优化小说阅读器插件功能,新增章节解锁状态和阅读历史记录功能,重构书籍详情跳转逻辑,改进书架和书籍列表页面的用户交互,修复样式问题,提升用户体验。

yangwenlan 1 éve
szülő
commit
3c10e39f7e

+ 15 - 0
api/api.js

@@ -80,3 +80,18 @@ export const addBookshelf = (data) => {
 export const removeBookshelf = (data) => {
     return requestAll('/user/bookshelf', data, 'DELETE', addTokenToHeader())
 }
+
+// /user/chapter/unlock-status 获取章节解锁状态
+export const getChapterUnlockStatus = (data) => {
+    return requestAll('/user/chapter/unlock-status', data, 'GET', addTokenToHeader())
+}
+
+// /user/browsing-history 新增用户阅读历史
+export const addBrowsingHistory = (data) => {
+    return requestAll('/user/browsing-history', data, 'POST', addTokenToHeader())
+}
+
+// 获取阅读记录
+export const getBrowsingHistory = () => {
+    return requestAll('/user/browsing-history', {}, 'GET', addTokenToHeader())
+}

+ 56 - 24
app.js

@@ -1,7 +1,7 @@
 // app.js
 // 引入阅读器插件
 const novelPlugin = requirePlugin('novel-plugin')
-import { userLogin } from './api/api'
+import { userLogin,getChapterUnlockStatus,getNovelDetail,addBrowsingHistory } from './api/api'
 
 App({
   onLaunch() {
@@ -71,31 +71,59 @@ App({
 })
 
 // 插件初始化回调
-function onNovelPluginLoad(data) {
+async function onNovelPluginLoad(data) {
   // data.id - 阅读器实例 id,每个插件页对应一个阅读器实例
   const novelManager = novelPlugin.getNovelManager(data.id)
-  
-  // 设置目录状态(这里先模拟三章内容,实际应该根据后端数据设置)
-  novelManager.setContents({
-    contents: [
-      {
-        index: 0, // 第一章
-        status: 0, // 免费
-      },
-      {
-        index: 1, // 第二章
-        status: 2, // 未解锁
-      },
-      {
-        index: 2, // 第三章
-        status: 1, // 已解锁
-      }
-    ],
-  })
 
-  function startRead() {
-    console.log('开始阅读');
-    //通报下后端
+
+  let pluginInfo = novelManager.getPluginInfo();
+
+  let innerBookId = pluginInfo.query?.innerBookId;
+  console.log("innerBookId",innerBookId);
+
+  let unlockStatus = await getChapterUnlockStatus({
+    novelId: innerBookId
+  });
+
+  let bookDetail = await getNovelDetail(innerBookId);
+
+  console.log("bookDetail",bookDetail);
+
+  // 设置目录状态(根据unlockStatus数据设置章节状态)
+  if (unlockStatus && Array.isArray(unlockStatus.status)) {
+    // 将unlockStatus.status数组转换为目录状态格式
+    const contents = unlockStatus.status.map((isUnlocked, index) => {
+      return {
+        index: index, // 章节索引
+        status: isUnlocked ? 1 : 2, // true为已解锁(1),false为未解锁(2)
+      };
+    });
+    
+    // 设置第一章为免费(0)状态,如果有其他免费章节也可以在这里设置
+    if (contents.length > 0) {
+      contents[0].status = 0;
+    }
+    
+    // 设置目录状态
+    novelManager.setContents({
+      contents: contents,
+    });
+  }
+
+  function startRead(res) {
+    console.log('开始阅读',res);
+    updateBrowsingHistory(res);
+  }
+
+  function updateBrowsingHistory(res) {
+    let params = {
+      novelAuthor: bookDetail.author,
+      novelCover: bookDetail.cover,
+      novelId: bookDetail.id,
+      novelTitle: bookDetail.title,
+      status: bookDetail.status
+    }
+    addBrowsingHistory(params);
   }
 
   // 监听用户行为事件
@@ -107,7 +135,10 @@ function onNovelPluginLoad(data) {
     switch(event_id) {
       case 'start_read': // 开始阅读
         console.log('开始阅读章节:', res.chapter_id);
-        startRead();
+        break;
+
+      case 'click_startread': // 点击开始阅读
+        startRead(res);
         break;
       
       case 'leave_readpage': // 离开阅读页
@@ -119,6 +150,7 @@ function onNovelPluginLoad(data) {
         break;
       
       case 'get_chapter': // 获取章节数据
+        console.log("get_chapter",res);
         console.log('章节状态:', res.pay_status);
         break;
       

+ 15 - 4
pages/book/list.js

@@ -1,4 +1,6 @@
 import { getCardNovelsMore } from '../../api/api'
+import { goToBookDetail } from '../../utils/util'
+
 
 Page({
   data: {
@@ -45,10 +47,19 @@ Page({
 
   // 点击书籍项
   onBookTap(e) {
-    const { id } = e.currentTarget.dataset
-    wx.navigateTo({
-      url: `/pages/book/detail?id=${id}`
-    })
+    const bookId = e.currentTarget.dataset.bookId;
+    const wxBookId = e.currentTarget.dataset.wxBookId;
+    const chapterId = e.currentTarget.dataset.chapterId;
+
+    console.log('bookId',bookId);
+    console.log('wxBookId',wxBookId);
+    console.log('chapterId',chapterId);
+    
+    goToBookDetail({
+      bookId,
+      wxBookId,
+      chapterId
+    });
   },
 
   // 返回上一页

+ 15 - 13
pages/book/list.wxml

@@ -7,31 +7,33 @@
         <view class="icon-back-arrow"></view>
       </view>
     </view>
-    <text class="title">{{pageTitle}}</text>
+    <text class="title">{{ pageTitle }}</text>
   </view>
 
   <!-- 书籍列表 -->
   <scroll-view class="book-list" scroll-y>
-    <block wx:for="{{bookList.novelList}}" wx:key="id">
-      <view class="book-item" bindtap="onBookTap" data-id="{{item.id}}">
-        <image class="book-cover" src="{{item.cover}}" mode="aspectFill" />
+    <block wx:for="{{ bookList.novelList }}" wx:key="id">
+      <view
+        class="book-item"
+        bindtap="onBookTap"
+        data-book-id="{{ item.id }}"
+        data-wx-book-id="{{ item.wxBookId }}"
+        data-chapter-id="{{ item.chapterId }}"
+      >
+        <image class="book-cover" src="{{ item.cover }}" mode="aspectFill" />
         <view class="book-info">
-          <view>
-            <text class="book-title">{{item.title}}</text>
-            <text class="book-author">{{item.author}}</text>
-            <text class="book-desc">{{item.brief}}</text>
-          </view>
+          <text class="book-title">{{ item.title }}</text>
+          <text class="book-desc">{{ item.brief }}</text>
           <view class="book-stats">
-            <text>{{item.readingNumber}}人在读</text>
-            <text class="book-category" wx:if="{{item.categoryNameLevel2}}">{{item.categoryNameLevel2}}</text>
+            <text>{{ item.readingNumber }}人在读</text>
           </view>
         </view>
       </view>
     </block>
 
     <!-- 加载状态 -->
-    <view class="loading" wx:if="{{loading}}">
+    <view class="loading" wx:if="{{ loading }}">
       <text>加载中...</text>
     </view>
   </scroll-view>
-</view> 
+</view>

+ 1 - 1
pages/book/list.wxss

@@ -11,7 +11,7 @@
   padding: 30rpx;
   display: flex;
   position: relative;
-  align-item: flex-start;
+  align-items: flex-start;
   justify-content: flex-start;
   width: 90vw;
 }

+ 20 - 3
pages/bookshelf/bookshelf.js

@@ -1,4 +1,4 @@
-import { getBookshelfList } from '../../api/api'
+import { getBookshelfList, getBrowsingHistory } from '../../api/api'
 
 Page({
   data: {
@@ -41,7 +41,16 @@ Page({
     this.setData({ loading: true })
 
     try {
-      const result = await getBookshelfList()
+      let result = [];
+      
+      // 根据当前激活的标签页加载不同的数据
+      if (this.data.activeTab === 'history') {
+        // 加载阅读历史记录
+        result = await getBrowsingHistory();
+      } else {
+        // 加载书架列表
+        result = await getBookshelfList();
+      }
       
       if (Array.isArray(result)) {
         this.setData({
@@ -56,7 +65,7 @@ Page({
         })
       }
     } catch (error) {
-      console.error('加载书架失败:', error)
+      console.error('加载数据失败:', error)
       this.setData({ 
         loading: false,
         hasMore: false
@@ -73,5 +82,13 @@ Page({
     if (this.data.hasMore) {
       this.loadBookList()
     }
+  },
+  
+  // 跳转到书籍详情
+  goToBookDetail(e) {
+    const book = e.currentTarget.dataset.book;
+    wx.navigateTo({
+      url: `/pages/plugins/novel-plugin/index?innerBookId=${book.novelId}`
+    });
   }
 })

+ 6 - 4
pages/bookshelf/bookshelf.wxml

@@ -13,13 +13,14 @@
   <!-- 书籍列表 -->
   <scroll-view scroll-y class="book-list" bindscrolltolower="loadMore">
     <view class="book-grid">
-      <view class="book-item" wx:for="{{bookList}}" wx:key="id">
+      <view class="book-item" wx:for="{{bookList}}" wx:key="id" bindtap="goToBookDetail" data-book="{{item}}">
         <view class="book-cover-wrap">
           <image class="book-cover" src="{{item.novelCover}}" mode="aspectFill"/>
-          <text class="read-status">读过</text>
+          <text class="read-status" wx:if="{{activeTab === 'history'}}">读过</text>
         </view>
         <text class="book-title">{{item.novelTitle}}</text>
-        <text class="latest-chapter">{{item.novelChapterTitle}}</text>
+        <text class="latest-chapter" wx:if="{{item.novelChapterTitle}}">{{item.novelChapterTitle}}</text>
+        
       </view>
     </view>
     
@@ -35,7 +36,8 @@
     
     <!-- 空状态 -->
     <view class="empty" wx:if="{{!loading && bookList.length === 0}}">
-      <text>暂无阅读记录</text>
+      <text wx:if="{{activeTab === 'history'}}">暂无阅读记录</text>
+      <text wx:else>暂无收藏书籍</text>
     </view>
   </scroll-view>
 </view>

+ 9 - 6
pages/index/index.js

@@ -163,18 +163,21 @@ Page({
     
     switch(feature) {
       case 'recent':
-        wx.navigateTo({
-          url: '/pages/read/recent'
+        // 修改为跳转到书架页面的阅读历史标签
+        wx.switchTab({
+          url: '/pages/bookshelf/bookshelf'
         });
         break;
       case 'user':
-        wx.navigateTo({
-          url: '/pages/user/center'
+        // 修改为跳转到我的页面
+        wx.switchTab({
+          url: '/pages/mine/mine'
         });
         break;
       case 'category':
-        wx.navigateTo({
-          url: '/pages/category/hot'
+        // 修改为跳转到分类页面
+        wx.switchTab({
+          url: '/pages/category/category'
         });
         break;
       case 'hot':

+ 3 - 1
pages/index/index.wxml

@@ -36,7 +36,9 @@
         circular="true"
         class="banner-swiper">
         <swiper-item wx:for="{{bannerList}}" wx:key="id">
-          <image src="{{item.cover}}" mode="aspectFill" bindtap="onBannerTap" data-item="{{item}}"/>
+          <image src="{{item.cover}}" mode="aspectFill" bindtap="goToBookDetail"  data-book-id="{{ item.id }}"
+          data-wx-book-id="{{ item.wxBookId }}"
+          data-chapter-id="{{ item.chapterId }}" />
         </swiper-item>
       </swiper>
     </view>