From f6889ac3df8e58ecdbcd3e45e75e29613e375e57 Mon Sep 17 00:00:00 2001 From: Jim__TT <1820452084@qq.com> Date: Mon, 20 Nov 2023 21:24:43 +0800 Subject: [PATCH] =?UTF-8?q?=E5=94=90=E7=AE=80=EF=BC=9A=E6=8F=90=E4=BA=A4?= =?UTF-8?q?=E6=96=B0=E5=88=86=E6=94=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/system/notice.ts | 23 + src/api/system/post.ts | 51 ++ src/api/system/role.ts | 96 ++- src/api/system/users.ts | 86 +++ src/view/system/notice/inform/index.scss | 60 ++ src/view/system/notice/inform/index.tsx | 245 ++++++- src/view/system/notice/publish/index.tsx | 90 +-- src/view/system/post/index.scss | 103 +++ src/view/system/post/index.tsx | 472 +++++++++++++ src/view/system/role/index.tsx | 89 +-- src/view/system/user/index.scss | 104 +++ src/view/system/user/index.tsx | 808 ++++++++++++++++++++++- 12 files changed, 2090 insertions(+), 137 deletions(-) create mode 100644 src/api/system/notice.ts create mode 100644 src/api/system/post.ts create mode 100644 src/api/system/users.ts create mode 100644 src/view/system/notice/inform/index.scss create mode 100644 src/view/system/post/index.scss create mode 100644 src/view/system/post/index.tsx create mode 100644 src/view/system/user/index.scss diff --git a/src/api/system/notice.ts b/src/api/system/notice.ts new file mode 100644 index 0000000..81dd7f9 --- /dev/null +++ b/src/api/system/notice.ts @@ -0,0 +1,23 @@ +import request from "../../utils/request"; + +export const getNoticeListApi = (params: any) => { + return request({ + url: "/notice/notify", + method: "get", + params, + }); +}; + +export const getNoticeInfoApi = (id: number) => { + return request({ + url: "/notice/notify/" + id, + method: "get", + }); +}; + +export const deleteNoticeInfoApi = (id: number) => { + return request({ + url: "/notice/notify/" + id, + method: "delete", + }); +}; diff --git a/src/api/system/post.ts b/src/api/system/post.ts new file mode 100644 index 0000000..d344de1 --- /dev/null +++ b/src/api/system/post.ts @@ -0,0 +1,51 @@ +import request from "../../utils/request"; + +interface postListParams { + postCode?: string; + postName?: string; + state?: string; + pageNum?: string; + pageSize?: string; +} + +export const getPostListApi = (data: postListParams) => { + const { postCode, postName, state, pageNum } = data; + const params = data + ? { + postCode, + postName, + state, + pageNum, + pageSize: 500, + } + : undefined; + + return request({ + url: "/admin/post", + method: "get", + params, + }); +}; + +export const addPostApi = (data: any) => { + return request({ + url: "/admin/post", + method: "post", + data, + }); +}; + +export const editPostApi = (data: any) => { + return request({ + url: "/admin/post", + method: "put", + data, + }); +}; + +export const deletePostApi = (postId: any) => { + return request({ + url: "/admin/post/" + postId, + method: "delete", + }); +}; diff --git a/src/api/system/role.ts b/src/api/system/role.ts index 76187b1..5c61735 100644 --- a/src/api/system/role.ts +++ b/src/api/system/role.ts @@ -1,25 +1,26 @@ import request from "@/utils/request"; interface paramsType { - createTime?: string, - dataScope?: string, - deptIds?: any[], - menuIds?: any[], - roleId?: number, - roleKey?: string, - roleName?: string, - state?: string, - endTime?: string, - startTime?: string, - pageNum?: number, - pageSize?: number + createTime?: string; + dataScope?: string; + deptIds?: any[]; + menuIds?: any[]; + roleId?: number; + roleKey?: string; + roleName?: string; + state?: string; + endTime?: string; + startTime?: string; + pageNum?: number; + pageSize?: number; } export const getRolesDataAPI = (params: paramsType) => { - const { endTime, roleKey, roleName, startTime, state, pageNum, pageSize } = params + const { endTime, roleKey, roleName, startTime, state, pageNum, pageSize } = + params; // console.log('API',params); - + return request({ - url: '/admin/role', - method: 'get', + url: "/admin/role", + method: "get", params: { endTime, roleKey, @@ -27,51 +28,48 @@ export const getRolesDataAPI = (params: paramsType) => { startTime, state, pageNum, - pageSize - } - }) -} -export const delRoleAPI = (params: paramsType) => { - let { roleId } = params + pageSize, + }, + }); +}; +export const delRoleAPI = (roleId: paramsType) => { // console.log(roleId); return request({ url: `/admin/role/${roleId}`, - method: 'delete', - }) -} + method: "delete", + }); +}; export const getMenuLiseAPI = () => { - return request({ - url: '/admin/menu', - method: 'get', - - }) -} -export const addRoleAPI = (data:any) => { + url: "/admin/menu", + method: "get", + }); +}; +export const addRoleAPI = (data: any) => { // console.log('addAPI',data); return request({ url: `/admin/role`, - method: 'post', - data - }) -} -export const getRoleAPI = (params:paramsType) => { - const {roleId}=params - + method: "post", + data, + }); +}; +export const getRoleAPI = (params: paramsType) => { + const { roleId } = params; + return request({ url: `/admin/role/${roleId}`, - method: 'get', - }) -} -export const setRoleDataAPI = (data:any) => { + method: "get", + }); +}; +export const setRoleDataAPI = (data: any) => { // data.menuIds=[] // const {roleId}=params - console.log('修改',data); - + console.log("修改", data); + return request({ url: `/admin/role`, - method: 'put', - data:data - }) -} \ No newline at end of file + method: "put", + data: data, + }); +}; diff --git a/src/api/system/users.ts b/src/api/system/users.ts new file mode 100644 index 0000000..3773d0b --- /dev/null +++ b/src/api/system/users.ts @@ -0,0 +1,86 @@ +import request from "../../utils/request"; + +interface userListParams { + deptId?: string; + userName?: string; + phoneNumber?: string; + state?: string; + startTime?: string; + endTime?: string; + pageNum?: number; + pageSize?: number; +} + +export const getDeptTreeApi = () => { + return request({ + url: "/admin/dept", + method: "get", + }); +}; + +export const getUserInfoApi = (userId: string) => { + return request({ + url: "/admin/user/info/" + userId, + method: "get", + }); +}; + +export const getRoleListApi = () => { + return request({ + url: "/admin/role", + method: "get", + }); +}; + +export const getPostListApi = () => { + return request({ + url: "/admin/post", + method: "get", + }); +}; + +export const getUserListApi = (data: userListParams) => { + const { deptId, userName, phoneNumber, state, startTime, endTime, pageNum } = + data; + const params = data + ? { + deptId, + userName, + phoneNumber, + state, + startTime, + endTime, + pageNum, + pageSize: 500, + } + : undefined; + + return request({ + url: "/admin/user", + method: "get", + params, + }); +}; + +export const addUserApi = (data: any) => { + return request({ + url: "/admin/user", + method: "post", + data, + }); +}; + +export const editUserApi = (data: any) => { + return request({ + url: "/admin/user", + method: "put", + data, + }); +}; + +export const deleteUserApi = (userId: any) => { + return request({ + url: "/admin/user/" + userId, + method: "delete", + }); +}; diff --git a/src/view/system/notice/inform/index.scss b/src/view/system/notice/inform/index.scss new file mode 100644 index 0000000..12821c2 --- /dev/null +++ b/src/view/system/notice/inform/index.scss @@ -0,0 +1,60 @@ +#content { + display: flex; + border-top: 1px solid black; + .dept-content { + flex: 20%; + padding: 35px 12px 0 0; + height: calc(100vh - 85px); + } + + .left-dept { + flex: 20%; + padding: 35px 12px 0 0; + height: calc(100vh - 85px); + border: 1px solid red; + border-top: 1px solid black; + } + .right { + flex: 80%; + height: 190px; + display: flex; + flex-direction: column; + + .search-content { + display: flex; + width: 500px; + justify-content: space-around; + padding: 35px 12px 0 0; + margin-left: 20px; + } + } + .table-content { + margin: 12px 0 0 12px; + + .ant-table-thead > tr > th { + color: #909399; + text-align: center; + } + .ant-table-tbody > tr > td { + text-align: center; + } + } + .add-content { + display: flex; + margin-left: 12px; + margin-top: 20px; + button:focus, + button:focus-visible { + outline: none; + } + } + .user-mid-button { + display: flex; + margin-left: 12px; + margin-top: 20px; + button:focus, + button:focus-visible { + outline: none; + } + } +} diff --git a/src/view/system/notice/inform/index.tsx b/src/view/system/notice/inform/index.tsx index 0dbeafb..b48eae1 100644 --- a/src/view/system/notice/inform/index.tsx +++ b/src/view/system/notice/inform/index.tsx @@ -1,5 +1,242 @@ +import "./index.scss"; +import { Select, Button, Table, Space, Tag, message, Modal } from "antd"; + +import { + EditOutlined, + DeleteOutlined, + ExclamationCircleFilled, +} from "@ant-design/icons"; + +import { + getNoticeListApi, + deleteNoticeInfoApi, +} from "../../../../api/system/notice"; + +import { useEffect, useState } from "react"; +import { SearchOutlined, RedoOutlined } from "@ant-design/icons"; + export default function Inform() { - return( -
公告1
- ) -} \ No newline at end of file + const [noticeInfo, setNoticeInfo] = useState(""); + const [isNoticeOpen, setIsNoticeOpen] = useState(false); + const [listData, setListData] = useState([]); + const [messageApi, contextHolder] = message.useMessage(); + const [queryParams, setQueryParams] = useState({ + state: undefined, + pageSize: undefined, + pageNum: undefined, + }); + const columns = [ + { + title: "序号", + dataIndex: "noticeId", + key: "noticeId", + render: (text: string) => <>{text ? text : "null"}, + }, + { + title: "公告标题", + dataIndex: "noticeTitle", + key: "noticeTitle", + render: (text: string) => <>{text ? text : "null"}, + }, + { + title: "阅读状态", + key: "state", + dataIndex: "state", + render: (text: string) => ( + <> + {text === "1" ? ( + 已读 + ) : ( + 未读 + )} + + ), + }, + { + title: "操作", + key: "operate", + dataIndex: "operate", + render: (_: string, record: object) => ( +
+ + + handleInfo(record)} + style={{ color: " #58aaff" }} + > + 详情 + + + handleDel(record)} + style={{ color: " #58aaff" }} + > + 删除 + + +
+ ), + }, + ]; + + interface QueryParamsType { + state?: string; + pageSize?: number; + pageNum?: number; + } + + const getList = async (newQueryParams: object) => { + try { + const { code, data } = await getNoticeListApi(newQueryParams); + if (code === 1000) { + setListData(data.rows); + } + } catch (err) { + console.error(err); + } + }; + + const handleReset = async () => { + setQueryParams({}); + getList({}); + }; + + const handleSearch = () => { + getList(queryParams); + }; + + const handleInfo = (record: any) => { + setIsNoticeOpen(true); + setNoticeInfo(record.noticeTitle); + }; + + const handleInfoOk = () => { + setIsNoticeOpen(false); + }; + + const handleInfoCancel = () => { + setIsNoticeOpen(false); + }; + + const handleDel = async (record: any) => { + Modal.confirm({ + title: `确定删除Id为-${record.noticeId}-, 名称为-${record.noticeTitle}-的岗位吗?`, + icon: , + async onOk() { + const { code } = await deleteNoticeInfoApi(record.noticeId); + try { + if (code === 1000) { + messageApi.open({ + type: "success", + content: "删除成功", + }); + getList({}); + } else { + messageApi.open({ + type: "error", + content: "删除失败", + }); + } + } catch (err) { + console.log(err); + } + }, + onCancel() { + messageApi.open({ + type: "warning", + content: "取消成功", + }); + }, + }); + }; + + const handlePageChange = (page: number) => { + setQueryParams({ + ...queryParams, + pageNum: page, + }); + }; + + useEffect(() => { + getList(queryParams); + }, []); + + return ( +
+ <> +
+
+ <> + +
状态
+ +
+
+
岗位编码
+ +
+
+
状态
+ + + + + + + + + + + + + + + + + 正常 + 停用 + + + + + + + +
+ +
+ ); +} diff --git a/src/view/system/role/index.tsx b/src/view/system/role/index.tsx index e2928d2..169ee64 100644 --- a/src/view/system/role/index.tsx +++ b/src/view/system/role/index.tsx @@ -71,7 +71,6 @@ const fieldNames = { let thisrole: any = {}; let treeIds: number[] = []; export default function Role() { - const { confirm } = Modal; const { RangePicker } = DatePicker; //提示组件 @@ -94,7 +93,6 @@ export default function Role() { const [expandedKeys, setExpandedKeys] = useState([]); const [checkedKeys, setCheckedKeys] = useState([]); const [selectedKeys, setSelectedKeys] = useState([]); - const [autoExpandParent, setAutoExpandParent] = useState(true); //Modal const [isModalOpen, setIsModalOpen] = useState(false); const [modalTitle, setModalTitle] = useState(""); @@ -194,11 +192,10 @@ export default function Role() { pageNum: undefined, pageSize: undefined, }); - const [allChecked,setAllChecked]=useState(false) + const [allChecked, setAllChecked] = useState(false); const onTreeExpand = (expandedKeysValue: React.Key[]) => { // console.log("onExpand", expandedKeysValue); setExpandedKeys(expandedKeysValue); - setAutoExpandParent(false); }; const onCheckExpand = (e: CheckboxChangeEvent) => { console.log(`checked = ${e.target.checked}`); @@ -209,7 +206,7 @@ export default function Role() { }; const onCheckAll = (e: CheckboxChangeEvent) => { console.log(`checked = ${e.target.checked}`); - setAllChecked(!allChecked) + setAllChecked(!allChecked); if (!allChecked) setCheckedKeys(treeIds); else setCheckedKeys([]); }; @@ -220,13 +217,12 @@ export default function Role() { const onTreeCheck = (checkedKeysValue: any) => { // console.log("onCheck", checkedKeysValue.checked); console.log("onCheck", checkedKeysValue); - console.log('treeIds',treeIds); - - if(checkedKeysValue.length!=treeIds.length){ - setAllChecked(false) - } - else { - setAllChecked(true) + console.log("treeIds", treeIds); + + if (checkedKeysValue.length != treeIds.length) { + setAllChecked(false); + } else { + setAllChecked(true); } if (checkStrictly === false) { form.setFieldsValue({ menuIds: checkedKeysValue }); @@ -269,19 +265,19 @@ export default function Role() { }; const handleSerach = () => { searchValue = formSearch.getFieldsValue(); - + if (typeof searchValue.dateTime !== "undefined") { searchValue.startTime = (searchValue.dateTime as string[])[0]; searchValue.endTime = (searchValue.dateTime as string[])[1]; - } - setSearchValue(searchValue) + } + setSearchValue(searchValue); count = 1; setQueryTableDataParams({ ...searchValue }); }; const handleReset = () => { formSearch.resetFields(); - searchValue =formSearch.getFieldsValue() - setSearchValue(searchValue) + searchValue = formSearch.getFieldsValue(); + setSearchValue(searchValue); setQueryTableDataParams({ ...searchValue }); // setSearchValue({ ...searchValue }); // setCount(1) @@ -336,7 +332,7 @@ export default function Role() { searchValue.startTime = dateString[0]; searchValue.endTime = dateString[1]; formSearch.setFieldsValue({ dateTime: [dateString[0], dateString[1]] }); - setSearchValue(searchValue) + setSearchValue(searchValue); // setSearchValue({ ...searchValue }) }; const filterOption = ( @@ -515,29 +511,35 @@ export default function Role() { return (
-
- - + + - - + + - + */}
展开 - 全选 + + 全选 + 父子联动
-
+
tr > th { + color: #909399; + text-align: center; + } + .ant-table-tbody > tr > td { + text-align: center; + } + } + .add-content { + display: flex; + margin-left: 12px; + margin-top: 20px; + button:focus, + button:focus-visible { + outline: none; + } + } + + .user-mid-button { + display: flex; + margin-left: 12px; + margin-top: 20px; + button:focus, + button:focus-visible { + outline: none; + } + } + } +} diff --git a/src/view/system/user/index.tsx b/src/view/system/user/index.tsx index b47f70a..d8952b1 100644 --- a/src/view/system/user/index.tsx +++ b/src/view/system/user/index.tsx @@ -1,7 +1,807 @@ +import "./index.scss"; +import { + Input, + Tree, + Select, + DatePicker, + Button, + Table, + Space, + Tag, + message, + Modal, + Form, + Row, + Col, + TreeSelect, + Radio, +} from "antd"; +import { + EditOutlined, + DeleteOutlined, + ExclamationCircleFilled, +} from "@ant-design/icons"; + +import { + getUserListApi, + deleteUserApi, + getDeptTreeApi, + addUserApi, + getRoleListApi, + getUserInfoApi, + editUserApi, +} from "../../../api/system/users"; +import dataLocale from "antd/es/date-picker/locale/zh_CN"; +import React, { useEffect, useState, useMemo } from "react"; +import { SearchOutlined, PlusOutlined } from "@ant-design/icons"; export default function User() { - return( -
user
- ) -} \ No newline at end of file + const postIdList: number[] = []; + const [form] = Form.useForm(); + const [searchForm] = Form.useForm(); + const [echoId, setEchoId] = useState(); + const [myTreeData, setMyTreeData] = useState<[]>([]); + const [listData, setListData] = useState([]); + const [radioValue, setRadioValue] = useState(1); + const [searchTreeValue, setSearchTreeValue] = useState(""); + const [roleList, setRoleList] = useState([]); + const [messageApi, contextHolder] = message.useMessage(); + const [modalTitle, setModalTitle] = useState(""); + const [buttonType, setButtonType] = useState(""); + const [isShowModal, setIsShowModal] = useState(false); + const [autoExpandParent, setAutoExpandParent] = useState(true); + const [expandedKeys, setExpandedKeys] = useState([ + 100, 102, 101, 104, + ]); + const [treeValue, setTreeValue] = useState(); + const fieldNames = { + label: "deptName", + title: "deptName", + value: "deptId", + key: "deptName", + }; + const [queryParams, setQueryParams] = useState({ + deptId: undefined, + userName: undefined, + phoneNumber: undefined, + state: undefined, + startTime: undefined, + endTime: undefined, + pageNum: undefined, + pageSize: undefined, + }); + const columns = [ + { + title: "序号", + dataIndex: "userId", + key: "Id", + render: (text: string) => <>{text ? text : "null"}, + }, + { + title: "用户名称", + dataIndex: "userName", + key: "userName", + render: (text: string) => <>{text ? text : "null"}, + }, + { + title: "用户昵称", + dataIndex: "nickName", + key: "nikeName", + render: (text: string) => <>{text ? text : "null"}, + }, + { + title: "部门", + key: "deptId", + dataIndex: "deptName", + render: (text: string) => <>{text ? text : "--"}, + }, + { + title: "手机号码", + key: "phoneNumber", + dataIndex: "phoneNumber", + render: (text: string) => <>{text ? text : "--"}, + }, + { + title: "状态", + key: "state", + dataIndex: "state", + render: (text: string) => ( + <> + {text === "0" ? ( + 停用 + ) : ( + 正常 + )} + + ), + }, + { + title: "创建时间", + key: "createTime", + dataIndex: "createTime", + render: (text: string) => <>{text ? text : "null"}, + }, + { + title: "操作", + key: "operate", + dataIndex: "operate", + render: (_: string, record: object) => ( + + ), + }, + ]; + + interface AddUserType { + email: string; + nickName: string; + password: string; + phoneNumber: string; + postIds: number[]; + roleIds: number[]; + sex: string; + state: string; + userName: string; + } + + interface QueryParamsType { + deptId?: number; + userName?: string; + phoneNumber?: string; + state?: string; + startTime?: string | any; + endTime?: string | any; + pageNum?: number; + pageSize?: number; + } + + let addUserParams: AddUserType = { + email: "", + nickName: "", + password: "", + phoneNumber: "", + postIds: [], + roleIds: [], + sex: "", + state: "", + userName: "", + }; + + const getDeptTreeData = async () => { + try { + const { code, data } = await getDeptTreeApi(); + if (code === 1000) { + setMyTreeData(data); + handleLoopPostList(data); + setExpandedKeys(postIdList); + } + } catch (error) { + console.error(error); + } + }; + + const getUserList = async (newQueryParams: object) => { + try { + const { code, data } = await getUserListApi(newQueryParams); + if (code === 1000) { + setListData(data.rows); + } + } catch (err) { + console.error(err); + } + }; + + const getUserInfo = async () => { + try { + const { code, data } = await getUserInfoApi(echoId); + if (code === 1000) { + handleEcho(data); + } + } catch (error) { + console.error(error); + } + }; + + const getRoleList = async () => { + try { + const { code, data } = await getRoleListApi(); + if (code === 1000) { + setRoleList(data.rows); + } + } catch (err) { + console.log(err); + } + }; + + const handleAdd = () => { + setModalTitle("新增用户"); + setButtonType("ADD"); + setIsShowModal(true); + }; + + const handleEdit = (echoData: any) => { + setModalTitle("修改用户"); + setButtonType("EDIT"); + setIsShowModal(true); + setEchoId(echoData.userId); + }; + + const handleConfirm = () => { + form.validateFields().then((values) => { + Object.keys(values).forEach( + (key) => values[key] === undefined && delete values[key] + ); + addUserParams = { + ...addUserParams, + ...values, + userId: echoId, + }; + if (buttonType === "ADD") { + handleAddUser(); + } else if (buttonType === "EDIT") { + handleEditUser(); + } else { + messageApi.open({ + type: "error", + content: "系统异常，请刷新后重试", + }); + } + }); + }; + + const handleAddUser = async () => { + const { code } = await addUserApi(addUserParams); + try { + if (code === 1000) { + messageApi.open({ + type: "success", + content: "创建成功", + }); + setQueryParams({}); + handleClear(); + } else { + messageApi.open({ + type: "error", + content: "用户名已经存在", + }); + } + } catch (err) { + console.log(err); + } + }; + + const handleEditUser = async () => { + const { code } = await editUserApi(addUserParams); + try { + if (code === 1000) { + messageApi.open({ + type: "success", + content: "修改成功", + }); + setQueryParams({}); + handleClear(); + } else { + messageApi.open({ + type: "error", + content: "修改失败", + }); + } + } catch (err) { + console.log(err); + } + }; + + const handleReset = async () => { + searchForm.resetFields(); + setQueryParams({}); + getUserList({}); + }; + + const handleSearch = () => { + getUserList(queryParams); + }; + + const handleDel = async (record: any) => { + Modal.confirm({ + title: `确定删除Id为-${record.userId}-, 用户名为-${record.userName}-的用户吗?`, + icon: , + async onOk() { + const { code } = await deleteUserApi(record.userId); + try { + if (code === 1000) { + messageApi.open({ + type: "success", + content: "删除成功", + }); + setQueryParams({}); + } else { + messageApi.open({ + type: "error", + content: "删除失败", + }); + } + } catch (err) { + console.log(err); + } + }, + onCancel() { + messageApi.open({ + type: "warning", + content: "取消成功", + }); + }, + }); + }; + + const handleTimePikerValue = (_: any, dates: string[]) => { + setQueryParams({ + ...queryParams, + startTime: dates[0], + endTime: dates[1], + }); + searchForm.setFieldsValue({ dataTime: [dates[0], dates[1]] }); + }; + + const handleSearchValues = (e: any) => { + const { name, value } = e.target; + setQueryParams({ ...queryParams, [name]: value }); + }; + + const handlePageChange = (page: number) => { + setQueryParams({ + ...queryParams, + pageNum: page, + }); + }; + + const handleTreeSelect = (deptId: any) => { + console.log(queryParams); + getUserList({ + ...queryParams, + deptId: deptId[0], + }); + }; + + const handleEcho = (data: any) => { + const { userName, nickName, sex, state, phoneNumber, deptId, email } = + data.user; + const { postIds, roleIds } = data; + form.setFieldsValue({ + userName, + nickName, + state, + phoneNumber, + sex, + deptId, + email, + postIds, + roleIds, + }); + }; + + const handleCancel = () => { + handleClear(); + }; + + const handleClear = () => { + form.resetFields(); + setIsShowModal(false); + }; + + const handleExpandKeys = (key: string, data: object[]) => { + const filterRes = new RegExp(key, "i"); + data.forEach((item: any) => { + if (filterRes.test(item?.title?.props?.children)) { + postIdList.push(item.key); + } + item.children ? handleExpandKeys(key, item.children) : ""; + }); + }; + + const handleLoopPostList = (loopData: object[]) => { + loopData.forEach((item: any) => { + if (item?.deptId) { + const flag = postIdList.some((someItem) => { + someItem === item.deptId; + }); + if (!flag) { + postIdList.push(item.deptId); + } + } + item.children ? handleLoopPostList(item.children) : ""; + }); + }; + + const onRadio = (e: any) => { + setRadioValue(e.target.value); + }; + + const onTreeSelect = (newValue: string) => { + setTreeValue(newValue); + }; + + const onTreeSearch = (e?: any) => { + const { value } = e.target ? e.target : null; + setSearchTreeValue(value); + handleExpandKeys(value, treeData); + setExpandedKeys(postIdList); + setAutoExpandParent(true); + }; + + const onExpand = (newExpandedKeys: React.Key[]) => { + console.log(newExpandedKeys); + setExpandedKeys(newExpandedKeys); + setAutoExpandParent(false); + }; + + const treeData = useMemo(() => { + const loop = (data: any[]): any[] => + data.map((item) => { + const strTitle = item.deptName as string; + const index = strTitle.indexOf(searchTreeValue); + const beforeStr = strTitle.substring(0, index); + const afterStr = strTitle.slice(index + searchTreeValue.length); + const title = + index > -1 ? ( + + {beforeStr} + {searchTreeValue} + {afterStr} + + ) : ( + {strTitle} + ); + if (item.children) { + return { title, key: item.deptId, children: loop(item.children) }; + } + return { + title, + key: item.deptId, + }; + }); + return loop(myTreeData); + }, [myTreeData]); + + useEffect(() => { + getDeptTreeData(); + getRoleList(); + getUserInfo(); + }, [echoId]); + + useEffect(() => { + getUserList({}); + }, []); + + return ( +
+
+ } + placeholder="请输入部门名称" + onChange={onTreeSearch} + /> + +
+ <> +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 正常 + 停用 + + + + + + + {roleList.map((item) => ( + + {item.roleName} + + ))} + + + + + + + + + + + + +
+ +
+ ); +}