fix preview overflow

miniprogram/components/journal-detail-panel/index.ts

@@ -96,21 +96,28 @@ Component({
 
 		/** 预览媒体 */
 		previewMedia(e: WechatMiniprogram.BaseEvent) {
-			const { mediaIndex } = e.currentTarget.dataset;
 			const journals = this.properties.journals as JournalInfo[];
-			if (!journals || journals.length === 0) return;
+			if (!journals || journals.length === 0) {
-
+				return;
-			// 使用当前 swiper 的索引
+			}
-			const journal = journals[this.data.currentJournalIndex];
+			const { itemIndex } = e.currentTarget.dataset;
-			const sources = journal.items.map((item: any) => ({
+			const items = journals[this.data.currentJournalIndex].items;
-				url: item.sourceURL,
+			const total = items.length;
-				type: item.type === 0 ? "image" : "video"
+			
-			}));
+			const startIndex = Math.max(0, itemIndex - 25);
+			const endIndex = Math.min(total, startIndex + 50);
+			const newCurrentIndex = itemIndex - startIndex;
 
+			const sources = items.slice(startIndex, endIndex).map((item) => {
+				return {
+					url: item.sourceURL,
+					type: item.type === 0 ? "image" : "video"
+				}
+			}) as any;
 			wx.previewMedia({
-				current: mediaIndex,
+				current: newCurrentIndex,
-				sources: sources as WechatMiniprogram.MediaSource[]
+				sources
-			});
+			})
 		}
 	}
 });

miniprogram/components/journal-detail-panel/index.wxml

@@ -41,13 +41,13 @@
 							<scroll-view wx:if="{{item.items && item.items.length > 0}}" scroll-y class="items-scroll">
 								<view class="items">
 									<view class="wrapper">
-										<block wx:for="{{item.items}}" wx:key="mongoId" wx:for-item="media" wx:for-index="mediaIndex">
+										<block wx:for="{{item.items}}" wx:key="mongoId" wx:for-item="media" wx:for-index="itemIndex">
 											<image
 												class="item thumbnail {{media.type === 1 ? 'video' : 'image'}}"
 												src="{{media.thumbURL}}"
 												mode="widthFix"
 												catchtap="previewMedia"
-												data-media-index="{{mediaIndex}}"
+												data-item-index="{{itemIndex}}"
 											/>
 										</block>
 									</view>