|
@@ -24,9 +24,10 @@ interface VideoSelectModalProps {
|
|
onClose: () => void;
|
|
onClose: () => void;
|
|
onOk: (selectedVideos: VideoItem[]) => void;
|
|
onOk: (selectedVideos: VideoItem[]) => void;
|
|
initialSelectedIds?: number[];
|
|
initialSelectedIds?: number[];
|
|
|
|
+ selectedVideos?: VideoItem[];
|
|
}
|
|
}
|
|
|
|
|
|
-const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ visible, onClose, onOk, initialSelectedIds = [] }) => {
|
|
|
|
|
|
+const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ visible, onClose, onOk, initialSelectedIds = [], selectedVideos = [] }) => {
|
|
const { videoCategoryOptions } = useVideoCategoryOptions();
|
|
const { videoCategoryOptions } = useVideoCategoryOptions();
|
|
const [category, setCategory] = useState<string>();
|
|
const [category, setCategory] = useState<string>();
|
|
const [searchTerm, setSearchTerm] = useState<string>('');
|
|
const [searchTerm, setSearchTerm] = useState<string>('');
|
|
@@ -54,15 +55,19 @@ const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ visible, onClose, o
|
|
setLoading(false);
|
|
setLoading(false);
|
|
});
|
|
});
|
|
if (res && res.code === 0) {
|
|
if (res && res.code === 0) {
|
|
- setVideoList(res.data.objs);
|
|
|
|
- setVideoListAll(old => [...old, ...res.data.objs]);
|
|
|
|
|
|
+ setVideoList([...selectedVideos, ...res.data.objs.filter(v => !selectedVideos.find(ov => ov.videoId === v.videoId))]);
|
|
|
|
+ setVideoListAll(old => [...old, ...res.data.objs.filter(v => !old.find(ov => ov.videoId === v.videoId))]);
|
|
setTotal(res.data.totalSize);
|
|
setTotal(res.data.totalSize);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
- getVideoList();
|
|
|
|
- }, []);
|
|
|
|
|
|
+ if (visible) {
|
|
|
|
+ setVideoList(selectedVideos);
|
|
|
|
+ setVideoListAll(selectedVideos);
|
|
|
|
+ getVideoList(0);
|
|
|
|
+ }
|
|
|
|
+ }, [visible]);
|
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
if (visible) {
|
|
if (visible) {
|
|
@@ -93,8 +98,8 @@ const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ visible, onClose, o
|
|
};
|
|
};
|
|
|
|
|
|
const handleOk = () => {
|
|
const handleOk = () => {
|
|
- const selectedVideos = videoListAll.filter(video => selectedVideoIds.has(video.videoId));
|
|
|
|
- onOk(selectedVideos);
|
|
|
|
|
|
+ const _selectedVideos = videoListAll.filter(video => selectedVideoIds.has(video.videoId));
|
|
|
|
+ onOk(_selectedVideos);
|
|
onClose();
|
|
onClose();
|
|
};
|
|
};
|
|
|
|
|
|
@@ -177,13 +182,13 @@ const VideoSelectModal: React.FC<VideoSelectModalProps> = ({ visible, onClose, o
|
|
>
|
|
>
|
|
<div className="p-3">
|
|
<div className="p-3">
|
|
<Text type="secondary" className="text-xs">票圈 | 3亿人喜欢的视频平台</Text>
|
|
<Text type="secondary" className="text-xs">票圈 | 3亿人喜欢的视频平台</Text>
|
|
- <Text className="block mt-1 mb-2 leading-tight line-clamp-2" title={video.title}>{video.title}</Text>
|
|
|
|
|
|
+ <Text className="block mt-1 mb-2 leading-tight line-clamp-2" title={video.customTitle || video.title}>{video.customTitle || video.title}</Text>
|
|
</div>
|
|
</div>
|
|
<div
|
|
<div
|
|
className="relative h-[120px] bg-gray-200 group/thumb"
|
|
className="relative h-[120px] bg-gray-200 group/thumb"
|
|
onClick={(e) => { e.stopPropagation(); playVideo(video); }}
|
|
onClick={(e) => { e.stopPropagation(); playVideo(video); }}
|
|
>
|
|
>
|
|
- <img src={video.cover} alt={video.title} referrerPolicy="no-referrer" className="w-full h-full object-cover" />
|
|
|
|
|
|
+ <img src={video.customCover || video.cover} alt={video.customTitle || video.title} referrerPolicy="no-referrer" className="w-full h-full object-cover" />
|
|
<div className="absolute inset-0 flex justify-center items-center cursor-pointer">
|
|
<div className="absolute inset-0 flex justify-center items-center cursor-pointer">
|
|
<CaretRightFilled className="!text-white text-4xl bg-black/20 rounded-full p-1 pl-2" />
|
|
<CaretRightFilled className="!text-white text-4xl bg-black/20 rounded-full p-1 pl-2" />
|
|
</div>
|
|
</div>
|