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

<view class="forum-page">
 
  <!-- 帖子详情 -->
  <scroll-view 
    class="post-detail-container" 
    scroll-y 
    scroll-with-animation
    scroll-into-view="{{scrollToId}}"
    bindscroll="onScroll"
  >
    
    <!-- 帖子主体 -->
    <view class="post-main" id="post-main">
      <!-- 帖子头部 -->
      <view class="post-header">
        <view class="user-info">
          <image class="avatar" src="{{post.avatar}}" mode="aspectFill"></image>
          <view class="user-detail">
            <view class="username">{{post.username}}</view>
            <view class="post-time">{{post.time}}</view>
          </view>
        </view>
        <view class="post-status" wx:if="{{post.solved}}">
          <text class="solved-badge">已解决</text>
        </view>
      </view>
      
      <!-- 帖子内容 -->
      <view class="post-content">
        <view class="post-title">{{post.title}}</view>
        <view class="post-desc">{{post.content}}</view>
        
        <!-- 帖子图片 -->
        <view class="post-images" wx:if="{{post.images && post.images.length > 0}}">
          <view class="images-container">
            <block wx:for="{{post.images}}" wx:for-item="image" wx:for-index="imgIndex" wx:key="index">
              <image 
                class="post-image" 
                src="{{image}}" 
                mode="aspectFill"
                data-img-index="{{imgIndex}}"
                bindtap="previewImage"
              ></image>
            </block>
          </view>
        </view>
        
     
      </view>
    
    </view>
    
    <!-- 回复列表 -->
    <view class="replies-section" id="replies-section">
      <view class="section-title">
        <text class="title-text">全部回复</text>
        <text class="reply-count">{{post.replyCount}}条</text>
      </view>
      
      <view class="reply-list" wx:if="{{post.replies && post.replies.length > 0}}">
        <block wx:for="{{post.replies}}" wx:key="replyId" wx:for-index="replyIndex">
          <view class="reply-item" id="reply-{{item.replyId}}">
            <view class="reply-user">
              <image class="reply-avatar" src="{{item.avatar}}" mode="aspectFill"></image>
              <view class="reply-user-info">
                <view class="reply-username">{{item.username}}</view>
                <view class="reply-time">{{item.time}}</view>
              </view>
            </view>
            <view class="reply-content">{{item.content}}</view>
            
            <!-- 回复操作 -->
            <view class="reply-actions">
      
              <view class="reply-action" bindtap="replyToUser" data-type="reply" data-index="{{replyIndex}}" data-username="{{item.username}}">
                <image class="reply-action-icon" src="/pagesB/images/hf.png" mode="aspectFit"></image>
                <text class="reply-action-text">回复</text>
              </view>
            </view>
            
            <!-- 评论列表 -->
            <view class="comment-list" wx:if="{{item.comments && item.comments.length > 0}}">
              <block wx:for="{{item.comments}}" wx:key="commentId">
                <view class="comment-item">
                  <view class="comment-user">
                    <image class="comment-avatar" src="{{item.avatar}}" mode="aspectFill"></image>
                    <view class="comment-user-info">
                      <view class="comment-username">{{item.username}}</view>
                      <view class="comment-time">{{item.time}}</view>
                    </view>
                  </view>
                  <view class="comment-content">
                    <text class="comment-to" wx:if="{{item.toUsername}}">@{{item.toUsername}} </text>
                    {{item.content}}
                  </view>
                  
                  <!-- 评论操作 -->
                  <view class="comment-actions">
                    <view class="comment-action" bindtap="replyToUser" 
                          data-type="comment" 
                          data-reply-index="{{replyIndex}}" 
                          data-comment-index="{{index}}"
                          data-username="{{item.username}}">
                      <text>回复</text>
                    </view>
                  </view>
                </view>
              </block>
            </view>
          </view>
        </block>
      </view>
      
      <!-- 空回复状态 -->
      <view class="empty-replies" wx:else>
        <view class="empty-reply-text">还没有回复，快来第一个回复吧！</view>
      </view>
    </view>
    
    <!-- 底部占位 -->
    <view class="bottom-placeholder" style="height: 160rpx;"></view>
  </scroll-view>
  
  <!-- 底部回复输入栏 -->
  <view class="bottom-input-container" style="transform: translateY({{inputTransformY}});">
    <view class="input-wrapper">
      <input 
        class="reply-input" 
        placeholder="{{replyPlaceholder}}" 
        value="{{replyContent}}"
        bindinput="onReplyInput"
        bindfocus="onInputFocus"
        bindblur="onInputBlur"
        bindconfirm="submitReply"
        adjust-position="{{false}}"
        focus="{{isInputFocused}}"
        maxlength="500"
      />
      <button 
        class="send-btn" 
        bindtap="submitReply" 
        disabled="{{!replyContent}}"
      >
        {{isSubmitting ? '发送中' : '发送'}}
      </button>
    </view>
    
    <!-- 回复对象显示 -->
    <view class="reply-target" wx:if="{{replyTarget.username}}">
      <text class="target-text">回复 {{replyTarget.username}}</text>
      <text class="clear-target" bindtap="clearReplyTarget">×</text>
    </view>
  </view>
  
  <!-- 图片预览模态框 -->
  <view class="preview-overlay" wx:if="{{showPreview}}" catchtap="hidePreview">
    <swiper class="preview-swiper" current="{{previewIndex}}" bindchange="onSwiperChange">
      <block wx:for="{{previewImages}}" wx:key="index">
        <swiper-item>
          <image class="preview-image" src="{{item}}" mode="aspectFit"></image>
        </swiper-item>
      </block>
    </swiper>
    <view class="preview-indicator">{{previewIndex + 1}}/{{previewImages.length}}</view>
  </view>
  
  <!-- 加载提示 -->
  <view class="loading" wx:if="{{loading}}">
    <image class="loading-icon" src="/images/loading.png" mode="aspectFit"></image>
    加载中...
  </view>
</view>