From d7b6926a803f28c82fca47befe0b52b42e3032dd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E2=80=98lijianhao=E2=80=99?= Date: Thu, 21 Jul 2022 20:18:03 +0800 Subject: [PATCH] =?UTF-8?q?'=E7=94=A8=E6=88=B7=E7=AE=A1=E7=90=86=E8=B0=83?= =?UTF-8?q?=E6=95=B4'?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/sections/organization/actions/user.js | 39 +++++- .../organization/components/userModal.js | 35 +++-- .../sections/organization/containers/user.js | 122 +++++++++++++++--- web/client/src/utils/webapi.js | 4 +- 4 files changed, 163 insertions(+), 37 deletions(-) diff --git a/web/client/src/sections/organization/actions/user.js b/web/client/src/sections/organization/actions/user.js index b9eed02b..9c72eb58 100644 --- a/web/client/src/sections/organization/actions/user.js +++ b/web/client/src/sections/organization/actions/user.js @@ -57,22 +57,55 @@ export function delUser(userIds) { }); } -export function resetPwd(id, data) { +export function resetPwd(userId, data) { return dispatch => basicAction({ type: 'put', data, dispatch: dispatch, actionType: 'CREATE_DEPARTMENT_USER', - url: ApiTable.resetPwd.replace('{id}', id), + url: ApiTable.resetPwd.replace('{userId}', userId), msg: { option: '重置用户密码' }, }); } +export function createDep(data) { + return dispatch => basicAction({ + type: 'put', + data, + dispatch: dispatch, + actionType: 'CREATE_DEPARTMENT', + url: ApiTable.createDepMessage, + msg: { option: '新建部门' }, + }); +} + +export function delDep(depId) { + return dispatch => basicAction({ + type: 'del', + dispatch: dispatch, + actionType: 'DEL_DEPARTMENT', + url: ApiTable.delDepMessage.replace('{depId}', depId), + msg: { option: '删除部门' }, + }); +} + +export function updateDep(data) { + return dispatch => basicAction({ + type: 'put', + data, + dispatch: dispatch, + actionType: 'UPDATE_DEPARTMENT', + url: ApiTable.createDepMessage, + msg: { option: '修改部门' }, + }); +} export default { getDepMessage, getDepUser, createUser, updateUser, delUser, - resetPwd + resetPwd, + createDep, + delDep } \ No newline at end of file diff --git a/web/client/src/sections/organization/components/userModal.js b/web/client/src/sections/organization/components/userModal.js index 45c085bb..babe35ea 100644 --- a/web/client/src/sections/organization/components/userModal.js +++ b/web/client/src/sections/organization/components/userModal.js @@ -41,7 +41,7 @@ const UserModal = (props) => { { rules={[{ required: true, message: '请输入姓名' }]} /> { - return event.target.value.replace(/\D/g, '') + return event.target.value }} - placeholder="请输入用户名(手机号)" + placeholder="请输入用户名" rules={[ - { required: true, valueType: Number, max: 11 }, { pattern: /^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/, message: "请输入正确的手机号" } + { required: true } ]} /> @@ -92,17 +93,25 @@ const UserModal = (props) => { }} rules={[{ required: true, message: '请选择所属部门' }]} request={async () => { - console.log(depData); return depData }} expandedKeys={["title"]} /> < ProFormText - name={['contract', 'post']} + name={['contract', 'phone']} width="md" - label="职位" - // required - placeholder="请输入职位" + label="手机号" + required + fieldProps={{ + maxLength: 11, + }} + getValueFromEvent={(event) => { + return event.target.value.replace(/\D/g, '') + }} + placeholder="请输入手机号" + rules={[ + { required: true, valueType: Number, max: 11 }, { pattern: /^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/, message: "请输入正确的手机号" } + ]} /> @@ -149,7 +158,7 @@ const UserModal = (props) => { function mapStateToProps(state) { const { depMessage } = state; - + console.log('depMessage:',depMessage); const pakData = (dep) => { // console.log(dep); return dep.map((d) => { diff --git a/web/client/src/sections/organization/containers/user.js b/web/client/src/sections/organization/containers/user.js index da407ee2..b8c21ae6 100644 --- a/web/client/src/sections/organization/containers/user.js +++ b/web/client/src/sections/organization/containers/user.js @@ -1,11 +1,12 @@ import React, { useEffect, useState } from 'react'; import { connect } from 'react-redux'; -import { EllipsisOutlined } from '@ant-design/icons'; -import { Spin, Space, Button, Popconfirm, Row, Col, Tree, Table, Card, Switch } from 'antd'; +import { DeleteOutlined, EllipsisOutlined, FormOutlined } from '@ant-design/icons'; +import { Spin, Space, Button, Popconfirm, Row, Col, Tree, Table, Card, Switch, Tooltip } from 'antd'; import ProTable from '@ant-design/pro-table'; -import { getDepMessage, getDepUser, createUser, updateUser, delUser, resetPwd } from '../actions/user'; +import { getDepMessage, getDepUser, createUser, updateUser, delUser, resetPwd, createDep, delDep, updateDep } from '../actions/user'; import UserModal from '../components/userModal'; import ResetPwd from '../components/resetPwd'; +import DepModal from '../components/depModal'; const TreeNode = Tree.TreeNode; @@ -17,6 +18,10 @@ const UserManage = (props) => { const [pwdModalVisible, setPwdModalVisible] = useState(false); const [depSelectedKeys, setDepSelectedKeys] = useState([]) const [rowSelected, setRowSelected] = useState([]) + const [depModalVisible, setDepModalVisible] = useState(false); + const [depModalType, setDepModalType] = useState(); + const [depModalRecord, setDepModalRecord] = useState(); + useEffect(() => { dispatch(getDepMessage()) }, []) @@ -27,20 +32,20 @@ const UserManage = (props) => { dispatch(getDepUser(depMessage[0].id)) } }, [depMessage]) - const columns = [ { title: '姓名', dataIndex: 'name', }, { - title: '用户名(手机号)', + title: '用户名', dataIndex: 'username', }, { - title: '职位', - dataIndex: 'post', - }, { + title: '手机号', + dataIndex: 'phone', + }, + { title: '邮箱', dataIndex: 'email', }, { @@ -53,7 +58,6 @@ const UserManage = (props) => { title: '操作', dataIndex: 'action', render: (dom, record) => { - // return record.username == 'SuperAdmin' ? '' : [ // , // { dispatch(createUser(values.contract)).then(res => { if (res.success) { setModalVisible(false); - dispatch(getDepUser(depSelectedKeys[0])); + dispatch(getDepMessage()); } }); } @@ -125,6 +129,18 @@ const UserManage = (props) => { } } + //打开部门弹窗 + const openDepModal = (type, record) => { + setDepModalVisible(true) + setDepModalType(type) + if (type == 'edit') { + setDepModalRecord(record); + } else { + setModalRecord(null); + } + + } + //删除用户 const delUsers = (ids, type) => { dispatch(delUser(ids)).then(res => { @@ -144,7 +160,53 @@ const UserManage = (props) => { } }); } + //部门新增及编辑 + const onDepConfirm = (data) => { + if (depModalType == 'edit') { + dispatch(updateDep(data)).then(res => { + if (res.success) { + setDepModalVisible(false); + dispatch(getDepMessage()); + } + }); + } else { + dispatch(createDep(data)).then(res => { + if (res.success) { + setDepModalVisible(false); + dispatch(getDepMessage()); + } + }); + } + + } + // 删除部门 + const delDepartment = (id) => { + dispatch(delDep(id)).then(res => { + dispatch(getDepMessage()) + }); + } + const renderTree = (item, id) => { + return
+ +
{item.name}
+ +
+ { + depSelectedKeys == id ? <> + { + setDepModalRecord(item) + setDepModalVisible(true) + setDepModalType('edit') + }} /> + { delDepartment(id) }}> + + + : null + } +
+
+ } return (
@@ -155,7 +217,7 @@ const UserManage = (props) => { type="primary" key="primary" style={{ marginLeft: 50 }} - onClick={() => openModal('create')} + onClick={() => openDepModal('create')} >新建部门 { depMessage.length ? @@ -164,19 +226,33 @@ const UserManage = (props) => { defaultExpandedKeys={[depMessage[0].id]} selectedKeys={depSelectedKeys} onSelect={(selectedKeys, e) => { + if (e.selected) { setDepSelectedKeys(selectedKeys) dispatch(getDepUser(selectedKeys[0])) } }} - treeData={depMessage} - fieldNames={{ - title: 'name', - key: 'id', - children: 'subordinate' - }} style={{ paddingTop: 20 }} - /> : '' + > + { + depMessage?.map((s, index) => { + return + { + s.subordinate.map(k => { + return { setIShowIcon(k.id) }} onMouseOut={() => { setIShowIcon(null) }}> + { + k.subordinate.map(i => { + return { setIShowIcon(i.id) }} onMouseOut={() => { setIShowIcon(null) }}> + + }) + } + + }) + } + + }) + } + : '' } @@ -234,6 +310,14 @@ const UserManage = (props) => { onVisibleChange={setPwdModalVisible} onConfirm={onPwdConfirm} /> : ''} + {depModalVisible ? : ''} + + + @@ -254,4 +338,4 @@ function mapStateToProps(state) { }; } -export default connect(mapStateToProps)(UserManage); \ No newline at end of file +export default connect(mapStateToProps)(UserManage); diff --git a/web/client/src/utils/webapi.js b/web/client/src/utils/webapi.js index 1f6a90bf..96b86ae0 100644 --- a/web/client/src/utils/webapi.js +++ b/web/client/src/utils/webapi.js @@ -9,7 +9,7 @@ export const ApiTable = { //组织管理-用户管理-部门     getDepMessage: 'department', -    createMessage: 'department', +    createDepMessage: 'department',     updateDepMessage: 'department',     delDepMessage: 'department/{depId}',     //组织管理-用户管理-用户 @@ -18,7 +18,7 @@ export const ApiTable = {     updateUser: 'department/user/{userId}',     delUser: 'department/user/{userIds}', -    resetPwd: '/organization/department/user/resetPwd/{id}', +    resetPwd: 'department/user/{userId}/password', //用户权限