wishpal_ironfan
/
tiefen_space_op
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

anln #9

Merged
yezian merged 5 commits from anln into main 2024-08-08 22:18:02 +08:00
Conversation 0 Commits 5 Files Changed 22 +21336 -119
22 changed files with 21336 additions and 119 deletions
package-lock.jsonpackage.json
src
components
VideoPlayer
index.js
VideoUploader
index.jsx
ViewAssets
index.jsx
pages
CommentsReview
index.jsx
CreateAndEditPost
index.jsx
DeletedPostReview
index.jsx
EditSpacePost
index.jsx
Feedback
index.jsx
GoodsReview
index.jsx
ImageMachineReview
index.jsx
MediaReview
index.jsx
PostMachineReview
index.jsx
StreamerImageMachineReview
index.jsx
StreamerInformation
index.jsx
StreamerInformationCompleteNew
index.jsx
StreamerJoin
index.jsx
StreamerVerification
index.jsx
StreamerVideoMachineReview
index.jsx
TopPosts
index.jsx
ZonePostMachineReview
index.jsx

21185
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

1
package.json
View File

@ -16,6 +16,7 @@
"react": "^18.2.0",
"react-cookie": "^6.1.1",
"react-dom": "^18.2.0",
"react-player": "^2.16.0",
"react-router-dom": "^6.14.2",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"

17
src/components/VideoPlayer/index.js Normal file
View File

@ -0,0 +1,17 @@
import React, { useState } from "react";
import { Select } from "antd";
import ReactPlayer from "react-player";
export default function VideoPlayer({url,key,style}) {
const [rate, setRate] = useState(1);
return (
<div key={key} >
<ReactPlayer playbackRate={rate} url={url} width={150} controls style={style}/>
<Select onChange={(e) => setRate(e)} value={rate}>
<Select.Option value={1}>x1</Select.Option>
<Select.Option value={2}>x2</Select.Option>
<Select.Option value={3}>x3</Select.Option>
<Select.Option value={5}>x5</Select.Option>
</Select>
</div>
);
}

11
src/components/VideoUploader/index.jsx
View File

