Enhance mini program environment configuration and chapter loading logic

- Introduced a debugging environment configuration in app.js, allowing for dynamic API endpoint selection based on the environment. - Implemented lazy loading for chapter parts in chapters.js, improving performance by only fetching necessary data. - Updated UI elements in chapters.wxml to reflect changes in chapter loading and added loading indicators. - Enhanced error handling and data management for chapter retrieval, ensuring a smoother user experience. - Added functionality for switching API environments in settings.js, visible only in development mode.
2026-03-14 18:04:05 +08:00
parent 1edceda4db
commit d82ef6d8e4
22 changed files with 1184 additions and 899 deletions
--- a/miniprogram/pages/chapters/chapters.js
+++ b/miniprogram/pages/chapters/chapters.js
@@ -19,13 +19,19 @@ Page({
    isVip: false,
    purchasedSections: [],
    
-    // 书籍数据：以后台内容管理为准，仅用接口 /api/miniprogram/book/all-chapters 返回的数据
+    // 懒加载：篇章列表（不含章节详情），展开时再请求 chapters-by-part
    totalSections: 0,
    bookData: [],
    
-    // 展开状态：默认不展开任何篇章，直接显示目录
+    // 展开状态
    expandedPart: null,
    
+    // 已加载的篇章章节缓存 { partId: chapters }
+    _loadedChapters: {},
+    
+    // 固定模块 id -> mid（序言/尾声/附录，供 goToRead 传 mid）
+    fixedSectionsMap: {},
+    
    // 附录
    appendixList: [
      { id: 'appendix-1', title: '附录1｜Soul派对房精选对话' },
@@ -33,7 +39,7 @@ Page({
      { id: 'appendix-3', title: '附录3｜本书提到的工具和资源' }
    ],

-    // 每日新增章节
+    // 每日新增章节（懒加载后暂无，可后续用 latest-chapters 补充）
    dailyChapters: []
  },

@@ -45,73 +51,71 @@ Page({
    })
    this.updateUserStatus()
    this.loadVipStatus()
-    this.loadChaptersOnce()
+    this.loadParts()
  },

-  // 固定模块（序言、尾声、附录）不参与中间篇章
-  _isFixedPart(pt) {
-    if (!pt) return false
-    const p = String(pt).toLowerCase().replace(/[_\s｜|]/g, '')
-    return p.includes('序言') || p.includes('尾声') || p.includes('附录')
-  },
-
-  // 一次请求拉取全量目录，以后台内容管理为准；同时更新 totalSections / bookData / dailyChapters
-  async loadChaptersOnce() {
+  // 懒加载：仅拉取篇章列表 + totalSections + fixedSections
+  async loadParts() {
    try {
-      const res = await app.request({ url: '/api/miniprogram/book/all-chapters', silent: true })
-      const rows = (res && res.data) || (res && res.chapters) || []
-
-      // 无数据时清空目录，避免展示旧数据
-      if (rows.length === 0) {
-        app.globalData.bookData = []
-        wx.setStorageSync('bookData', [])
-        this.setData({
-          bookData: [],
-          totalSections: 0,
-          dailyChapters: [],
-          expandedPart: null
-        })
+      const res = await app.request({ url: '/api/miniprogram/book/parts', silent: true })
+      if (!res?.success) {
+        this.setData({ bookData: [], totalSections: 0 })
        return
      }
-
-      const totalSections = res.total ?? rows.length
-      app.globalData.bookData = rows
-      wx.setStorageSync('bookData', rows)
-
-      // bookData：过滤序言/尾声/附录，按 part 聚合，篇章顺序按 sort_order 与后台一致（含「2026每日派对干货」等）
-      const filtered = rows.filter(r => !this._isFixedPart(r.partTitle || r.part_title))
-      const partMap = new Map()
+      const parts = res.parts || []
+      const totalSections = res.totalSections ?? 0
+      const fixedSections = res.fixedSections || []
      const numbers = ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二']
-      filtered.forEach((r) => {
-        const pid = r.partId || r.part_id || 'part-1'
+      const fixedMap = {}
+      fixedSections.forEach(f => { fixedMap[f.id] = f.mid })
+      const appendixList = [
+        { id: 'appendix-1', title: '附录1｜Soul派对房精选对话', mid: fixedMap['appendix-1'] },
+        { id: 'appendix-2', title: '附录2｜创业者自检清单', mid: fixedMap['appendix-2'] },
+        { id: 'appendix-3', title: '附录3｜本书提到的工具和资源', mid: fixedMap['appendix-3'] }
+      ]
+      const bookData = parts.map((p, idx) => ({
+        id: p.id,
+        number: numbers[idx] || String(idx + 1),
+        title: p.title,
+        subtitle: p.subtitle || '',
+        chapterCount: p.chapterCount || 0,
+        chapters: [] // 展开时懒加载
+      }))
+      app.globalData.totalSections = totalSections
+      this.setData({
+        bookData,
+        totalSections,
+        fixedSectionsMap: fixedMap,
+        appendixList,
+        _loadedChapters: {}
+      })
+    } catch (e) {
+      console.log('[Chapters] 加载篇章失败:', e)
+      this.setData({ bookData: [], totalSections: 0 })
+    }
+  },
+
+  // 展开时懒加载该篇章的章节（含 mid，供阅读页 by-mid 请求）
+  async loadChaptersByPart(partId) {
+    if (this.data._loadedChapters[partId]) return
+    try {
+      const res = await app.request({
+        url: `/api/miniprogram/book/chapters-by-part?partId=${encodeURIComponent(partId)}`,
+        silent: true
+      })
+      const rows = (res && res.data) || []
+      const chMap = new Map()
+      rows.forEach(r => {
        const cid = r.chapterId || r.chapter_id || 'chapter-1'
-        const sortOrder = r.sectionOrder ?? r.sort_order ?? 999999
-        if (!partMap.has(pid)) {
-          const partIdx = partMap.size
-          partMap.set(pid, {
-            id: pid,
-            number: numbers[partIdx] || String(partIdx + 1),
-            title: r.partTitle || r.part_title || '未分类',
-            subtitle: r.chapterTitle || r.chapter_title || '',
-            chapters: new Map(),
-            minSortOrder: sortOrder
-          })
-        }
-        const part = partMap.get(pid)
-        if (sortOrder < part.minSortOrder) part.minSortOrder = sortOrder
-        if (!part.chapters.has(cid)) {
-          part.chapters.set(cid, {
+        if (!chMap.has(cid)) {
+          chMap.set(cid, {
            id: cid,
            title: r.chapterTitle || r.chapter_title || '未分类',
            sections: []
          })
        }
-        const ch = part.chapters.get(cid)
-        const isPremium =
-          r.editionPremium === true ||
-          r.edition_premium === true ||
-          r.edition_premium === 1 ||
-          r.edition_premium === '1'
+        const ch = chMap.get(cid)
+        const isPremium = r.editionPremium === true || r.edition_premium === true || r.edition_premium === 1 || r.edition_premium === '1'
        ch.sections.push({
          id: r.id,
          mid: r.mid ?? r.MID ?? 0,
@@ -122,46 +126,27 @@ Page({
          isPremium
        })
      })
-      const partList = Array.from(partMap.values())
-      partList.sort((a, b) => (a.minSortOrder ?? 999999) - (b.minSortOrder ?? 999999))
-      const bookData = partList.map((p, idx) => ({
-        id: p.id,
-        number: numbers[idx] || String(idx + 1),
-        title: p.title,
-        subtitle: p.subtitle,
-        chapters: Array.from(p.chapters.values())
-      }))
-
-      const baseSort = 62
-      const daily = rows
-        .filter(r => (r.sectionOrder ?? r.sort_order ?? 0) > baseSort)
-        .sort((a, b) => new Date(b.updatedAt || b.updated_at || 0) - new Date(a.updatedAt || a.updated_at || 0))
-        .slice(0, 20)
-        .map(c => {
-          const d = new Date(c.updatedAt || c.updated_at || Date.now())
-          return {
-            id: c.id,
-            mid: c.mid ?? c.MID ?? 0,
-            title: c.section_title || c.title || c.sectionTitle,
-            price: c.price ?? 1,
-            dateStr: `${d.getMonth() + 1}/${d.getDate()}`
-          }
-        })
-
-      this.setData({
-        bookData,
-        totalSections,
-        dailyChapters: daily,
-        expandedPart: this.data.expandedPart
+      const chapters = Array.from(chMap.values())
+      const loaded = { ...this.data._loadedChapters, [partId]: chapters }
+      const bookData = this.data.bookData.map(p =>
+        p.id === partId ? { ...p, chapters } : p
+      )
+      const bookDataFlat = app.globalData.bookData || []
+      rows.forEach(r => {
+        const idx = bookDataFlat.findIndex(c => c.id === r.id)
+        if (idx >= 0) bookDataFlat[idx] = { ...bookDataFlat[idx], ...r }
+        else bookDataFlat.push(r)
      })
+      app.globalData.bookData = bookDataFlat
+      wx.setStorageSync('bookData', bookDataFlat)
+      this.setData({ bookData, _loadedChapters: loaded })
    } catch (e) {
-      console.log('[Chapters] 加载目录失败:', e)
-      this.setData({ bookData: [], totalSections: 0 })
+      console.log('[Chapters] 加载章节失败:', e)
    }
  },

  onPullDownRefresh() {
-    this.loadChaptersOnce().then(() => wx.stopPullDownRefresh()).catch(() => wx.stopPullDownRefresh())
+    this.loadParts().then(() => wx.stopPullDownRefresh()).catch(() => wx.stopPullDownRefresh())
  },

  onShow() {
@@ -204,12 +189,14 @@ Page({
    this.setData({ isLoggedIn, hasFullBook, purchasedSections, isVip })
  },

-  // 切换展开状态
-  togglePart(e) {
+  // 切换展开状态，展开时懒加载该篇章章节
+  async togglePart(e) {
    const partId = e.currentTarget.dataset.id
+    const isExpanding = this.data.expandedPart !== partId
    this.setData({
-      expandedPart: this.data.expandedPart === partId ? null : partId
+      expandedPart: isExpanding ? partId : null
    })
+    if (isExpanding) await this.loadChaptersByPart(partId)
  },

  // 跳转到阅读页（优先传 mid，与分享逻辑一致）
--- a/miniprogram/pages/chapters/chapters.wxml
+++ b/miniprogram/pages/chapters/chapters.wxml
@@ -34,8 +34,8 @@

  <!-- 目录内容 -->
  <view class="chapters-content">
-    <!-- 序言 -->
-    <view class="chapter-item" bindtap="goToRead" data-id="preface">
+    <!-- 序言（优先传 mid，阅读页用 by-mid 请求） -->
+    <view class="chapter-item" bindtap="goToRead" data-id="preface" data-mid="{{fixedSectionsMap.preface}}">
      <view class="item-left">
        <view class="item-icon icon-brand">📖</view>
        <text class="item-title">序言｜为什么我每天早上6点在Soul开播?</text>
@@ -59,14 +59,15 @@
            </view>
          </view>
          <view class="part-right">
-            <text class="part-count">{{item.chapters.length}}章</text>
+            <text class="part-count">{{item.chapters.length || item.chapterCount}}章</text>
            <text class="part-arrow {{expandedPart === item.id ? 'arrow-down' : ''}}">→</text>
          </view>
        </view>

-        <!-- 章节列表 - 展开时显示 -->
+        <!-- 章节列表 - 展开时显示，懒加载 -->
        <block wx:if="{{expandedPart === item.id}}">
          <view class="chapters-list">
+            <view wx:if="{{item.chapters.length === 0}}" class="chapters-loading">加载中...</view>
            <block wx:for="{{item.chapters}}" wx:key="id" wx:for-item="chapter">
              <view class="chapter-header">{{chapter.title}}</view>
              <view class="section-list">
@@ -92,8 +93,8 @@
      </view>
    </view>

-    <!-- 尾声 -->
-    <view class="chapter-item" bindtap="goToRead" data-id="epilogue">
+    <!-- 尾声（优先传 mid） -->
+    <view class="chapter-item" bindtap="goToRead" data-id="epilogue" data-mid="{{fixedSectionsMap.epilogue}}">
      <view class="item-left">
        <view class="item-icon icon-brand">📖</view>
        <text class="item-title">尾声｜这本书的真实目的</text>
@@ -114,6 +115,7 @@
          wx:key="id"
          bindtap="goToRead"
          data-id="{{item.id}}"
+          data-mid="{{item.mid}}"
        >
          <text class="appendix-text">{{item.title}}</text>
          <text class="appendix-arrow">→</text>
--- a/miniprogram/pages/chapters/chapters.wxss
+++ b/miniprogram/pages/chapters/chapters.wxss
@@ -339,6 +339,12 @@
  margin-left: 16rpx;
 }

+.chapters-loading {
+  padding: 24rpx;
+  font-size: 26rpx;
+  color: rgba(255, 255, 255, 0.5);
+}
+
 .chapter-group {
  background: rgba(28, 28, 30, 0.5);
  border-radius: 16rpx;