fix: '机构，站点树支持搜索'

src/pages/bsmanager/base/tablemanager/filedConfig/changeAdd.jsx

 import React, { useState, useEffect, useCallback, useRef } from 'react';
 import { Form, Modal, Space, Divider, Radio, Checkbox } from 'antd';
-import {
-
-} from '@/services/tablemanager/tablemanager'
-import styles from './index.less'
+import {} from '@/services/tablemanager/tablemanager';
 import Sortable from 'sortablejs';
+import styles from './index.less'
 const CheckboxGroup = Checkbox.Group;
 const AddModal = props => {
-  const { callBackSubmit = () => { }, isType, formObj, visible, filed, characterValue, newCheckedList } = props;
+  const {
+    callBackSubmit = () => {},
+    isType,
+    formObj,
+    visible,
+    filed,
+    characterValue,
+    newCheckedList,
+  } = props;
   const [loading, setLoading] = useState(false);
   const [value, setValue] = useState('');
   const [checkValue, setCheckValue] = useState([]);
   const [form] = Form.useForm();
-  const [title, setTitle] = useState([])
+  const [title, setTitle] = useState([]);
   const { Item } = Form;
-  const [checkedList, setCheckedList] = useState([]);//选中的复选框内容
+  const [checkedList, setCheckedList] = useState([]); // 选中的复选框内容
   const [indeterminate, setIndeterminate] = useState([]);
   const [checkAll, setCheckAll] = useState([]);
-  const [selectData, setSelectData] = useState([])
-  let objArr = []
-  const onChangeList = (list, index,title) => {
-    const checkedListArr = [...checkedList]
-    checkedListArr[index] = list
+  const [selectData, setSelectData] = useState([]);
+  let objArr = [];
+  const onChangeList = (list, index, title) => {
+    const checkedListArr = [...checkedList];
+    checkedListArr[index] = list;
     setCheckedList(checkedListArr);
-    const indeterminateArr = [...indeterminate]
-    const checkAllArr = [...checkAll]
-    indeterminateArr[index] = !!list.length && list.length < filed[title].length
-    checkAllArr[index] = list.length === filed[title].length
-    setIndeterminate(indeterminateArr)
+    const indeterminateArr = [...indeterminate];
+    const checkAllArr = [...checkAll];
+    indeterminateArr[index] = !!list.length && list.length < filed[title].length;
+    checkAllArr[index] = list.length === filed[title].length;
+    setIndeterminate(indeterminateArr);
     setCheckAll(checkAllArr);
   };
 
   const onCheckAllChange = e => {
-    const indeterminateArr = [...indeterminate]
-    const checkAllArr = [...checkAll]
-    const checkedListArr = [...checkedList]
-    checkAllArr[e.target.index] = e.target.checked
-    indeterminateArr[e.target.index] = false
-    e.target.checked ? checkedListArr[e.target.index] = e.target.checkvalue : checkedListArr[e.target.index] = []
+    const indeterminateArr = [...indeterminate];
+    const checkAllArr = [...checkAll];
+    const checkedListArr = [...checkedList];
+    checkAllArr[e.target.index] = e.target.checked;
+    indeterminateArr[e.target.index] = false;
+    e.target.checked
+      ? (checkedListArr[e.target.index] = e.target.checkvalue)
+      : (checkedListArr[e.target.index] = []);
     setCheckedList(checkedListArr);
     setIndeterminate(indeterminateArr);
     setCheckAll(checkAllArr);
   };
-  //监听用户选择的字段名
+  // 监听用户选择的字段名
   useEffect(() => {
-    selectAll()
+    selectAll();
   }, [checkedList]);
 
   const selectAll = () => {
-    objArr = []
+    objArr = [];
     checkedList.map(item => {
-      objArr = objArr.concat(item)
-    })
-    setSelectData(objArr)
-  }
+      objArr = objArr.concat(item);
+    });
+    setSelectData(objArr);
+  };
 
   const onSubmit = () => {
-    isType === 'rule' ? callBackSubmit(`${value === '无' || value === '' ? '' : value + ','}${checkValue.join(',')}`) : callBackSubmit({ checkedList, str: selectData.join(",") });
+    isType === 'rule'
+      ? callBackSubmit(
+          `${value === '无' || value === '' ? '' : value + ','}${checkValue.join(',')}`,
+        )
+      : callBackSubmit({ checkedList, str: selectData.join(',') });
   };
 
   useEffect(() => {
     if (isType != '' && isType === 'rule') {
-      setValue(formObj.numerical)
-      setCheckValue(formObj.rule)
-    }
-    else if (isType === 'characteristics') {
-      let arr = Object.keys(filed)
-      setTitle(arr)
-      let checkArr = []
-      let indeterminateArr = []
-      let checkAllArr = []
+      setValue(formObj.numerical);
+      setCheckValue(formObj.rule);
+    } else if (isType === 'characteristics') {
+      let arr = Object.keys(filed);
+      setTitle(arr);
+      let checkArr = [];
+      let indeterminateArr = [];
+      let checkAllArr = [];
       arr.map((item, index) => {
-        checkArr[index] = []
+        checkArr[index] = [];
         newCheckedList.map(checkItem => {
           if (filed[item].includes(checkItem)) {
-            checkArr[index].push(checkItem)
+            checkArr[index].push(checkItem);
           }
-        })
-        indeterminateArr.push(!!checkArr[index].length && checkArr[index].length < filed[item].length)
-        checkAllArr.push(checkArr[index].length === filed[item].length)
-
-      })
-      setCheckedList(checkArr)
-      setIndeterminate(indeterminateArr)
-      setCheckAll(checkAllArr)
-      let newArr = characterValue.length? characterValue.split(","):[]
-      setSelectData(newArr)
-      draftSort()
+        });
+        indeterminateArr.push(
+          !!checkArr[index].length && checkArr[index].length < filed[item].length,
+        );
+        checkAllArr.push(checkArr[index].length === filed[item].length);
+      });
+      setCheckedList(checkArr);
+      setIndeterminate(indeterminateArr);
+      setCheckAll(checkAllArr);
+      let newArr = characterValue.length ? characterValue.split(',') : [];
+      setSelectData(newArr);
+      draftSort();
     }
-
   }, [visible]);
