huaanglimeng/pages/home/home.wxml

<view class="tarot-table">
  
  <!-- 顶部栏 (已移除) -->

  <!-- 右上角积分徽章 -->
  <view class="points-badge" bindtap="showPointsInfo" style="top: 100rpx;">
    <text class="badge-icon">🎯</text>
    <text class="badge-value">{{currentPoints}}</text>
  </view>

  <!-- 星座能量入口 (放在主牌堆上方) -->
  <view class="zodiac-entry" bindtap="goToZodiac">
    <view class="zodiac-content">
      <text class="zodiac-title">今日星象能量</text>
      <text class="zodiac-subtitle">看看今天宇宙给你的提示</text>
    </view>
    <view class="zodiac-icon">🌑</view>
  </view>

  <!-- 中央主牌堆 -->
  <view class="main-deck" bindtap="goToTarot" hover-class="deck-hover">
    <view class="deck-cards">
      <view class="card-stack card-1">
        <view class="card-bg"></view>
      </view>
      <view class="card-stack card-2">
        <view class="card-bg"></view>
      </view>
      <view class="card-stack card-3">
        <view class="card-bg"></view>
        <view class="card-pattern">
          <view class="card-symbol">✡</view>
        </view>
      </view>
    </view>
    <text class="deck-title">开始抽牌</text>
  </view>

  <!-- 左侧今日能量卡 -->
  <view class="energy-card side-card" bindtap="showEnergyOverlay" hover-class="card-hover">
    <text class="card-icon">💫</text>
    <text class="card-label">今日能量</text>
  </view>

  <!-- 右侧今日知识卡 -->
  <view class="knowledge-card side-card" bindtap="showKnowledgePanel" hover-class="card-hover">
    <text class="card-icon">✨</text>
    <text class="card-label">今日知识</text>
  </view>

  <!-- 底部功能抽屉 -->
  <view class="function-drawer">
    <view class="drawer-item" bindtap="goToTarot" hover-class="drawer-hover">
      <text class="drawer-icon">🎴</text>
      <text class="drawer-text">常用牌阵</text>
    </view>
    <view class="drawer-item" bindtap="goToKnowledge" hover-class="drawer-hover">
      <text class="drawer-icon">📚</text>
      <text class="drawer-text">学点塔罗</text>
    </view>
    <view class="drawer-item" bindtap="showPointsInfo" hover-class="drawer-hover">
      <text class="drawer-icon">🎯</text>
      <text class="drawer-text">积分说明</text>
    </view>
    <view class="drawer-item" bindtap="goToSettings" hover-class="drawer-hover">
      <text class="drawer-icon">⚙️</text>
      <text class="drawer-text">更多设置</text>
    </view>
  </view>

  <!-- 能量卡浮层 -->
  <view class="overlay {{energyVisible ? 'show' : ''}}" bindtap="hideEnergyOverlay">
    <view class="overlay-content energy-content" catchtap="stopPropagation">
      <text class="overlay-title">💫 今日能量</text>
      <text class="overlay-text">{{dailyAdvice}}</text>
      <view class="overlay-close" bindtap="hideEnergyOverlay">关闭</view>
    </view>
  </view>

  <!-- 积分说明浮层 -->
  <view class="overlay {{pointsVisible ? 'show' : ''}}" bindtap="hidePointsInfo">
    <view class="overlay-content points-content" catchtap="stopPropagation">
      <view class="points-header">
        <text class="points-big-icon">🎯</text>
        <text class="points-big-value">{{currentPoints}}</text>
        <text class="points-label">当前积分</text>
      </view>
      
      <view class="points-rules">
        <view class="rule-item">
          <text class="rule-icon">📅</text>
          <view class="rule-text">
            <text class="rule-title">每日登录</text>
            <text class="rule-desc">自动获得 +3 积分</text>
          </view>
        </view>
        <view class="rule-item">
          <text class="rule-icon">🎁</text>
          <view class="rule-text">
            <text class="rule-title">分享给朋友</text>
            <text class="rule-desc">获得 +10 积分 (每日限3次)</text>
          </view>
        </view>
        <view class="rule-item">
          <text class="rule-icon">🔮</text>
          <view class="rule-text">
            <text class="rule-title">消耗规则</text>
            <text class="rule-desc">不同牌阵消耗不同积分</text>
          </view>
        </view>
      </view>

      <view class="overlay-close" bindtap="hidePointsInfo">知道了</view>
    </view>
  </view>

  <!-- 知识卡半屏 -->
  <view class="panel {{knowledgeVisible ? 'show' : ''}}" bindtap="hideKnowledgePanel">
    <view class="panel-content" catchtap="stopPropagation">
      <text class="panel-title">✨ 今日小知识</text>
      <text class="panel-article-title">{{dailyArticle.title}}</text>
      <text class="panel-summary">{{dailyArticle.summary}}</text>
      <view class="panel-actions">
        <view class="panel-btn" bindtap="goToArticle">查看详情</view>
        <view class="panel-btn secondary" bindtap="hideKnowledgePanel">关闭</view>
      </view>
    </view>
  </view>
</view>