<view class="container">
  <!-- 无八字提示 -->
  <view class="card text-center" wx:if="{{!hasBazi}}">
    <text class="text-lg text-muted">请先排八字以查看每日运势</text>
    <view class="btn-primary mt-2" bindtap="goBazi">去排八字</view>
  </view>

  <!-- 运势内容 -->
  <block wx:if="{{hasBazi && fortune}}">
    <!-- 总分卡片 -->
    <view class="card score-card">
      <view class="text-center">
        <text class="score-value">{{fortune.overallScore}}</text>
        <text class="score-level">{{scoreLevelText}}</text>
      </view>
      <view class="text-sm text-muted text-center mt-1">{{fortune.date}} {{fortune.lunarDate}}</view>
    </view>

    <!-- 幸运元素 -->
    <view class="card">
      <view class="section-title">幸运元素</view>
      <view class="grid grid-cols-2 gap-2">
        <view class="info-item">
          <text class="text-xs text-muted">幸运色</text>
          <text class="text-base font-medium">{{fortune.luckyMeta.colors.join('、')}}</text>
        </view>
        <view class="info-item">
          <text class="text-xs text-muted">幸运数字</text>
          <text class="text-base font-medium">{{fortune.luckyMeta.numbers.join('、')}}</text>
        </view>
        <view class="info-item">
          <text class="text-xs text-muted">幸运方位</text>
          <text class="text-base font-medium">{{fortune.luckyMeta.direction}}</text>
        </view>
        <view class="info-item">
          <text class="text-xs text-muted">五行</text>
          <text class="text-base font-medium">{{fortune.luckyMeta.element}}</text>
        </view>
      </view>
    </view>

    <!-- 四柱关系 -->
    <view class="card">
      <view class="section-title">四柱与今日关系</view>
      <view class="relation-list">
        <view class="relation-item" wx:for="{{fortune.pillarRelationships}}" wx:key="pillar">
          <view class="flex justify-between items-center">
            <text class="font-medium">{{item.pillarLabel}}</text>
            <text class="text-sm {{item.score >= 0 ? 'text-lucky' : 'text-unlucky'}}">{{item.score > 0 ? '+' : ''}}{{item.score}}</text>
          </view>
          <view class="text-sm text-muted mt-1">
            {{item.userGanzhi}} vs {{item.dayGanzhi}}
          </view>
          <view class="flex flex-wrap gap-1 mt-1">
            <text class="badge badge-outline" wx:if="{{item.stemTenStar}}">{{item.stemTenStar}}</text>
            <text class="badge badge-lucky" wx:if="{{item.stemCombine}}">天干合</text>
            <text class="badge badge-unlucky" wx:if="{{item.stemOpposite}}">天干冲</text>
            <text class="badge badge-lucky" wx:if="{{item.branchCombine}}">地支合</text>
            <text class="badge badge-unlucky" wx:if="{{item.branchOpposite}}">地支冲</text>
          </view>
        </view>
      </view>
    </view>

    <!-- 建议 -->
    <view class="card">
      <view class="section-title">今日建议</view>
      <view class="suggestion-list">
        <view class="suggestion-item" wx:for="{{fortune.suggestions}}" wx:key="*this">
          <text class="text-base">{{item}}</text>
        </view>
      </view>
    </view>

    <!-- 分项得分 -->
    <view class="card">
      <view class="section-title">分项运势</view>
      <view class="grid grid-cols-2 gap-2">
        <view class="info-item text-center">
          <text class="text-xs text-muted">爱情</text>
          <text class="text-xl font-bold {{fortune.categoryScores.love >= 0 ? 'text-lucky' : 'text-unlucky'}}">{{fortune.categoryScores.love}}</text>
        </view>
        <view class="info-item text-center">
          <text class="text-xs text-muted">事业</text>
          <text class="text-xl font-bold {{fortune.categoryScores.career >= 0 ? 'text-lucky' : 'text-unlucky'}}">{{fortune.categoryScores.career}}</text>
        </view>
        <view class="info-item text-center">
          <text class="text-xs text-muted">财运</text>
          <text class="text-xl font-bold {{fortune.categoryScores.wealth >= 0 ? 'text-lucky' : 'text-unlucky'}}">{{fortune.categoryScores.wealth}}</text>
        </view>
        <view class="info-item text-center">
          <text class="text-xs text-muted">健康</text>
          <text class="text-xl font-bold {{fortune.categoryScores.health >= 0 ? 'text-lucky' : 'text-unlucky'}}">{{fortune.categoryScores.health}}</text>
        </view>
      </view>
    </view>
  </block>
</view>