-  //单选框变化时触发的事件
-  const handleChange = (e) => {
-    setValue(e.target.value)
+  // 单选框变化时触发的事件
+  const handleChange = e => {
+    setValue(e.target.value);
     if (e.target.value === '无') {
-      setCheckValue([])
+      setCheckValue([]);
     }
-  }
-  //复选框变化时触发的事件
-  const onChange = (e) => {
-    setCheckValue(e)
+  };
+  // 复选框变化时触发的事件
+  const onChange = e => {
+    setCheckValue(e);
     if (e.length && value == '无') {
-      setValue('')
+      setValue('');
     }
-  }
-  //拖拽初始化及逻辑
+  };
+  // 拖拽初始化及逻辑
   const draftSort = () => {
     let el = document.getElementById('doctor-drag-items');
     if (el) {
       let sortable = Sortable.create(el, {
-        animation: 100, //动画参数
-        onEnd: function (evt) { //拖拽完毕之后发生，只需关注该事件
+        animation: 100, // 动画参数
+        onEnd (evt) { //拖拽完毕之后发生，只需关注该事件
           let arr = [];
           let len = evt.from.children.length;
           for (let i = 0; i < len; i++) {
             arr.push(evt.from.children[i].getAttribute('drag-id'))
           }
           setSelectData(arr)
-        }
+        },
       });
     }
-
-  }
+  };
 
   return (
     <Modal
@@ -130,31 +140,35 @@ const AddModal = props => {
       style={{ top: '10px' }}
       width="700px"
       destroyOnClose
-      centered ={true}
+      centered={true}
       maskClosable={false}
       cancelText="取消"
       okText="确认"
       {...props}
       onOk={() => onSubmit()}
       confirmLoading={loading}
-      forceRender={true}
+      forceRender
       getContainer={false}
     >
       {visible && isType === 'rule' && (
         <>
           <Radio.Group onChange={handleChange} value={value}>
             <Space direction="vertical">
-              <Radio value='无'>无(清空选中)</Radio>
-              <Radio value='number'>数值(number)</Radio>
-              <Radio value='digits'>整数(digits)</Radio>
-              <Radio value='email'>邮箱(email)</Radio>
-              <Radio value='identity'>身份证号(identity)</Radio>
-              <Radio value='mobile'>手机号(mobile)</Radio>
-              <Radio value='bankAccount'>银行卡号(bankAccount)</Radio>
-              <Radio value='timeControl'>时间控制(timeControl)</Radio>
+              <Radio value="无">无(清空选中)</Radio>
+              <Radio value="number">数值(number)</Radio>
+              <Radio value="digits">整数(digits)</Radio>
+              <Radio value="email">邮箱(email)</Radio>
+              <Radio value="identity">身份证号(identity)</Radio>
+              <Radio value="mobile">手机号(mobile)</Radio>
+              <Radio value="bankAccount">银行卡号(bankAccount)</Radio>
+              <Radio value="timeControl">时间控制(timeControl)</Radio>
             </Space>
           </Radio.Group>
-          <Checkbox.Group style={{ width: '100%', marginTop: '1rem' }} onChange={onChange} value={checkValue}>
+          <Checkbox.Group
+            style={{ width: '100%', marginTop: '1rem' }}
+            onChange={onChange}
+            value={checkValue}
+          >
             <Space direction="vertical">
               <Checkbox value="required">必填(required)</Checkbox>
               <Checkbox value="emphasis">强调(emphasis)</Checkbox>
@@ -166,17 +180,25 @@ const AddModal = props => {
       {visible && isType === 'characteristics' && (
         <div className={styles.listCard}>
           <div className={styles.cardItem} style={{ borderRight: '1px solid #99bbe8' }}>
-            <Divider orientation="left" style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }}>待选字段列表</Divider>
+            <Divider
+              orientation="left"
+              style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }}
+            >
+              待选字段列表
+            </Divider>
             <div className={styles.cardContent}>
-              {title.map((item, index) => {
-                return <div className={styles.cardItemData} key={index}>
+              {title.map((item, index) => <div className={styles.cardItemData} key={index}>
                   <Divider orientation="left" style={{ margin: '0 0 10px 0', color: '#15428b', borderTopColor: '#99bbe8' }}>{item} <Checkbox indeterminate={indeterminate[index]} onChange={onCheckAllChange} index={index} checkvalue={filed[item]} checked={checkAll[index]}> </Checkbox></Divider>
-                  <CheckboxGroup options={filed[item]} value={checkedList[index]} onChange={(e) => onChangeList(e, index,item)} /></div>
-              })}
+                  <CheckboxGroup options={filed[item]} value={checkedList[index]} onChange={(e) => onChangeList(e, index,item)} /></div>)}
             </div>
           </div>
           <div className={styles.cardItem}>
-            <Divider orientation="left" style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }}>已选字段列表</Divider>
+            <Divider
+              orientation="left"
+              style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }}
+            >
+              已选字段列表
+            </Divider>
             <div className={styles.cardContent}>
               <div className={styles.doctorTable}>
                 <table>
@@ -185,25 +207,26 @@ const AddModal = props => {
                       <td>字段名</td>
                     </tr>
                   </thead>
-                  <tbody id='doctor-drag-items'>
-                    {selectData && selectData.length > 0 ?
-                      selectData.map((item, index) => {
-                        return <tr drag-id={item} key={index} style={{ cursor: 'move' }}>
+                  <tbody id="doctor-drag-items">
+                    {selectData && selectData.length > 0 ? (
+                      selectData.map((item, index) => <tr drag-id={item} key={index} style={{ cursor: 'move' }}>
                           <td><span title={item}>{item}</span></td>
-                        </tr>
+                        </tr>)
                       })
-                      : <tr><td colSpan='10' style={{ textAlign: 'center' }}>暂无数据</td></tr>
-                    }
+                    ) : (
+                      <tr>
+                        <td colSpan="10" style={{ textAlign: 'center' }}>
+                          暂无数据
+                        </td>
+                      </tr>
+                    )}
                   </tbody>
                 </table>
               </div>
-
             </div>
           </div>
         </div>
-      )
-
-      }
+      )}
     </Modal>
   );
 };

src/pages/bsmanager/base/tablemanager/index.jsx

