线上课课时、课件编辑增加loading

This commit is contained in:
unknown 2023-08-04 09:16:07 +08:00
parent 425033f672
commit 7f1902d490
2 changed files with 178 additions and 150 deletions

View File

@ -1,5 +1,5 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import { Button, Drawer, Form, Modal, message } from "antd"; import { Button, Drawer, Form, Modal, message, Spin } from "antd";
import styles from "./hour-update.module.less"; import styles from "./hour-update.module.less";
import { course, courseAttachment } from "../../../api/index"; import { course, courseAttachment } from "../../../api/index";
import { SelectAttachment } from "../../../compenents"; import { SelectAttachment } from "../../../compenents";
@ -20,11 +20,13 @@ export const CourseAttachmentUpdate: React.FC<PropInterface> = ({
onCancel, onCancel,
}) => { }) => {
const [form] = Form.useForm(); const [form] = Form.useForm();
const [init, setInit] = useState(true);
const [attachmentVisible, setAttachmentVisible] = useState<boolean>(false); const [attachmentVisible, setAttachmentVisible] = useState<boolean>(false);
const [attachmentData, setAttachmentData] = useState<any>([]); const [attachmentData, setAttachmentData] = useState<any>([]);
const [attachments, setAttachments] = useState<any>([]); const [attachments, setAttachments] = useState<any>([]);
useEffect(() => { useEffect(() => {
setInit(true);
if (id === 0) { if (id === 0) {
return; return;
} }
@ -43,6 +45,7 @@ export const CourseAttachmentUpdate: React.FC<PropInterface> = ({
setAttachmentData(arr); setAttachmentData(arr);
setAttachments(keys); setAttachments(keys);
} }
setInit(false);
}); });
}; };
@ -169,6 +172,15 @@ export const CourseAttachmentUpdate: React.FC<PropInterface> = ({
selectAttachmentData(arr, videos); selectAttachmentData(arr, videos);
}} }}
></SelectAttachment> ></SelectAttachment>
{init && (
<div className="float-left text-center mt-30">
<Spin></Spin>
</div>
)}
<div
className="float-left"
style={{ display: init ? "none" : "block" }}
>
<Form <Form
form={form} form={form}
name="attachment-update-basic" name="attachment-update-basic"
@ -211,6 +223,7 @@ export const CourseAttachmentUpdate: React.FC<PropInterface> = ({
</div> </div>
</Form> </Form>
</div> </div>
</div>
</Drawer> </Drawer>
) : null} ) : null}
</> </>

View File

@ -1,5 +1,5 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import { Button, Drawer, Form, Input, Modal, message } from "antd"; import { Button, Drawer, Form, Input, Modal, message, Spin } from "antd";
import styles from "./hour-update.module.less"; import styles from "./hour-update.module.less";
import { course, courseHour, courseChapter } from "../../../api/index"; import { course, courseHour, courseChapter } from "../../../api/index";
import { SelectResource } from "../../../compenents"; import { SelectResource } from "../../../compenents";
@ -20,6 +20,7 @@ export const CourseHourUpdate: React.FC<PropInterface> = ({
onCancel, onCancel,
}) => { }) => {
const [form] = Form.useForm(); const [form] = Form.useForm();
const [init, setInit] = useState(true);
const [chapterType, setChapterType] = useState(0); const [chapterType, setChapterType] = useState(0);
const [chapters, setChapters] = useState<any>([]); const [chapters, setChapters] = useState<any>([]);
const [hours, setHours] = useState<any>([]); const [hours, setHours] = useState<any>([]);
@ -29,6 +30,7 @@ export const CourseHourUpdate: React.FC<PropInterface> = ({
const [addvideoCurrent, setAddvideoCurrent] = useState(0); const [addvideoCurrent, setAddvideoCurrent] = useState(0);
useEffect(() => { useEffect(() => {
setInit(true);
if (id === 0) { if (id === 0) {
return; return;
} }
@ -77,6 +79,7 @@ export const CourseHourUpdate: React.FC<PropInterface> = ({
setHours([]); setHours([]);
} }
} }
setInit(false);
}); });
}; };
@ -373,6 +376,15 @@ export const CourseHourUpdate: React.FC<PropInterface> = ({
} }
}} }}
/> />
{init && (
<div className="float-left text-center mt-30">
<Spin></Spin>
</div>
)}
<div
className="float-left"
style={{ display: init ? "none" : "block" }}
>
<Form <Form
form={form} form={form}
name="hour-update-basic" name="hour-update-basic"
@ -478,13 +490,16 @@ export const CourseHourUpdate: React.FC<PropInterface> = ({
})} })}
<Form.Item> <Form.Item>
<div className="ml-42"> <div className="ml-42">
<Button onClick={() => addNewChapter()}></Button> <Button onClick={() => addNewChapter()}>
</Button>
</div> </div>
</Form.Item> </Form.Item>
</div> </div>
)} )}
</Form> </Form>
</div> </div>
</div>
</Drawer> </Drawer>
) : null} ) : null}
</> </>