yexuejc007/PlayEdu-backend
1
0
Fork 0
mirror of https://github.com/PlayEdu/backend synced 2025-12-23 07:09:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

视频列表优化

Browse Source
This commit is contained in:
禺狨
2023-03-10 18:46:19 +08:00
parent 97caa68565
commit 5bc78f6192
6 changed files with 186 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files

135
src/pages/resource/images/index.tsx
View File

@@ -74,79 +74,78 @@ export const ResourceImagesPage = () => {
return (
<>
<Row>
<Col span={4}>
<div className="playedu-main-body" style={{ marginLeft: -24 }}>
<TreeCategory onUpdate={(keys: any) => setCategoryIds(keys)} />
<div className="tree-main-body">
<div className="left-box">
<TreeCategory
text={"图片"}
onUpdate={(keys: any) => setCategoryIds(keys)}
/>
</div>
<div className="right-box">
<div className="playedu-main-title float-left mb-24">
图片 / 全部图片
</div>
</Col>
<Col span={20}>
<div className="playedu-main-body">
<div className="playedu-main-title float-left mb-24">
图片 / 全部图片
</div>
<Row gutter={16} style={{ marginBottom: 24 }}>
<Row gutter={16} style={{ marginBottom: 24 }}>
<Col span={24}>
<UploadImageSub
categoryIds={category_ids}
onUpdate={() => {
resetImageList();
}}
></UploadImageSub>
</Col>
</Row>
<Row gutter={[24, 24]}>
{imageList.length === 0 && (
<Col span={24}>
<UploadImageSub
categoryIds={category_ids}
onUpdate={() => {
resetImageList();
}}
></UploadImageSub>
<Empty description="暂无图片" />
</Col>
</Row>
<Row gutter={[24, 24]}>
{imageList.length === 0 && (
<Col span={24}>
<Empty description="暂无图片" />
</Col>
)}
)}
{imageList.map((item) => (
<Col key={item.id} span={3}>
<div className={styles.imageItem}>
<Image
preview={true}
width={150}
height={150}
src={item.url}
/>
<Popconfirm
title="警告"
description="即将删除此图片，确认操作？"
onConfirm={() => removeResource(item.id)}
okText="确定"
cancelText="取消"
>
<Button
className={styles.closeButton}
danger
shape="circle"
icon={<CloseOutlined />}
/>
</Popconfirm>
</div>
</Col>
))}
{imageList.length > 0 && (
<Col span={24}>
<Pagination
showSizeChanger
onChange={(currentPage, currentSize) => {
setPage(currentPage);
setSize(currentSize);
}}
defaultCurrent={page}
total={total}
pageSize={size}
{imageList.map((item) => (
<Col key={item.id} span={3}>
<div className={styles.imageItem}>
<Image
preview={true}
width={150}
height={150}
src={item.url}
/>
</Col>
)}
</Row>
</div>
</Col>
</Row>
<Popconfirm
title="警告"
description="即将删除此图片，确认操作？"
onConfirm={() => removeResource(item.id)}
okText="确定"
cancelText="取消"
>
<Button
className={styles.closeButton}
danger
shape="circle"
icon={<CloseOutlined />}
/>
</Popconfirm>
</div>
</Col>
))}
{imageList.length > 0 && (
<Col span={24}>
<Pagination
showSizeChanger
onChange={(currentPage, currentSize) => {
setPage(currentPage);
setSize(currentSize);
}}
defaultCurrent={page}
total={total}
pageSize={size}
/>
</Col>
)}
</Row>
</div>
</div>
</>
);
};

81
src/pages/resource/videos/index.tsx
View File

@@ -38,18 +38,18 @@ export const ResourceVideosPage = () => {
const [category_ids, setCategoryIds] = useState<any>([]);
const columns: ColumnsType<DataType> = [
{
title: "封面",
dataIndex: "id",
render: (id: string) => (
<Image
preview={false}
width={120}
height={80}
src={videosExtra[id].poster}
></Image>
),
},
// {
// title: "封面",
// dataIndex: "id",
// render: (id: string) => (
// <Image
// preview={false}
// width={120}
// height={80}
// src={videosExtra[id].poster}
// ></Image>
// ),
// },
{
title: "视频名称",
dataIndex: "name",
@@ -158,37 +158,36 @@ export const ResourceVideosPage = () => {
return (
<>
<Row>
<Col span={4}>
<div className="playedu-main-body" style={{ marginLeft: -24 }}>
<TreeCategory onUpdate={(keys: any) => setCategoryIds(keys)} />
<div className="tree-main-body">
<div className="left-box">
<TreeCategory
text={"视频"}
onUpdate={(keys: any) => setCategoryIds(keys)}
/>
</div>
<div className="right-box">
<div className="playedu-main-title float-left mb-24">
视频 / 后端课程
</div>
</Col>
<Col span={20}>
<div className="playedu-main-body">
<div className="playedu-main-title float-left mb-24">
视频 / 后端课程
</div>
<div className="float-left mb-24">
<UploadVideoButton
categoryIds={category_ids}
onUpdate={() => {
resetVideoList();
}}
></UploadVideoButton>
</div>
<div className="float-left">
<Table
columns={columns}
dataSource={videoList}
loading={loading}
pagination={paginationProps}
rowKey={(record) => record.id}
/>
</div>
<div className="float-left mb-24">
<UploadVideoButton
categoryIds={category_ids}
onUpdate={() => {
resetVideoList();
}}
></UploadVideoButton>
</div>
</Col>
</Row>
<div className="float-left">
<Table
columns={columns}
dataSource={videoList}
loading={loading}
pagination={paginationProps}
rowKey={(record) => record.id}
/>
</div>
</div>
</div>
</>
);
};