xiangqinxiaochengxu/miniprogram/pages/match/match.wxml

<view class="page match-page">
  <view class="hero-box">
    <view>
      <view class="hero-title">{{source === 'activity' ? (activityTitle || '活动专属推荐') : '今日推荐'}}</view>
      <view class="hero-desc">{{source === 'activity' ? '仅展示当前活动内的异性嘉宾，右滑加入我的选择。' : '优先展示同城、兴趣重叠和价值观更接近的候选人。'}}</view>
    </view>
    <button wx:if="{{source !== 'activity'}}" class="ai-btn {{aiMatching ? 'ai-btn-loading' : ''}}" bindtap="triggerAi" disabled="{{aiMatching}}">{{aiMatching ? '匹配中...' : '匹配推荐'}}</button>
  </view>

  <view wx:if="{{source === 'activity' && selectionSummaryText}}" class="activity-banner">{{selectionSummaryText}}</view>
  <view wx:if="{{source === 'activity' && activityMatchText}}" class="activity-banner secondary-banner">{{activityMatchText}}</view>
  <view class="swipe-tip">左滑跳过 · 右滑选择 · 点击卡片查看资料</view>
  <view class="ai-status">{{getAiStatusText()}}<text wx:if="{{aiSuggestionCount}}"> · 共 {{aiSuggestionCount}} 人</text></view>

  <view wx:if="{{source === 'activity' && activityId}}" class="quick-actions">
    <button class="ghost-btn quick-btn" bindtap="goMyMatches">我的选择与结果</button>
  </view>

  <view wx:if="{{loading}}" class="loading-tip">正在加载推荐候选人...</view>
  <view wx:if="{{currentCandidate}}" class="deck-area">
    <view wx:if="{{nextCandidate}}" class="match-card match-card-shadow {{swipeActive ? 'match-card-shadow-active' : ''}}">
      <view class="match-cover shadow-cover">
        <image wx:if="{{nextCandidate.avatar_blur_url}}" class="cover-image" src="{{nextCandidate.avatar_blur_url}}" mode="aspectFill" />
        <view wx:else class="cover-image avatar-placeholder">用户</view>
      </view>
    </view>

    <view class="match-card match-card-active {{swipeActive ? 'match-card-moving' : ''}} {{cardExitClass}}" style="transform: translateX({{dragOffsetX}}px) rotate({{dragRotation}}deg);">
      <view class="swipe-badge swipe-badge-like" wx:if="{{swipeHint === 'like'}}">感兴趣</view>
      <view class="swipe-badge swipe-badge-skip" wx:if="{{swipeHint === 'skip'}}">跳过</view>

      <view class="match-cover" data-id="{{currentCandidate.user_id}}" bindtap="openCard" catchtouchstart="handleTouchStart" catchtouchmove="handleTouchMove" catchtouchend="handleTouchEnd" catchtouchcancel="handleTouchCancel">
        <image wx:if="{{currentCandidate.avatar_blur_url}}" class="cover-image" src="{{currentCandidate.avatar_blur_url}}" mode="aspectFill" />
        <view wx:else class="cover-image avatar-placeholder">用户</view>
        <view class="cover-overlay">
          <view class="cover-top">
            <view class="score-chip score-chip--{{currentCandidate.matchScoreLevel}}" wx:if="{{currentCandidate.hasMatchScore}}">
              <text class="score-chip-value">{{currentCandidate.matchScoreText}}</text>
              <text class="score-chip-label">匹配度</text>
            </view>
          </view>
          <view class="cover-bottom">
            <view class="name-row">
              <text class="name">{{currentCandidate.nicknameText}}</text>
            </view>
            <view class="meta">{{currentCandidate.birthYearRangeText}} · {{currentCandidate.cityText}}</view>
          </view>
        </view>
      </view>

      <view class="card-main">
        <view class="card-main-header">
          <view class="card-caption-row">
            <view class="card-caption-title">推荐印象</view>
            <view class="card-caption-status">{{canOperate ? '可滑动操作' : '当前不可操作'}}</view>
          </view>
          <view class="card-summary">
            <view class="card-summary-name">{{currentCandidate.nicknameText}}</view>
            <view class="card-summary-meta">{{currentCandidate.birthYearRangeText}} · {{currentCandidate.cityText}}</view>
          </view>
        </view>
        <view class="card-main-body">
          <view class="tags">
            <text wx:for="{{currentCandidate.personality_tags}}" wx:key="*this" class="tag">{{item}}</text>
          </view>
          <view wx:if="{{currentCandidate.hasMatchReasons}}" class="reasons">
            <view class="reasons-title">推荐理由</view>
            <view class="reasons-text">{{currentCandidate.matchReasonsText}}</view>
          </view>
          <view wx:if="{{!currentCandidate.personality_tags.length && !currentCandidate.hasMatchReasons}}" class="card-empty-state">系统正在补全该候选人的资料与推荐理由。</view>
        </view>
      </view>
    </view>
  </view>

  <view wx:else class="empty-card">
    <view class="empty-title">{{source === 'activity' ? '本活动可匹配的候选人已看完' : '今天的推荐已经看完啦'}}</view>
    <view class="empty-desc">{{source === 'activity' ? '该活动内没有更多可匹配对象，或你的可选人数已达上限。' : '稍后再来看看，或者点击匹配获取新的候选人。'}}</view>
  </view>

  <view wx:if="{{activeCandidate}}" class="mask" bindtap="closeCard">
    <view class="sheet" catchtap="noop">
      <view class="sheet-title">候选人信息</view>
      <view class="sheet-text">昵称：{{activeCandidate.nicknameText}}</view>
      <view class="sheet-text">年龄范围：{{activeCandidate.birthYearRangeText}}</view>
      <view class="sheet-text">城市：{{activeCandidate.cityText}}</view>
      <view class="sheet-text">性格：{{activeCandidatePersonalityText}}</view>
      <view wx:if="{{activeCandidate.hasMatchReasons}}" class="sheet-reasons">{{activeCandidate.matchReasonsText}}</view>
      <button class="primary-btn" data-id="{{activeCandidate.user_id}}" bindtap="likeUser">加入我的选择</button>
    </view>
  </view>

  <view wx:if="{{mutualMatchVisible}}" class="success-mask" bindtap="closeMutualMatch">
    <view class="success-card" catchtap="noop">
      <view class="success-badge">MATCH</view>
      <view class="success-title">匹配成功</view>
      <view class="success-desc">你和 {{mutualMatchName}} 互相感兴趣，快去“我的选择与结果”查看更完整的信息吧。</view>
      <view class="success-actions">
        <button class="ghost-btn success-ghost-btn" bindtap="closeMutualMatch">稍后查看</button>
        <button class="primary-btn" bindtap="goMyMatches">查看结果</button>
      </view>
    </view>
  </view>
</view>