完善功能图片浏览功能
This commit is contained in:
parent
ad47c28d0f
commit
a02e57e404
|
@ -3,7 +3,7 @@ import { Form, Input, Table, Image, Space, Button, Modal, message } from "antd";
|
||||||
import baseRequest from "../../utils/baseRequest";
|
import baseRequest from "../../utils/baseRequest";
|
||||||
import ImageUploader from "../../components/ImageUploader";
|
import ImageUploader from "../../components/ImageUploader";
|
||||||
import VideoUploader from "../../components/VideoUploader";
|
import VideoUploader from "../../components/VideoUploader";
|
||||||
import VideoPlayer from '../../components/VideoPlayer';
|
import VideoPlayer from "../../components/VideoPlayer";
|
||||||
const CreateAndEditPostContent = (props) => {
|
const CreateAndEditPostContent = (props) => {
|
||||||
const { TextArea } = Input;
|
const { TextArea } = Input;
|
||||||
//表头
|
//表头
|
||||||
|
@ -37,16 +37,20 @@ const CreateAndEditPostContent = (props) => {
|
||||||
key: "media",
|
key: "media",
|
||||||
render: (data) => (
|
render: (data) => (
|
||||||
<div>
|
<div>
|
||||||
{data?.images?.map((item, index) => (
|
<Image.PreviewGroup
|
||||||
<Image
|
items={data?.images?.map((item) => item.urls[0])}
|
||||||
key={index}
|
>
|
||||||
src={item.urls[0]}
|
{data?.images?.map((item, index) => (
|
||||||
width={150}
|
<Image
|
||||||
style={{ marginBottom: 10 }}
|
key={index}
|
||||||
/>
|
src={item.urls[0]}
|
||||||
))}
|
width={150}
|
||||||
|
style={{ marginBottom: 10 }}
|
||||||
|
/>
|
||||||
|
))}
|
||||||
|
</Image.PreviewGroup>
|
||||||
{data?.videos?.map((item, index) => (
|
{data?.videos?.map((item, index) => (
|
||||||
<VideoPlayer key={index} url={item.urls[0]}/>
|
<VideoPlayer key={index} url={item.urls[0]} />
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
),
|
),
|
||||||
|
@ -542,7 +546,7 @@ const CreateAndEditPostContent = (props) => {
|
||||||
<div className="flex flex-row mt-4">
|
<div className="flex flex-row mt-4">
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<div className="mr-auto">
|
<div className="mr-auto">
|
||||||
<VideoPlayer url={defaultMedia.videos[0].urls[0]}/>
|
<VideoPlayer url={defaultMedia.videos[0].urls[0]} />
|
||||||
</div>
|
</div>
|
||||||
<Button
|
<Button
|
||||||
className="absolute top-0 left-0 w-full"
|
className="absolute top-0 left-0 w-full"
|
||||||
|
|
|
@ -55,9 +55,11 @@ const EditSpacePostContent = (props) => {
|
||||||
</div>
|
</div>
|
||||||
<p className="text-red-400">媒体:</p>
|
<p className="text-red-400">媒体:</p>
|
||||||
<div className="flex flex-wrap gap-1">
|
<div className="flex flex-wrap gap-1">
|
||||||
|
<Image.PreviewGroup items={data.media.images?.map((item) => item.urls[0])}>
|
||||||
{data.media.images.map((item, index) => (
|
{data.media.images.map((item, index) => (
|
||||||
<Image key={index} src={item.urls[0]} width={100} />
|
<Image key={index} src={item.urls[0]} width={100} />
|
||||||
))}
|
))}
|
||||||
|
</Image.PreviewGroup>
|
||||||
{data.media.videos.map((item, index) => (
|
{data.media.videos.map((item, index) => (
|
||||||
<VideoPlayer key={index} url={item.urls[0]}/>
|
<VideoPlayer key={index} url={item.urls[0]}/>
|
||||||
))}
|
))}
|
||||||
|
|
|
@ -53,9 +53,11 @@ const StreamerImageMachineReviewContent = (props) => {
|
||||||
key: "newMedia",
|
key: "newMedia",
|
||||||
render: (data) => (
|
render: (data) => (
|
||||||
<div className="flex flex-wrap gap-1">
|
<div className="flex flex-wrap gap-1">
|
||||||
{data?.map((item, index) => (
|
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
|
||||||
<Image key={index} src={item.urls[0]} width={100} />
|
{data?.map((item, index) => (
|
||||||
))}
|
<Image key={index} src={item.urls[0]} width={100} />
|
||||||
|
))}
|
||||||
|
</Image.PreviewGroup>
|
||||||
</div>
|
</div>
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
|
@ -65,9 +67,11 @@ const StreamerImageMachineReviewContent = (props) => {
|
||||||
key: "oldMedia",
|
key: "oldMedia",
|
||||||
render: (data) => (
|
render: (data) => (
|
||||||
<div className="flex flex-wrap gap-1">
|
<div className="flex flex-wrap gap-1">
|
||||||
{data?.map((item, index) => (
|
<Image.PreviewGroup items={data?.map((item) => item.urls[0])}>
|
||||||
<Image key={index} src={item.urls[0]} width={100} />
|
{data?.map((item, index) => (
|
||||||
))}
|
<Image key={index} src={item.urls[0]} width={100} />
|
||||||
|
))}
|
||||||
|
</Image.PreviewGroup>
|
||||||
</div>
|
</div>
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React, { useState, useEffect } from "react";
|
import React, { useState, useEffect } from "react";
|
||||||
import { Form, Input, Table, Image, Space, Button, Modal, message } from "antd";
|
import { Form, Input, Table, Image, Space, Button, Modal, message } from "antd";
|
||||||
import baseRequest from "../../utils/baseRequest";
|
import baseRequest from "../../utils/baseRequest";
|
||||||
import VideoPlayer from '../../components/VideoPlayer';
|
import VideoPlayer from "../../components/VideoPlayer";
|
||||||
const TopPostsContent = (props) => {
|
const TopPostsContent = (props) => {
|
||||||
//表头
|
//表头
|
||||||
const columns = [
|
const columns = [
|
||||||
|
@ -34,16 +34,18 @@ const TopPostsContent = (props) => {
|
||||||
key: "media",
|
key: "media",
|
||||||
render: (data) => (
|
render: (data) => (
|
||||||
<div>
|
<div>
|
||||||
{data?.images?.map((item, index) => (
|
<Image.PreviewGroup items={data?.images?.map((item) => item.urls[0])}>
|
||||||
<Image
|
{data?.images?.map((item, index) => (
|
||||||
key={index}
|
<Image
|
||||||
src={item.urls[0]}
|
key={index}
|
||||||
width={150}
|
src={item.urls[0]}
|
||||||
style={{ marginBottom: 10 }}
|
width={150}
|
||||||
/>
|
style={{ marginBottom: 10 }}
|
||||||
))}
|
/>
|
||||||
|
))}
|
||||||
|
</Image.PreviewGroup>
|
||||||
{data?.videos?.map((item, index) => (
|
{data?.videos?.map((item, index) => (
|
||||||
<VideoPlayer key={index} url={item.urls[0]} width={150} />
|
<VideoPlayer key={index} url={item.urls[0]} width={150} />
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
),
|
),
|
||||||
|
|
|
@ -8,7 +8,7 @@ import {
|
||||||
useLocation,
|
useLocation,
|
||||||
} from "react-router-dom";
|
} from "react-router-dom";
|
||||||
import baseRequest from "../../utils/baseRequest";
|
import baseRequest from "../../utils/baseRequest";
|
||||||
import VideoPlayer from '../../components/VideoPlayer';
|
import VideoPlayer from "../../components/VideoPlayer";
|
||||||
const ZonePostMachineReviewContent = (props) => {
|
const ZonePostMachineReviewContent = (props) => {
|
||||||
const { TextArea } = Input;
|
const { TextArea } = Input;
|
||||||
const current = props.current;
|
const current = props.current;
|
||||||
|
@ -48,11 +48,13 @@ const ZonePostMachineReviewContent = (props) => {
|
||||||
</div>
|
</div>
|
||||||
<p className="text-red-400">媒体:</p>
|
<p className="text-red-400">媒体:</p>
|
||||||
<div className="flex flex-wrap gap-1">
|
<div className="flex flex-wrap gap-1">
|
||||||
{data.media.images.map((item, index) => (
|
<Image.PreviewGroup items={data.media.images?.map((item) => item.urls[0])}>
|
||||||
<Image key={index} src={item.urls[0]} width={100} />
|
{data.media.images.map((item, index) => (
|
||||||
))}
|
<Image key={index} src={item.urls[0]} width={100} />
|
||||||
|
))}
|
||||||
|
</Image.PreviewGroup>
|
||||||
{data.media.videos.map((item, index) => (
|
{data.media.videos.map((item, index) => (
|
||||||
<VideoPlayer key={index} url={item.urls[0]} width={150} />
|
<VideoPlayer key={index} url={item.urls[0]} width={150} />
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue