perf: 查找用户

src/pages/userCenter/UserManage.js

@@ -14,6 +14,7 @@ import {
   Divider,
   Tabs,
   Checkbox,
+  Button,
 } from 'antd';
 import {
   FileAddTwoTone,
@@ -24,6 +25,8 @@ import {
   ShareAltOutlined,
   KeyOutlined,
   ApartmentOutlined,
+  SearchOutlined,
+  StopOutlined,
 } from '@ant-design/icons';
 import { PageContainer } from '@ant-design/pro-layout';
 // import classnames from 'classnames';
@@ -40,9 +43,11 @@ const UserManage = () => {
   const [treeData1, setTreeData1] = useState([]);
   const [treeData2, setTreeData2] = useState([]);
   const [tableData, setTableData] = useState([]); // 用户表
+  const [searchData, setSearchData] = useState([]);
   const [currentSelect, setCurrentSelect] = useState([]);
 
   const [userVisible, setUserVisible] = useState(false);
+  const [searchUserVisible, setSearchUserVisible] = useState(false);
   const [addOrgVisible, setAddOrgVisible] = useState(false);
   const [editOrgVisible, setEditOrgVisible] = useState(false);
   const [deleteOrgVisible, setDeleteOrgVisible] = useState(false);
@@ -62,6 +67,7 @@ const UserManage = () => {
   const [rolelist, setRolelist] = useState([]);
   const [stationlist, setStationlist] = useState([]);
 
+  const [searchUserForm] = Form.useForm();
   const [addUserForm] = Form.useForm();
   const [addOrgForm] = Form.useForm();
   const [editOrgForm] = Form.useForm();
@@ -132,7 +138,7 @@ const UserManage = () => {
             />
           </Tooltip>
           <Tooltip title="冻结用户">
-            <PlayCircleOutlined
+            <StopOutlined
               onClick={() => freezeUser(record)}
               style={{ fontSize: '16px', color: '#1890FF' }}
             />
@@ -161,6 +167,46 @@ const UserManage = () => {
       ),
     },
   ];
+  const searchColumns = [
+    {
+      title: '所在机构',
+      dataIndex: 'OUName',
+      key: 'OUName',
+    },
+    {
+      title: '登录名称',
+      dataIndex: 'loginName',
+      key: 'loginName',
+      render: item => (
+        <div
+          ref={r => {
+            if (r) {
+              r.innerHTML = item;
+            }
+          }}
+        />
+      ),
+    },
+    {
+      title: '用户姓名',
+      dataIndex: 'userName',
+      key: 'userName',
+      render: item => (
+        <div
+          ref={r => {
+            if (r) {
+              r.innerHTML = item;
+            }
+          }}
+        />
+      ),
+    },
+    {
+      title: '手机号码',
+      dataIndex: 'phone',
+      key: 'phone',
+    },
+  ];
 
   // 渲染机构树
   const mapTree = org => {
@@ -267,6 +313,9 @@ const UserManage = () => {
   };
 
   // 左侧目录树相关操作
+  const searchUser = () => {
+    setSearchUserVisible(true);
+  };
   const addUser = (e, title, id) => {
     // e.stopPropagation();
     setUserVisible(true);
@@ -300,9 +349,10 @@ const UserManage = () => {
   const relateRole = record => {
     setRoleVisible(true);
     setUserID(record.userID);
-    setTimeout(() => {
     getRoleList();
-    }, 1000);
+    // setTimeout(() => {
+    //   getRoleList();
+    // }, 1000);
   };
   const changeOrg = record => {
     setChangeOrgVisible(true);
@@ -336,6 +386,29 @@ const UserManage = () => {
     setDeleteUserVisible(true);
     setUserID(record.userID);
   };
+  // 查找用户
+  const submitSearchUser = () => {
+    get(`/Cityinterface/rest/services/OMS.svc/U_GetUserByKey`, {
+      _version: 9999,
+      _dc: time.getTime(),
+      key: searchUserForm.getFieldValue('key'),
+    })
+      .then(res => {
+        if (res.success) {
+          // setSearchUserVisible(false);
+          setSearchData(res.root);
+          // setSearchData(res.root);
+        } else {
+          notification.error({
+            message: '提交失败',
+            description: res.message,
+          });
+        }
+      })
+      .catch(err => {
+        message.error(err);
+      });
+  };
   // 提交-添加用户
   const submitAddUser = () => {
     get(`/Cityinterface/rest/services/OMS.svc/U_AddUser`, {
@@ -460,15 +533,12 @@ const UserManage = () => {
       });
   };
   const listitem = list =>
-    list.map(item1 => {
-      item1.key = item1.roleID;
-      return (
-        <Col className="gutter-row" span={6}>
-          <Checkbox checked={item1.isChecked} />
+    list.map(item1 => (
+      <Col className="gutter-row" span={6} key={item1.roleID}>
+        <Checkbox defaultChecked={item1.isChecked} />
         <span>{item1.roleName}</span>
       </Col>
-      );
-    });
+    ));
   const checkBox = () => {
     console.log('123');
   };
@@ -487,7 +557,7 @@ const UserManage = () => {
               item.key = index;
               return (
                 <>
-                  <Divider orientation="left" style={{ fontSize: '14px' }}>
+                  <Divider style={{ fontSize: '14px', color: '#1890FF' }}>
                     <Checkbox onClick={checkBox} />
                     {item.visibleTitle}
                   </Divider>
@@ -681,9 +751,20 @@ const UserManage = () => {
         <div className={styles.orgContainer}>
           <span style={{ padding: '8px', fontSize: '16px' }}>
             机构列表
+            <Tooltip title="查找用户">
+              <SearchOutlined
+                style={{
+                  fontSize: '18px',
+                  float: 'right',
+                  marginLeft: '12px',
+                  color: '#1890FF',
+                }}
+                onClick={searchUser}
+              />
+            </Tooltip>
             <Tooltip title="添加下级机构">
               <FolderAddTwoTone
-                style={{ fontSize: '16px', float: 'right' }}
+                style={{ fontSize: '18px', float: 'right' }}
                 onClick={e => addSubOrg(e, '根目录', '-1')}
               />
             </Tooltip>
@@ -705,6 +786,58 @@ const UserManage = () => {
             loading={tableLoading}
           />
         </div>
+        {/* 查找用户 */}
+        <Modal
+          title="查找用户"
+          visible={searchUserVisible}
+          onCancel={() => setSearchUserVisible(false)}
+          footer={[
+            <Button
+              key="back"
+              type="primary"
+              onClick={() => setSearchUserVisible(false)}
+            >
+              关闭
+            </Button>,
+          ]}
+        >
+          <Form form={searchUserForm}>
+            <Form.Item
+              name="key"
+              label="关键字搜索"
+              rules={[
+                {
+                  required: true,
+                },
+              ]}
+            >
+              <Input
+                placeholder="请输入登录名称/用户名称/手机号 ，回车键查找"
+                onPressEnter={submitSearchUser}
+              />
+              {/* <SearchOutlined
+                style={{
+                  fontSize: '18px',
+                  float: 'right',
+                  marginLeft: '12px',
+                  color: '#1890FF',
+                  display: 'inline-block',
+                }}
+                onClick={submitSearchUser}
+              /> */}
+            </Form.Item>
+          </Form>
+          <Table
+            columns={searchColumns}
+            dataSource={searchData}
+            onRow={record => ({
+              onClick: () => {
+                onSelect([record.OUID]);
+                setSearchUserVisible(false);
+              },
+            })}
+          />
+        </Modal>
         {/* 添加用户 */}
         <Modal
           title={orgTitle}