<!-- 消息页面 -->
<view class="page-container">
  <!-- 顶部导航栏 -->
  <view class="unified-header">
    <view class="unified-header-left"></view>
    <text class="unified-header-title">消息</text>
    <view class="unified-header-right"></view>
  </view>

  <!-- 消息列表 -->
  <scroll-view scroll-y class="message-list">
    <!-- 免费畅聊时间提醒 (显示在推广收益上方) - 已根据需求隐藏 -->
    <view class="free-chat-banner" wx:if="{{false && freeTime && freeTime.isActive && countdownText}}" bindtap="onFreeChatTap">
      <view class="free-chat-banner-content">
        <image src="/images/icon-clock-red.png" class="banner-clock-icon" mode="aspectFit"></image>
        <text class="banner-text">剩余 {{countdownText}} 分 可以免费畅聊</text>
      </view>
    </view>

    <!-- 系统消息 -->
    <view class="message-item" wx:for="{{systemMessages}}" wx:key="id" bindtap="onMessageTap" data-id="{{item.id}}" data-type="system">
      <view class="avatar-section">
        <view class="avatar-wrapper system {{item.gradient}}">
          <image src="{{item.icon}}" class="avatar-icon" mode="aspectFit"></image>
        </view>
        <view class="badge" wx:if="{{item.unread > 0}}">{{item.unread}}</view>
      </view>
      <view class="message-content">
        <view class="message-header">
          <text class="message-name">{{item.name}}</text>
          <text class="message-time">{{item.time}}</text>
        </view>
        <text class="message-preview">{{item.preview}}</text>
      </view>
    </view>
    
    <!-- AI会话列表（支持滑动删除） -->
    <view class="swipe-container" wx:for="{{conversations}}" wx:key="id">
      <view 
        class="swipe-content {{item.swiped ? 'swiped' : ''}}" 
        bindtouchstart="onTouchStart" 
        bindtouchmove="onTouchMove" 
        bindtouchend="onTouchEnd"
        data-id="{{item.id}}"
        data-index="{{index}}"
      >
        <view class="message-item" bindtap="onMessageTap" data-id="{{item.id}}" data-type="ai" bindlongpress="onMessageLongPress">
          <view class="avatar-section">
            <view class="avatar-wrapper ai">
              <image src="{{item.avatar}}" class="avatar-image" mode="aspectFill"></image>
            </view>
            <view class="badge" wx:if="{{item.unread > 0}}">{{item.unread}}</view>
          </view>
          <view class="message-content">
            <view class="message-header">
              <text class="message-name">{{item.name}}</text>
              <text class="message-time">{{item.time}}</text>
            </view>
            <text class="message-preview">{{item.preview}}</text>
          </view>
        </view>
      </view>
      <!-- 删除按钮 -->
      <view class="swipe-actions {{item.swiped ? 'show' : ''}}">
        <view class="action-btn delete" bindtap="onSwipeDelete" data-id="{{item.id}}" data-index="{{index}}">
          <text>删除</text>
        </view>
      </view>
    </view>
    
    <!-- 加载状态 -->
    <view class="loading-tip" wx:if="{{loading}}">
      <text>加载中...</text>
    </view>
    
    <!-- 空状态 -->
    <view class="empty-tip" wx:if="{{!loading && conversations.length === 0}}">
      <text>暂无聊天记录</text>
      <text class="empty-sub">去陪伴页面挑选聊天的伙伴吧~</text>
    </view>
  </scroll-view>

  <!-- 自定义底部导航栏 -->
  <view class="custom-tabbar">
    <view class="tabbar-item" bindtap="switchTab" data-path="/pages/index/index" wx:if="{{auditStatus === 0}}">
      <image src="/images/tab-listen.png" class="tabbar-icon" mode="aspectFit"></image>
      <text class="tabbar-text">陪伴</text>
    </view>
    <view class="tabbar-item" bindtap="switchTab" data-path="/pages/entertainment/entertainment">
      <image src="/images/tab-companion.png" class="tabbar-icon" mode="aspectFit"></image>
      <text class="tabbar-text">文娱</text>
    </view>
    <view class="tabbar-item" bindtap="switchTab" data-path="/pages/service/service">
      <image src="/images/tab-service.png" class="tabbar-icon" mode="aspectFit"></image>
      <text class="tabbar-text">服务</text>
    </view>
    <view class="tabbar-item active">
      <view class="message-icon-wrapper">
        <image src="/images/tab-message-active-nodot.png" class="tabbar-icon" mode="aspectFit"></image>
      </view>
      <text class="tabbar-text active">消息</text>
    </view>
    <view class="tabbar-item" bindtap="switchTab" data-path="/pages/profile/profile">
      <image src="/images/tab-profile.png" class="tabbar-icon" mode="aspectFit"></image>
      <text class="tabbar-text">我的</text>
    </view>
  </view>
</view>