@@ -19,6 +19,7 @@ import {
   Menu,
   Modal,
   message,
+  Tag,
 } from 'antd';
 import {
   EditOutlined,
@@ -425,11 +426,11 @@ const TableManager = props => {
         if (record) {
           return (
             <Tooltip title={record}>
-              <span style={{ color: '#50aefc', cursor: 'pointer' }}>有</span>
+              <Tag color="success">有</Tag>
             </Tooltip>
           );
         }
-        return <span>无</span>;
+        return <Tag color="processing">无</Tag>;
       },
     },
     {

src/pages/bsmanager/patrolMaintenance/patrolFeedback/AddModal.jsx

@@ -395,6 +395,7 @@ const AddModal = props => {
   const pickFiled = fileds => {
     if (form.getFieldsValue().tableName) {
       let pp = formateArrDataA(nu, 'groupName');
+      console.log(pp);
       if (form.getFieldValue(fileds)) {
         let ab = form.getFieldValue(fileds).split(',');
         let arr = Object.keys(pp);

src/pages/bsmanager/workOrder/incident/incident.jsx

@@ -23,6 +23,7 @@ import {
   Modal,
   Input,
   message,
+  Tag,
 } from 'antd';
 
 import {
@@ -165,17 +166,20 @@ const incident = () => {
     //   width: 80,
     // },
 
-    {
-      title: '编辑',
-      dataIndex: 'editable',
-      key: 'editable',
-      width: 50,
-      render: item => (
-        <span style={{ color: 'grey' }} key={item}>
-          {item}
-        </span>
-      ),
-    },
+    // {
+    //   title: '编辑',
+    //   dataIndex: 'editable',
+    //   key: 'editable',
+    //   width: 50,
+    //   align: 'center',
+    //   render: record => {
+    //     if (record == '是') {
+    //       return <Tag color="success">{record}</Tag>;
+    //     } else {
+    //       return <Tag color="processing">{record}</Tag>;
+    //     }
+    //   },
+    // },
     {
       title: '编辑字段',
       dataIndex: 'editableFields',

src/pages/bsmanager/workOrder/workFlow/flow.jsx

 import React, { useEffect, useState } from 'react';
 import { useHistory } from 'react-router-dom';
 import { reloadFlows, removeFlowExtend } from '@/services/flow/flow';
-import { Card, Space, Table, Popconfirm, Spin, Tooltip, notification, message, Button } from 'antd';
+import { Tag, Card, Space, Table, Popconfirm, Spin, Tooltip, notification, message, Button } from 'antd';
 import {
   DoubleLeftOutlined,
   DoubleRightOutlined,
@@ -158,6 +158,13 @@ const Flow = () => {
       dataIndex: 'useFixedCodingRule',
       width: 80,
       align: 'center',
+      render: record => {
+            if (record == '是') {
+              return <Tag color="success">{record}</Tag>;
+            } else {
+              return <Tag color="processing">{record}</Tag>;
+            }
+          },
     },
     {
       title: '异常节点',
@@ -169,7 +176,17 @@ const Flow = () => {
       title: '接口配置',
       dataIndex: 'interfaceConfig',
       align: 'center',
-      render: text => <span style={{ color: text === '(无)' ? 'grey' : '000000D9' }}>{text}</span>,
+      // render: text => <span style={{ color: text === '(无)' ? 'grey' : '000000D9' }}>{text}</span>,
+      render: record => {
+        if (record!='(无)') {
+          return (
+            <Tooltip title={record}>
+              <Tag color="success">有</Tag>
+            </Tooltip>
+          );
+        }
+        return <Tag color="processing">无</Tag>;
+      },
     },
     {
       title: '操作',

src/pages/userCenter/siteManage/SiteManage.jsx

@@ -5,7 +5,7 @@
 /* eslint-disable eqeqeq */
 import React, { useEffect, useState } from 'react';
 import {
-  // Tree,
+  Tree,
   message,
   Input,
   notification,
@@ -32,11 +32,11 @@ import {
 } from '@ant-design/icons';
 
 import PageContainer from '@/components/BasePageContainer';
-import Tree from '@/components/ExpendableTree';
+import TreeComponents from '@/components/ExpendableTree';
 import voca from 'voca';
 import zhCN from 'antd/es/locale/zh_CN';
 import qs from 'qs';
-import lodash, { clone } from 'lodash';
+import lodash, { clone, set } from 'lodash';
 import styles from './SiteManage.less';
 
 import {
@@ -76,7 +76,7 @@ const SiteManageV2 = () => {
   });
   const [total, setTotal] = useState(0); // 分页总数
   const [page, setPage] = useState({ pageNum: 1, pageSize: 10 });
-  const [selectList, setSelectList] = useState([]); // 已勾选列表数据
+  const [selectList, setSelectList] = useState(new Map()); // 已勾选列表数据
   const [updatePageUser, setUpdatePageUser] = useState(1); //
   const [updateCheck, setUpdateCheck] = useState(1);
   const [name, setName] = useState('');
@@ -84,16 +84,29 @@ const SiteManageV2 = () => {
   const [data, setData] = useState('');
   const [ch, setCh] = useState('');
   const [keepTree, setKeepTree] = useState([]); // 保存所有一级id用于控制只展开一项一级菜单
+  const [indeterminate, setIndeterminate] = useState(new Map());
+  const [searchTreeValue, setSearchTreeValue] = useState('');
 
   let a = [];
 
   // 渲染机构树
   const mapTree = org => {
     const haveChildren = Array.isArray(org.children) && org.children.length > 0;
+    const indexsearch = org.text.indexOf(searchTreeValue);
+    const beforeStr = org.text.substring(0, indexsearch);
+    const afterStr = org.text.slice(indexsearch + searchTreeValue.length);
     return {
       title: (
         <div className={styles.title}>
-          <div className={styles.titleText}>{org.text}</div>
+          {org.text.includes(searchTreeValue) && searchTreeValue != '' ? (
+            <div className={styles.titleText}>
+              {beforeStr}
+              <span className={styles.titleSearch}>{searchTreeValue}</span>
+              {afterStr}
+            </div>
+          ) : (
+            <div className={styles.titleText}>{org.text}</div>
+          )}
           <div className={styles.tip}>
             <Tooltip title="添加下级站点" className={styles.fs}>
               <PlusSquareOutlined
@@ -146,16 +159,18 @@ const SiteManageV2 = () => {
     handleShowModal('editVisible', true);
   };
   // 重新渲染树
-  const updateTrees = () => {
+  const updateTrees = value => {
     setTreeLoading(true);
-    getSiteTree({ selectNode: -1 }).then(res => {
-      if (res.data.length > 0) {
+    getSiteTree({ selectNode: -1, keyword: value }).then(res => {
+      if (res.code === 0) {
         setTreeLoading(false);
         setTreeData(res.data);
         let aa = [];
-        res.data.forEach(i => {
-          aa.push(i.id);
-        });
+        if (res.data.length > 0) {
+          res.data.forEach(i => {
+            aa.push(i.id);
+          });
+        }
         setKeepTree(aa);
         setTreeDataCopy(res.data);
         // 第一次加载，默认选择第一个组织
@@ -198,6 +213,7 @@ const SiteManageV2 = () => {
   }, [currentStation, updateCheck]);
 
   const getList = () => {
+    indeterminate.clear();
     let params = {
       PageIndex: +page.pageNum,
       PageSize: +page.pageSize,
@@ -210,25 +226,34 @@ const SiteManageV2 = () => {
         setShowSearchStyle(true);
         let list = res.data.data;
         // 还原选择的数据
-        if (selectList.length > 0) {
-          selectList.forEach(item => {
+        let indete = indeterminate;
+        if (selectList.size > 0) {
+          [...selectList].map(item => {
             list.forEach((value, index) => {
-              if (item.groupId == value.groupId) {
-                list[index].users.forEach((user, userIndex) => {
-                  if (user.userId === item.userId) {
-                    list[index].users[userIndex].isChecked = true;
-                  }
-                });
-                let checkedLen = list[index].users.filter(v => v.isChecked).length;
-                if (checkedLen === list[index].users.length) {
-                  list[index].isChecked = true;
+              // if (item[1].groupId == value.groupId) {
+              list[index].users.forEach((user, userIndex) => {
+                if (user.userId === item[1].userId) {
+                  list[index].users[userIndex].isChecked = true;
+                  list[index].users[userIndex].groupName = value.groupName;
                 }
+              });
+              let checkedLen = list[index].users.filter(v => v.isChecked).length;
+              if (checkedLen === list[index].users.length) {
+                list[index].isChecked = true;
+                indete.set(value.groupId, false);
+              } else if (checkedLen < list[index].users.length && checkedLen != 0) {
+                list[index].isChecked = false;
+                indete.set(value.groupId, true);
+              } else {
+                list[index].isChecked = false;
+                indete.set(value.groupId, false);
               }
+              // }
             });
           });
         }
+        setIndeterminate(lodash.cloneDeep(indete));
         handleShowModal('loading', false);
-        console.log(lodash.cloneDeep(list));
         setdataList(lodash.cloneDeep(list));
         setTotal(res.data.count);
       } else {
@@ -240,6 +265,7 @@ const SiteManageV2 = () => {
   };
   // 搜索状态时获取当前站点可编辑用户(已勾选和未勾选)分页展示
   const getSearchList = value => {
+    indeterminate.clear();
     let params = {
       PageIndex: 1,
       PageSize: 10,
@@ -252,23 +278,33 @@ const SiteManageV2 = () => {
         setShowSearchStyle(true);
         let list = res.data.data;
         // 还原选择的数据
+        let indete = indeterminate;
         if (selectList.length > 0) {
           selectList.forEach(item => {
             list.forEach((value, index) => {
-              if (item.groupId == value.groupId) {
-                list[index].users.forEach((user, userIndex) => {
-                  if (user.userId === item.userId) {
-                    list[index].users[userIndex].isChecked = true;
-                  }
-                });
-                let checkedLen = list[index].users.filter(v => v.isChecked).length;
-                if (checkedLen === list[index].users.length) {
-                  list[index].isChecked = true;
+              // if (item.groupId == value.groupId) {
+              list[index].users.forEach((user, userIndex) => {
+                if (user.userId === item.userId) {
+                  list[index].users[userIndex].isChecked = true;
+                  list[index].users[userIndex].groupName = value.groupName;
                 }
+              });
+              let checkedLen = list[index].users.filter(v => v.isChecked).length;
+              if (checkedLen === list[index].users.length) {
+                list[index].isChecked = true;
+                indete.set(value.groupId, false);
+              } else if (checkedLen < list[index].users.length && checkedLen != 0) {
+                list[index].isChecked = false;
+                indete.set(value.groupId, true);
+              } else {
+                list[index].isChecked = false;
+                indete.set(value.groupId, false);
               }
+              // }
             });
           });
         }
+        setIndeterminate(lodash.cloneDeep(indete));
         handleShowModal('loading', false);
         setdataList(lodash.cloneDeep(list));
         setTotal(res.data.count);
@@ -282,33 +318,47 @@ const SiteManageV2 = () => {
 
   // 重置
   const restButton = () => {
+    setName('');
+    indeterminate.clear();
     let params = {
       PageIndex: 1,
       PageSize: 10,
     };
     params = { ...params };
+    setCheckLoading(true);
     getGroupUserTree(params).then(res => {
+      setCheckLoading(false);
       if (res.code === 0 && res.data) {
         setShowSearchStyle(true);
         let list = res.data.data;
         // 还原选择的数据
+        let indete = indeterminate;
         if (selectList.length > 0) {
           selectList.forEach(item => {
             list.forEach((value, index) => {
-              if (item.groupId == value.groupId) {
-                list[index].users.forEach((user, userIndex) => {
-                  if (user.userId === item.userId) {
-                    list[index].users[userIndex].isChecked = true;
-                  }
-                });
-                let checkedLen = list[index].users.filter(v => v.isChecked).length;
-                if (checkedLen === list[index].users.length) {
-                  list[index].isChecked = true;
+              // if (item.groupId == value.groupId) {
+              list[index].users.forEach((user, userIndex) => {
+                if (user.userId === item.userId) {
+                  list[index].users[userIndex].isChecked = true;
+                  list[index].users[userIndex].groupName = value.groupName;
                 }
+              });
+              let checkedLen = list[index].users.filter(v => v.isChecked).length;
+              if (checkedLen === list[index].users.length) {
+                list[index].isChecked = true;
+                indete.set(value.groupId, false);
+              } else if (checkedLen < list[index].users.length && checkedLen != 0) {
+                list[index].isChecked = false;
+                indete.set(value.groupId, true);
+              } else {
+                list[index].isChecked = false;
+                indete.set(value.groupId, false);
               }
+              // }
             });
           });
         }
+        setIndeterminate(lodash.cloneDeep(indete));
         handleShowModal('loading', false);
         setdataList(lodash.cloneDeep(list));
         setTotal(res.data.count);
@@ -323,26 +373,26 @@ const SiteManageV2 = () => {
 
   const handleChange = e => {
     setName(e.target.value);
-    handleSearch(e.target.value);
   };
 
   // 获取当前站点所有已经勾选的用户新接口
   const getAllCheckListNew = () => {
+    selectList.clear();
     getStationUsers({
       stationId: currentStation,
     }).then(res => {
-      let list = [];
       if (res.data.length > 0) {
         res.data.map((item, index) => {
-          list.push({
-            groupId: +item.OUID,
+          console.log(selectList);
+          selectList.set(`${item.userID}|${item.OUID.toString()}`, {
+            groupId: item.OUID,
             groupName: item.OUName,
             userName: item.userName,
-            userId: item.userID,
+            userId: item.userID.toString(),
           });
         });
       }
-      setSelectList(lodash.cloneDeep(list));
+      console.log(selectList);
       setUpdatePageUser(updatePageUser + 1);
     });
   };
@@ -425,87 +475,100 @@ const SiteManageV2 = () => {
       }
     });
   };
+
   // 每组全选全不选
-  const handleChangeAll = (e, index) => {
+  const handleChangeAll = (e, index, groupName) => {
     dataList[index].isChecked = e.target.checked;
+    setdataList(lodash.cloneDeep(dataList));
+    let select = selectList;
     dataList[index].users.forEach(item => {
-      item.isChecked = e.target.checked;
-      let delIndex = selectList.findIndex(
-        v => v.groupId == dataList[index].groupId && v.userId == item.userId,
-      );
+      let datalist = item;
+      datalist.groupName = groupName;
       if (e.target.checked) {
-        if (delIndex === -1) {
-          selectList.push({
-            groupId: dataList[index].groupId,
-            groupName: dataList[index].groupName,
-            userName: item.userName,
-            userId: item.userId,
-          });
-        }
-      }
-      if (!e.target.checked) {
-        selectList.splice(delIndex, 1);
+        select.set(`${item.userId}|${item.groupId}`, datalist);
+      } else {
+        select.delete(`${item.userId}|${item.groupId}`);
       }
+      const indeterminateArr = indeterminate;
+      indeterminateArr.set(item.groupId, false);
+      setIndeterminate(lodash.cloneDeep(indeterminateArr));
     });
-    setSelectList(lodash.cloneDeep(selectList));
-    setdataList(lodash.cloneDeep(dataList));
+    setSelectList(lodash.cloneDeep(select));
   };
+
   // 单个选择checkbox
-  const handleChangeSignel = (e, index, vIndex) => {
-    dataList[index].users[vIndex].isChecked = e.target.checked;
-    let checked = isAllChecked(index);
-    let hasIndex = selectList.findIndex(
-      item =>
-        item.userId == dataList[index].users[vIndex].userId &&
-        item.groupId == dataList[index].groupId,
-    );
-    dataList[index].isChecked = checked;
-    if (e.target.checked && hasIndex === -1) {
-      selectList.push({
-        groupId: dataList[index].groupId,
-        groupName: dataList[index].groupName,
-        userName: dataList[index].users[vIndex].userName,
-        userId: dataList[index].users[vIndex].userId,
-      });
+  const handleChangeSignel = (e, index, vIndex, item, groupName) => {
+    let select = selectList;
+    let datalist = item;
+    datalist.groupName = groupName;
+    if (e.target.checked) {
+      select.set(`${item.userId}|${item.groupId}`, datalist);
+      setSelectList(lodash.cloneDeep(select));
+    } else {
+      select.delete(`${item.userId}|${item.groupId}`);
+      setSelectList(lodash.cloneDeep(select));
+    }
+    // 全选状态样式
+    let data = [];
+    [...select].map(i => {
+      if (i[1].groupId == item.groupId) {
+        data.push(i[1]); // 分组中已选的数据
+      }
+    });
+    console.log(data);
+    console.log(dataList[index].users.length);
+    const indeterminateArr = indeterminate;
+    if (dataList[index].users.length == data.length) {
+      indeterminateArr.set(item.groupId, false);
+      dataList[index].isChecked = true;
+    } else if (data.length < dataList[index].users.length && data.length != 0) {
+      indeterminateArr.set(item.groupId, true);
+      dataList[index].isChecked = false;
     } else {
-      selectList.splice(hasIndex, 1);
+      indeterminateArr.set(item.groupId, false);
+      dataList[index].isChecked = false;
     }
-    setSelectList(lodash.cloneDeep(selectList));
+    setIndeterminate(lodash.cloneDeep(indeterminateArr));
     setdataList(lodash.cloneDeep(dataList));
   };
-  const isAllChecked = index =>
-    dataList[index].users.filter(item => item.isChecked).length === dataList[index].users.length;
+
   // 删除已选列表
-  const handleDel = index => {
-    let { groupId, userId } = selectList[index];
-    let outerIndex = dataList.findIndex(item => item.groupId == groupId);
-    if (outerIndex > -1) {
-      let innerIndex = dataList[outerIndex].users.findIndex(item => item.userId == userId);
-      dataList[outerIndex].users[innerIndex].isChecked = false;
-      dataList[outerIndex].isChecked = isAllChecked(outerIndex);
+  const handleDel = (e, item) => {
+    let select = selectList;
+    select.delete(item[0]);
+    setSelectList(lodash.cloneDeep(select));
+
+    // 全选样式
+    let data = [];
+    [...select].map(i => {
+      if (i[1].groupId == item[1].groupId) {
+        data.push(i[1]);
+      }
+    });
+    const indeterminateArr = indeterminate;
+    [...indeterminateArr].map((i, j) => {
+      if (i[0] == item[1].groupId) {
+        dataList[j].isChecked = false;
+      }
+    });
+    if (data.length > 0) {
+      indeterminateArr.set(item[1].groupId, true);
+    } else {
+      indeterminateArr.set(item[1].groupId, false);
     }
-    selectList.splice(index, 1);
-    setSelectList(lodash.cloneDeep(selectList));
     setdataList(lodash.cloneDeep(dataList));
+    setIndeterminate(lodash.cloneDeep(indeterminateArr));
   };
+
   // 提交
   const handleCommitBtn = () => {
     handleShowModal('btnLoading', true);
     let result = [];
-    let obj = {};
-    selectList.forEach(item => {
-      if (obj[item.groupId]) {
-        obj[item.groupId].push(item.userId);
-      } else {
-        obj[item.groupId] = [item.userId];
-      }
+    let aa = selectList;
+    [...aa].map(i => {
+      console.log(i[1].userId);
+      result.push(i[1].userId);
     });
-    // dataList.forEach(item => {
-    //     if (obj[item.GroupId] && item.Users.length === obj[item.GroupId].length) {
-    //         obj[item.GroupId].push(item.GroupId);
-    //     }
-    // });
-    result = Object.values(obj);
     // 数据处理成后台需要的格式
     if (result.length === 0)
       return notification.warning({
@@ -520,7 +583,6 @@ const SiteManageV2 = () => {
         handleShowModal('btnLoading', false);
 
         if (res.code === 0) {
-          setSelectList([]);
           setUpdateCheck(updateCheck + 1);
           notification.success({
             message: '提示',
@@ -629,27 +691,6 @@ const SiteManageV2 = () => {
     });
   };
 
-  const indeterminate = i => {
-    let aa = [];
-    i.users.map(i => {
-      if (i.isChecked) {
-        aa.push(i.userName);
-      }
-    });
-    if (i.isChecked) {
-      console.log(12);
-      return false;
-    }
-    if (!i.isChecked && aa.length < i.users.length && aa.length != 0) {
-      console.log(34);
-      return true;
-    }
-    if (!i.isChecked && aa.length == 0) {
-      console.log(56);
-      return false;
-    }
-  };
-
   const Panels = React.memo(props => {
     let { index, groupId, groupName, users, isChecked, isShow, color, item } = props;
     return (
@@ -668,8 +709,8 @@ const SiteManageV2 = () => {
             key="0"
             className={styles.siteListTitle}
             checked={isChecked}
-            indeterminate={indeterminate(item)}
-            onClick={e => props.handleChangeAll(e, index)}
+            indeterminate={indeterminate.get(groupId)}
+            onClick={e => props.handleChangeAll(e, index, groupName)}
           >
             全选
           </Checkbox>
@@ -679,9 +720,12 @@ const SiteManageV2 = () => {
             users.map((v, vIndex) => (
               <CheckBoxRow
                 {...v}
+                item={v}
+                groupName={groupName}
                 index={index}
                 vIndex={vIndex}
                 key={v.userId}
+                selectList={selectList}
                 handleChangeSignel={props.handleChangeSignel}
               />
             ))}
@@ -690,6 +734,11 @@ const SiteManageV2 = () => {
     );
   });
 
+  const onSearch = value => {
+    setSearchTreeValue(value);
+    updateTrees(value);
+  };
+
   return (
     <PageContainer className={styles.siteManageContainer}>
       <div className={styles.contentContainer}>
@@ -711,23 +760,57 @@ const SiteManageV2 = () => {
                 }}
               />
             </Tooltip>
-            {treeData.length > 0 && (
-              <div style={{ height: '100%', overflowY: 'scroll' }}>
-                <Tree
-                  showIcon="true"
-                  showLine={{ showLeafIcon: false }}
-                  blockNode
-                  autoExpandParent
-                  selectedKeys={[currentStation]}
-                  onSelect={onSelect}
-                  treeData={treeData.map(t => mapTree(t))}
-                  expandedKeys={treeData[0].id}
-                  draggable
-                  onDrop={handleDrop}
-                  keepTree={keepTree}
-                />
-              </div>
+            <hr style={{ width: '95%', color: '#eeecec', marginLeft: '15px' }} />
+            <Search
+              style={{
+                marginBottom: 8,
+                width: '98%',
+                marginLeft: '7px',
+              }}
+              placeholder="快速搜索站点"
+              onSearch={onSearch}
+            />
+            {searchTreeValue !== '' ? (
+              <>
+                {treeData.length > 0 && (
+                  <div style={{ height: '100%', overflowY: 'scroll' }}>
+                    <Tree
+                      showIcon="true"
+                      showLine={{ showLeafIcon: false }}
+                      blockNode
+                      defaultExpandAll
+                      selectedKeys={[currentStation]}
+                      onSelect={onSelect}
+                      treeData={treeData.map(t => mapTree(t))}
+                      draggable
+                      onDrop={handleDrop}
+                      keepTree={keepTree}
+                    />
+                  </div>
+                )}
+              </>
+            ) : (
+              <>
+                {treeData.length > 0 && (
+                  <div style={{ height: '100%', overflowY: 'scroll' }}>
+                    <TreeComponents
+                      showIcon="true"
+                      showLine={{ showLeafIcon: false }}
+                      blockNode
+                      autoExpandParent
+                      selectedKeys={[currentStation]}
+                      onSelect={onSelect}
+                      treeData={treeData.map(t => mapTree(t))}
+                      expandedKeys={treeData[0].id}
+                      draggable
+                      onDrop={handleDrop}
+                      keepTree={keepTree}
+                    />
+                  </div>
+                )}
+              </>
             )}
+
             <div className={styles.switcher}>
               {treeVisible && (
                 <Tooltip title="隐藏站点列表">
@@ -790,8 +873,8 @@ const SiteManageV2 = () => {
                 allowClear
                 placeholder={placeholder}
                 onSearch={handleSearch}
-                // value={name}
-                // onChange={e => handleChange(e)}
+                value={name}
+                onChange={e => handleChange(e)}
                 enterButton
               />
 
@@ -824,13 +907,11 @@ const SiteManageV2 = () => {
                           }}
                         >
                           <ul className={styles.siteSelectUl}>
-                            {selectList.map((item, index) => (
+                            {[...selectList].map((item, index) => (
                               <li
                                 key={`${item.userName}${item.groupId}${index}`}
-                                onClick={() => handleDel(index)}
-                              >
-                                {`${item.userName}(${item.groupName})`}
-                              </li>
+                                onClick={e => handleDel(e, item)}
+                              >{`${item[1].userName}（${item[1].groupName}）`}</li>
                             ))}
                           </ul>
                         </div>
@@ -912,16 +993,16 @@ const SiteManageV2 = () => {
   );
 };
 
-const CheckBoxRow = React.memo(props => {
-  let { vIndex, index, isChecked, userName } = props;
+const CheckBoxRow = props => {
+  let { vIndex, index, isChecked, userName, item, selectList, groupName } = props;
   return (
     <Checkbox
       className={styles.siteList}
-      checked={isChecked}
-      onClick={e => props.handleChangeSignel(e, index, vIndex)}
+      checked={selectList.size > 0 && selectList.has(`${item.userId}|${item.groupId}`)}
+      onClick={e => props.handleChangeSignel(e, index, vIndex, item, groupName)}
     >
       {userName}
     </Checkbox>
   );
-});
+};
 export default SiteManageV2;

src/pages/userCenter/siteManage/SiteManage.less

@@ -377,4 +377,7 @@
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
-}
+}
\ No newline at end of file
+.titleSearch {
+  color: #f50;
+}

src/pages/userCenter/userManage/RelateRoleModal.jsx

@@ -54,7 +54,7 @@ const RelateRoleModal = props => {
   const submitRole = () => {
     console.log(1212121212);
     SetUserRelationList(
-      currentUser.userID,
+      currentUser.userId,
       Object.keys(roleValueList)
         .map(k => roleValueList[k])
         .flat(),

src/pages/userCenter/userManage/UserManage.jsx

@@ -2,7 +2,7 @@
 /* eslint-disable eqeqeq */
 import React, { useState, useEffect, useRef } from 'react';
 import {
-  // Tree,
+  Tree,
   Table,
   Space,
   message,
@@ -18,6 +18,7 @@ import {
   Popconfirm,
   Form,
   Radio,
+  Pagination,
 } from 'antd';
 import {
   UserOutlined,
@@ -69,7 +70,7 @@ import {
   SetGroupManager,
 } from '@/services/userManage/api';
 import { AddUserAuthSetting, GetUserAuthSet } from '@/services/database/api';
-import Tree from '@/components/ExpendableTree';
+import TreeComponents from '@/components/ExpendableTree';
 import classnames from 'classnames';
 import DraggleLayout from 'components/DraggleLayout';
 import AddUserModal from './AddUserModal';
@@ -176,8 +177,14 @@ const UserManage = () => {
   const [keepDataList, setKeepDataList] = useState([]);
   const [siteList, setSiteList] = useState([]);
   const setRowClassName = record =>
-    record.userID === selectColor.userID ? styles.clickRowStyle : '';
+    record.userId === selectColor.userId ? styles.clickRowStyle : '';
 
+  const [demoVisivle, setDemoVisible] = useState(false);
+  const [searchTreeValue, setSearchTreeValue] = useState('');
+
+  const [total, setTotal] = useState(0);
+  const [pageSize, setPageSize] = useState(20);
+  const [currentPage, setCurrentPage] = useState(1);
   // 用户表列名
   const columns = [
     {
@@ -197,13 +204,13 @@ const UserManage = () => {
     },
     {
       title: '所在机构',
-      dataIndex: 'OUName',
-      key: 'OUName',
+      dataIndex: 'groupName',
+      key: 'groupName',
       // width: 150,
       ellipsis: true,
       filters: orgFilters,
       filteredValue,
-      onFilter: (value, record) => record.OUName === value,
+      onFilter: (value, record) => record.groupName === value,
     },
     {
       title: '手机号码',
@@ -272,7 +279,7 @@ const UserManage = () => {
               cancelText="取消"
               onConfirm={() => {
                 console.log(groupId, 'groupId');
-                SetGroupManager({ groupId, userId: record.userID }).then(res => {
+                SetGroupManager({ groupId, userId: record.userId }).then(res => {
                   if (res.code === 0) {
                     // eslint-disable-next-line no-unused-expressions
                     currentSelectOrg === '-1' ? submitSearchUser() : onSelect([currentSelectOrg]);
@@ -523,7 +530,7 @@ const UserManage = () => {
       setSelectedRowKeys(RowKeys);
       getCheckList(RowKeys);
       setUserIDs(RowKeys.toString()); // 数组转字符串，逗号连接
-      setOrgIDs(Rows.map(item => item.OUID).toString());
+      setOrgIDs(Rows.map(item => item.groupId).toString());
       // 选中行数大于0时设置批量操作可行
       if (RowKeys.length > 0) {
         setSelectColor({});
@@ -538,6 +545,9 @@ const UserManage = () => {
   // 渲染机构树
   const mapTree = org => {
     const haveChildren = Array.isArray(org.children) && org.children.length > 0;
+    const indexsearch = org.text.indexOf(searchTreeValue);
+    const beforeStr = org.text.substring(0, indexsearch);
+    const afterStr = org.text.slice(indexsearch + searchTreeValue.length);
     return {
       title: (
         <div className={styles.title1}>
@@ -554,7 +564,15 @@ const UserManage = () => {
             ) : (
               <span />
             )}
-            <span style={{ marginLeft: '5px' }}>{org.text}</span>
+            {org.text.includes(searchTreeValue) && searchTreeValue != '' ? (
+              <span>
+                {beforeStr}
+                <span className={styles.titleSearch}>{searchTreeValue}</span>
+                {afterStr}
+              </span>
+            ) : (
+              <span>{org.text}</span>
+            )}
           </span>
           <span
             className={classnames({
@@ -617,7 +635,7 @@ const UserManage = () => {
   };
 
   // 重新渲染树
-  const updateTrees = () => {
+  const updateTrees = e => {
     setTreeLoading(true);
     // getUserTree(-1, -1)
     //   .then(res => {
@@ -642,14 +660,15 @@ const UserManage = () => {
     //     setTreeLoading(false);
     //     message.error(err);
     //   });
-    GetOUTreeNew({ selectOU: -1 })
+    GetOUTreeNew({ selectOU: -1, keyword: e })
       .then(newres => {
+        setTreeLoading(false);
         if (newres.code === 0) {
           let res = newres.data;
           console.log(res);
-          setTreeLoading(false);
+
           setTreeData(res);
-          setTreeDataCopy(res);
+          // setTreeDataCopy(res);
           let aa = [];
           res.forEach(i => {
             aa.push(i.id);
@@ -711,9 +730,7 @@ const UserManage = () => {
   };
 
   // 点击树节点，获取当前机构下所有用户
-  const onSelect = (props, e) => {
-    console.log(props);
-    console.log(e);
+  const onSelect = (props, e, size, index) => {
     if (e) {
       props[0] = e.node.key;
     } else {
@@ -747,39 +764,47 @@ const UserManage = () => {
       // eslint-disable-next-line no-console
 
       setGroupId(props[0]);
-      getOneOUUserListNew(props[0] || currentSelectOrg)
+      let sizedata = '';
+      let currentData = '';
+      if (currentSelectOrg !== props[0]) {
+        setPageSize(20);
+        setCurrentPage(1);
+        sizedata = size ? size : 20;
+        currentData = index ? index : 1;
+      } else {
+        // 分页查询
+        sizedata = size ? size : pageSize;
+        currentData = index ? index : currentPage;
+      }
+
+      getOneOUUserListNew(props[0] || currentSelectOrg, sizedata, currentData)
         .then(res => {
           setCurrentOrgOperate(false); // 重置禁用当前机构操作为false
           setMultiOperate(true); // 重新禁止用户批量操作
           setSelectedRowKeys([]); // 重置选中用户数
           if (res.code === 0) {
+            setTotal(res.data.count);
             setTableLoading(false);
             setSearchWord(''); // 搜索框置空
             setOrgTitle(res.data.GroupName);
-            setDescription(res.data.Description);
             // 返回用户表数据结构处理，扁平化
-            console.log(res.data);
-            const temp = flatten(getUsers(res.data));
-            console.log(temp);
+            let temp = res.data.data;
             // 设置过滤字段
-            let arr = temp.map(item => item.OUName);
-            console.log(arr);
+            let arr = temp.map(item => item.groupName);
             arr = arr.filter((value, index) => arr.indexOf(value) === index);
-            console.log(arr);
             setOrgFilters(arr.map(item => ({ text: item, value: item })));
             setTableLength(temp.length);
             let datalist = [];
             const table = temp.map((item, index) => {
-              console.log(item);
               if (item.loginName == 'panda' || item.loginName == 'admin') {
-                datalist.push(item.userID);
+                datalist.push(item.userId);
               }
               item.key = index;
               return item;
             });
-            console.log(datalist);
             setKeepDataList(datalist);
             setShowSearchStyle(false);
+            console.log(table);
             setTableData(table);
           } else {
             setTableLoading(false);
@@ -798,46 +823,47 @@ const UserManage = () => {
     }
   };
 
-  // 添加用户刷新表数据
-  const onSelect1 = () => {
-    console.log(orgID);
-    setTableLoading(true);
-    // eslint-disable-next-line no-console
-    getOneOUUserListNew(orgID.id || currentSelectOrg)
-      .then(res => {
-        setCurrentOrgOperate(false); // 重置禁用当前机构操作为false
-        setMultiOperate(true); // 重新禁止用户批量操作
-        setSelectedRowKeys([]); // 重置选中用户数
-        if (res.code === 0) {
-          setTableLoading(false);
-          setSearchWord(''); // 搜索框置空
-          setOrgTitle(res.data.GroupName);
-          setDescription(res.data.Description);
-          // 返回用户表数据结构处理，扁平化
-          const temp = flatten(getUsers(res.data));
-          // 设置过滤字段
-          let arr = temp.map(item => item.OUName);
-          arr = arr.filter((value, index) => arr.indexOf(value) === index);
-          setOrgFilters(arr.map(item => ({ text: item, value: item })));
-          setTableLength(temp.length);
-          const table = temp.map((item, index) => {
-            item.key = index;
-            return item;
-          });
-          setShowSearchStyle(false);
-          setTableData(table);
-        } else {
-          setTableLoading(false);
-        }
-      })
-      .catch(err => {
-        setTableLoading(false);
-        message.error(err);
-      });
-  };
+  // // 添加用户刷新表数据
+  // const onSelect1 = () => {
+  //   console.log(orgID);
+  //   setTableLoading(true);
+  //   // eslint-disable-next-line no-console
+  //   getOneOUUserListNew(orgID.id || currentSelectOrg, pageSize, currentPage)
+  //     .then(res => {
+  //       setCurrentOrgOperate(false); // 重置禁用当前机构操作为false
+  //       setMultiOperate(true); // 重新禁止用户批量操作
+  //       setSelectedRowKeys([]); // 重置选中用户数
+  //       if (res.code === 0) {
+  //         setTableLoading(false);
+  //         setSearchWord(''); // 搜索框置空
+  //         setOrgTitle(res.data.GroupName);
+  //         // setDescription(res.data.Description);
+  //         // 返回用户表数据结构处理，扁平化
+  //         let temp = res.data.data;
+  //         // const temp = flatten(getUsers(res.data));
+  //         // 设置过滤字段
+  //         let arr = temp.map(item => item.groupName);
+  //         arr = arr.filter((value, index) => arr.indexOf(value) === index);
+  //         setOrgFilters(arr.map(item => ({ text: item, value: item })));
+  //         setTableLength(temp.length);
+  //         const table = temp.map((item, index) => {
+  //           item.key = index;
+  //           return item;
+  //         });
+  //         setShowSearchStyle(false);
+  //         setTableData(table);
+  //       } else {
+  //         setTableLoading(false);
+  //       }
+  //     })
+  //     .catch(err => {
+  //       setTableLoading(false);
+  //       message.error(err);
+  //     });
+  // };
 
   const getDescription = e => {
-    getOneOUUserListNew(e).then(res => {
+    getOneOUUserListNew(e, pageSize, currentPage).then(res => {
       if (res.code === 0) {
         setDescription(res.data.Description);
       }
@@ -856,16 +882,16 @@ const UserManage = () => {
     });
   };
   // 返回用户表数据结构处理，扁平化
-  const getUsers = orgObj => {
-    let result = orgObj.Users;
-    result.map(item => {
-      item.OUID = orgObj.GroupId;
-      item.OUName = orgObj.GroupName;
-      return item;
-    });
-    if (orgObj.Childs.length > 0) result = [...result, ...orgObj.Childs.map(o => getUsers(o))];
-    return result;
-  };
+  // const getUsers = orgObj => {
+  //   let result = orgObj.Users;
+  //   result.map(item => {
+  //     item.OUID = orgObj.GroupId;
+  //     item.OUName = orgObj.GroupName;
+  //     return item;
+  //   });
+  //   if (orgObj.Childs.length > 0) result = [...result, ...orgObj.Childs.map(o => getUsers(o))];
+  //   return result;
+  // };
   const flatten = arr => {
     while (arr.some(item => Array.isArray(item))) {
       arr = [].concat(...arr);
@@ -907,7 +933,7 @@ const UserManage = () => {
 
   // 在currentUser变化后获取角色列表
   // useEffect(() => {
-  //   if (currentUser && currentUser.userID) {
+  //   if (currentUser && currentUser.userId) {
   //     getRoleList();
   //   }
   // }, [currentUser]);
@@ -921,7 +947,7 @@ const UserManage = () => {
     setRoleVisible(true);
     setMultiRelateRoles(true);
   };
-  // 更改机构
+  // 批量更改机构
   const changeOrgs = () => {
     setChangeOrgVisible(true);
     setMultiChangeOrgs(true);
@@ -935,7 +961,7 @@ const UserManage = () => {
   /** ***右侧表格相关操作****** */
   // 关联角色
   const relateRole = record => {
-    // getEmptyRoleList(record.userID);
+    // getEmptyRoleList(record.userId);
     setMult('No');
     console.log(record);
     getRoleList(record);
@@ -946,9 +972,10 @@ const UserManage = () => {
   // 更改机构
   const changeOrg = record => {
     setChangeOrgVisible(true);
+    setMultiChangeOrgs(false);
     setCurrentUser(record);
     setSelectColor(record);
-    setCurrentSelectOldOrg(record.OUID);
+    setCurrentSelectOldOrg(record.groupId);
   };
   // 修改密码
   const changePassword = record => {
@@ -975,7 +1002,7 @@ const UserManage = () => {
     } else {
       state = '0';
     }
-    UserStateOUNew({ ouid: record.userID })
+    UserStateOUNew({ ouid: record.userId })
       .then(res => {
         if (res.code === 0) {
           // 重新获取用户表
@@ -1003,8 +1030,7 @@ const UserManage = () => {
     setCurrentUser(record.userName);
     setSelectColor(record);
     DeleteUserNew({
-      userID: record.userID,
-      ouID: record.OUID,
+      userId: record.userId,
     })
       .then(res => {
         if (res.code === 0) {
@@ -1029,9 +1055,9 @@ const UserManage = () => {
 
   // 用户鉴权
   //   useEffect(() => {
-  //     currentUser.userID
+  //     currentUser.userId
   //     GetUserAuthSet({
-  //         UserId: currentUser.userID
+  //         UserId: currentUser.userId
   //     }).then(
   //         res => {
   //             if(res.code == 0){
@@ -1044,7 +1070,7 @@ const UserManage = () => {
   // }, [currentUser])
   const jianquan = record => {
     GetUserAuthSet({
-      UserId: record.userID,
+      UserId: record.userId,
     }).then(res => {
       if (res.code === 0) {
         setSelctValue(res.data);
@@ -1059,7 +1085,7 @@ const UserManage = () => {
     setCurrentUser(record);
     console.log(selectValue);
     AddUserAuthSetting({
-      userId: record.userID,
+      userId: record.userId,
       userLevel: selectValue,
     }).then(res => {
       if (res.code === 0) {
@@ -1074,9 +1100,11 @@ const UserManage = () => {
     //   message.warning('请输入搜索内容');
     //   return;
     // }
+    setTableLoading(true);
     let data = searchWord != '' ? { key: searchWord } : '';
     GetUserByKeyNew(data)
       .then(res => {
+        setTableLoading(false);
         if (res.code === 0) {
           setSelectedRowKeys([]); // 重置选中用户数
           setCurrentOrgOperate(true); // 禁止当前机构操作
@@ -1101,10 +1129,10 @@ const UserManage = () => {
   };
 
   /** ***表单提交相关操作****** */
-  // 根据当前 userID 获取用户关联角色
+  // 根据当前 userId 获取用户关联角色
   const getRoleList = e => {
     setLoading(true);
-    GetUserRelationListNew({ userID: e.userID })
+    GetUserRelationListNew({ userId: e.userId })
       .then(res => {
         console.log(111);
 
@@ -1128,7 +1156,7 @@ const UserManage = () => {
   // 获取全部未勾选的角色列表与站点列表
   const getEmptyRoleList = () => {
     setLoading(true);
-    GetUserRelationListNew({ userID: 0 })
+    GetUserRelationListNew({ userId: 0 })
       .then(res => {
         console.log(222);
         if (res.code === 0) {
@@ -1175,7 +1203,7 @@ const UserManage = () => {
   };
   // 提交-更改机构
   const submitChangeOrg = () => {
-    // addToOrg(currentUser.userID, currentUser.OUID, newOrgID)
+    // addToOrg(currentUser.userId, currentUser.OUID, newOrgID)
     // .then(res => {
     //   if (res.success) {
     //     setChangeOrgVisible(false);
@@ -1196,9 +1224,10 @@ const UserManage = () => {
     // .catch(err => {
     //   message.error(err);
     // });
+    console.log(currentUser);
     JumpToAnotherOUNew({
-      userID: currentUser.userID,
-      oldOUID: currentUser.OUID,
+      userId: currentUser.userId,
+      oldOUID: currentUser.groupId,
       newOUID: newOrgID,
     })
       .then(res => {
@@ -1257,7 +1286,7 @@ const UserManage = () => {
   //   } else {
   //     state = '0';
   //   }
-  //   // postSetUserState(currentUser.userID, state)
+  //   // postSetUserState(currentUser.userId, state)
   //   //   .then(res => {
   //   //     if (res.success) {
   //   //       setFreezeUserVisible(false);
@@ -1281,7 +1310,7 @@ const UserManage = () => {
   //   //     setTableLoading(false);
   //   //     message.error(err);
   //   //   });
-  //   UserStateOUNew({ ouid: currentUser.userID, state })
+  //   UserStateOUNew({ ouid: currentUser.userId, state })
   //     .then(res => {
   //       if (res.code === 0) {
   //         // setFreezeUserVisible(false);
@@ -1309,8 +1338,7 @@ const UserManage = () => {
   // 提交-删除用户
   const submitDeleteUser = () => {
     DeleteUserNew({
-      userID: currentUser.userID,
-      ouID: currentUser.OUID,
+      userId: currentUser.userId,
     })
       .then(res => {
         if (res.code === 0) {
@@ -1334,9 +1362,6 @@ const UserManage = () => {
   };
   // 提交-批量删除用户
   const submitDeleteUsers = () => {
-    console.log(userIDs);
-    console.log(keepDataList);
-    console.log(userIDs.split(','));
     let data = [];
     keepDataList.length > 0 &&
       keepDataList.map(i => {
@@ -1566,6 +1591,18 @@ const UserManage = () => {
     setUserVisible(false);
   };
 
+  const onSearch = value => {
+    setSearchTreeValue(value);
+    updateTrees(value);
+  };
+
+  // 监听分页
+  const paginationChange = (page, pageSizes) => {
+    setCurrentPage(page);
+    setPageSize(pageSizes);
+    onSelect([currentSelectOrg], '', pageSizes, page);
+  };
+
   return (
     <PageContainer className={styles.userManageContainer}>
       <div className={styles.contentContainer}>
@@ -1600,24 +1637,54 @@ const UserManage = () => {
                     }}
                   />
                 </Tooltip>
-               
               </div>
               <hr style={{ width: '95%', color: '#eeecec', marginLeft: '15px' }} />
-              {treeData.length > 0 && (
-                <div style={{ height: '100%', overflowY: 'scroll' }}>
-                  <Tree
-                    showIcon="true"
-                    blockNode
-                    autoExpandParent
-                    onSelect={onSelect}
-                    treeData={treeData.map(t => mapTree(t))}
-                    draggable
-                    onDrop={handleDrop}
-                    selectedKeys={[menuID]}
-                    keepTree={keepTree}
-                    expandedKeys={expendKey}
-                  />
-                </div>
+              <Search
+                style={{
+                  marginBottom: 8,
+                  width: '98%',
+                  marginLeft: '7px',
+                }}
+                placeholder="快速搜索机构"
+                onSearch={onSearch}
+              />
+              {searchTreeValue !== '' ? (
+                <>
+                  {treeData.length > 0 && (
+                    <div style={{ height: '100%', overflowY: 'scroll' }}>
+                      <Tree
+                        showIcon="true"
+                        blockNode
+                        defaultExpandAll
+                        onSelect={onSelect}
+                        treeData={treeData.map(t => mapTree(t))}
+                        draggable
+                        onDrop={handleDrop}
+                        selectedKeys={[menuID]}
+                        keepTree={keepTree}
+                      />
+                    </div>
+                  )}
+                </>
+              ) : (
+                <>
+                  {treeData.length > 0 && (
+                    <div style={{ height: '100%', overflowY: 'scroll' }}>
+                      <TreeComponents
+                        showIcon="true"
+                        blockNode
+                        autoExpandParent
+                        onSelect={onSelect}
+                        treeData={treeData.map(t => mapTree(t))}
+                        draggable
+                        onDrop={handleDrop}
+                        selectedKeys={[menuID]}
+                        keepTree={keepTree}
+                        expandedKeys={expendKey}
+                      />
+                    </div>
+                  )}
+                </>
               )}
             </div>
             <div className={styles.switcher}>
@@ -1679,7 +1746,7 @@ const UserManage = () => {
               }}
               rowClassName={setRowClassName}
               size="small"
-              rowKey={record => record.userID}
+              rowKey={record => record.userId}
               locale={zhCN}
               bordered
               columns={columns}
@@ -1689,14 +1756,7 @@ const UserManage = () => {
                 x: 'max-content',
                 y: `calc(${userContainer.current.clientHeight}px - 150px)`,
               }}
-              // scroll={{ x: 'max-content' }}
-              pagination={{
-                showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
-                pageSizeOptions: [10, 20, 50, 100],
-                defaultPageSize: 20,
-                showQuickJumper: true,
-                showSizeChanger: true,
-              }}
+              pagination={false}
               onRow={record => ({
                 onDoubleClick: () => {
                   editUser(record);
@@ -1705,6 +1765,28 @@ const UserManage = () => {
               onChange={onChangeInput}
             />
           )}
+          <div
+            style={{
+              display: 'flex',
+              justifyContent: 'flex-end',
+              marginTop: '10px',
+              marginRight: '5px',
+            }}
+          >
+            <Pagination
+              total={total}
+              showTotal={(totals, range) => `第${range[0]}-${range[1]} 条/共 ${totals} 条`}
+              defaultPageSize={pageSize}
+              defaultCurrent={1}
+              showSizeChanger
+              pageSizeOptions={[10, 20, 40, 100]}
+              current={currentPage}
+              onChange={paginationChange}
+              style={{ marginBottom: '10px' }}
+              size="small"
+              showQuickJumper
+            />
+          </div>
         </div>
 
         {/* Modal弹框 */}
@@ -1732,7 +1814,7 @@ const UserManage = () => {
           visible={editOrgVisible}
           orgID={orgID}
           orgTitle1={orgTitle1}
-          description={description}
+          // description={description}
           onCancel={() => setEditOrgVisible(false)}
           updateTrees={updateTrees}
         />
@@ -1745,7 +1827,6 @@ const UserManage = () => {
           updateTrees={updateTrees}
           onCancel={() => setDeleteOrgVisible(false)}
         />
-       
         {/* 关联角色 */}
         <RelateRoleModal
           currentUser={currentUser}
@@ -1790,7 +1871,7 @@ const UserManage = () => {
           />
           <div style={{ height: '500px', overflowY: 'scroll' }}>
             {changeOrgVisible && treeDataCopy.length > 0 && (
-              <Tree
+              <TreeComponents
                 showIcon="true"
                 showLine={{ showLeafIcon: false }}
                 // defaultExpandAll

src/pages/userCenter/userManage/UserManage.less

@@ -264,11 +264,11 @@
       overflow: hidden;
 
       .ant-table-wrapper {
-        height: calc(100% - 50px);
+        height: calc(100% - 100px);
       }
 
       .ant-table {
-        height: calc(100% - 50px)
+        height: calc(100% - 100px)
       }
 
       .title {
@@ -404,4 +404,14 @@
 // .ant-tree {
 //     overflow-y: scroll;
 //     height: calc(100vh - 150px);
-// }
+// }
\ No newline at end of file
+.titleTop {
+  width: 20rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  padding-left: 10px;
+}
+.titleSearch {
+  color: #f50;
+}
\ No newline at end of file

src/services/userManage/api.js

@@ -15,9 +15,11 @@ export const getUserTree = (selectOU, node) =>
 //     OUID,
 //   });
 
-export const getOneOUUserListNew = OUID =>
+export const getOneOUUserListNew = (OUID, size, index) =>
   get(`${PUBLISH_SERVICE}/UserCenter/GroupUserList`, {
     groupId: OUID,
+    pageSize: size,
+    pageIndex: index,
   });
 
 /**