wxamp-ymtxUser/pagesB/pages/forumlist/forumlist.wxml

<view class="forum-list-page">
  
  <!-- 顶部栏 -->
  <view class="header">
    <view class="title">问答论坛</view>
    <button class="add-btn" bindtap="createPost">提问</button>
  </view>
  
  <!-- 筛选栏 -->
  <view class="filter-bar">
    <scroll-view class="filter-scroll" scroll-x>
      <view class="filter-list">
        <view 
          class="filter-item {{currentFilter === 'all' ? 'active' : ''}}" 
          bindtap="changeFilter" 
          data-type="all"
        >
          <text>全部</text>
        </view>
        <view 
          class="filter-item {{currentFilter === 'unsolved' ? 'active' : ''}}" 
          bindtap="changeFilter" 
          data-type="unsolved"
        >
          <text>待解决</text>
        </view>
        <view 
          class="filter-item {{currentFilter === 'solved' ? 'active' : ''}}" 
          bindtap="changeFilter" 
          data-type="solved"
        >
          <text>已解决</text>
        </view>
        <view 
          class="filter-item {{currentFilter === 'hot' ? 'active' : ''}}" 
          bindtap="changeFilter" 
          data-type="hot"
        >
          <text>热门</text>
        </view>
        <view 
          class="filter-item {{currentFilter === 'mine' ? 'active' : ''}}" 
          bindtap="changeFilter" 
          data-type="mine"
        >
          <text>我的帖子</text>
        </view>
      </view>
    </scroll-view>
  </view>
  
  <!-- 搜索框 -->
  <view class="search-container">
    <view class="search-input-wrapper">
      <image class="search-icon" src="/images/search.png" mode="aspectFit"></image>
      <input 
        class="search-input" 
        placeholder="搜索问题或关键词..." 
        value="{{searchKeyword}}"
        bindinput="onSearchInput"
        bindconfirm="onSearchConfirm"
        confirm-type="search"
      />
      <view class="search-clear" wx:if="{{searchKeyword}}" bindtap="clearSearch">
        ×
      </view>
    </view>
  </view>
  
  <!-- 帖子列表 -->
  <scroll-view 
    class="post-list-container" 
    scroll-y 
    enable-back-to-top
    bindscrolltolower="loadMore"
    refresher-enabled="{{true}}"
    refresher-triggered="{{refreshing}}"
    bindrefresherrefresh="onRefresh"
  >
    
    <!-- 空状态 -->
    <view class="empty-state" wx:if="{{!loading && posts.length === 0}}">
      <image class="empty-image" src="/images/empty-forum.png" mode="aspectFit"></image>
      <view class="empty-text" wx:if="{{searchKeyword}}">
        没有找到"{{searchKeyword}}"相关的问题
      </view>
      <view class="empty-text" wx:else>
        暂无帖子，快来发布第一个问题吧！
      </view>
      <button class="empty-btn" bindtap="createPost" wx:if="{{!searchKeyword}}">发布问题</button>
      <button class="empty-btn" bindtap="clearSearch" wx:else>清空搜索</button>
    </view>
    
    <!-- 帖子列表 -->
    <view class="post-list" wx:if="{{posts.length > 0}}">
      <block wx:for="{{posts}}" wx:key="id">
        <view class="post-item" data-id="{{item.id}}" bindtap="goToDetail">
          
          <!-- 左侧状态栏 -->
          <view class="post-status-side">
            <view class="vote-count">
              <view class="vote-number">{{item.likeCount}}</view>
              <view class="vote-label">点赞</view>
            </view>
            <view class="reply-count">
              <view class="reply-number">{{item.replyCount}}</view>
              <view class="reply-label">回答</view>
            </view>
            <view class="view-count">
              <view class="view-number">{{item.viewCount}}</view>
              <view class="view-label">浏览</view>
            </view>
          </view>
          
          <!-- 右侧内容区 -->
          <view class="post-content-main">
            
            <!-- 帖子标题和状态 -->
            <view class="post-header">
              <view class="post-title">{{item.title}}</view>
              <view class="status-badge" wx:if="{{item.solved}}">
                <text class="solved-badge">已解决</text>
              </view>
              <view class="status-badge" wx:if="{{item.hot}}">
                <text class="hot-badge">热门</text>
              </view>
            </view>
            
            <!-- 帖子内容摘要 -->
            <view class="post-summary">{{item.summary}}</view>
            
            <!-- 帖子元信息 -->
            <view class="post-meta">
              
              <!-- 用户信息 -->
              <view class="user-info">
                <image class="user-avatar" src="{{item.avatar}}" mode="aspectFill"></image>
                <text class="username">{{item.username}}</text>
                <text class="separator">·</text>
                <text class="post-time">{{item.time}}</text>
              </view>
              
              <!-- 标签 -->
              <view class="post-tags" wx:if="{{item.tags && item.tags.length > 0}}">
                <block wx:for="{{item.tags.slice(0, 2)}}" wx:key="index">
                  <text class="tag">{{item}}</text>
                </block>
                <text class="more-tags" wx:if="{{item.tags.length > 2}}">+{{item.tags.length - 2}}</text>
              </view>
              
            </view>
            
            <!-- 最后回复信息 -->
            <view class="last-reply" wx:if="{{item.lastReply}}">
              <text class="last-reply-label">最后回复：</text>
              <text class="last-reply-user">{{item.lastReply.username}}</text>
              <text class="separator">·</text>
              <text class="last-reply-time">{{item.lastReply.time}}</text>
            </view>
            
          </view>
          
        </view>
      </block>
      
      <!-- 加载更多 -->
      <view class="load-more" wx:if="{{hasMore && posts.length > 0}}">
        <view class="loading-text" wx:if="{{!loadingMore}}">
          上拉加载更多
        </view>
        <view class="loading-more" wx:else>
          <image class="loading-icon" src="/images/loading.png" mode="aspectFit"></image>
          加载中...
        </view>
      </view>
      
      <!-- 没有更多了 -->
      <view class="no-more" wx:if="{{!hasMore && posts.length > 0}}">
        <text>没有更多了</text>
      </view>
      
    </view>
    
    <!-- 底部占位 -->
    <view class="bottom-placeholder"></view>
    
  </scroll-view>
  
  <!-- 加载提示 -->
  <view class="loading" wx:if="{{loading && posts.length === 0}}">
    <image class="loading-icon" src="/images/loading.png" mode="aspectFit"></image>
    加载中...
  </view>
  
  <!-- 创建帖子浮动按钮 -->
  <view class="fab-container" wx:if="{{!searchKeyword}}">
    <view class="fab" bindtap="createPost">
      <image class="fab-icon" src="/images/add.png" mode="aspectFit"></image>
    </view>
  </view>
  
</view>