From 123c19126abf57532ccc596a2346791f422dffb4 Mon Sep 17 00:00:00 2001 From: unknown <18119604035@163.com> Date: Mon, 22 Jan 2024 10:25:48 +0800 Subject: [PATCH] =?UTF-8?q?=E5=87=A0=E4=B8=AA=E9=A1=B5=E9=9D=A2=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=E7=BB=84=E4=BB=B6=E5=A2=9E=E5=8A=A0loading?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/course/compenents/create.tsx | 136 ++++++++++-------- src/pages/course/compenents/update.tsx | 1 - src/pages/department/compenents/create.tsx | 15 +- src/pages/member/compenents/create.tsx | 15 +- .../resource-category/compenents/create.tsx | 15 +- .../administrator/compenents/create.tsx | 15 +- .../system/adminroles/compenents/create.tsx | 24 +++- 7 files changed, 149 insertions(+), 72 deletions(-) diff --git a/src/pages/course/compenents/create.tsx b/src/pages/course/compenents/create.tsx index 87330f6..0a6935b 100644 --- a/src/pages/course/compenents/create.tsx +++ b/src/pages/course/compenents/create.tsx @@ -10,6 +10,7 @@ import { message, Image, TreeSelect, + Spin, } from "antd"; import styles from "./create.module.less"; import { useSelector } from "react-redux"; @@ -52,6 +53,7 @@ export const CourseCreate: React.FC = ({ const defaultThumb2 = courseDefaultThumbs[1]; const defaultThumb3 = courseDefaultThumbs[2]; const [loading, setLoading] = useState(false); + const [init, setInit] = useState(true); const [departments, setDepartments] = useState([]); const [categories, setCategories] = useState([]); const [thumb, setThumb] = useState(""); @@ -71,9 +73,9 @@ export const CourseCreate: React.FC = ({ const [attachments, setAttachments] = useState([]); useEffect(() => { + setInit(true); if (open) { - getParams(); - getCategory(); + initData(); } }, [open, cateIds, depIds]); @@ -96,43 +98,48 @@ export const CourseCreate: React.FC = ({ setShowDrop(false); }, [form, open]); - const getParams = () => { - department.departmentList().then((res: any) => { - const departments = res.data.departments; - const departCount: DepIdsModel = res.data.dep_user_count; - if (JSON.stringify(departments) !== "{}") { - const new_arr: any = checkArr(departments, 0, departCount); - setDepartments(new_arr); - } - let type = "open"; - if (depIds.length !== 0 && depIds[0] !== 0) { - type = "elective"; - let item = checkChild(res.data.departments, depIds[0]); - let arr: any[] = []; - if (item === undefined) { - arr.push(depIds[0]); - } else if (item.parent_chain === "") { - arr.push(depIds[0]); - } else { - let new_arr = item.parent_chain.split(","); - new_arr.map((num: any) => { - arr.push(Number(num)); - }); - arr.push(depIds[0]); - } - form.setFieldsValue({ - dep_ids: arr, - }); + const initData = async () => { + await getParams(); + await getCategory(); + setInit(false); + }; + + const getParams = async () => { + let res: any = await department.departmentList(); + const departments = res.data.departments; + const departCount: DepIdsModel = res.data.dep_user_count; + if (JSON.stringify(departments) !== "{}") { + const new_arr: any = checkArr(departments, 0, departCount); + setDepartments(new_arr); + } + let type = "open"; + if (depIds.length !== 0 && depIds[0] !== 0) { + type = "elective"; + let item = checkChild(res.data.departments, depIds[0]); + let arr: any[] = []; + if (item === undefined) { + arr.push(depIds[0]); + } else if (item.parent_chain === "") { + arr.push(depIds[0]); } else { - form.setFieldsValue({ - dep_ids: depIds, + let new_arr = item.parent_chain.split(","); + new_arr.map((num: any) => { + arr.push(Number(num)); }); + arr.push(depIds[0]); } form.setFieldsValue({ - type: type, + dep_ids: arr, }); - setType(type); + } else { + form.setFieldsValue({ + dep_ids: depIds, + }); + } + form.setFieldsValue({ + type: type, }); + setType(type); }; const checkChild = (departments: any[], id: number) => { @@ -145,37 +152,36 @@ export const CourseCreate: React.FC = ({ } }; - const getCategory = () => { - course.createCourse().then((res: any) => { - const categories = res.data.categories; - if (JSON.stringify(categories) !== "{}") { - const new_arr: any = checkArr(categories, 0, null); - setCategories(new_arr); - } + const getCategory = async () => { + let res: any = await course.createCourse(); + const categories = res.data.categories; + if (JSON.stringify(categories) !== "{}") { + const new_arr: any = checkArr(categories, 0, null); + setCategories(new_arr); + } - if (cateIds.length !== 0 && cateIds[0] !== 0) { - let item = checkChild(res.data.categories, cateIds[0]); - let arr: any[] = []; - if (item === undefined) { - arr.push(cateIds[0]); - } else if (item.parent_chain === "") { - arr.push(cateIds[0]); - } else { - let new_arr = item.parent_chain.split(","); - new_arr.map((num: any) => { - arr.push(Number(num)); - }); - arr.push(cateIds[0]); - } - form.setFieldsValue({ - category_ids: arr, - }); + if (cateIds.length !== 0 && cateIds[0] !== 0) { + let item = checkChild(res.data.categories, cateIds[0]); + let arr: any[] = []; + if (item === undefined) { + arr.push(cateIds[0]); + } else if (item.parent_chain === "") { + arr.push(cateIds[0]); } else { - form.setFieldsValue({ - category_ids: cateIds, + let new_arr = item.parent_chain.split(","); + new_arr.map((num: any) => { + arr.push(Number(num)); }); + arr.push(cateIds[0]); } - }); + form.setFieldsValue({ + category_ids: arr, + }); + } else { + form.setFieldsValue({ + category_ids: cateIds, + }); + } }; const getNewTitle = (title: any, id: number, counts: any) => { @@ -503,7 +509,15 @@ export const CourseCreate: React.FC = ({ } width={634} > -
+ {init && ( +
+ +
+ )} +
= ({ setType(type); setThumb(res.data.course.thumb); setInit(false); - console.log(dayjs(res.data.course.published_at, "YYYY-MM-DD HH:mm:ss")); }); }; diff --git a/src/pages/department/compenents/create.tsx b/src/pages/department/compenents/create.tsx index 9e0bce9..888bbaa 100644 --- a/src/pages/department/compenents/create.tsx +++ b/src/pages/department/compenents/create.tsx @@ -1,5 +1,5 @@ import React, { useState, useRef, useEffect } from "react"; -import { Modal, Form, Input, Cascader, message } from "antd"; +import { Modal, Form, Input, Cascader, message, Spin } from "antd"; import styles from "./create.module.less"; import { department } from "../../../api/index"; @@ -19,11 +19,13 @@ export const DepartmentCreate: React.FC = ({ onCancel, }) => { const [form] = Form.useForm(); + const [init, setInit] = useState(true); const [loading, setLoading] = useState(false); const [departments, setDepartments] = useState([]); const [parent_id, setParentId] = useState(0); useEffect(() => { + setInit(true); if (open) { getParams(); } @@ -54,6 +56,7 @@ export const DepartmentCreate: React.FC = ({ }); setDepartments(new_arr); } + setInit(false); }); }; @@ -125,7 +128,15 @@ export const DepartmentCreate: React.FC = ({ maskClosable={false} okButtonProps={{ loading: loading }} > -
+ {init && ( +
+ +
+ )} +
= ({ onCancel, }) => { const [form] = Form.useForm(); + const [init, setInit] = useState(true); const [loading, setLoading] = useState(false); const [departments, setDepartments] = useState([]); const memberDefaultAvatar = useSelector( @@ -32,6 +33,7 @@ export const MemberCreate: React.FC = ({ const [avatar, setAvatar] = useState(memberDefaultAvatar); useEffect(() => { + setInit(true); if (open) { getParams(); } @@ -56,6 +58,7 @@ export const MemberCreate: React.FC = ({ const new_arr: Option[] = checkArr(departments, 0); setDepartments(new_arr); } + setInit(false); }); }; @@ -125,7 +128,15 @@ export const MemberCreate: React.FC = ({ maskClosable={false} okButtonProps={{ loading: loading }} > -
+ {init && ( +
+ +
+ )} +
= ({ onCancel, }) => { const [form] = Form.useForm(); + const [init, setInit] = useState(true); const [loading, setLoading] = useState(false); const [categories, setCategories] = useState([]); const [parent_id, setParentId] = useState(0); useEffect(() => { + setInit(true); if (open) { getParams(); } @@ -54,6 +56,7 @@ export const ResourceCategoryCreate: React.FC = ({ }); setCategories(new_arr); } + setInit(false); }); }; @@ -125,7 +128,15 @@ export const ResourceCategoryCreate: React.FC = ({ onCancel={() => onCancel()} okButtonProps={{ loading: loading }} > -
+ {init && ( +
+ +
+ )} +
= ({ onCancel, }) => { const [form] = Form.useForm(); + const [init, setInit] = useState(true); const [loading, setLoading] = useState(false); const [roles, setRoles] = useState([]); useEffect(() => { + setInit(true); if (open) { getParams(); } @@ -56,6 +58,7 @@ export const SystemAdministratorCreate: React.FC = ({ }); } setRoles(arr); + setInit(false); }); }; @@ -110,7 +113,15 @@ export const SystemAdministratorCreate: React.FC = ({ maskClosable={false} okButtonProps={{ loading: loading }} > -
+ {init && ( +
+ +
+ )} +
= ({ onCancel, }) => { const [form] = Form.useForm(); + const [init, setInit] = useState(true); const [loading, setLoading] = useState(false); const [permissions, setPermissions] = useState([]); const [actions, setActions] = useState([]); useEffect(() => { + setInit(true); if (open) { getParams(); } @@ -89,6 +100,7 @@ export const SystemAdminrolesCreate: React.FC = ({ } setPermissions(arr); setActions(arr2); + setInit(false); }); }; @@ -148,7 +160,15 @@ export const SystemAdminrolesCreate: React.FC = ({ } width={634} > -
+ {init && ( +
+ +
+ )} +