southnote-sdk 1.0.0

package/components/post-item/post-item.wxml

@@ -0,0 +1,423 @@
+<view class="post-item" bindtap="goDetail" data-id="{{item.post.id}}">
+
+  <view wx:if="{{item.post.is_user_top === 1 || item.post.is_game_top === 1}}" class="pin-badge"> 置顶</view>
+
+  <!-- 顶部用户信息 -->
+  <view class="post-header">
+    <image class="avatar" src="{{item.user.avatar ?  item.user.avatar : '../../assets/images/icons/header_placeholder.png'}}" mode="aspectFill" />
+    <view class="user-info">
+      <view style="display: flex;align-items: center;">
+        <span class="nickname">{{item.user.nickname}}</span>
+        <view class="level-icon">
+          <image class="level-img" src="{{item.user.levelImg}}" mode="aspectFit"></image>
+          <text class="level-text">{{item.user.level}}</text>
+        </view>
+
+        <view wx:if="{{item.post.is_featured === 1}}" class="featured-tag">精</view>
+
+      </view>
+
+      <text class="time">{{item.post.formatTime}} · {{item.post.ip}}</text>
+    </view>
+
+  </view>
+
+  <!-- 文字内容 -->
+  <view id="postContent" class="post-content {{showFull ? 'show-full' : ''}}">
+
+
+
+    <view wx:if="{{item.post.vote}}" style="position: relative;bottom: 3.5rpx; display: inline-block; background-color: #002fa7; color: #fff; font-size: 20rpx; padding: 0rpx 12rpx; border-radius: 6rpx;text-align: center;line-height: 31rpx; margin: 0 5rpx 0 0;">
+      投票
+    </view>
+
+    <view wx:if="{{item.post.lottery}}" style="position: relative;bottom: 3.5rpx; display: inline-block; background-color: #ee7f13; color: #fff; font-size: 20rpx; padding: 0rpx 12rpx; border-radius: 6rpx;text-align: center;line-height: 31rpx; margin: 0 5rpx 0 0;">
+      抽奖
+    </view>
+
+    <view wx:if="{{(item.post.lottery && isLotteryEnded) || (item.post.vote && isVoteEnded)}}" style="position: relative;bottom: 3.5rpx; display: inline-block; background-color: #c5c5c5; color: black; font-size: 20rpx; padding: 0rpx 12rpx; border-radius: 6rpx;text-align: center;line-height: 31rpx; margin: 0 5rpx 0 0;">
+      已结束
+    </view>
+
+    <block wx:for="{{contentParts}}" wx:for-item="part" wx:key="part" style="color: {{part.color}}">
+      <view wx:if="{{part.type === 'br'}}" style="height: 2rpx;"></view>
+      <image wx:elif="{{part.type === 'emoji'}}" class="emoji" src="{{part.src}}" mode="aspectFit" />
+      <span wx:elif="{{part.text === ' '}}">{{' '}}</span>
+      <!-- 查看图片 -->
+      <span wx:elif="{{part.type === 'view_img'}}" style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 30rpx;" catchtap="onPreviewImage" data-src="{{part.src}}">
+        {{part.text}}
+      </span>
+      <!-- 话题（#xxx#） -->
+      <span wx:elif="{{part.type === 'topic'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="onTopicTap" data-topic="{{part.text}}">
+        {{part.text}}
+      </span>
+      <!-- 游戏 -->
+      <span wx:elif="{{part.type === 'game'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="gotoGameCenter" data-id="{{part.gameId}}">
+        {{part.text}}
+      </span>
+
+      <!-- 攻略 -->
+      <span wx:elif="{{part.type === 'guide'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="gotoWiki" data-id="{{part.guideGameId}}" data-name="{{part.guideName}}">
+        {{part.text}}
+      </span>
+
+      <!-- @某人 -->
+      <span wx:elif="{{part.type === 'at'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;">
+        {{part.text}}
+      </span>
+      <!-- 攻略标题 -->
+      <span wx:elif="{{part.type === 'title'}}" style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 32rpx;word-wrap: break-word;white-space: normal;font-weight: bold;">
+        {{part.text}}
+      </span>
+      <!-- 链接 -->
+      <span catchtap="onJumpUrlTap" data-url="{{part.url}}" wx:elif="{{part.type === 'jump_url'}}" style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 30rpx;word-wrap: break-word;white-space: normal;text-decoration: underline;">
+        {{part.text}}
+      </span>
+      <!-- 普通文本 -->
+      <span wx:else style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 30rpx;word-wrap: break-word;white-space: normal;">
+        {{part.text}}
+      </span>
+
+    </block>
+
+    <!-- 评论拼接 -->
+    <block wx:if="{{commentedContentParts.length > 0}}">
+      <span style="color: #333;"> // </span>
+      <block wx:for="{{commentedContentParts}}" wx:for-item="part" wx:key="part">
+        <view wx:if="{{part.type === 'br'}}" style="height: 2rpx;"></view>
+        <image wx:elif="{{part.type === 'emoji'}}" class="emoji" src="{{part.src}}" mode="aspectFit" />
+        <span wx:elif="{{part.type === 'view_img'}}" style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 30rpx;" catchtap="onPreviewImage" data-src="{{part.src}}">
+          {{part.text}}
+        </span>
+
+        <!-- 话题（#xxx#） -->
+        <span wx:elif="{{part.type === 'topic'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="onTopicTap" data-topic="{{part.text}}">
+          {{part.text}}
+        </span>
+        <!-- 游戏 -->
+        <span wx:elif="{{part.type === 'game'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="gotoGameCenter" data-id="{{part.gameId}}">
+          {{part.text}}
+        </span>
+
+        <!-- 攻略 -->
+        <span wx:elif="{{part.type === 'guide'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="gotoWiki" data-id="{{part.guideGameId}}" data-name="{{part.guideName}}">
+          {{part.text}}
+        </span>
+
+        <!-- @某人 -->
+        <span wx:elif="{{part.type === 'at'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;">
+          {{part.text}}
+        </span>
+        <!-- 链接 -->
+        <span catchtap="onJumpUrlTap" data-url="{{part.url}}" wx:elif="{{part.type === 'jump_url'}}" style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 30rpx;word-wrap: break-word;white-space: normal;text-decoration: underline;">
+          {{part.text}}
+        </span>
+
+
+        <span wx:else style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 30rpx;word-wrap: break-word;white-space: normal;">
+          {{part.text}}
+        </span>
+      </block>
+    </block>
+
+  </view>
+
+  <span wx:if="{{needShowReadMore && !showFull}}" class="read-more" catchtap="showFull">...全文</span>
+
+
+
+  <!-- 转发的原始帖 -->
+  <view wx:if="{{item.shared && item.shared.post}}" style="background-color: #f5f5f5; padding: 16rpx; border-radius: 10rpx; margin-top: 10rpx;" bindtap="goSharedDetail" data-id="{{item.shared.post.id}}">
+
+
+
+    <!-- 原始帖文字内容 -->
+    <view class="shared-post-content" style="margin-bottom: 10rpx;margin-top: 10rpx;font-size: 28rpx;">
+      <view wx:if="{{item.shared.post.vote}}" style="position: relative;bottom: 3.5rpx; display: inline-block; background-color: #002fa7; color: #fff; font-size: 20rpx; padding: 0rpx 12rpx; border-radius: 6rpx;text-align: center;line-height: 31rpx; margin: 0 5rpx 0 0;">
+        投票
+      </view>
+
+      <view wx:if="{{item.shared.post.lottery}}" style="position: relative;bottom: 3.5rpx; display: inline-block; background-color: #ee7f13; color: #fff; font-size: 20rpx; padding: 0rpx 12rpx; border-radius: 6rpx;text-align: center;line-height: 31rpx; margin: 0 5rpx 0 0;">
+        抽奖
+      </view>
+
+      <view wx:if="{{(item.shared.post.lottery && isLotteryEnded) || (item.shared.post.vote && isVoteEnded)}}" style="position: relative;bottom: 3.5rpx; display: inline-block; background-color: #c5c5c5; color: black; font-size: 20rpx; padding: 0rpx 12rpx; border-radius: 6rpx;text-align: center;line-height: 31rpx; margin: 0 5rpx 0 0;">
+        已结束
+      </view>
+
+      <!-- 原始用户昵称 -->
+      <span style="color: #406ce3;  margin-bottom: 8rpx;">
+        @{{item.shared.user.nickname}}:
+      </span>
+
+
+
+
+      <block wx:for="{{sharedContentParts}}" wx:for-item="part" wx:key="part">
+        <view wx:if="{{part.type === 'br'}}" style="height: 2rpx;"></view>
+        <image wx:elif="{{part.type === 'emoji'}}" class="emoji" src="{{part.src}}" mode="aspectFit" />
+        <span wx:elif="{{part.text === ' '}}">{{' '}}</span>
+
+        <!-- 话题（#xxx#） -->
+        <span wx:elif="{{part.type === 'topic'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="onTopicTap" data-topic="{{part.text}}">
+          {{part.text}}
+        </span>
+        <!-- 游戏 -->
+        <span wx:elif="{{part.type === 'game'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="gotoGameCenter" data-id="{{part.gameId}}">
+          {{part.text}}
+        </span>
+
+        <!-- 攻略 -->
+        <span wx:elif="{{part.type === 'guide'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="gotoWiki" data-id="{{part.guideGameId}}" data-name="{{part.guideName}}">
+          {{part.text}}
+        </span>
+
+        <!-- @某人 -->
+        <span wx:elif="{{part.type === 'at'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;">
+          {{part.text}}
+        </span>
+        <!-- 链接 -->
+        <span catchtap="onJumpUrlTap" data-url="{{part.url}}" wx:elif="{{part.type === 'jump_url'}}" style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 30rpx;word-wrap: break-word;white-space: normal;text-decoration: underline;">
+          {{part.text}}
+        </span>
+        <span wx:else style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 28rpx;word-wrap: break-word;white-space: normal;">
+          {{part.text}}
+        </span>
+      </block>
+    </view>
+
+    <!-- 原始帖视频 -->
+    <view wx:if="{{item.shared.post.is_video === 1}}" class="banner-video-wrapper">
+
+      <!-- 1️⃣ 未加载视频：poster + 播放按钮 -->
+      <view wx:if="{{!item.shared.post.videoUrl}}" class="video-poster-wrapper" catchtap="onBannerVideoPlay" data-id="{{item.post.id}}" data-type="shared" data-sharedid="{{item.shared.post.id}}">
+        <image class="banner-video" src="{{item.shared.post.images}}" mode="aspectFit" />
+        <!-- 播放按钮 -->
+        <view wx:if="{{item.shared.post.images}}" class="custom-play-btn" catchtap="onBannerVideoPlay" data-id="{{item.post.id}}" data-type="shared" data-sharedid="{{item.shared.post.id}}"></view>
+      </view>
+
+      <!-- 2️⃣ 已加载视频：video 播放器 -->
+      <video wx:else id="bannerVideo-{{item.post.id}}" data-video="1" class="banner-video" src="{{item.shared.post.videoUrl}}" controls="{{true}}" poster="{{item.shared.post.images}}" enable-play-gesture="{{true}}" object-fit="contain" autoplay="{{true}}" style="width: 100%;height: 100%;" bindplay="handlePlayVideo" bindpause="onVideoPause" />
+
+    </view>
+
+    <!-- 原始帖图片内容 -->
+    <!-- 单张图片 -->
+    <image wx:if="{{item.shared.post.imageArray.length === 1 && item.shared.post.is_video !== 1}}" class="{{isSuperLongImage ? 'super-long' : 'post-image'}}" src="{{item.shared.post.imageArray[0]}}" mode="{{isSuperLongImage ? 'aspectFill' : (isLongImage ? 'aspectFill' : (isHorizonImage ? 'widthFix' : 'heightFix'))}}" catchtap="previewImageMultiple" data-type="shared" data-index="1" bindload="onImageLoad" />
+
+
+
+
+    <!-- 多图显示 -->
+    <view wx:if="{{item.shared.post.imageArray.length > 1}}" class="post-image-grid">
+      <block wx:for="{{item.shared.post.imageArray}}" wx:for-item="img" wx:for-index="idx" wx:key="idx">
+        <block wx:if="{{idx < 3}}">
+          <view class="grid-image-wrapper1">
+            <image class="grid-image1" src="{{img}}" mode="aspectFill" catchtap="previewImageMultiple" data-type="shared" data-index="{{idx}}" />
+            <view wx:if="{{idx === 2 && item.shared.post.imageArray.length > 3}}" class="extra-overlay">
+              +{{item.shared.post.imageArray.length - 3}}
+            </view>
+          </view>
+        </block>
+      </block>
+    </view>
+
+    <!-- 原始帖回复提示 -->
+    <view wx:if="{{item.shared && item.shared.post && item.shared.post.comment_count > 0}}" style="margin-top: 10rpx; color: #999; font-size: 28rpx;">
+      去看{{item.shared.post.comment_count}}条回复 >
+    </view>
+
+  </view>
+
+
+  <!-- 原帖已删除 -->
+  <view class="deleted" wx:if="{{item.shared && !item.shared.post}}">
+    原文已被删除
+  </view>
+
+  <view class="deleted" wx:if="{{item.user.status === 3}}">
+    原文账户被封禁，已无法查看
+  </view>
+
+  <!-- 当前帖视频 -->
+  <view wx:if="{{item.post.is_video === 1}}" class="banner-video-wrapper">
+
+    <!-- 1️⃣ 未加载视频：poster + 播放按钮 -->
+    <view wx:if="{{!item.post.videoUrl}}" class="video-poster-wrapper" catchtap="onBannerVideoPlay" data-id="{{item.post.id}}">
+      <image class="banner-video" src="{{item.post.images}}" mode="aspectFit" />
+      <!-- 播放按钮 -->
+      <view wx:if="{{item.post.images}}" class="custom-play-btn" catchtap="onBannerVideoPlay" data-id="{{item.post.id}}"></view>
+    </view>
+
+    <!-- 2️⃣ 已加载视频：video 播放器 -->
+    <video wx:else id="bannerVideo-{{item.post.id}}" data-video="1" class="banner-video" src="{{item.post.videoUrl}}" controls="{{true}}" poster="{{item.post.images}}" enable-play-gesture="{{true}}" object-fit="contain" autoplay="{{true}}" style="width: 100%;height: 100%;" bindplay="handlePlayVideo" bindpause="onVideoPause" />
+
+  </view>
+
+
+
+  <!-- 当前帖图片内容 -->
+  <!-- 单张图片 -->
+  <image wx:if="{{!item.shared && item.post.imageArray.length === 1 && item.post.is_video !== 1}}" class="{{isSuperLongImage ? 'super-long' : 'post-image'}}" src="{{item.post.imageArray[0]}}" mode="{{isSuperLongImage ? 'aspectFill' : (isLongImage ? 'aspectFill' : (isHorizonImage ? 'widthFix' : 'heightFix'))}}" catchtap="previewImageMultiple" bindload="onImageLoad" data-type="post" data-index="1" />
+
+
+
+  <!-- 多图显示 -->
+  <view wx:if="{{!item.shared && item.post.imageArray.length > 1}}" class="post-image-grid">
+    <block wx:for="{{item.post.imageArray}}" wx:for-item="img" wx:for-index="idx" wx:key="idx">
+      <block wx:if="{{idx < 3}}">
+        <view class="grid-image-wrapper">
+          <image class="grid-image" src="{{img}}" mode="aspectFill" catchtap="previewImageMultiple" data-type="post" data-index="{{idx}}" />
+          <view wx:if="{{idx === 2 && item.post.imageArray.length > 3}}" class="extra-overlay">+{{item.post.imageArray.length - 3}}</view>
+        </view>
+      </block>
+    </block>
+  </view>
+
+  <!-- 热评栏 -->
+  <view wx:if="{{item.hot && hotContentParts.length}}" class="hot-comment">
+
+    <!-- 左侧「热评」标识 -->
+    <view class="hot-label">
+      <text>热评</text>
+    </view>
+
+    <!-- 中间内容 -->
+    <view class="hot-body">
+
+      <!-- 用户名 -->
+
+      <!-- 内容（最多两行） -->
+      <view class="hot-content">
+        <text class="hot-user">@{{item.hot.user.nickname}}</text>
+        <text>:</text>
+        <block wx:for="{{hotContentParts}}" wx:key="index">
+          <view wx:if="{{item.type === 'br'}}"></view>
+
+          <image wx:elif="{{item.type === 'emoji'}}" class="emoji emoji-hot" src="{{item.src}}" mode="aspectFit" />
+
+          <!-- 查看图片 -->
+          <span wx:elif="{{part.type === 'view_img'}}" style="color: {{part.color || '#333'}};line-height: 45rpx;font-size: 26rpx;" catchtap="onPreviewImage" data-src="{{item.src}}">
+            {{item.text}}
+          </span>
+
+          <text wx:elif="{{item.type === 'topic'}}" class="hot-link" catchtap="onTopicTap" data-topic="{{item.text}}">{{item.text}}</text>
+
+          <!-- 游戏 -->
+          <span wx:elif="{{part.type === 'game'}}" style="color: #406ce3;line-height: 45rpx;font-size: 26rpx;" catchtap="gotoGameCenter" data-id="{{item.gameId}}">
+            {{item.text}}
+          </span>
+
+          <!-- 攻略 -->
+          <span wx:elif="{{part.type === 'guide'}}" style="color: #406ce3;line-height: 45rpx;font-size: 30rpx;" catchtap="gotoWiki" data-id="{{part.guideGameId}}" data-name="{{part.guideName}}">
+            {{part.text}}
+          </span>
+
+          <text wx:elif="{{item.type === 'at'}}" class="hot-link">{{item.text}}</text>
+
+          <text wx:elif="{{item.type === 'jump_url'}}" class="hot-link" catchtap="onJumpUrlTap" data-url="{{item.url}}">{{item.text}}</text>
+
+          <text wx:else class="hot-text">{{item.text}}</text>
+        </block>
+      </view>
+
+    </view>
+
+    <!-- 右侧点赞 -->
+    <view class="hot-like" catch:tap="onHotLike">
+
+      <image wx:if="{{item.hot.comment.is_like === 1}}" src="../../assets/images/icons/home_liked.png" class="hot-like-icon" />
+
+      <image wx:else src="../../assets/images/icons/home_like.png" class="hot-like-icon" />
+
+      <view class="hot-like-count">
+        {{item.hot.comment.like_count}}
+      </view>
+
+    </view>
+
+
+  </view>
+
+
+
+
+  <!-- 游戏栏 -->
+  <view wx:if="{{item.game.id}}">
+    <view catchtap="gotoGameCenter" data-id="{{item.game.id}}" style="background-color: #F7F7F7;display: inline-flex;padding: 5px 6px;border-radius: 5px;align-items: center;margin-top: 8px;">
+      <image src="../../assets/images/icons/input_game.png" style="width: 20px; height: 15px;" />
+      <span style="font-weight: bold;margin-left: 8px;font-size: 26rpx;">{{item.game.name}}</span>
+    </view>
+  </view>
+
+  <!-- 操作栏 -->
+  <view class="post-actions">
+    <view class="action" catchtap="shareTap">
+      <image src="../../assets/images/icons/home_share.png" style="width: 20px; height: 20px;" />
+      <text class="action-text" wx:if="{{item.post.share_count === 0}}">转发</text>
+      <text class="action-text" wx:if="{{item.post.share_count !== 0}}"> {{item.post.share_count}}</text>
+    </view>
+    <view class="action" catch:tap="commonTap">
+      <image src="../../assets/images/icons/home_comment.png" style="width: 20px; height: 20px;" />
+      <text class="action-text" wx:if="{{item.post.comment_count === 0}}">评论</text>
+      <text class="action-text" wx:if="{{item.post.comment_count !== 0}}"> {{item.post.comment_count}}</text>
+    </view>
+
+    <view class="action" catchtap="likeTap">
+      <image animation="{{likeAnimation}}" src="{{item.post.is_like === 1 ? '../../assets/images/icons/home_liked.png' : '../../assets/images/icons/home_like.png'}}" style="width: 20px; height: 20px;" />
+      <text class="action-text" wx:if="{{item.post.like_count === 0}}">赞</text>
+      <text class="action-text" wx:if="{{item.post.like_count !== 0}}"> {{item.post.like_count}}</text>
+    </view>
+
+    <!-- 更多按钮 -->
+    <view class="action more-btn" catchtap="onMoreTap" data-post="{{item.post}}">
+      <image src="../../assets/images/icons/icon_more.png" style="width: 20px; height: 20px;" />
+    </view>
+
+  </view>
+
+</view>
+<!-- 分割线 -->
+<view class="divider"></view>
+
+<!-- 底部弹窗 -->
+<view wx:if="{{showSheet}}" class="custom-sheet-wrapper" catchtap="onCloseSheet">
+  <view class="custom-sheet" catchtap="stopPropagation">
+    <view class="sheet-buttons">
+      <view wx:if="{{isOwner}}" class="sheet-button" bindtap="onDelete">
+        <view class="icon-wrapper">
+          <van-icon name="delete" size="30" />
+        </view>
+        <text class="sheet-text">删除</text>
+      </view>
+
+      <!-- 置顶/取消置顶按钮 -->
+      <view wx:if="{{showPinButton}}" class="sheet-button" bindtap="onPinTap">
+        <view class="icon-wrapper">
+          <van-icon name="{{isPinned ? 'down' : 'back-top'}} " size="30" style="color: {{isPinned ? '#ff7d00' : '#333'}};" />
+        </view>
+        <text class="sheet-text">{{isPinned ? '取消置顶' : '主页置顶'}}</text>
+      </view>
+
+
+      <view class="sheet-button" bindtap="onReport">
+        <view class="icon-wrapper">
+          <van-icon name="warning" size="30" />
+        </view>
+        <text class="sheet-text">举报</text>
+      </view>
+
+
+      <view class="sheet-button" bindtap="onFavorite">
+        <view class="icon-wrapper">
+          <van-icon name="star" size="30" color="{{item.post.is_collect === 1 ? '#ff7d00' : '#333'}}" />
+        </view>
+        <text class="sheet-text">{{item.post.is_collect === 1 ? '已收藏' : '收藏'}}</text>
+
+      </view>
+
+    </view>
+    <view class="sheet-divider"></view>
+    <view class="sheet-cancel" bindtap="onCloseSheet">取消</view>
+  </view>
+</view>