@ -1,6 +1,6 @@
import React, { useState } from "react";
import { uploadVideo } from "../../utils/upload";
import VideoPlayer from '../VideoPlayer';
const VideoUploader = ({ setIds }) => {
const [selectedVideos, setSelectedVideos] = useState([]);
const [uploading, setUploading] = useState(false);
@ -64,17 +64,12 @@ const VideoUploader = ({ setIds }) => {
<div style={{ display: "flex", flexWrap: "wrap" }}>
{selectedVideos.map((video, index) => (
<div key={index} style={{ margin: "5px" }} className="relative">
<video
controls
src={video.videoUrl}
alt={`视频 ${index + 1}`}
style={{
<VideoPlayer url={video.videoUrl} style={{
width: "100px",
height: "100px",
objectFit: "cover",
borderRadius: "8px",
}}
/>
}}/>
{video.uploadStatus === "success" && (
<p className="absolute top-0 left-0 text-green-400 font-bold bg-black/50 flex w-full h-full items-center justify-center rounded-lg">
上传成功

0
src/components/ViewAssets/index.jsx Normal file
View File

4
src/pages/CommentsReview/index.jsx
View File

@ -7,7 +7,7 @@ import {
useNavigate,
useLocation,
} from "react-router-dom";
import VideoPlayer from '../../components/VideoPlayer';
const CommentsReviewContent = (props) => {
const current = props.current;
//表头
@ -58,7 +58,7 @@ const CommentsReviewContent = (props) => {
style={{ marginBottom: 10 }}
/>
) : (
<video key={item.url} src={item.url} width={150} controls />
<VideoPlayer url={item.url}/>
)
)
: "无"}

33
src/pages/CreateAndEditPost/index.jsx
View File

@ -3,7 +3,7 @@ import { Form, Input, Table, Image, Space, Button, Modal, message } from "antd";
import baseRequest from "../../utils/baseRequest";
import ImageUploader from "../../components/ImageUploader";
import VideoUploader from "../../components/VideoUploader";
import VideoPlayer from "../../components/VideoPlayer";
const CreateAndEditPostContent = (props) => {
const { TextArea } = Input;
//表头
@ -37,16 +37,20 @@ const CreateAndEditPostContent = (props) => {
key: "media",
render: (data) => (
<div>
{data?.images?.map((item, index) => (
<Image
key={index}
src={item.urls[0]}
width={150}
style={{ marginBottom: 10 }}
/>
))}
<Image.PreviewGroup
items={data?.images?.map((item) => item.urls[0])}
>
{data?.images?.map((item, index) => (
<Image
key={index}
src={item.urls[0]}
width={150}
style={{ marginBottom: 10 }}
/>
))}
</Image.PreviewGroup>
{data?.videos?.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer key={index} url={item.urls[0]} />
))}
</div>
),
@ -541,12 +545,9 @@ const CreateAndEditPostContent = (props) => {
{defaultMedia.video_ids.length !== 0 && (
<div className="flex flex-row mt-4">
<div className="relative">
<video
src={defaultMedia.videos[0].urls[0]}
width={150}
controls
className="mr-auto"
/>
<div className="mr-auto">
<VideoPlayer url={defaultMedia.videos[0].urls[0]} />
</div>
<Button
className="absolute top-0 left-0 w-full"
danger

4
src/pages/DeletedPostReview/index.jsx
View File

@ -1,7 +1,7 @@
import React, { useState, useEffect } from "react";
import { Form, Input, Table, Image, Space, Button, Modal, message } from "antd";
import baseRequest from "../../utils/baseRequest";
import VideoPlayer from '../../components/VideoPlayer';
export default function DeletedPostReview() {
//表头
const columns = [
@ -43,7 +43,7 @@ export default function DeletedPostReview() {
/>
))}
{data?.videos?.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer key={index} url={item.urls[0]}/>
))}
</div>
),

15
src/pages/EditSpacePost/index.jsx
View File

@ -4,7 +4,7 @@ import baseRequest from "../../utils/baseRequest";
import ImageUploader from "../../components/ImageUploader";
import VideoUploader from "../../components/VideoUploader";
import { useSearchParams } from "react-router-dom";
import VideoPlayer from '../../components/VideoPlayer';
const EditSpacePostContent = (props) => {
const { TextArea } = Input;
const [searchParams, setSearchParams] = useSearchParams();
@ -55,11 +55,13 @@ const EditSpacePostContent = (props) => {
</div>
<p className="text-red-400">媒体：</p>
<div className="flex flex-wrap gap-1">
<Image.PreviewGroup items={data.media.images?.map((item) => item.urls[0])}>
{data.media.images.map((item, index) => (
<Image key={index} src={item.urls[0]} width={100} />
))}
</Image.PreviewGroup>
{data.media.videos.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer key={index} url={item.urls[0]}/>
))}
</div>
</div>
@ -509,12 +511,9 @@ const EditSpacePostContent = (props) => {
{defaultMedia.video_ids.length !== 0 && (
<div className="flex flex-row mt-4">
<div className="relative">
<video
src={defaultMedia.videos[0].urls[0]}
width={150}
controls
className="mr-auto"
/>
<div className="mr-auto" >
<VideoPlayer url={defaultMedia.videos[0].urls[0]}/>
</div>
<Button
className="absolute top-0 left-0 w-full"
danger

4
src/pages/Feedback/index.jsx
View File

@ -8,7 +8,7 @@ import {
useLocation,
} from "react-router-dom";
import baseRequest from "../../utils/baseRequest";
import VideoPlayer from '../../components/VideoPlayer';
const FeedbackContent = (props) => {
const { TextArea } = Input;
const current = props.current;
@ -44,7 +44,7 @@ const FeedbackContent = (props) => {
/>
))}
{data.videos?.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer key={index} url={item.urls[0]}/>
))}
</div>
),

4
src/pages/GoodsReview/index.jsx
View File

@ -7,7 +7,7 @@ import {
useNavigate,
useLocation,
} from "react-router-dom";
import VideoPlayer from '../../components/VideoPlayer';
const GoodsReviewContent = (props) => {
const { TextArea } = Input;
const current = props.current;
@ -49,7 +49,7 @@ const GoodsReviewContent = (props) => {
style={{ marginBottom: 10 }}
/>
) : (
<video key={item.url} src={item.url} width={150} controls />
<VideoPlayer key={item.url} url={item.url} width={150} />
)
)
: "无"}

19
src/pages/ImageMachineReview/index.jsx
View File

@ -53,9 +53,16 @@ const ImageMachineReviewContent = (props) => {
key: "newMedia",
render: (data) => (
<div className="flex flex-wrap gap-1">
{data?.map((item, index) => (
<Image key={index} src={item.urls[0]} width={100} />
))}
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
{data.map((item) => (
<Image
key={item.urls[0]}
src={item.urls[0]}
width={100}
style={{ marginBottom: 10 }}
/>
))}
</Image.PreviewGroup>
</div>
),
},
@ -65,9 +72,9 @@ const ImageMachineReviewContent = (props) => {
key: "oldMedia",
render: (data) => (
<div className="flex flex-wrap gap-1">
{data?.map((item, index) => (
<Image key={index} src={item.urls[0]} width={100} />
))}
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
<Image src={data[0].urls[0]} width={100} />
</Image.PreviewGroup>
</div>
),
},

4
src/pages/MediaReview/index.jsx
View File

@ -7,7 +7,7 @@ import {
useNavigate,
useLocation,
} from "react-router-dom";
import VideoPlayer from '../../components/VideoPlayer';
const MediaReviewContent = (props) => {
const { TextArea } = Input;
const current = props.current;
@ -59,7 +59,7 @@ const MediaReviewContent = (props) => {
style={{ marginBottom: 10 }}
/>
) : (
<video key={item.url} src={item.url} width={150} controls />
<VideoPlayer key={item.url} url={item.url} width={150} />
)
)
: "无"}

6
src/pages/PostMachineReview/index.jsx
View File

@ -8,7 +8,7 @@ import {
useLocation,
} from "react-router-dom";
import baseRequest from "../../utils/baseRequest";
import VideoPlayer from '../../components/VideoPlayer';
const PostMachineReviewContent = (props) => {
const { TextArea } = Input;
const current = props.current;
@ -47,7 +47,7 @@ const PostMachineReviewContent = (props) => {
<Image key={index} src={item.urls[0]} width={100} />
))}
{data.media?.videos?.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer key={index} url={item.urls[0]} width={150} />
))}
</div>
</div>
@ -68,7 +68,7 @@ const PostMachineReviewContent = (props) => {
<Image key={index} src={item.urls[0]} width={100} />
))}
{data.media?.videos?.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer key={index} url={item.urls[0]} width={150} />
))}
</div>
</div>

