You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
172 lines
6.3 KiB
172 lines
6.3 KiB
<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>
|