diff --git a/.umirc.ts b/.umirc.ts index eecfa13..a154d10 100644 --- a/.umirc.ts +++ b/.umirc.ts @@ -1,5 +1,4 @@ import { defineConfig } from '@umijs/max'; - export default defineConfig({ antd: {}, access: {}, @@ -40,27 +39,31 @@ export default defineConfig({ { name: ' 用户配置', path: '/user', - component: './User', + // redirect: "/users", routes: [ { name: ' 用户表', - path: '/Users', - component: './Users', + path: '/user/users', + component: "./Users", + layout:true, }, { name: ' 角色表', - path: '/Role', - component: './Role', + path: '/user/role', + component: "./Role", + layout:true, }, { name: ' 权限表', - path: '/Permission', - component: './Permission', + path: '/user/permission', + component: "./Permission", + layout:true, }, { - name: ' 社会用户信息表', - path: '/Social', - component: './Social', + name: ' 社会用户表', + path: '/user/social', + component: "./Social", + layout:true, }, ] }, diff --git a/src/pages/User/Permission/components/CreateForm.tsx b/src/pages/User/Permission/components/CreateForm.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Permission/components/UpdateForm.tsx b/src/pages/User/Permission/components/UpdateForm.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Permission/permission.tsx b/src/pages/User/Permission/permission.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Role/components/CreateForm.tsx b/src/pages/User/Role/components/CreateForm.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Role/components/UpdateForm.tsx b/src/pages/User/Role/components/UpdateForm.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Role/role.tsx b/src/pages/User/Role/role.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Social/components/CreateForm.tsx b/src/pages/User/Social/components/CreateForm.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Social/components/UpdateForm.tsx b/src/pages/User/Social/components/UpdateForm.tsx deleted file mode 100644 index 8b13789..0000000 --- a/src/pages/User/Social/components/UpdateForm.tsx +++ /dev/null @@ -1 +0,0 @@ - diff --git a/src/pages/User/Social/social.tsx b/src/pages/User/Social/social.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Users/components/CreateForm.tsx b/src/pages/User/Users/components/CreateForm.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Users/components/UpdateForm.tsx b/src/pages/User/Users/components/UpdateForm.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/User/Users/users.tsx b/src/pages/User/Users/users.tsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/Users/components/CreateForm.tsx b/src/pages/Users/components/CreateForm.tsx new file mode 100644 index 0000000..e5233db --- /dev/null +++ b/src/pages/Users/components/CreateForm.tsx @@ -0,0 +1,26 @@ +import { Modal } from 'antd'; +import React, { PropsWithChildren } from 'react'; + +interface CreateFormProps { + modalVisible: boolean; + onCancel: () => void; +} + +const CreateForm: React.FC> = (props) => { + const { modalVisible, onCancel } = props; + + return ( + onCancel()} + footer={null} + > + {props.children} + + ); +}; + +export default CreateForm; diff --git a/src/pages/Users/components/UpdateForm.tsx b/src/pages/Users/components/UpdateForm.tsx new file mode 100644 index 0000000..e5233db --- /dev/null +++ b/src/pages/Users/components/UpdateForm.tsx @@ -0,0 +1,26 @@ +import { Modal } from 'antd'; +import React, { PropsWithChildren } from 'react'; + +interface CreateFormProps { + modalVisible: boolean; + onCancel: () => void; +} + +const CreateForm: React.FC> = (props) => { + const { modalVisible, onCancel } = props; + + return ( + onCancel()} + footer={null} + > + {props.children} + + ); +}; + +export default CreateForm; diff --git a/src/pages/Users/index.tsx b/src/pages/Users/index.tsx new file mode 100644 index 0000000..2a67335 --- /dev/null +++ b/src/pages/Users/index.tsx @@ -0,0 +1,298 @@ +import services from '@/services/demo'; +import { + ActionType, + FooterToolbar, + PageContainer, + ProDescriptions, + ProDescriptionsItemProps, + ProTable, +} from '@ant-design/pro-components'; +import { Button, Divider, Drawer, message } from 'antd'; +import React, { useRef, useState } from 'react'; +import CreateForm from './components/CreateForm'; +//import UpdateForm, { FormValueType } from './components/UpdateForm'; + +const { addUser, queryUserList, deleteUser, modifyUser } = + services.UserController; + +/** + * 添加节点 + * @param fields + */ +const handleAdd = async (fields: API.UserInfo) => { + const hide = message.loading('正在添加'); + try { + await addUser({ ...fields }); + hide(); + message.success('添加成功'); + return true; + } catch (error) { + hide(); + message.error('添加失败请重试！'); + return false; + } +}; + +/** + * 更新节点 + * @param fields + +const handleUpdate = async (fields: FormValueType) => { + const hide = message.loading('正在配置'); + try { + await modifyUser( + { + userId: fields.id || '', + }, + { + name: fields.name || '', + nickName: fields.nickName || '', + email: fields.email || '', + }, + ); + hide(); + + message.success('编辑成功'); + return true; + } catch (error) { + hide(); + message.error('编辑失败请重试！'); + return false; + } +}; + */ +/** + * 删除节点 + * @param selectedRows + */ +const handleRemove = async (selectedRows: API.UserInfo[]) => { + const hide = message.loading('正在删除'); + if (!selectedRows) return true; + try { + await deleteUser({ + userId: selectedRows.find((row) => row.id)?.id || '', + }); + hide(); + message.success('删除成功，即将刷新'); + return true; + } catch (error) { + hide(); + message.error('删除失败，请重试'); + return false; + } +}; + +const User: React.FC = () => { + const [createModalVisible, handleModalVisible] = useState(false); + const [updateModalVisible, handleUpdateModalVisible] = + useState(false); + const [stepFormValues, setStepFormValues] = useState({}); + const actionRef = useRef(); + const [row, setRow] = useState(); + const [selectedRowsState, setSelectedRows] = useState([]); + const columns: ProDescriptionsItemProps[] = [ + { + title: '名称', + dataIndex: 'name', + tip: '名称是唯一的 key', + formItemProps: { + rules: [ + { + required: true, + message: '名称为必填项', + }, + ], + }, + }, + { + title: '昵称', + dataIndex: 'nickName', + valueType: 'text', + }, + { + title: '邮箱', + dataIndex: 'email', + valueType: 'text', + }, + { + title: '电话', + dataIndex: 'phone', + valueType: 'text', + }, + { + title: '密码', + dataIndex: 'password', + valueType: 'text', + }, + { + title: '性别', + dataIndex: 'gender', + hideInForm: true, + valueEnum: { + 0: { text: '男', status: 'MALE' }, + 1: { text: '女', status: 'FEMALE' }, + UNKNOWN: { text: '未知', status: 'UNKNOWN' }, + }, + }, + { + title: '头像', + dataIndex: 'avatar', + valueType: 'text', + }, + { + title: '注册时间', + dataIndex: 'create_time', + valueType: 'dateTime', + }, + { + title: '操作', + dataIndex: 'option', + valueType: 'option', + render: (_, record) => ( + <> + { + handleUpdateModalVisible(true); + setStepFormValues(record); + }} + > + 编辑 + + + 删除 + + ), + }, + ]; + + return ( + + + headerTitle="用户表格" + actionRef={actionRef} + rowKey="id" + search={{ + labelWidth: 120, + }} + toolBarRender={() => [ + , + ]} + request={async (params, sorter, filter) => { + const { data, success } = await queryUserList({ + ...params, + // FIXME: remove @ts-ignore + // @ts-ignore + sorter, + filter, + }); + return { + data: data?.list || [], + success, + }; + }} + columns={columns} + rowSelection={{ + onChange: (_, selectedRows) => setSelectedRows(selectedRows), + }} + /> + {selectedRowsState?.length > 0 && ( + + 已选择{' '} + {selectedRowsState.length}{' '} + 项   + + } + > + + + + )} + handleModalVisible(false)} + modalVisible={createModalVisible} + > + + onSubmit={async (value) => { + const success = await handleAdd(value); + if (success) { + handleModalVisible(false); + if (actionRef.current) { + actionRef.current.reload(); + } + } + }} + rowKey="id" + type="form" + columns={columns} + /> + + {stepFormValues && Object.keys(stepFormValues).length ? ( + { + const success = await handleUpdate(value); + if (success) { + handleUpdateModalVisible(false); + setStepFormValues({}); + if (actionRef.current) { + actionRef.current.reload(); + } + } + }} + onCancel={() => { + handleUpdateModalVisible(false); + setStepFormValues({}); + }} + updateModalVisible={updateModalVisible} + values={stepFormValues} + /> + + ) : null} + + { + setRow(undefined); + }} + closable={false} + > + {row?.name && ( + + column={2} + title={row?.name} + request={async () => ({ + data: row || {}, + })} + params={{ + id: row?.name, + }} + columns={columns} + /> + )} + + + ); +}; + +export default User;