16
src/pages/StreamerImageMachineReview/index.jsx
View File

@ -53,9 +53,11 @@ const StreamerImageMachineReviewContent = (props) => {
key: "newMedia",
render: (data) => (
<div className="flex flex-wrap gap-1">
{data?.map((item, index) => (
<Image key={index} src={item.urls[0]} width={100} />
))}
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
{data?.map((item, index) => (
<Image key={index} src={item.urls[0]} width={100} />
))}
</Image.PreviewGroup>
</div>
),
},
@ -65,9 +67,11 @@ const StreamerImageMachineReviewContent = (props) => {
key: "oldMedia",
render: (data) => (
<div className="flex flex-wrap gap-1">
{data?.map((item, index) => (
<Image key={index} src={item.urls[0]} width={100} />
))}
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
{data?.map((item, index) => (
<Image key={index} src={item.urls[0]} width={100} />
))}
</Image.PreviewGroup>
</div>
),
},

28
src/pages/StreamerInformation/index.jsx
View File

@ -13,7 +13,7 @@ import Modal from "../../components/Modal";
import VideoUploader from "../../components/VideoUploader";
import ImageUploader from "../../components/ImageUploader";
import baseRequest from "../../utils/baseRequest";
import VideoPlayer from '../../components/VideoPlayer';
//tab内容
const StreamerInformationContent = () => {
const { TextArea } = Input;
@ -120,7 +120,7 @@ const StreamerInformationContent = () => {
dataIndex: "displayVideo",
key: "displayVideo",
render: (data) => (
<video src={data[0].urls[0]} width={150} controls />
<VideoPlayer url={data[0].urls[0]} width={150} />
),
};
case "displayGallery":
@ -130,14 +130,16 @@ const StreamerInformationContent = () => {
key: "displayGallery",
render: (data) => (
<div>
{data.map((item) => (
<Image
key={item.urls[0]}
src={item.urls[0]}
width={100}
style={{ marginBottom: 10 }}
/>
))}
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
{data.map((item) => (
<Image
key={item.urls[0]}
src={item.urls[0]}
width={100}
style={{ marginBottom: 10 }}
/>
))}
</Image.PreviewGroup>
</div>
),
};
@ -751,11 +753,7 @@ const StreamerInformationContent = () => {
</p>
{defaultMedia.displayVideo.length !== 0 && (
<div className="relative">
<video
src={defaultMedia.displayVideo[0].urls[0]}
width={150}
controls
/>
<VideoPlayer url={defaultMedia.displayVideo[0].urls[0]} width={150} />
<Button
className="absolute top-0 left-0 w-full"
danger

22
src/pages/StreamerInformationCompleteNew/index.jsx
View File

@ -8,7 +8,7 @@ import {
useLocation,
} from "react-router-dom";
import baseRequest from "../../utils/baseRequest";
import VideoPlayer from '../../components/VideoPlayer';
const JoinContent = (props) => {
const { TextArea } = Input;
const current = props.current;
@ -104,7 +104,7 @@ const JoinContent = (props) => {
title: "封面视频",
dataIndex: "displayVideo",
key: "displayVideo",
render: (data) => <video src={data[0].urls[0]} width={150} controls />,
render: (data) => <VideoPlayer url={data[0].urls[0]} width={150} />,
},
{
title: "相册",
@ -112,14 +112,16 @@ const JoinContent = (props) => {
key: "displayGallery",
render: (data) => (
<div>
{data.map((item) => (
<Image
key={item.urls[0]}
src={item.urls[0]}
width={100}
style={{ marginBottom: 10 }}
/>
))}
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
{data.map((item) => (
<Image
key={item.urls[0]}
src={item.urls[0]}
width={100}
style={{ marginBottom: 10 }}
/>
))}
</Image.PreviewGroup>
</div>
),
},

24
src/pages/StreamerJoin/index.jsx
View File

@ -1,5 +1,5 @@
import React, { useState, useRef, useEffect } from "react";
import { Form, Input, Button, Space, Table, Menu, Image } from "antd";
import { Form, Input, Button, Space, Table, Menu, Image, Select } from "antd";
import {
Routes,
Route,
@ -8,7 +8,7 @@ import {
useLocation,
} from "react-router-dom";
import baseRequest from "../../utils/baseRequest";
import VideoPlayer from "../../components/VideoPlayer"
const JoinContent = (props) => {
const { TextArea } = Input;
const current = props.current;
@ -133,7 +133,7 @@ const JoinContent = (props) => {
title: "封面视频",
dataIndex: "displayVideo",
key: "displayVideo",
render: (data) => <video src={data} width={150} controls />,
render: (data) => <VideoPlayer url={data}/>,
},
{
title: "相册",
@ -141,14 +141,16 @@ const JoinContent = (props) => {
key: "displayGallery",
render: (data) => (
<div>
{data.map((item) => (
<Image
key={item.urls[0]}
src={item.urls[0]}
width={100}
style={{ marginBottom: 10 }}
/>
))}
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
{data.map((item) => (
<Image
key={item.urls[0]}
src={item.urls[0]}
width={100}
style={{ marginBottom: 10 }}
/>
))}
</Image.PreviewGroup>
</div>
),
},

18
src/pages/StreamerVerification/index.jsx
View File

@ -51,14 +51,16 @@ const VerificationContent = (props) => {
key: "ID_card_photos",
render: (data) => (
<div>
{data.map((item, index) => (
<Image
key={index}
className="mb-2"
src={item.urls[0]}
width={100}
/>
))}
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
{data.map((item) => (
<Image
key={item.urls[0]}
src={item.urls[0]}
width={100}
style={{ marginBottom: 10 }}
/>
))}
</Image.PreviewGroup>
</div>
),
},

6
src/pages/StreamerVideoMachineReview/index.jsx
View File

@ -8,7 +8,7 @@ import {
useLocation,
} from "react-router-dom";
import baseRequest from "../../utils/baseRequest";
import VideoPlayer from '../../components/VideoPlayer';
const StreamerVideoMachineReviewContent = (props) => {
const { TextArea } = Input;
const current = props.current;
@ -48,7 +48,7 @@ const StreamerVideoMachineReviewContent = (props) => {
render: (data) => (
<div className="flex flex-wrap gap-1">
{data?.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer url={item.urls[0]}width={150}/>
))}
</div>
),
@ -60,7 +60,7 @@ const StreamerVideoMachineReviewContent = (props) => {
render: (data) => (
<div className="flex flex-wrap gap-1">
{data?.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer key={index} url={item.urls[0]} width={150} />
))}
</div>
),

22
src/pages/TopPosts/index.jsx
View File

@ -1,7 +1,7 @@
import React, { useState, useEffect } from "react";
import { Form, Input, Table, Image, Space, Button, Modal, message } from "antd";
import baseRequest from "../../utils/baseRequest";
import VideoPlayer from "../../components/VideoPlayer";
const TopPostsContent = (props) => {
//表头
const columns = [
@ -34,16 +34,18 @@ const TopPostsContent = (props) => {
key: "media",
render: (data) => (
<div>
{data?.images?.map((item, index) => (
<Image
key={index}
src={item.urls[0]}
width={150}
style={{ marginBottom: 10 }}
/>
))}
<Image.PreviewGroup items={data?.images?.map((item) => item.urls[0])}>
{data?.images?.map((item, index) => (
<Image
key={index}
src={item.urls[0]}
width={150}
style={{ marginBottom: 10 }}
/>
))}
</Image.PreviewGroup>
{data?.videos?.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer key={index} url={item.urls[0]} width={150} />
))}
</div>
),

12
src/pages/ZonePostMachineReview/index.jsx
View File

@ -8,7 +8,7 @@ import {
useLocation,
} from "react-router-dom";
import baseRequest from "../../utils/baseRequest";
import VideoPlayer from "../../components/VideoPlayer";
const ZonePostMachineReviewContent = (props) => {
const { TextArea } = Input;
const current = props.current;
@ -48,11 +48,13 @@ const ZonePostMachineReviewContent = (props) => {
</div>
<p className="text-red-400">媒体：</p>
<div className="flex flex-wrap gap-1">
{data.media.images.map((item, index) => (
<Image key={index} src={item.urls[0]} width={100} />
))}
<Image.PreviewGroup items={data.media.images?.map((item) => item.urls[0])}>
{data.media.images.map((item, index) => (
<Image key={index} src={item.urls[0]} width={100} />
))}
</Image.PreviewGroup>
{data.media.videos.map((item, index) => (
<video key={index} src={item.urls[0]} width={150} controls />
<VideoPlayer key={index} url={item.urls[0]} width={150} />
))}
</div>
</div>