From 3707e31eb8857ffe81358cbadaa555bd9e6e03c4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=A6=BA=E7=8B=A8?= <18119604035@163.com> Date: Tue, 14 Mar 2023 14:27:54 +0800 Subject: [PATCH] =?UTF-8?q?=E9=83=A8=E9=97=A8=E6=96=B0=E5=BB=BA=E3=80=81?= =?UTF-8?q?=E7=BC=96=E8=BE=91=E5=BC=B9=E7=AA=97=E7=BB=84=E4=BB=B6=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../{ => compenents}/create.module.less | 0 src/pages/department/compenents/create.tsx | 147 ++++++++++++++ .../{ => compenents}/update.module.less | 0 src/pages/department/compenents/update.tsx | 179 +++++++++++++++++ src/pages/department/create.tsx | 148 -------------- src/pages/department/index.tsx | 58 ++++-- src/pages/department/update.tsx | 187 ------------------ src/pages/index.ts | 2 - .../resource-category/compenents/create.tsx | 1 - .../resource-category/compenents/update.tsx | 23 ++- .../resource/resource-category/index.tsx | 3 +- src/router/routes.tsx | 12 +- 12 files changed, 378 insertions(+), 382 deletions(-) rename src/pages/department/{ => compenents}/create.module.less (100%) create mode 100644 src/pages/department/compenents/create.tsx rename src/pages/department/{ => compenents}/update.module.less (100%) create mode 100644 src/pages/department/compenents/update.tsx delete mode 100644 src/pages/department/create.tsx delete mode 100644 src/pages/department/update.tsx diff --git a/src/pages/department/create.module.less b/src/pages/department/compenents/create.module.less similarity index 100% rename from src/pages/department/create.module.less rename to src/pages/department/compenents/create.module.less diff --git a/src/pages/department/compenents/create.tsx b/src/pages/department/compenents/create.tsx new file mode 100644 index 0000000..7fc9e24 --- /dev/null +++ b/src/pages/department/compenents/create.tsx @@ -0,0 +1,147 @@ +import React, { useState, useRef, useEffect } from "react"; +import { Modal, Form, Input, Cascader, message } from "antd"; +import styles from "./create.module.less"; +import { department } from "../../../api/index"; + +interface PropInterface { + open: boolean; + onCancel: () => void; +} + +interface Option { + value: string | number; + label: string; + children?: Option[]; +} + +export const DepartmentCreate: React.FC = ({ + open, + onCancel, +}) => { + const [form] = Form.useForm(); + const [loading, setLoading] = useState(true); + const [departments, setDepartments] = useState([]); + const [parent_id, setParentId] = useState(0); + + useEffect(() => { + getParams(); + }, []); + + useEffect(() => { + form.setFieldsValue({ + name: "", + parent_id: [0], + }); + }, [form, open]); + + const getParams = () => { + department.createDepartment().then((res: any) => { + const departments = res.data.departments; + if (JSON.stringify(departments) !== "{}") { + const new_arr: Option[] = checkArr(departments, 0); + new_arr.unshift({ + label: "无", + value: 0, + }); + setDepartments(new_arr); + } + }); + }; + + const checkArr = (departments: any[], id: number) => { + const arr = []; + for (let i = 0; i < departments[id].length; i++) { + if (!departments[departments[id][i].id]) { + arr.push({ + label: departments[id][i].name, + value: departments[id][i].id, + }); + } else { + const new_arr: Option[] = checkArr(departments, departments[id][i].id); + arr.push({ + label: departments[id][i].name, + value: departments[id][i].id, + children: new_arr, + }); + } + } + return arr; + }; + + const onFinish = (values: any) => { + department + .storeDepartment(values.name, parent_id || 0, 0) + .then((res: any) => { + message.success("保存成功！"); + onCancel(); + }); + }; + + const onFinishFailed = (errorInfo: any) => { + console.log("Failed:", errorInfo); + }; + + const handleChange = (value: any) => { + if (value !== undefined) { + let it = value[value.length - 1]; + setParentId(it); + } else { + setParentId(0); + } + }; + + const displayRender = (label: any, selectedOptions: any) => { + return label[label.length - 1]; + }; + + return ( + <> + form.submit()} + onCancel={() => onCancel()} + > +
+
+ + + + + + +
+
+ + + ); +}; diff --git a/src/pages/department/update.module.less b/src/pages/department/compenents/update.module.less similarity index 100% rename from src/pages/department/update.module.less rename to src/pages/department/compenents/update.module.less diff --git a/src/pages/department/compenents/update.tsx b/src/pages/department/compenents/update.tsx new file mode 100644 index 0000000..4aa94ae --- /dev/null +++ b/src/pages/department/compenents/update.tsx @@ -0,0 +1,179 @@ +import React, { useState, useRef, useEffect } from "react"; +import { Modal, Form, Input, Cascader, message } from "antd"; +import styles from "./update.module.less"; +import { department } from "../../../api/index"; + +interface PropInterface { + id: number; + open: boolean; + onCancel: () => void; +} + +interface Option { + value: string | number; + label: string; + children?: Option[]; +} + +export const DepartmentUpdate: React.FC = ({ + id, + open, + onCancel, +}) => { + const [form] = Form.useForm(); + const [loading, setLoading] = useState(true); + const [departments, setDepartments] = useState([]); + const [parent_id, setParentId] = useState(0); + + useEffect(() => { + getParams(); + }, []); + + useEffect(() => { + if (id === 0) { + return; + } + getDetail(); + }, [id]); + + const getParams = () => { + department.createDepartment().then((res: any) => { + const departments = res.data.departments; + if (JSON.stringify(departments) !== "{}") { + const new_arr: Option[] = checkArr(departments, 0); + new_arr.unshift({ + label: "无", + value: 0, + }); + setDepartments(new_arr); + } + }); + }; + + const getDetail = () => { + department.department(id).then((res: any) => { + let data = res.data; + let arr = data.parent_chain.split(","); + let new_arr: any[] = []; + arr.map((num: any) => { + new_arr.push(Number(num)); + }); + form.setFieldsValue({ + name: data.name, + parent_id: new_arr, + }); + setParentId(data.parent_id); + }); + }; + + const checkArr = (departments: any[], id: number) => { + const arr = []; + for (let i = 0; i < departments[id].length; i++) { + if (departments[id][i].id === id) { + console.log("截断"); + } else if (!departments[departments[id][i].id]) { + arr.push({ + label: departments[id][i].name, + value: departments[id][i].id, + }); + } else { + const new_arr: Option[] = checkArr(departments, departments[id][i].id); + arr.push({ + label: departments[id][i].name, + value: departments[id][i].id, + children: new_arr, + }); + } + } + return arr; + }; + + const onFinish = (values: any) => { + department + .updateDepartment(id, values.name, parent_id || 0, 0) + .then((res: any) => { + message.success("保存成功！"); + onCancel(); + }); + }; + + const onFinishFailed = (errorInfo: any) => { + console.log("Failed:", errorInfo); + }; + + const handleChange = (value: any) => { + if (value !== undefined) { + let it = value[value.length - 1]; + if (it === id) { + setParentId(0); + } else { + setParentId(it); + } + } else { + setParentId(0); + } + }; + + const displayRender = (label: any, selectedOptions: any) => { + if (selectedOptions && selectedOptions[0]) { + let current = selectedOptions[selectedOptions.length - 1].value; + if (current === id) { + message.error("不能选择自己作为父类"); + return "无"; + } + } + + return label[label.length - 1]; + }; + + return ( + <> + form.submit()} + onCancel={() => onCancel()} + > +
+
+ + + + + + +
+
+ + + ); +}; diff --git a/src/pages/department/create.tsx b/src/pages/department/create.tsx deleted file mode 100644 index 0cd64b5..0000000 --- a/src/pages/department/create.tsx +++ /dev/null @@ -1,148 +0,0 @@ -import React, { useState, useEffect } from "react"; -import { Row, Col, Form, Input, Cascader, Button, message } from "antd"; -import styles from "./create.module.less"; -import { department } from "../../api/index"; -import { useNavigate } from "react-router-dom"; -import { BackBartment } from "../../compenents"; - -interface Option { - value: string | number; - label: string; - children?: Option[]; -} - -export const DepartmentCreatePage: React.FC = () => { - const navigate = useNavigate(); - const [form] = Form.useForm(); - const [loading, setLoading] = useState(true); - const [categories, setCategories] = useState([]); - const [parent_id, setParentId] = useState(0); - - useEffect(() => { - getParams(); - }, []); - - const getParams = () => { - department.createDepartment().then((res: any) => { - const departments = res.data.departments; - if (JSON.stringify(departments) !== "{}") { - const new_arr: Option[] = checkArr(departments, 0); - setCategories(new_arr); - } - }); - }; - - const checkArr = (departments: any[], id: number) => { - const arr = []; - for (let i = 0; i < departments[id].length; i++) { - if (!departments[departments[id][i].id]) { - arr.push({ - label: departments[id][i].name, - value: departments[id][i].id, - }); - } else { - const new_arr: Option[] = checkArr(departments, departments[id][i].id); - arr.push({ - label: departments[id][i].name, - value: departments[id][i].id, - children: new_arr, - }); - } - } - return arr; - }; - - const onFinish = (values: any) => { - department - .storeDepartment(values.name, parent_id || 0, values.sort) - .then((res: any) => { - message.success("保存成功！"); - navigate(-1); - }); - }; - - const onFinishFailed = (errorInfo: any) => { - console.log("Failed:", errorInfo); - }; - - const handleChange = (value: any) => { - if (value !== undefined) { - let it = value[value.length - 1]; - setParentId(it); - } else { - setParentId(0); - } - }; - - const displayRender = (label: any, selectedOptions: any) => { - return label[label.length - 1]; - }; - - return ( - <> - - -
- -
-
-
- - - - - - - - - - - - - -
-
- - - - ); -}; diff --git a/src/pages/department/index.tsx b/src/pages/department/index.tsx index 432b599..baf5f70 100644 --- a/src/pages/department/index.tsx +++ b/src/pages/department/index.tsx @@ -1,12 +1,13 @@ import React, { useState, useEffect } from "react"; import { Button, Space, Tree, Modal, message } from "antd"; -import type { ColumnsType } from "antd/es/table"; import styles from "./index.module.less"; import { PlusOutlined, ExclamationCircleFilled } from "@ant-design/icons"; import { department } from "../../api/index"; -import { Link, useNavigate } from "react-router-dom"; +import { useNavigate } from "react-router-dom"; import { PerButton } from "../../compenents"; import type { DataNode, TreeProps } from "antd/es/tree"; +import { DepartmentCreate } from "./compenents/create"; +import { DepartmentUpdate } from "./compenents/update"; const { confirm } = Modal; @@ -30,6 +31,10 @@ export const DepartmentPage: React.FC = () => { const [treeData, setTreeData] = useState([]); const [selectKey, setSelectKey] = useState([]); + const [createVisible, setCreateVisible] = useState(false); + const [updateVisible, setUpdateVisible] = useState(false); + const [did, setDid] = useState(0); + const onSelect = (selectedKeys: any, info: any) => { setSelectKey(selectedKeys); console.log(selectedKeys); @@ -67,9 +72,10 @@ export const DepartmentPage: React.FC = () => { class="b-link c-red" icon={null} p="department-cud" - onClick={() => - navigate(`/department/update/${departments[id][i].id}`) - } + onClick={() => { + setDid(departments[id][i].id); + setUpdateVisible(true); + }} disabled={null} />
@@ -100,9 +106,10 @@ export const DepartmentPage: React.FC = () => { class="b-link c-red" icon={null} p="department-cud" - onClick={() => - navigate(`/department/update/${departments[id][i].id}`) - } + onClick={() => { + setDid(departments[id][i].id); + setUpdateVisible(true); + }} disabled={null} />
@@ -231,17 +238,15 @@ export const DepartmentPage: React.FC = () => { <>
- - } - p="department-cud" - onClick={() => null} - disabled={null} - /> - + } + p="department-cud" + onClick={() => setCreateVisible(true)} + disabled={null} + />
@@ -253,6 +258,21 @@ export const DepartmentPage: React.FC = () => { onDragEnter={onDragEnter} onDrop={onDrop} /> + { + setCreateVisible(false); + setRefresh(!refresh); + }} + /> + { + setUpdateVisible(false); + setRefresh(!refresh); + }} + />
); diff --git a/src/pages/department/update.tsx b/src/pages/department/update.tsx deleted file mode 100644 index 6825186..0000000 --- a/src/pages/department/update.tsx +++ /dev/null @@ -1,187 +0,0 @@ -import React, { useState, useEffect } from "react"; -import { Row, Col, Form, Input, Cascader, Button, message } from "antd"; -import styles from "./create.module.less"; -import { department } from "../../api/index"; -import { useParams, useNavigate } from "react-router-dom"; -import { BackBartment } from "../../compenents"; - -interface Option { - value: string | number; - label: string; - children?: Option[]; -} - -export const DepartmentUpdatePage: React.FC = () => { - const params = useParams(); - const navigate = useNavigate(); - const [form] = Form.useForm(); - const [loading, setLoading] = useState(true); - const [categories, setCategories] = useState([]); - const [parent_id, setParentId] = useState(0); - - useEffect(() => { - getParams(); - }, []); - - useEffect(() => { - getDetail(); - }, [params.depId]); - - const getParams = () => { - department.createDepartment().then((res: any) => { - const departments = res.data.departments; - if (JSON.stringify(departments) !== "{}") { - const new_arr: Option[] = checkArr(departments, 0); - setCategories(new_arr); - } - }); - }; - - const getDetail = () => { - department.department(Number(params.depId)).then((res: any) => { - let data = res.data; - let arr = data.parent_chain.split(","); - let new_arr: any[] = []; - arr.map((num: any) => { - new_arr.push(Number(num)); - }); - form.setFieldsValue({ - name: data.name, - sort: data.sort, - parent_id: new_arr, - }); - setParentId(data.parent_id); - }); - }; - - const checkArr = (departments: any[], id: number) => { - const arr = []; - for (let i = 0; i < departments[id].length; i++) { - if (departments[id][i].id === Number(params.depId)) { - console.log("截断"); - } else if (!departments[departments[id][i].id]) { - arr.push({ - label: departments[id][i].name, - value: departments[id][i].id, - }); - } else { - const new_arr: Option[] = checkArr(departments, departments[id][i].id); - arr.push({ - label: departments[id][i].name, - value: departments[id][i].id, - children: new_arr, - }); - } - } - return arr; - }; - - const onFinish = (values: any) => { - let id = Number(params.depId); - department - .updateDepartment(id, values.name, parent_id || 0, values.sort) - .then((res: any) => { - message.success("保存成功！"); - navigate(-1); - }); - }; - - const onFinishFailed = (errorInfo: any) => { - console.log("Failed:", errorInfo); - }; - - const handleChange = (value: any) => { - let id = Number(params.depId); - if (value !== undefined) { - let it = value[value.length - 1]; - if (it === id) { - setParentId(0); - } else { - setParentId(it); - } - } else { - setParentId(0); - } - }; - - const displayRender = (label: any, selectedOptions: any) => { - let id = Number(params.depId); - if (selectedOptions && selectedOptions[0]) { - let current = selectedOptions[selectedOptions.length - 1].value; - if (current === id) { - message.error("不能选择自己作为父类"); - return 0; - } - } - - return label[label.length - 1]; - }; - - return ( - <> - - -
- -
-
-
- - - - - - - - - - - - - -
-
- - - - ); -}; diff --git a/src/pages/index.ts b/src/pages/index.ts index db982dd..1eb5820 100644 --- a/src/pages/index.ts +++ b/src/pages/index.ts @@ -18,8 +18,6 @@ export * from "./system/adminroles/index"; export * from "./system/adminroles/create"; export * from "./system/adminroles/update"; export * from "./department"; -export * from "./department/create"; -export * from "./department/update"; export * from "./change-password"; export * from "./resource/images"; export * from "./resource/resource-category/index"; diff --git a/src/pages/resource/resource-category/compenents/create.tsx b/src/pages/resource/resource-category/compenents/create.tsx index 34b911b..caf3a91 100644 --- a/src/pages/resource/resource-category/compenents/create.tsx +++ b/src/pages/resource/resource-category/compenents/create.tsx @@ -2,7 +2,6 @@ import React, { useState, useRef, useEffect } from "react"; import { Modal, Form, Input, Cascader, message } from "antd"; import styles from "./create.module.less"; import { resourceCategory } from "../../../../api/index"; -import type { FormInstance } from "antd/es/form"; interface PropInterface { open: boolean; diff --git a/src/pages/resource/resource-category/compenents/update.tsx b/src/pages/resource/resource-category/compenents/update.tsx index c14ad3f..c6d4968 100644 --- a/src/pages/resource/resource-category/compenents/update.tsx +++ b/src/pages/resource/resource-category/compenents/update.tsx @@ -1,8 +1,7 @@ import React, { useState, useRef, useEffect } from "react"; import { Modal, Form, Input, Cascader, message } from "antd"; -import styles from "./create.module.less"; +import styles from "./update.module.less"; import { resourceCategory } from "../../../../api/index"; -import type { FormInstance } from "antd/es/form"; interface PropInterface { id: number; @@ -37,13 +36,6 @@ export const ResourceCategoryUpdate: React.FC = ({ getDetail(); }, [id]); - useEffect(() => { - form.setFieldsValue({ - name: "", - parent_id: [0], - }); - }, [form, open]); - const getParams = () => { resourceCategory.createResourceCategory().then((res: any) => { const categories = res.data.categories; @@ -68,7 +60,6 @@ export const ResourceCategoryUpdate: React.FC = ({ }); form.setFieldsValue({ name: data.name, - sort: data.sort, parent_id: new_arr, }); setParentId(data.parent_id); @@ -97,7 +88,7 @@ export const ResourceCategoryUpdate: React.FC = ({ const onFinish = (values: any) => { resourceCategory - .updateResourceCategory(id, values.name, parent_id || 0, values.sort) + .updateResourceCategory(id, values.name, parent_id || 0, 0) .then((res: any) => { message.success("保存成功！"); onCancel(); @@ -122,13 +113,21 @@ export const ResourceCategoryUpdate: React.FC = ({ }; const displayRender = (label: any, selectedOptions: any) => { + if (selectedOptions && selectedOptions[0]) { + let current = selectedOptions[selectedOptions.length - 1].value; + if (current === id) { + message.error("不能选择自己作为父类"); + return "无"; + } + } + return label[label.length - 1]; }; return ( <> , }, - { - path: "/department/create", - element: , - }, - { - path: "/department/update/:depId", - element: , - }, ], }, {