Merge branch 'dev' of https://gitea.anxinyun.cn/gao.zhiyuan/Highways4Good into dev

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
 }

web/client/src/sections/organization/components/userModal.js

@@ -41,7 +41,7 @@ const UserModal = (props) => {
                 <ProForm.Group>
                     <ProFormText
                         name={['contract', 'name']}
-                        maxLength={24}
+                        maxLength={10}
                         width="md"
                         label="姓名"
                         required
@@ -49,19 +49,20 @@ const UserModal = (props) => {
                         rules={[{ required: true, message: '请输入姓名' }]}
                     />
                     <ProFormText
-                        name={['contract', 'phone']}
+                        name={['contract', 'username']}
                         width="md"
-                        label="用户名(手机号)"
+                        label="用户名"
+                        maxLength={20}
                         required
                         fieldProps={{
-                            maxLength: 11,
+                            maxLength: 30,
                         }}
                         getValueFromEvent={(event) => {
-                            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 }
                         ]}
                     />
                 </ProForm.Group>
@@ -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="职位"
+                        label="手机号"
-                        // required
+                        required
-                        placeholder="请输入职位"
+                        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: "请输入正确的手机号" }
+                        ]}
                     />
                 </ProForm.Group>
                 <ProForm.Group>
@@ -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) => {

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 { DeleteOutlined, EllipsisOutlined, FormOutlined } from '@ant-design/icons';
-import { Spin, Space, Button, Popconfirm, Row, Col, Tree, Table, Card, Switch } from 'antd';
+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: '职位',
+                title: '手机号',
-                dataIndex: 'post',
+                dataIndex: 'phone',
-            }, {
+            }, 
+            {
                 title: '邮箱',
                 dataIndex: 'email',
             }, {
@@ -53,7 +58,6 @@ const UserManage = (props) => {
                 title: '操作',
                 dataIndex: 'action',
                 render: (dom, record) => {
-
                     // return record.username == 'SuperAdmin' ? '' : [
                     //     <Button type="link" onClick={() => { openModal('edit', record) }}>编辑</Button>,
                     //     <Popconfirm
@@ -107,7 +111,7 @@ const UserManage = (props) => {
             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 <div style={{ display: 'flex', width: '6vw', justifyContent: 'space-between' }}>
+            <Tooltip title={item.name}>
+                <div style={{ width: '70%', textOverflow: 'ellipsis', whiteSpace: 'nowrap', overflow: 'hidden' }}>{item.name}</div>
+            </Tooltip>
+            <div style={{ width: '30%' }} >
+                {
+                    depSelectedKeys == id ? <>
+                        <FormOutlined onClick={() => {
+                            setDepModalRecord(item)
+                            setDepModalVisible(true)
+                            setDepModalType('edit')
+                        }} />
+                        <Popconfirm title='是否确认删除?' onConfirm={() => { delDepartment(id) }}>
+                            <DeleteOutlined style={{ marginLeft: 5 }} />
+                        </Popconfirm>
+                    </> : null
+                }
+            </div>
 
+        </div>
+    }
     return (<div >
         <Spin spinning={loading} /* style={{ height: "calc(100vh - 70px)" }} */>
             <Row gutter={16} /* style={{ overflow: "scroll" }} */>
@@ -155,7 +217,7 @@ const UserManage = (props) => {
                             type="primary"
                             key="primary"
                             style={{ marginLeft: 50 }}
-                            onClick={() => openModal('create')}
+                            onClick={() => openDepModal('create')}
                         >新建部门</Button>
                         {
                             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 <TreeNode title={renderTree(s, s.id)} key={s.id} >
+                                                {
+                                                    s.subordinate.map(k => {
+                                                        return <TreeNode title={renderTree(k, k.id)} key={k.id} onMouseOver={() => { setIShowIcon(k.id) }} onMouseOut={() => { setIShowIcon(null) }}>
+                                                            {
+                                                                k.subordinate.map(i => {
+                                                                    return <TreeNode title={renderTree(i, i.id)} key={i.id} onMouseOver={() => { setIShowIcon(i.id) }} onMouseOut={() => { setIShowIcon(null) }}>
+                                                                    </TreeNode>
+                                                                })
+                                                            }
+                                                        </TreeNode>
+                                                    })
+                                                }
+                                            </TreeNode>
+                                        })
+                                    }
+                                </Tree> : ''
                         }
                     </Card>
                 </Col>
@@ -234,6 +310,14 @@ const UserManage = (props) => {
                         onVisibleChange={setPwdModalVisible}
                         onConfirm={onPwdConfirm} /> : ''}
 
+                    {depModalVisible ? <DepModal visible={depModalVisible}
+                        onVisibleChange={setDepModalVisible}
+                        depModalType={depModalType}
+                        data={depModalRecord}
+                        onConfirm={onDepConfirm} /> : ''}
+
+
+
                 </Col>
             </Row>
         </Spin>
@@ -254,4 +338,4 @@ function mapStateToProps(state) {
     };
 }
 
-export default connect(mapStateToProps)(UserManage);
+export default connect(mapStateToProps)(UserManage);

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',
 
 
     //用户权限