Przeglądaj źródła

卡片只保留推荐指数,提升滚动加载流畅度

- 卡片底部去掉 平台传播得分/行业裂变率/本渠道传播率,只保留单行「推荐指数」,取接口 score 字段
- PAGE_SIZE 10 → 20,初次和每次加载条数翻倍
- IntersectionObserver rootMargin 200px → 800px,提前到剩约一屏时触发下一页

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
刘立冬 1 dzień temu
rodzic
commit
e7b75f2373

+ 4 - 9
src/views/publishContent/weCom/components/videoSelectModal/index.tsx

@@ -38,7 +38,7 @@ const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ visible, onClose, o
 	const { videoCategoryOptions } = useVideoCategoryOptions();
 	const [category, setCategory] = useState<string>();
 	const sort = VideoSortType.推荐指数;
-	const PAGE_SIZE = 10;
+	const PAGE_SIZE = 20;
 	const [searchTerm, setSearchTerm] = useState<string>('');
 	const [currentPage, setCurrentPage] = useState(1);
 	const [total, setTotal] = useState(0);
@@ -121,7 +121,7 @@ const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ visible, onClose, o
 			if (entries[0].isIntersecting && hasMoreRef.current && !loadingMoreRef.current && !loadingRef.current) {
 				getVideoListRef.current?.(currentPageRef.current + 1, true);
 			}
-		}, { rootMargin: '200px' });
+		}, { rootMargin: '800px' });
 		observerRef.current.observe(node);
 	}, []);
 
@@ -257,13 +257,8 @@ const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ visible, onClose, o
 									</div>
 								</div>
 								<div className="p-3 flex justify-between items-center">
-									<div className="flex flex-col gap-1">
-										<Text type="secondary" className="text-xs">推荐指数: {video.recommendScore?.toFixed(2) || '无'}</Text>
-										<Text type="secondary" className="text-xs">平台传播得分: {video.score?.toFixed(2) || '无'}</Text>
-										<Text type="secondary" className="text-xs">行业裂变率: {video.industryFissionRate?.toFixed(2) || '无'}</Text>
-										<Text type="secondary" className="text-xs">本渠道传播率: {video.channelFissionRate?.toFixed(2) || '无'}</Text>
-									</div>
-								{isSelected ? (
+									<Text type="secondary" className="text-sm">推荐指数: <span className="text-gray-700 font-medium">{video.score?.toFixed(2) || '无'}</span></Text>
+									{isSelected ? (
 										<CheckCircleFilled className="text-green-500 text-xl" />
 									) : (
 										<div className={`w-5 h-5 border-2 ${isDisabled ? 'border-gray-200 bg-gray-100' : 'border-gray-300' } rounded-full`}></div>

+ 3 - 8
src/views/publishContent/weGZH/components/videoSelectModal/index.tsx

@@ -34,7 +34,7 @@ const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ planType, visible,
 	const { videoCategoryOptions } = useVideoCategoryOptions();
 	const [category, setCategory] = useState<string>();
 	const sort = VideoSortType.推荐指数;
-	const PAGE_SIZE = 10;
+	const PAGE_SIZE = 20;
 	const [searchTerm, setSearchTerm] = useState<string>('');
 	const [currentPage, setCurrentPage] = useState(1);
 	const [total, setTotal] = useState(0);
@@ -132,7 +132,7 @@ const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ planType, visible,
 			if (entries[0].isIntersecting && hasMoreRef.current && !loadingMoreRef.current && !loadingRef.current) {
 				getVideoListRef.current?.(currentPageRef.current + 1, true);
 			}
-		}, { rootMargin: '200px' });
+		}, { rootMargin: '800px' });
 		observerRef.current.observe(node);
 	}, []);
 
@@ -243,12 +243,7 @@ const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ planType, visible,
 									</div>
 								</div>
 								<div className="p-3 flex justify-between items-center">
-									<div className="flex flex-col gap-1">
-										<Text type="secondary" className="text-xs">推荐指数: {video.recommendScore?.toFixed(2) || '无'}</Text>
-										<Text type="secondary" className="text-xs">平台传播得分: {video.score?.toFixed(2) || '无'}</Text>
-										<Text type="secondary" className="text-xs">行业裂变率: {video.industryFissionRate?.toFixed(2) || '无'}</Text>
-										<Text type="secondary" className="text-xs">本渠道传播率: {video.channelFissionRate?.toFixed(2) || '无'}</Text>
-									</div>
+									<Text type="secondary" className="text-sm">推荐指数: <span className="text-gray-700 font-medium">{video.score?.toFixed(2) || '无'}</span></Text>
 									{isSelected ? (
 										<CheckCircleFilled className="text-green-500 text-xl" />
 									) : (