feat: migrate static pages to native tabbar

2026-04-23 21:25:24 +08:00
parent f3cd0c3a98
commit cd30f57f2c
116 changed files with 7143 additions and 311 deletions
--- a/packages/mingli/pages/bazi/index.js
+++ b/packages/mingli/pages/bazi/index.js
@@ -0,0 +1,52 @@
+const { resolveScene } = require('../../../../utils/static-ux/shared')
+const { ROUTES, openStaticRoute } = require('../../../../utils/static-ux/route-map')
+
+function createMingliBaziPageData(rawScene) {
+  const scene = resolveScene(rawScene, ['default', 'result'], 'default')
+
+  return {
+    title: '八字排盘',
+    scene,
+    form: {
+      name: '张三',
+      gender: '男',
+      birthDate: '1990-01-01',
+      birthTime: '08:30'
+    },
+    result:
+      scene === 'result'
+        ? {
+            headline: '学习型排盘结果',
+            subline: '以静态四柱结果承接旧页面的结果层级，不迁移旧排盘引擎。',
+            pillars: [
+              { key: 'year', label: '年柱', value: '庚午' },
+              { key: 'month', label: '月柱', value: '戊寅' },
+              { key: 'day', label: '日柱', value: '甲辰' },
+              { key: 'time', label: '时柱', value: '丁卯' }
+            ]
+          }
+        : null,
+    primaryActionText: scene === 'result' ? '重新排盘' : '开始排盘',
+    secondaryActionText: '命理解读'
+  }
+}
+
+Page({
+  data: createMingliBaziPageData('default'),
+
+  onLoad(options) {
+    this.setData(createMingliBaziPageData(options.scene))
+  },
+
+  handlePrimaryTap() {
+    this.setData(createMingliBaziPageData(this.data.scene === 'result' ? 'default' : 'result'))
+  },
+
+  handleSecondaryTap() {
+    openStaticRoute(`${ROUTES.mingli.interpret}?scene=result`, wx)
+  }
+})
+
+module.exports = {
+  createMingliBaziPageData
+}
--- a/packages/mingli/pages/bazi/index.json
+++ b/packages/mingli/pages/bazi/index.json
@@ -0,0 +1,5 @@
+{
+  "navigationBarTitleText": "八字排盘",
+  "navigationBarBackgroundColor": "#f8f0ee",
+  "navigationBarTextStyle": "black"
+}
--- a/packages/mingli/pages/bazi/index.wxml
+++ b/packages/mingli/pages/bazi/index.wxml
@@ -0,0 +1,63 @@
+<view class="bazi-page">
+  <view class="hero-card">
+    <text class="hero-card__eyebrow">命理练习台</text>
+    <text class="hero-card__title">{{title}}</text>
+    <text class="hero-card__desc">
+      排盘页当前只保留输入层级、四柱结果和跳转关系，并把阅读节奏整体放大。
+    </text>
+    <view class="hero-card__meta">
+      <text class="hero-card__meta-item">静态录入</text>
+      <text class="hero-card__meta-item">四柱结果</text>
+      <text class="hero-card__meta-item">命理解读</text>
+    </view>
+  </view>
+
+  <view class="form-card">
+    <view class="panel-header">
+      <text class="panel-header__title">基础信息</text>
+      <text class="panel-header__desc">保留排盘必需字段，用更大的信息卡呈现当前静态示例。</text>
+    </view>
+    <view class="field-row">
+      <view class="field-block">
+        <text class="field-block__label">姓名</text>
+        <view class="field-block__value">{{form.name}}</view>
+      </view>
+      <view class="field-block">
+        <text class="field-block__label">性别</text>
+        <view class="field-block__value">{{form.gender}}</view>
+      </view>
+    </view>
+    <view class="field-row">
+      <view class="field-block">
+        <text class="field-block__label">出生日期</text>
+        <view class="field-block__value">{{form.birthDate}}</view>
+      </view>
+      <view class="field-block">
+        <text class="field-block__label">出生时间</text>
+        <view class="field-block__value">{{form.birthTime}}</view>
+      </view>
+    </view>
+    <view class="action-group">
+      <view class="action-button" bindtap="handlePrimaryTap">{{primaryActionText}}</view>
+      <view class="action-button action-button--ghost" bindtap="handleSecondaryTap">
+        {{secondaryActionText}}
+      </view>
+    </view>
+  </view>
+
+  <view wx:if="{{result}}" class="result-card">
+    <view class="panel-header panel-header--result">
+      <text class="panel-header__title">{{result.headline}}</text>
+      <text class="panel-header__desc">{{result.subline}}</text>
+    </view>
+    <view class="result-card__grid">
+      <view class="pillar-card" wx:for="{{result.pillars}}" wx:key="key">
+        <view class="pillar-card__inner">
+          <text class="pillar-card__label">{{item.label}}</text>
+          <text class="pillar-card__value">{{item.value}}</text>
+        </view>
+      </view>
+    </view>
+    <text class="result-card__hint">结果区保留静态展示，可继续进入命理解读页查看后续层级。</text>
+  </view>
+</view>
--- a/packages/mingli/pages/bazi/index.wxss
+++ b/packages/mingli/pages/bazi/index.wxss
@@ -0,0 +1,194 @@
+page {
+  min-height: 100%;
+  background: linear-gradient(180deg, #f9f7f5 0%, #f3ebe8 100%);
+}
+
+.bazi-page {
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding: 36rpx 24rpx 96rpx;
+}
+
+.hero-card,
+.form-card,
+.result-card {
+  margin-top: 22rpx;
+  padding: 34rpx 28rpx;
+  border: 1rpx solid rgba(139, 59, 49, 0.08);
+  border-radius: 32rpx;
+  background: rgba(255, 252, 248, 0.94);
+  box-shadow: 0 14rpx 34rpx rgba(139, 59, 49, 0.08);
+}
+
+.hero-card {
+  margin-top: 0;
+}
+
+.hero-card__eyebrow {
+  display: block;
+  color: #9f594e;
+  font-size: 22rpx;
+  font-weight: 600;
+  letter-spacing: 6rpx;
+  line-height: 1.4;
+}
+
+.hero-card__title {
+  display: block;
+  margin-top: 14rpx;
+  color: #2c2621;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 46rpx;
+  font-weight: 700;
+  line-height: 1.28;
+}
+
+.hero-card__desc {
+  display: block;
+  margin-top: 18rpx;
+  color: #7a6f64;
+  font-size: 28rpx;
+  line-height: 1.8;
+}
+
+.hero-card__meta {
+  margin: 20rpx -6rpx 0;
+  font-size: 0;
+}
+
+.hero-card__meta-item {
+  display: inline-block;
+  margin: 10rpx 6rpx 0;
+  padding: 10rpx 18rpx;
+  border-radius: 999rpx;
+  background: rgba(139, 59, 49, 0.08);
+  color: #8b3b31;
+  font-size: 22rpx;
+  line-height: 1.4;
+}
+
+.panel-header {
+  margin-bottom: 4rpx;
+}
+
+.panel-header__title {
+  display: block;
+  color: #2c2621;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 34rpx;
+  font-weight: 700;
+  line-height: 1.35;
+}
+
+.panel-header__desc,
+.result-card__hint {
+  display: block;
+  margin-top: 12rpx;
+  color: #7a6f64;
+  font-size: 24rpx;
+  line-height: 1.7;
+}
+
+.panel-header--result {
+  margin-bottom: 8rpx;
+}
+
+.field-row {
+  display: flex;
+  margin: 0 -8rpx;
+}
+
+.field-block {
+  box-sizing: border-box;
+  width: 50%;
+  padding: 0 8rpx;
+  margin-top: 20rpx;
+}
+
+.field-block__label {
+  display: block;
+  color: #8b5a3c;
+  font-size: 24rpx;
+  line-height: 1.5;
+}
+
+.field-block__value {
+  box-sizing: border-box;
+  width: 100%;
+  min-height: 94rpx;
+  margin-top: 12rpx;
+  padding: 24rpx 22rpx;
+  border: 1rpx solid rgba(139, 90, 60, 0.1);
+  border-radius: 24rpx;
+  background: linear-gradient(180deg, #fffdfa 0%, #f7f1ec 100%);
+  color: #5a4335;
+  font-size: 30rpx;
+  font-weight: 600;
+  line-height: 1.4;
+}
+
+.action-group {
+  margin-top: 26rpx;
+}
+
+.action-button {
+  margin-top: 18rpx;
+  padding: 28rpx 24rpx;
+  border-radius: 24rpx;
+  background: linear-gradient(135deg, #a64e44 0%, #7a342b 100%);
+  color: #fff;
+  font-size: 30rpx;
+  font-weight: 600;
+  line-height: 1.2;
+  text-align: center;
+}
+
+.action-button--ghost {
+  background: rgba(139, 59, 49, 0.08);
+  color: #8b3b31;
+}
+
+.result-card__grid {
+  display: flex;
+  flex-wrap: wrap;
+  margin: 18rpx -8rpx 0;
+}
+
+.pillar-card {
+  box-sizing: border-box;
+  width: 50%;
+  padding: 0 8rpx;
+  margin-top: 16rpx;
+}
+
+.pillar-card__inner {
+  min-height: 156rpx;
+  padding: 24rpx 18rpx;
+  border-radius: 24rpx;
+  background: linear-gradient(180deg, #fff7f3 0%, #fff 100%);
+  border: 1rpx solid rgba(139, 59, 49, 0.08);
+  box-shadow: inset 0 1rpx 0 rgba(255, 255, 255, 0.7);
+}
+
+.pillar-card__label {
+  display: block;
+  color: #8b3b31;
+  font-size: 24rpx;
+  line-height: 1.4;
+  text-align: center;
+}
+
+.pillar-card__value {
+  display: block;
+  margin-top: 16rpx;
+  color: #5d312a;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 40rpx;
+  font-weight: 700;
+  line-height: 1.3;
+  text-align: center;
+}
+
+.result-card__hint {
+  margin-top: 24rpx;
+}
--- a/packages/mingli/pages/book-detail/index.js
+++ b/packages/mingli/pages/book-detail/index.js
@@ -0,0 +1,63 @@
+const { resolveScene } = require('../../../../utils/static-ux/shared')
+const { ROUTES, openStaticRoute } = require('../../../../utils/static-ux/route-map')
+
+const BOOK_SURFACES = Object.freeze({
+  'classic-a': {
+    coverText: '滴',
+    title: '滴天髓',
+    subtitle: '命理经典研习入口',
+    route: `${ROUTES.mingli.section}?scene=reader-a`,
+    catalog: ['总论', '天干地支', '格局取法'],
+    recommends: [{ key: 'classic-b', title: '穷通宝鉴', route: `${ROUTES.mingli.bookDetail}?scene=classic-b` }]
+  },
+  'classic-b': {
+    coverText: '穷',
+    title: '穷通宝鉴',
+    subtitle: '格局与用神的静态阅读入口',
+    route: `${ROUTES.mingli.section}?scene=reader-b`,
+    catalog: ['四时旺衰', '五行喜忌', '命局评析'],
+    recommends: [{ key: 'classic-a', title: '滴天髓', route: `${ROUTES.mingli.bookDetail}?scene=classic-a` }]
+  }
+})
+
+function createMingliBookDetailPageData(rawScene) {
+  const scene = resolveScene(rawScene, ['classic-a', 'classic-b'], 'classic-a')
+  const surface = BOOK_SURFACES[scene]
+
+  return {
+    title: '易学典籍详情',
+    scene,
+    coverText: surface.coverText,
+    book: {
+      title: surface.title,
+      subtitle: surface.subtitle
+    },
+    catalog: [...surface.catalog],
+    primaryRoute: surface.route,
+    recommends: surface.recommends.map(item => ({ ...item }))
+  }
+}
+
+function showNavigate(route) {
+  openStaticRoute(route, wx)
+}
+
+Page({
+  data: createMingliBookDetailPageData('classic-a'),
+
+  onLoad(options) {
+    this.setData(createMingliBookDetailPageData(options.scene))
+  },
+
+  handlePrimaryTap() {
+    showNavigate(this.data.primaryRoute)
+  },
+
+  handleRecommendTap(event) {
+    showNavigate(event.currentTarget.dataset.route)
+  }
+})
+
+module.exports = {
+  createMingliBookDetailPageData
+}
--- a/packages/mingli/pages/book-detail/index.json
+++ b/packages/mingli/pages/book-detail/index.json
@@ -0,0 +1,5 @@
+{
+  "navigationBarTitleText": "易学典籍详情",
+  "navigationBarBackgroundColor": "#f8f0ee",
+  "navigationBarTextStyle": "black"
+}
--- a/packages/mingli/pages/book-detail/index.wxml
+++ b/packages/mingli/pages/book-detail/index.wxml
@@ -0,0 +1,28 @@
+<view class="mingli-book-page">
+  <view class="hero-card">
+    <view class="hero-card__cover">{{coverText}}</view>
+    <view class="hero-card__body">
+      <text class="hero-card__title">{{book.title}}</text>
+      <text class="hero-card__subtitle">{{book.subtitle}}</text>
+      <view class="hero-card__button" bindtap="handlePrimaryTap">进入阅读</view>
+    </view>
+  </view>
+
+  <view class="section-card">
+    <text class="section-card__title">目录预览</text>
+    <text class="section-card__item" wx:for="{{catalog}}" wx:key="index">{{item}}</text>
+  </view>
+
+  <view class="section-card">
+    <text class="section-card__title">相关推荐</text>
+    <view
+      class="section-card__recommend"
+      wx:for="{{recommends}}"
+      wx:key="key"
+      data-route="{{item.route}}"
+      bindtap="handleRecommendTap"
+    >
+      {{item.title}}
+    </view>
+  </view>
+</view>
--- a/packages/mingli/pages/book-detail/index.wxss
+++ b/packages/mingli/pages/book-detail/index.wxss
@@ -0,0 +1,75 @@
+page {
+  min-height: 100%;
+  background: linear-gradient(180deg, #f9f7f5 0%, #f3ebe8 100%);
+}
+
+.mingli-book-page {
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding: 28rpx 20rpx 72rpx;
+}
+
+.hero-card,
+.section-card {
+  margin-top: 18rpx;
+  padding: 24rpx;
+  border: 1rpx solid rgba(139, 59, 49, 0.08);
+  border-radius: 28rpx;
+  background: rgba(255, 252, 248, 0.94);
+  box-shadow: 0 10rpx 26rpx rgba(139, 59, 49, 0.06);
+}
+
+.hero-card {
+  display: flex;
+  align-items: flex-start;
+  margin-top: 0;
+}
+
+.hero-card__cover {
+  width: 110rpx;
+  height: 150rpx;
+  border-radius: 22rpx;
+  background: rgba(139, 59, 49, 0.12);
+  color: #8b3b31;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 38rpx;
+  font-weight: 700;
+  line-height: 150rpx;
+  text-align: center;
+}
+
+.hero-card__body {
+  flex: 1;
+  margin-left: 18rpx;
+}
+
+.hero-card__title,
+.section-card__title {
+  display: block;
+  color: #2c2621;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 34rpx;
+  font-weight: 700;
+  line-height: 1.3;
+}
+
+.hero-card__subtitle,
+.section-card__item {
+  display: block;
+  margin-top: 10rpx;
+  color: #7a6f64;
+  font-size: 24rpx;
+  line-height: 1.6;
+}
+
+.hero-card__button,
+.section-card__recommend {
+  margin-top: 16rpx;
+  padding: 18rpx 22rpx;
+  border-radius: 20rpx;
+  background: rgba(139, 59, 49, 0.08);
+  color: #8b3b31;
+  font-size: 24rpx;
+  line-height: 1;
+  text-align: center;
+}
--- a/packages/mingli/pages/hall/index.js
+++ b/packages/mingli/pages/hall/index.js
@@ -0,0 +1,81 @@
+const { createMingliHallPageData: createBaseMingliHallPageData } = require('../../../../utils/static-ux/mingli')
+const { ROUTES, openStaticRoute } = require('../../../../utils/static-ux/route-map')
+
+function createMingliHallPageData() {
+  const baseData = createBaseMingliHallPageData()
+
+  return {
+    ...baseData,
+    almanac: {
+      date: '乙巳年 · 宜研习 · 忌浮躁',
+      ganzhi: '壬寅日 · 辰时',
+      yi: '宜：开卷、推演 · 忌：断章',
+      icon: '盘'
+    },
+    wisdomCard: {
+      text: '知进退存亡，而不失其正者，其唯圣人乎。',
+      from: '《周易》'
+    },
+    hotTopics: [
+      {
+        key: 'topic-drops',
+        label: '滴天髓',
+        route: `${ROUTES.mingli.searchBooks}?keyword=滴天髓`
+      },
+      {
+        key: 'topic-bazi',
+        label: '八字',
+        route: ROUTES.mingli.bazi
+      },
+      {
+        key: 'topic-interpret',
+        label: '命理解读',
+        route: ROUTES.mingli.interpret
+      }
+    ],
+    guideCards: [
+      {
+        key: 'guide-1',
+        title: '从排盘到解读',
+        description: '先完成静态排盘，再进入命理解读页承接结果结构。',
+        route: ROUTES.mingli.bazi
+      },
+      {
+        key: 'guide-2',
+        title: '从经典到术语',
+        description: '从易学典籍页进入静态阅读，再回到问题解释。',
+        route: `${ROUTES.mingli.bookDetail}?scene=classic-a`
+      }
+    ],
+    recommendedBooks: [
+      {
+        key: 'book-a',
+        title: '滴天髓',
+        subtitle: '命理经典研习入口',
+        route: `${ROUTES.mingli.bookDetail}?scene=classic-a`
+      },
+      {
+        key: 'book-b',
+        title: '穷通宝鉴',
+        subtitle: '格局与用神的静态学习入口',
+        route: `${ROUTES.mingli.bookDetail}?scene=classic-b`
+      }
+    ]
+  }
+}
+
+function showNavigate(route) {
+  openStaticRoute(route, wx)
+}
+
+Page({
+  data: createMingliHallPageData(),
+
+  handleRouteTap(event) {
+    showNavigate(event.currentTarget.dataset.route)
+  }
+})
+
+module.exports = {
+  createMingliHallPageData
+}
--- a/packages/mingli/pages/hall/index.json
+++ b/packages/mingli/pages/hall/index.json
@@ -0,0 +1,5 @@
+{
+  "navigationBarTitleText": "易学阁",
+  "navigationBarBackgroundColor": "#f8f0ee",
+  "navigationBarTextStyle": "black"
+}
--- a/packages/mingli/pages/hall/index.wxml
+++ b/packages/mingli/pages/hall/index.wxml
@@ -0,0 +1,76 @@
+<view class="hall-page">
+  <view class="almanac-card">
+    <view>
+      <text class="almanac-card__date">{{almanac.date}}</text>
+      <text class="almanac-card__ganzhi">{{almanac.ganzhi}}</text>
+      <text class="almanac-card__yi">{{almanac.yi}}</text>
+    </view>
+    <text class="almanac-card__icon">{{almanac.icon}}</text>
+  </view>
+
+  <view class="hall-grid">
+    <view
+      class="hall-card"
+      wx:for="{{quickCards}}"
+      wx:key="key"
+      data-route="{{item.route}}"
+      bindtap="handleRouteTap"
+    >
+      <view class="hall-card__icon">{{item.icon}}</view>
+      <text class="hall-card__title">{{item.title}}</text>
+      <text class="hall-card__subtitle">{{item.subtitle}}</text>
+    </view>
+  </view>
+
+  <view class="section-card">
+    <text class="section-card__title">每日一言</text>
+    <text class="section-card__text">{{wisdomCard.text}}</text>
+    <text class="section-card__from">—— {{wisdomCard.from}}</text>
+  </view>
+
+  <view class="section-card">
+    <text class="section-card__title">搜索热词</text>
+    <view class="chips-row">
+      <view
+        class="chips-row__item"
+        wx:for="{{hotTopics}}"
+        wx:key="key"
+        data-route="{{item.route}}"
+        bindtap="handleRouteTap"
+      >
+        {{item.label}}
+      </view>
+    </view>
+  </view>
+
+  <view class="section-card">
+    <text class="section-card__title">导读推荐</text>
+    <view
+      class="guide-card"
+      wx:for="{{guideCards}}"
+      wx:key="key"
+      data-route="{{item.route}}"
+      bindtap="handleRouteTap"
+    >
+      <text class="guide-card__title">{{item.title}}</text>
+      <text class="guide-card__desc">{{item.description}}</text>
+    </view>
+  </view>
+
+  <view class="section-card">
+    <text class="section-card__title">经典研习</text>
+    <view
+      class="book-row"
+      wx:for="{{recommendedBooks}}"
+      wx:key="key"
+      data-route="{{item.route}}"
+      bindtap="handleRouteTap"
+    >
+      <view class="book-row__cover">书</view>
+      <view class="book-row__body">
+        <text class="book-row__title">{{item.title}}</text>
+        <text class="book-row__subtitle">{{item.subtitle}}</text>
+      </view>
+    </view>
+  </view>
+</view>
--- a/packages/mingli/pages/hall/index.wxss
+++ b/packages/mingli/pages/hall/index.wxss
@@ -0,0 +1,166 @@
+page {
+  min-height: 100%;
+  background: linear-gradient(180deg, #f9f7f5 0%, #f3ebe8 100%);
+}
+
+.hall-page {
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding: 28rpx 20rpx 72rpx;
+}
+
+.almanac-card,
+.section-card,
+.hall-card {
+  border: 1rpx solid rgba(139, 59, 49, 0.08);
+  border-radius: 28rpx;
+  background: rgba(255, 252, 248, 0.94);
+  box-shadow: 0 10rpx 26rpx rgba(139, 59, 49, 0.06);
+}
+
+.almanac-card {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 24rpx;
+}
+
+.almanac-card__date,
+.almanac-card__yi,
+.section-card__from {
+  display: block;
+  color: #7a6f64;
+  font-size: 22rpx;
+  line-height: 1.6;
+}
+
+.almanac-card__ganzhi {
+  display: block;
+  margin: 8rpx 0;
+  color: #8b3b31;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 34rpx;
+  font-weight: 700;
+  line-height: 1.3;
+}
+
+.almanac-card__icon {
+  color: #8b3b31;
+  font-size: 46rpx;
+}
+
+.hall-grid {
+  display: flex;
+  flex-wrap: wrap;
+  margin: 12rpx -6rpx 0;
+}
+
+.hall-card {
+  box-sizing: border-box;
+  width: 50%;
+  margin-top: 12rpx;
+  padding: 24rpx 18rpx;
+  background: #fff;
+  border-radius: 24rpx;
+  margin-left: 6rpx;
+  margin-right: 6rpx;
+}
+
+.hall-card__icon {
+  width: 82rpx;
+  height: 82rpx;
+  border-radius: 20rpx;
+  background: rgba(139, 59, 49, 0.08);
+  color: #8b3b31;
+  font-size: 34rpx;
+  line-height: 82rpx;
+  text-align: center;
+}
+
+.hall-card__title,
+.section-card__title,
+.guide-card__title,
+.book-row__title {
+  display: block;
+  color: #2c2621;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 32rpx;
+  font-weight: 700;
+  line-height: 1.3;
+}
+
+.hall-card__title {
+  margin-top: 16rpx;
+}
+
+.hall-card__subtitle,
+.guide-card__desc,
+.book-row__subtitle,
+.section-card__text {
+  display: block;
+  margin-top: 8rpx;
+  color: #7a6f64;
+  font-size: 24rpx;
+  line-height: 1.6;
+}
+
+.section-card {
+  margin-top: 18rpx;
+  padding: 24rpx;
+}
+
+.section-card__text {
+  margin-top: 14rpx;
+  font-size: 30rpx;
+  line-height: 1.8;
+  color: #352f29;
+}
+
+.chips-row {
+  margin: 14rpx -6rpx 0;
+}
+
+.chips-row__item {
+  display: inline-block;
+  margin: 6rpx;
+  padding: 12rpx 18rpx;
+  border-radius: 999rpx;
+  background: rgba(139, 59, 49, 0.08);
+  color: #8b3b31;
+  font-size: 22rpx;
+  line-height: 1;
+}
+
+.guide-card,
+.book-row {
+  margin-top: 16rpx;
+  padding: 20rpx 0 0;
+  border-top: 1rpx solid rgba(139, 59, 49, 0.08);
+}
+
+.guide-card:first-of-type,
+.book-row:first-of-type {
+  padding-top: 16rpx;
+  border-top: 0;
+}
+
+.book-row {
+  display: flex;
+  align-items: center;
+}
+
+.book-row__cover {
+  width: 72rpx;
+  height: 96rpx;
+  border-radius: 18rpx;
+  background: rgba(139, 59, 49, 0.1);
+  color: #8b3b31;
+  font-size: 28rpx;
+  line-height: 96rpx;
+  text-align: center;
+}
+
+.book-row__body {
+  flex: 1;
+  margin-left: 16rpx;
+}
--- a/packages/mingli/pages/interpret/index.js
+++ b/packages/mingli/pages/interpret/index.js
@@ -0,0 +1,42 @@
+const { resolveScene } = require('../../../../utils/static-ux/shared')
+const { ROUTES, openStaticRoute } = require('../../../../utils/static-ux/route-map')
+
+function createMingliInterpretPageData(rawScene) {
+  const scene = resolveScene(rawScene, ['default', 'result'], 'default')
+
+  return {
+    title: '命理解读',
+    scene,
+    contextText: '围绕命理问题或盘面结果，保留一个学习型解释区块。',
+    result:
+      scene === 'result'
+        ? {
+            title: '学习型命理解读',
+            summary: '当前静态结果围绕“甲木日主”的基本气象来展示结果版式和引用层级。',
+            references: ['《滴天髓》重视日主气势', '先看时令，再看格局与用神']
+          }
+        : null,
+    primaryActionText: scene === 'result' ? '重新解读' : '提交解读',
+    secondaryActionText: '查看排盘'
+  }
+}
+
+Page({
+  data: createMingliInterpretPageData('default'),
+
+  onLoad(options) {
+    this.setData(createMingliInterpretPageData(options.scene))
+  },
+
+  handlePrimaryTap() {
+    this.setData(createMingliInterpretPageData(this.data.scene === 'result' ? 'default' : 'result'))
+  },
+
+  handleSecondaryTap() {
+    openStaticRoute(`${ROUTES.mingli.bazi}?scene=result`, wx)
+  }
+})
+
+module.exports = {
+  createMingliInterpretPageData
+}
--- a/packages/mingli/pages/interpret/index.json
+++ b/packages/mingli/pages/interpret/index.json
@@ -0,0 +1,5 @@
+{
+  "navigationBarTitleText": "命理解读",
+  "navigationBarBackgroundColor": "#f8f0ee",
+  "navigationBarTextStyle": "black"
+}
--- a/packages/mingli/pages/interpret/index.wxml
+++ b/packages/mingli/pages/interpret/index.wxml
@@ -0,0 +1,24 @@
+<view class="interpret-page">
+  <view class="hero-card">
+    <text class="hero-card__title">{{title}}</text>
+    <text class="hero-card__desc">{{contextText}}</text>
+  </view>
+
+  <view class="form-card">
+    <textarea class="form-card__textarea" placeholder="例如：如何理解滴天髓的入门结构？" disabled="{{true}}"></textarea>
+    <input class="form-card__input" placeholder="解读焦点（可选）" disabled="{{true}}" />
+    <view class="action-button" bindtap="handlePrimaryTap">{{primaryActionText}}</view>
+    <view class="action-button action-button--ghost" bindtap="handleSecondaryTap">
+      {{secondaryActionText}}
+    </view>
+  </view>
+
+  <view wx:if="{{result}}" class="result-card">
+    <text class="result-card__title">{{result.title}}</text>
+    <text class="result-card__desc">{{result.summary}}</text>
+    <view class="reference-item" wx:for="{{result.references}}" wx:key="index">
+      <text class="reference-item__dot">·</text>
+      <text class="reference-item__text">{{item}}</text>
+    </view>
+  </view>
+</view>
--- a/packages/mingli/pages/interpret/index.wxss
+++ b/packages/mingli/pages/interpret/index.wxss
@@ -0,0 +1,91 @@
+page {
+  min-height: 100%;
+  background: linear-gradient(180deg, #f9f7f5 0%, #f3ebe8 100%);
+}
+
+.interpret-page {
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding: 28rpx 20rpx 72rpx;
+}
+
+.hero-card,
+.form-card,
+.result-card {
+  margin-top: 18rpx;
+  padding: 24rpx;
+  border: 1rpx solid rgba(139, 59, 49, 0.08);
+  border-radius: 28rpx;
+  background: rgba(255, 252, 248, 0.94);
+  box-shadow: 0 10rpx 26rpx rgba(139, 59, 49, 0.06);
+}
+
+.hero-card {
+  margin-top: 0;
+}
+
+.hero-card__title,
+.result-card__title {
+  display: block;
+  color: #2c2621;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 36rpx;
+  font-weight: 700;
+  line-height: 1.3;
+}
+
+.hero-card__desc,
+.result-card__desc,
+.reference-item__text {
+  display: block;
+  margin-top: 10rpx;
+  color: #7a6f64;
+  font-size: 24rpx;
+  line-height: 1.7;
+}
+
+.form-card__textarea,
+.form-card__input {
+  box-sizing: border-box;
+  width: 100%;
+  padding: 18rpx 20rpx;
+  border: 1rpx solid rgba(139, 90, 60, 0.12);
+  border-radius: 18rpx;
+  background: #fff;
+  color: #5a4335;
+  font-size: 24rpx;
+  line-height: 1.6;
+}
+
+.form-card__input {
+  margin-top: 12rpx;
+}
+
+.action-button {
+  margin-top: 16rpx;
+  padding: 22rpx 24rpx;
+  border-radius: 22rpx;
+  background: linear-gradient(135deg, #a64e44 0%, #7a342b 100%);
+  color: #fff;
+  font-size: 26rpx;
+  line-height: 1;
+  text-align: center;
+}
+
+.action-button--ghost {
+  background: rgba(139, 59, 49, 0.08);
+  color: #8b3b31;
+}
+
+.reference-item {
+  display: flex;
+  align-items: flex-start;
+  margin-top: 10rpx;
+}
+
+.reference-item__dot {
+  margin-right: 10rpx;
+  color: #8b3b31;
+  font-size: 26rpx;
+  line-height: 1.6;
+}
--- a/packages/mingli/pages/search-books/index.js
+++ b/packages/mingli/pages/search-books/index.js
@@ -0,0 +1,61 @@
+const { ROUTES, openStaticRoute } = require('../../../../utils/static-ux/route-map')
+
+const SEARCH_CATALOG = Object.freeze([
+  {
+    key: 'classic-a',
+    title: '滴天髓',
+    subtitle: '命理经典结果',
+    aliases: ['滴天', '天髓'],
+    route: `${ROUTES.mingli.bookDetail}?scene=classic-a`
+  },
+  {
+    key: 'classic-b',
+    title: '穷通宝鉴',
+    subtitle: '格局与用神',
+    aliases: ['穷通', '宝鉴'],
+    route: `${ROUTES.mingli.bookDetail}?scene=classic-b`
+  }
+])
+
+function createMingliSearchBooksPageData(keyword) {
+  const normalizedKeyword = (keyword || '').trim()
+  const results = normalizedKeyword
+    ? SEARCH_CATALOG.filter(item => {
+        return (
+          item.title.includes(normalizedKeyword) ||
+          item.aliases.some(alias => alias.includes(normalizedKeyword))
+        )
+      }).map(item => ({ ...item }))
+    : []
+
+  return {
+    title: '搜索易学典籍',
+    keyword: normalizedKeyword,
+    history: ['滴天髓', '穷通宝鉴', '子平真诠'],
+    results
+  }
+}
+
+function showNavigate(route) {
+  openStaticRoute(route, wx)
+}
+
+Page({
+  data: createMingliSearchBooksPageData(''),
+
+  onLoad(options) {
+    this.setData(createMingliSearchBooksPageData(options.keyword || options.q))
+  },
+
+  handleHistoryTap(event) {
+    this.setData(createMingliSearchBooksPageData(event.currentTarget.dataset.keyword))
+  },
+
+  handleResultTap(event) {
+    showNavigate(event.currentTarget.dataset.route)
+  }
+})
+
+module.exports = {
+  createMingliSearchBooksPageData
+}
--- a/packages/mingli/pages/search-books/index.json
+++ b/packages/mingli/pages/search-books/index.json
@@ -0,0 +1,5 @@
+{
+  "navigationBarTitleText": "搜索易学典籍",
+  "navigationBarBackgroundColor": "#f8f0ee",
+  "navigationBarTextStyle": "black"
+}
--- a/packages/mingli/pages/search-books/index.wxml
+++ b/packages/mingli/pages/search-books/index.wxml
@@ -0,0 +1,21 @@
+<view class="mingli-search-page">
+  <view class="section-card">
+    <text class="section-card__title">{{title}}</text>
+    <text class="section-card__item" wx:for="{{history}}" wx:key="index" data-keyword="{{item}}" bindtap="handleHistoryTap">
+      {{item}}
+    </text>
+  </view>
+
+  <view wx:if="{{results.length}}" class="section-card">
+    <text class="section-card__title">搜索结果</text>
+    <view
+      class="section-card__item"
+      wx:for="{{results}}"
+      wx:key="key"
+      data-route="{{item.route}}"
+      bindtap="handleResultTap"
+    >
+      {{item.title}} · {{item.subtitle}}
+    </view>
+  </view>
+</view>
--- a/packages/mingli/pages/search-books/index.wxss
+++ b/packages/mingli/pages/search-books/index.wxss
@@ -0,0 +1,43 @@
+page {
+  min-height: 100%;
+  background: linear-gradient(180deg, #f9f7f5 0%, #f3ebe8 100%);
+}
+
+.mingli-search-page {
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding: 28rpx 20rpx 72rpx;
+}
+
+.section-card {
+  margin-top: 18rpx;
+  padding: 24rpx;
+  border: 1rpx solid rgba(139, 59, 49, 0.08);
+  border-radius: 28rpx;
+  background: rgba(255, 252, 248, 0.94);
+  box-shadow: 0 10rpx 26rpx rgba(139, 59, 49, 0.06);
+}
+
+.section-card:first-child {
+  margin-top: 0;
+}
+
+.section-card__title {
+  display: block;
+  color: #2c2621;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 34rpx;
+  font-weight: 700;
+  line-height: 1.3;
+}
+
+.section-card__item {
+  display: block;
+  margin-top: 14rpx;
+  padding: 18rpx 20rpx;
+  border-radius: 20rpx;
+  background: rgba(139, 59, 49, 0.08);
+  color: #8b3b31;
+  font-size: 24rpx;
+  line-height: 1.6;
+}
--- a/packages/mingli/pages/section/index.js
+++ b/packages/mingli/pages/section/index.js
@@ -0,0 +1,57 @@
+const { resolveScene } = require('../../../../utils/static-ux/shared')
+const { ROUTES, openStaticRoute } = require('../../../../utils/static-ux/route-map')
+
+const READER_SURFACES = Object.freeze({
+  'reader-a': {
+    title: '滴天髓 · 总论',
+    passages: ['欲识三元万法宗，先观帝载与神功。', '气机流转之间，先看格局成败。']
+  },
+  'reader-b': {
+    title: '穷通宝鉴 · 四时旺衰',
+    passages: ['论命之法，首重月令。', '得时得地者旺，失时失地者衰。']
+  }
+})
+
+function createMingliSectionPageData(rawScene) {
+  const scene = resolveScene(rawScene, ['reader-a', 'reader-b'], 'reader-a')
+  const surface = READER_SURFACES[scene]
+
+  return {
+    title: '易学阅读',
+    scene,
+    chapterTitle: surface.title,
+    passages: [...surface.passages],
+    actions: [
+      {
+        key: 'interpret',
+        title: '打开命理解读',
+        route: ROUTES.mingli.interpret
+      },
+      {
+        key: 'hall',
+        title: '返回易学阁',
+        route: ROUTES.mingli.hall
+      }
+    ]
+  }
+}
+
+function showNavigate(route) {
+  openStaticRoute(route, wx)
+}
+
+Page({
+  data: createMingliSectionPageData('reader-a'),
+
+  onLoad(options) {
+    this.setData(createMingliSectionPageData(options.scene))
+  },
+
+  handleActionTap(event) {
+    showNavigate(event.currentTarget.dataset.route)
+  }
+})
+
+module.exports = {
+  createMingliSectionPageData
+}
--- a/packages/mingli/pages/section/index.json
+++ b/packages/mingli/pages/section/index.json
@@ -0,0 +1,5 @@
+{
+  "navigationBarTitleText": "易学阅读",
+  "navigationBarBackgroundColor": "#f8f0ee",
+  "navigationBarTextStyle": "black"
+}
--- a/packages/mingli/pages/section/index.wxml
+++ b/packages/mingli/pages/section/index.wxml
@@ -0,0 +1,19 @@
+<view class="mingli-section-page">
+  <view class="hero-card">
+    <text class="hero-card__title">{{chapterTitle}}</text>
+  </view>
+
+  <view class="passage-card">
+    <text class="passage-card__item" wx:for="{{passages}}" wx:key="index">{{item}}</text>
+  </view>
+
+  <view
+    class="action-button"
+    wx:for="{{actions}}"
+    wx:key="key"
+    data-route="{{item.route}}"
+    bindtap="handleActionTap"
+  >
+    {{item.title}}
+  </view>
+</view>
--- a/packages/mingli/pages/section/index.wxss
+++ b/packages/mingli/pages/section/index.wxss
@@ -0,0 +1,56 @@
+page {
+  min-height: 100%;
+  background: linear-gradient(180deg, #f9f7f5 0%, #f3ebe8 100%);
+}
+
+.mingli-section-page {
+  box-sizing: border-box;
+  min-height: 100vh;
+  padding: 28rpx 20rpx 72rpx;
+}
+
+.hero-card,
+.passage-card {
+  margin-top: 18rpx;
+  padding: 24rpx;
+  border: 1rpx solid rgba(139, 59, 49, 0.08);
+  border-radius: 28rpx;
+  background: rgba(255, 252, 248, 0.94);
+  box-shadow: 0 10rpx 26rpx rgba(139, 59, 49, 0.06);
+}
+
+.hero-card {
+  margin-top: 0;
+}
+
+.hero-card__title {
+  display: block;
+  color: #2c2621;
+  font-family: 'STSong', 'Songti SC', serif;
+  font-size: 34rpx;
+  font-weight: 700;
+  line-height: 1.3;
+}
+
+.passage-card__item {
+  display: block;
+  margin-top: 16rpx;
+  color: #453730;
+  font-size: 28rpx;
+  line-height: 1.8;
+}
+
+.passage-card__item:first-child {
+  margin-top: 0;
+}
+
+.action-button {
+  margin-top: 16rpx;
+  padding: 22rpx 24rpx;
+  border-radius: 22rpx;
+  background: rgba(139, 59, 49, 0.08);
+  color: #8b3b31;
+  font-size: 26rpx;
+  line-height: 1;
+  text-align: center;
+}