UserManage.jsx 63.8 KB
Newer Older
1
/* eslint-disable no-unused-expressions */
皮倩雯's avatar
皮倩雯 committed
2
/* eslint-disable eqeqeq */
3
import React, { useState, useEffect, useRef } from 'react';
陈前坚's avatar
陈前坚 committed
4
import {
5
  Tree,
陈前坚's avatar
陈前坚 committed
6 7 8 9 10 11 12
  Table,
  Space,
  message,
  Modal,
  Input,
  notification,
  Tooltip,
陈前坚's avatar
陈前坚 committed
13
  Card,
陈前坚's avatar
陈前坚 committed
14
  Button,
15
  Spin,
陈前坚's avatar
陈前坚 committed
16 17
  Dropdown,
  Menu,
皮倩雯's avatar
皮倩雯 committed
18
  Popconfirm,
19 20
  Form,
  Radio,
21
  Pagination,
陈前坚's avatar
陈前坚 committed
22 23
} from 'antd';
import {
24
  UserOutlined,
陈前坚's avatar
陈前坚 committed
25
  UserAddOutlined,
陈前坚's avatar
陈前坚 committed
26
  UsergroupAddOutlined,
陈前坚's avatar
陈前坚 committed
27
  EditOutlined,
陈前坚's avatar
陈前坚 committed
28
  EditTwoTone,
陈前坚's avatar
陈前坚 committed
29
  DeleteOutlined,
30
  IdcardOutlined,
陈前坚's avatar
陈前坚 committed
31
  UnlockOutlined,
陈前坚's avatar
陈前坚 committed
32
  ApartmentOutlined,
陈前坚's avatar
陈前坚 committed
33
  StopOutlined,
陈前坚's avatar
陈前坚 committed
34 35
  DoubleLeftOutlined,
  DoubleRightOutlined,
陈前坚's avatar
陈前坚 committed
36
  DownOutlined,
mayongxin's avatar
mayongxin committed
37
  BorderlessTableOutlined,
皮倩雯's avatar
皮倩雯 committed
38 39 40 41 42
  LockOutlined,
  PlusSquareFilled,
  EllipsisOutlined,
  PlusOutlined,
  SyncOutlined,
43
  ClusterOutlined,
陈前坚's avatar
陈前坚 committed
44
} from '@ant-design/icons';
45
import PageContainer from '@/components/BasePageContainer';
陈前坚's avatar
陈前坚 committed
46 47
import voca from 'voca';
import zhCN from 'antd/es/locale/zh_CN';
48 49
import {
  addToOrg,
陈前坚's avatar
陈前坚 committed
50
  addToOrgs,
51 52 53
  getOneOUUserListNew,
  getUserRelationList,
  getUserTree,
皮倩雯's avatar
皮倩雯 committed
54
  // eslint-disable-next-line import/named
张烨's avatar
张烨 committed
55 56
  deleteUser as postDeleteUser,
  setUserState as postSetUserState,
陈前坚's avatar
陈前坚 committed
57
  multiDeleteUsers,
mayongxin's avatar
mayongxin committed
58
  setOrgArea,
mayongxin's avatar
mayongxin committed
59
  getOrgArea,
mayongxin's avatar
mayongxin committed
60
  GetMapSetByGroupID,
mayongxin's avatar
mayongxin committed
61 62 63 64 65 66
  GetOUTreeNew,
  GetUserRelationListNew,
  GetUserByKeyNew,
  UserStateOUNew,
  JumpToAnotherOUNew,
  DeleteUserNew,
皮倩雯's avatar
皮倩雯 committed
67
  loadAllUserRole,
68
  DragGroup,
69 70
  GetAllSite,
  SetGroupManager,
邓超's avatar
邓超 committed
71
} from '@/services/userManage/api';
72
import { AddUserAuthSetting, GetUserAuthSet } from '@/services/database/api';
73
import TreeComponents from '@/components/ExpendableTree';
陈前坚's avatar
陈前坚 committed
74
import classnames from 'classnames';
75
import DraggleLayout from 'components/DraggleLayout';
陈前坚's avatar
陈前坚 committed
76
import AddUserModal from './AddUserModal';
77 78 79 80 81 82
import AddSubOrgModal from './AddSubOrgModal';
import EditOrgModal from './EditOrgModal';
import DeleteOrgModal from './DeleteOrgModal';
import RelateRoleModal from './RelateRoleModal';
import EditUserModal from './EditUserModal';
import ChangePasswordModal from './ChangePasswordModal';
皮倩雯's avatar
皮倩雯 committed
83 84
import MapScopeEditModal from '@/components/MapScope';
import AuthModal from './AuthModal';
陈前坚's avatar
陈前坚 committed
85
import styles from './UserManage.less';
皮倩雯's avatar
皮倩雯 committed
86
import { createGuid } from '@/utils/transformUtil';
邓超's avatar
邓超 committed
87 88 89 90 91
const TdCell = props => {
  // onMouseEnter, onMouseLeave在数据量多的时候,会严重阻塞表格单元格渲染,严重影响性能
  const { onMouseEnter, onMouseLeave, ...restProps } = props;
  return <td {...restProps} />;
};
陈前坚's avatar
陈前坚 committed
92 93

const UserManage = () => {
皮倩雯's avatar
皮倩雯 committed
94 95
  const { TreeNode } = Tree;

96 97
  const [form] = Form.useForm();
  const { Item } = Form;
98
  const [selectValue, setSelctValue] = useState(); // 用户鉴权
99 100

  const [width, setWidth] = useState(50);
陈前坚's avatar
陈前坚 committed
101
  const [treeLoading, setTreeLoading] = useState(false);
陈前坚's avatar
陈前坚 committed
102
  const [tableLoading, setTableLoading] = useState(false);
陈前坚's avatar
陈前坚 committed
103
  const [loading, setLoading] = useState(true);
104
  const [currentOrgOperate, setCurrentOrgOperate] = useState(false); // 是否禁用当前机构操作
陈前坚's avatar
陈前坚 committed
105 106
  const [multiOperate, setMultiOperate] = useState(true); // 是否禁用用户批量操作
  const [multiOperateButtonType, setMultiOperateButtonType] = useState(''); // 更改批量操作按钮样式
陈前坚's avatar
陈前坚 committed
107

陈前坚's avatar
陈前坚 committed
108
  const [treeData, setTreeData] = useState([]); // 用户机构树
陈前坚's avatar
陈前坚 committed
109
  const [treeDataCopy, setTreeDataCopy] = useState([]); // 机构树数据备份,用于更改机构
陈前坚's avatar
陈前坚 committed
110 111
  const [treeState, setTreeState] = useState(true); // 树第一次加载
  const [treeVisible, setTreeVisible] = useState(true); // 树是否可见
陈前坚's avatar
陈前坚 committed
112
  const [tableData, setTableData] = useState([]); // 用户表
113
  const [selectColor, setSelectColor] = useState({}); // 当前选中颜色,操作时设置
陈前坚's avatar
陈前坚 committed
114
  const [orgFilters, setOrgFilters] = useState([]); // 用户列筛选
陈前坚's avatar
陈前坚 committed
115
  const [searchWord, setSearchWord] = useState(''); // 关键字
皮倩雯's avatar
皮倩雯 committed
116
  const [currentSelectOrg1, setCurrentSelectOrg1] = useState('-1');
117
  const [currentSelectOrg, setCurrentSelectOrg] = useState('-1'); // 左侧机构树-选中组织,字符串类型默认全部机构'-1',注意用户表中的OUID是数字
陈前坚's avatar
陈前坚 committed
118
  const [currentSelectOldOrg, setCurrentSelectOldOrg] = useState([]); // 更改机构时的树-原先选中组织
皮倩雯's avatar
皮倩雯 committed
119
  const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
陈前坚's avatar
陈前坚 committed
120

陈前坚's avatar
陈前坚 committed
121 122 123 124 125
  /** ***Modal弹框,是否可视**** */
  const [userVisible, setUserVisible] = useState(false); // 添加用户
  const [addOrgVisible, setAddOrgVisible] = useState(false); // 添加机构
  const [editOrgVisible, setEditOrgVisible] = useState(false); // 编辑机构
  const [deleteOrgVisible, setDeleteOrgVisible] = useState(false); // 删除机构
mayongxin's avatar
mayongxin committed
126
  const [editOrgExtentVisible, setEditOrgExtentVisible] = useState(false); // 删除机构
陈前坚's avatar
陈前坚 committed
127
  const [roleVisible, setRoleVisible] = useState(false); // 关联角色
陈前坚's avatar
陈前坚 committed
128 129 130
  const [changeOrgVisible, setChangeOrgVisible] = useState(false); // 更改机构
  const [passwordVisible, setPasswordVisible] = useState(false); // 修改密码
  const [editUserVisible, setEditUserVisible] = useState(false); // 编辑用户
皮倩雯's avatar
皮倩雯 committed
131
  // const [freezeUserVisible, setFreezeUserVisible] = useState(false); // 冻结用户
陈前坚's avatar
陈前坚 committed
132
  const [deleteUserVisible, setDeleteUserVisible] = useState(false); // 删除用户
mayongxin's avatar
mayongxin committed
133
  const [authUserVisible, setAuthUserVisible] = useState(false); // 鉴权用户
陈前坚's avatar
陈前坚 committed
134

陈前坚's avatar
陈前坚 committed
135
  const [orgTitle, setOrgTitle] = useState('当前机构'); // 弹框标题
136
  const [groupId, setGroupId] = useState();
皮倩雯's avatar
皮倩雯 committed
137
  const [orgTitle1, setOrgTitle1] = useState('当前机构'); // 弹框标题
138
  const [description, setDescription] = useState(''); // 机构描述信息
139 140
  const [selectedRowKeys, setSelectedRowKeys] = useState([]); // 已选用户数,机构改变时重置
  const [tableLength, setTableLength] = useState(0); // 当前机构用户总数
陈前坚's avatar
陈前坚 committed
141
  const [orgID, setOrgID] = useState(); // 当前选择的机构ID
陈前坚's avatar
陈前坚 committed
142 143
  const [newOrgID, setNewOrgID] = useState(); // 更改机构新选择的ID
  const [currentUser, setCurrentUser] = useState({}); // 当前用户
144

皮倩雯's avatar
皮倩雯 committed
145 146 147
  const [mult, setMult] = useState(''); // 判断是否是批量关联
  const [multiRoleList, setMultiRoleList] = useState([]);
  const [multistationList, setMultiStationList] = useState([]);
陈前坚's avatar
陈前坚 committed
148 149 150 151
  const [userIDs, setUserIDs] = useState(''); // 批量删除的用户
  const [orgIDs, setOrgIDs] = useState(''); // 批量操作的机构
  const [multiDelete, setMultiDelete] = useState(false); // 是否批量删除用户
  const [multiChangeOrgs, setMultiChangeOrgs] = useState(false); // 是否批量更改机构
陈前坚's avatar
陈前坚 committed
152
  const [multiRelateRoles, setMultiRelateRoles] = useState(false); // 是否批量更改机构
陈前坚's avatar
陈前坚 committed
153

陈前坚's avatar
陈前坚 committed
154 155
  const [rolelist, setRolelist] = useState([]); // 角色列表
  const [stationlist, setStationlist] = useState([]); // 站点列表
mayongxin's avatar
mayongxin committed
156

皮倩雯's avatar
皮倩雯 committed
157 158 159 160
  const [orgAreas, setOrgAreas] = useState([]);
  const [currentOrgArea, setCurrentOrgArea] = useState('');
  const [currentOrgDistinct, setCurrentOrgDistinct] = useState('');
  const [saveExtentFlag, setSaveExtentFlag] = useState(0);
皮倩雯's avatar
皮倩雯 committed
161
  const [filteredValue, setFilteredValue] = useState([]);
皮倩雯's avatar
皮倩雯 committed
162 163
  const [keep1, setKeep1] = useState([4]); // 存储树选择
  const [id, setId] = useState('');
陈前坚's avatar
陈前坚 committed
164
  const { Search } = Input;
165
  const [hoverItemIndex, setHoverItemIndex] = useState(0); // hover流程索引
166
  const [keepTree, setKeepTree] = useState([]); // 保存所有一级id用于控制只展开一项一级菜单
167 168

  const [expendKey, setExpendKey] = useState(''); // 保存默认展开项
169
  const [expendKeyOrg, setExpendKeyOrg] = useState(''); // 保存默认展开项
170 171 172
  const [menuID, setMenuID] = useState(''); // 选中的树IDs
  const [keepId, setKeepId] = useState('');
  const [flag, setFlag] = useState(1); // 刷新标志
173 174
  const userContainer = useRef();
  const flagRef = useRef(1);
175 176

  const [searchWordOrg, setSearchWordOrg] = useState('');
177
  const [keepDataList, setKeepDataList] = useState([]);
178
  const [siteList, setSiteList] = useState([]);
179
  const setRowClassName = record =>
180
    record.userId === selectColor.userId ? styles.clickRowStyle : '';
181

182 183 184 185 186 187
  const [demoVisivle, setDemoVisible] = useState(false);
  const [searchTreeValue, setSearchTreeValue] = useState('');

  const [total, setTotal] = useState(0);
  const [pageSize, setPageSize] = useState(20);
  const [currentPage, setCurrentPage] = useState(1);
188
  const [treeDataTotal, setTreeDataTotal] = useState();
陈前坚's avatar
陈前坚 committed
189 190 191 192 193 194
  // 用户表列名
  const columns = [
    {
      title: '登录名',
      dataIndex: 'loginName',
      key: 'loginName',
195
      // width: 100,
196
      // fixed: 'left',
皮倩雯's avatar
皮倩雯 committed
197
      render: item => searchStyle(item),
陈前坚's avatar
陈前坚 committed
198 199 200 201 202
    },
    {
      title: '用户姓名',
      dataIndex: 'userName',
      key: 'userName',
203
      // width: 100,
皮倩雯's avatar
皮倩雯 committed
204
      render: item => searchStyle(item),
陈前坚's avatar
陈前坚 committed
205
    },
206 207
    {
      title: '所在机构',
208 209
      dataIndex: 'groupName',
      key: 'groupName',
210
      // width: 150,
211
      ellipsis: true,
陈前坚's avatar
陈前坚 committed
212
      filters: orgFilters,
213
      filteredValue,
214
      onFilter: (value, record) => record.groupName === value,
215
    },
陈前坚's avatar
陈前坚 committed
216 217 218 219
    {
      title: '手机号码',
      dataIndex: 'phone',
      key: 'phone',
220
      // width: 150,
陈前坚's avatar
陈前坚 committed
221
      ellipsis: true,
皮倩雯's avatar
皮倩雯 committed
222 223 224
      render: text => {
        if (text) {
          return searchStyle(text);
225
        }
tianfen's avatar
tianfen committed
226
        return <span>未绑定</span>;
227
      },
陈前坚's avatar
陈前坚 committed
228
    },
229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260
    // {
    //   title: '钉钉账户',
    //   dataIndex: 'ddid',
    //   key: 'ddid',
    //   // width: 150,
    //   render: record => {
    //     if (record) {
    //       return (
    //         <Tooltip title={record}>
    //           <span style={{ color: '#50aefc', cursor: 'pointer' }}>已绑定</span>
    //         </Tooltip>
    //       );
    //     }
    //     return <span>未绑定</span>;
    //   },
    // },
    // {
    //   title: '微信账户',
    //   dataIndex: 'wxid',
    //   key: 'wxid',
    //   // width: 140,
    //   render: record => {
    //     if (record) {
    //       return (
    //         <Tooltip title={record}>
    //           <span style={{ color: '#50aefc', cursor: 'pointer' }}>已绑定</span>
    //         </Tooltip>
    //       );
    //     }
    //     return <span>未绑定</span>;
    //   },
    // },
261 262 263 264
    {
      title: '站点权限',
      dataIndex: 'stationCount',
      key: 'stationCount',
265
      width: 100,
266
    },
陈前坚's avatar
陈前坚 committed
267
    {
268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320
      title: '权限设置',
      key: 'action',
      // fixed: 'right',
      width: 150,
      align: 'center',
      render: record => (
        <Space size="middle">
          <Tooltip title="关联权限">
            <IdcardOutlined
              onClick={() => relateRole(record)}
              style={{ fontSize: '16px', color: '#1890FF' }}
            />
          </Tooltip>
          <Tooltip title="更改机构">
            <ApartmentOutlined
              onClick={() => changeOrg(record)}
              style={{ fontSize: '16px', color: '#1890FF' }}
            />
          </Tooltip>
          <Tooltip title="设置为主管">
            <Popconfirm
              placement="bottomRight"
              title={
                <p>
                  确定将用户
                  <span className={styles.redText}>{voca.stripTags(record.loginName)}</span>
                  设置为{orgTitle}主管吗?
                </p>
              }
              okText="确认"
              cancelText="取消"
              onConfirm={() => {
                console.log(groupId, 'groupId');
                SetGroupManager({ groupId, userId: record.userId }).then(res => {
                  if (res.code === 0) {
                    // eslint-disable-next-line no-unused-expressions
                    currentSelectOrg === '-1' ? submitSearchUser() : onSelect([currentSelectOrg]);
                  } else {
                    notification.error({
                      message: '设置失败',
                      description: res.msg,
                    });
                  }
                });
              }}
            >
              <UserOutlined
                style={{ fontSize: '16px', color: record.isManager ? '#FAAD14' : '#1890FF' }}
              />
            </Popconfirm>
          </Tooltip>
        </Space>
      ),
陈前坚's avatar
陈前坚 committed
321 322 323 324
    },
    {
      title: '操作',
      key: 'action',
陈前坚's avatar
陈前坚 committed
325
      // fixed: 'right',
326
      width: 100,
327
      align: 'center',
陈前坚's avatar
陈前坚 committed
328
      render: record => (
陈前坚's avatar
陈前坚 committed
329
        <Space size="middle">
330
          {/* <Tooltip title="关联权限">
邓超's avatar
邓超 committed
331 332 333 334 335 336 337 338 339 340 341
            <IdcardOutlined
              onClick={() => relateRole(record)}
              style={{ fontSize: '16px', color: '#1890FF' }}
            />
          </Tooltip>
          <Tooltip title="更改机构">
            <ApartmentOutlined
              onClick={() => changeOrg(record)}
              style={{ fontSize: '16px', color: '#1890FF' }}
            />
          </Tooltip>
342 343 344 345 346 347 348 349 350 351 352 353 354 355
          <Tooltip title="设置为主管">
            <Popconfirm
              placement="bottomRight"
              title={
                <p>
                  确定将用户
                  <span className={styles.redText}>{voca.stripTags(record.loginName)}</span>
                  设置为{orgTitle}主管吗?
                </p>
              }
              okText="确认"
              cancelText="取消"
              onConfirm={() => {
                console.log(groupId, 'groupId');
356
                SetGroupManager({ groupId, userId: record.userId }).then(res => {
357 358 359 360 361 362 363 364 365 366 367 368 369
                  if (res.code === 0) {
                    // eslint-disable-next-line no-unused-expressions
                    currentSelectOrg === '-1' ? submitSearchUser() : onSelect([currentSelectOrg]);
                  } else {
                    notification.error({
                      message: '设置失败',
                      description: res.msg,
                    });
                  }
                });
              }}
            >
              <UserOutlined
370
                style={{ fontSize: '16px', color: record.isManager ? '#FAAD14' : '#1890FF' }}
371 372
              />
            </Popconfirm>
373
          </Tooltip> */}
374
          {/* <Tooltip title="修改密码">
陈前坚's avatar
陈前坚 committed
375
            <UnlockOutlined
陈前坚's avatar
陈前坚 committed
376 377 378
              onClick={() => changePassword(record)}
              style={{ fontSize: '16px', color: '#1890FF' }}
            />
379 380
          </Tooltip> */}
          {/* <Tooltip title="编辑用户">
381
            <EditTwoTone onClick={() => editUser(record)} style={{ fontSize: '16px' }} />
382
          </Tooltip> */}
皮倩雯's avatar
皮倩雯 committed
383
          {(record.state == 0 || record.state == null) && (
384
            <>
385
              {record.loginName == 'panda' || record.loginName == 'admin' ? (
邓超's avatar
邓超 committed
386
                <StopOutlined style={{ fontSize: '16px', color: '#1890ff' }} disabled />
387 388 389 390 391 392 393 394 395 396 397 398 399 400 401
              ) : (
                <Tooltip title="冻结用户">
                  <Popconfirm
                    placement="bottomRight"
                    title={
                      <p>
                        即将冻结用户{' '}
                        <span className={styles.redText}>{voca.stripTags(record.loginName)}</span>
                        ,是否确认冻结?
                      </p>
                    }
                    okText="确认"
                    cancelText="取消"
                    onConfirm={() => freezeUser(record)}
                  >
402
                    <StopOutlined style={{ fontSize: '16px', color: '#1890ff' }} />
403 404 405
                  </Popconfirm>
                </Tooltip>
              )}
406 407
            </>
          )}
皮倩雯's avatar
皮倩雯 committed
408
          {record.state == 1 && (
409
            <>
410
              {console.log(record.state, 'record.state1')}
411
              <Tooltip title="解冻用户">
皮倩雯's avatar
皮倩雯 committed
412 413 414 415
                <Popconfirm
                  placement="bottomRight"
                  title={
                    <p>
416
                      即将解冻用户
417
                      <span className={styles.redText}>{voca.stripTags(record.loginName)}</span>
皮倩雯's avatar
皮倩雯 committed
418 419 420 421 422 423 424
                      ,是否确认解冻?
                    </p>
                  }
                  okText="确认"
                  cancelText="取消"
                  onConfirm={() => freezeUser(record)}
                >
425
                  <StopOutlined style={{ fontSize: '16px', color: '#e86060' }} />
皮倩雯's avatar
皮倩雯 committed
426
                </Popconfirm>
427 428 429
              </Tooltip>
            </>
          )}
430
          {/* <Tooltip title="用户鉴权">
431
            <Popconfirm
432 433 434
              placement="bottomRight"
              title={
                <div style={{ width: '130px' }}>
435 436
                  <Form form={form}>
                    <Item>
皮倩雯's avatar
皮倩雯 committed
437
                      <Radio.Group value={selectValue} onChange={onTypeChange}>
438 439 440 441 442 443 444
                        <Space direction="vertical">
                          <Radio value={0}>访客</Radio>
                          <Radio value={1}>普通用户</Radio>
                          <Radio value={2}>管理员</Radio>
                          <Radio value={3}>超级管理员</Radio>
                        </Space>
                      </Radio.Group>
445
                    </Item>
446 447
                  </Form>
                </div>
448 449 450 451 452
              }
              okText="确认"
              cancelText="取消"
              onConfirm={() => authUser(record)}
            >
453 454 455 456
              <LockOutlined
                onClick={() => jianquan(record)}
                style={{ fontSize: '16px', color: '#1890ff' }}
              />
457
            </Popconfirm>
458
          </Tooltip> */}
459
          {record.loginName == 'panda' || record.loginName == 'admin' ? (
邓超's avatar
邓超 committed
460
            <DeleteOutlined style={{ fontSize: '16px', color: '#e86060' }} disabled />
461
          ) : (
462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477
            <Popconfirm
              placement="bottomRight"
              title={
                <p>
                  即将删除用户{' '}
                  <span className={styles.redText}>{voca.stripTags(record.loginName)}</span>
                  ,是否确认删除?
                </p>
              }
              // title={`确认删除用户${currentUser}`}
              okText="确认"
              cancelText="取消"
              onConfirm={() => deleteUser(record)}
            >
              <DeleteOutlined style={{ fontSize: '16px', color: '#e86060' }} />
            </Popconfirm>
478
          )}
陈前坚's avatar
陈前坚 committed
479 480 481 482
        </Space>
      ),
    },
  ];
483 484 485 486 487

  useEffect(() => {
    setExpendKey(menuID);
    console.log(expendKey);
  }, [menuID]);
488 489 490
  // 获取用户机构树
  useEffect(() => {
    window.addEventListener('resize', resizeListener);
491 492 493 494 495 496
    GetAllSite().then(res => {
      if (res.code === 0) {
        setSiteList(res.data.map(item => ({ value: item.GroupId, label: item.GroupName })));
      }
    });

497 498 499 500 501 502 503 504 505 506 507 508 509 510 511
    updateTrees();
    return () => {
      window.removeEventListener('resize', resizeListener);
    };
  }, []);

  // 更新获取初始范围
  useEffect(() => {
    getOrgArea().then(res => {
      if (res.msg === 'Ok') {
        console.log(res);
        setOrgAreas(res.Results);
      }
    });
  }, [saveExtentFlag]);
512 513 514 515 516 517 518 519

  useEffect(() => {
    if (!changeOrgVisible) {
      setExpendKeyOrg('');
      setSearchWordOrg('');
      GetOUTreeNew({ keyword: '' })
        .then(newres => {
          if (newres.code === 0) {
520
            let res = newres.data.list;
521 522 523 524 525 526 527 528 529
            setTreeDataCopy(res);
          }
        })
        .catch(err => {
          setTreeLoading(false);
          message.error(err);
        });
    }
  }, [changeOrgVisible]);
530 531 532 533
  const resizeListener = () => {
    flagRef.current += 1;
    setFlag(flagRef.current);
  };
皮倩雯's avatar
皮倩雯 committed
534 535
  // 模糊查询匹配的样式
  const searchStyle = val => {
536 537 538
    if (!val) {
      return val;
    }
皮倩雯's avatar
皮倩雯 committed
539 540
    let n;
    if (showSearchStyle) {
541
      n = val.replace(new RegExp(searchWord, 'g'), `<span style='color:red'>${searchWord}</span>`);
皮倩雯's avatar
皮倩雯 committed
542 543 544 545 546
    } else {
      n = val;
    }
    return <div dangerouslySetInnerHTML={{ __html: n }} />;
  };
547 548 549 550
  // 获取搜索框的值
  const handleSearch = e => {
    setSearchWord(e.target.value);
  };
551 552 553 554 555 556 557 558 559 560

  // 获取搜索框的值
  const handleSearchOrg = e => {
    setSearchWordOrg(e.target.value);
  };

  const submitSearch = () => {
    GetOUTreeNew({ keyword: searchWordOrg })
      .then(newres => {
        if (newres.code === 0) {
561
          let res = newres.data.list;
562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585
          setTreeDataCopy(res);
          console.log(res);
          let aa = [];
          res.map(i => {
            if (i.children.length > 0) {
              aa.push(i.id);
            }
            console.log(i.id);
            aa = i.id;
          });
          setExpendKeyOrg(aa.toString());
        } else {
          notification.error({
            message: '获取失败',
            // eslint-disable-next-line no-undef
            description: res.message,
          });
        }
      })
      .catch(err => {
        setTreeLoading(false);
        message.error(err);
      });
  };
皮倩雯's avatar
皮倩雯 committed
586
  // 复选框
陈前坚's avatar
陈前坚 committed
587
  const rowSelection = {
588 589
    selectedRowKeys,
    onChange: (RowKeys, Rows) => {
590 591
      console.log(RowKeys);
      console.log(Rows);
592
      setSelectedRowKeys(RowKeys);
皮倩雯's avatar
皮倩雯 committed
593
      getCheckList(RowKeys);
594
      setUserIDs(RowKeys.toString()); // 数组转字符串,逗号连接
595
      setOrgIDs(Rows.map(item => item.groupId).toString());
陈前坚's avatar
陈前坚 committed
596
      // 选中行数大于0时设置批量操作可行
597
      if (RowKeys.length > 0) {
598
        setSelectColor({});
陈前坚's avatar
陈前坚 committed
599 600 601 602 603 604
        setMultiOperate(false);
        setMultiOperateButtonType('primary');
      } else {
        setMultiOperate(true);
        setMultiOperateButtonType('default');
      }
陈前坚's avatar
陈前坚 committed
605 606
    },
  };
陈前坚's avatar
陈前坚 committed
607 608 609
  // 渲染机构树
  const mapTree = org => {
    const haveChildren = Array.isArray(org.children) && org.children.length > 0;
610 611 612
    const indexsearch = org.text.indexOf(searchTreeValue);
    const beforeStr = org.text.substring(0, indexsearch);
    const afterStr = org.text.slice(indexsearch + searchTreeValue.length);
陈前坚's avatar
陈前坚 committed
613
    return {
皮倩雯's avatar
皮倩雯 committed
614
      title: (
皮倩雯's avatar
皮倩雯 committed
615
        <div className={styles.title1}>
616 617
          <span className={styles.titleText}>
            {org.children.length == 0 ? (
618 619 620 621 622 623 624 625
              <ApartmentOutlined
                style={{
                  fontSize: '14px',
                  color: '#1890FF',
                  verticalAlign: 'middle',
                  marginTop: '-3px',
                }}
              />
626 627 628
            ) : (
              <span />
            )}
629 630 631 632 633 634 635 636 637
            {org.text.includes(searchTreeValue) && searchTreeValue != '' ? (
              <span>
                {beforeStr}
                <span className={styles.titleSearch}>{searchTreeValue}</span>
                {afterStr}
              </span>
            ) : (
              <span>{org.text}</span>
            )}
638
          </span>
639 640 641 642 643 644 645 646 647 648 649 650
          <span
            className={classnames({
              [styles.tip1]: true,
              [styles.listHover]: org === hoverItemIndex,
            })}
            onMouseEnter={() => {
              setHoverItemIndex(org);
            }}
            onMouseLeave={() => {
              setHoverItemIndex('');
            }}
          >
651
            <Tooltip title="添加用户" className={styles.fs1}>
652 653 654 655 656 657 658 659 660 661 662 663
              <UserAddOutlined
                style={{ marginLeft: 20, lineHeight: '24px' }}
                onClick={e => {
                  e.stopPropagation();
                  addUser();
                }}
                onMouseEnter={e => {
                  setOrgID(org);
                  setOrgTitle1(org.text);
                  console.log(org);
                }}
              />
皮倩雯's avatar
皮倩雯 committed
664
            </Tooltip>
皮倩雯's avatar
皮倩雯 committed
665
            <Dropdown overlay={orgButtonMenu1}>
666
              <EllipsisOutlined
667
                style={{ marginLeft: 10, fontSize: '20px', lineHeight: '24px' }}
668
                onClick={e => e.stopPropagation()}
皮倩雯's avatar
皮倩雯 committed
669 670 671 672
                onMouseEnter={e => {
                  setOrgID(org);
                  setOrgTitle1(org.text);
                  getDescription(org.id);
673
                  // getMapSetByGroupID(org.id);
皮倩雯's avatar
皮倩雯 committed
674 675 676 677
                  setCurrentSelectOrg1(org.id);
                  setId(org.text);
                  console.log(org);
                }}
678
              />
皮倩雯's avatar
皮倩雯 committed
679 680 681 682
            </Dropdown>
          </span>
        </div>
      ),
陈前坚's avatar
陈前坚 committed
683 684 685 686 687
      key: org.id,
      // 判断它是否存在子集,若果存在就进行再次进行遍历操作,知道不存在子集便对其他的元素进行操作
      children: haveChildren ? org.children.map(i => mapTree(i)) : [],
    };
  };
688

皮倩雯's avatar
皮倩雯 committed
689 690 691 692 693 694 695 696 697 698
  const mapTree1 = org => {
    const haveChildren = Array.isArray(org.children) && org.children.length > 0;
    return {
      title: org.text,
      key: org.id,
      // 判断它是否存在子集,若果存在就进行再次进行遍历操作,知道不存在子集便对其他的元素进行操作
      children: haveChildren ? org.children.map(i => mapTree1(i)) : [],
    };
  };

陈前坚's avatar
陈前坚 committed
699
  // 重新渲染树
700
  const updateTrees = e => {
陈前坚's avatar
陈前坚 committed
701
    setTreeLoading(true);
mayongxin's avatar
mayongxin committed
702 703 704 705 706 707 708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724
    // getUserTree(-1, -1)
    //   .then(res => {
    //     if (res.length > 0) {
    //       setTreeLoading(false);
    //       setTreeData(res);
    //       setTreeDataCopy(res);
    //       // 第一次加载,默认选择第一个组织
    //       if (treeState) {
    //         onSelect([res[0].id], false);
    //         setTreeState(false);
    //       }
    //     } else {
    //       setTreeLoading(false);
    //       notification.error({
    //         message: '获取失败',
    //         description: res.message,
    //       });
    //     }
    //   })
    //   .catch(err => {
    //     setTreeLoading(false);
    //     message.error(err);
    //   });
725
    GetOUTreeNew({ groupId: -1, keyword: e })
皮倩雯's avatar
皮倩雯 committed
726
      .then(newres => {
727
        setTreeLoading(false);
皮倩雯's avatar
皮倩雯 committed
728
        if (newres.code === 0) {
729 730
          let res = newres.data.list;
          setTreeDataTotal(newres.data.count);
731
          console.log(res);
732

733
          setTreeData(res);
734
          // setTreeDataCopy(res);
皮倩雯's avatar
皮倩雯 committed
735 736 737 738 739
          let aa = [];
          res.forEach(i => {
            aa.push(i.id);
          });
          setKeepTree(aa);
740

741 742
          // 第一次加载,默认选择第一个组织
          if (treeState) {
皮倩雯's avatar
皮倩雯 committed
743
            onSelect([res[0].id]);
744 745
            setTreeState(false);
          }
陈前坚's avatar
陈前坚 committed
746 747 748 749
        } else {
          setTreeLoading(false);
          notification.error({
            message: '获取失败',
皮倩雯's avatar
皮倩雯 committed
750
            // eslint-disable-next-line no-undef
陈前坚's avatar
陈前坚 committed
751 752
            description: res.message,
          });
陈前坚's avatar
陈前坚 committed
753 754 755
        }
      })
      .catch(err => {
陈前坚's avatar
陈前坚 committed
756
        setTreeLoading(false);
陈前坚's avatar
陈前坚 committed
757 758
        message.error(err);
      });
陈前坚's avatar
陈前坚 committed
759
  };
张烨's avatar
张烨 committed
760

761 762 763
  const updateTrees1 = e => {
    console.log(e);
    setTreeLoading(true);
764
    GetOUTreeNew({ groupId: -1 })
765 766
      .then(newres => {
        if (newres.code === 0) {
767 768
          let res = newres.data.list;
          setTreeDataTotal(newres.data.count);
769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 790 791 792 793 794 795
          console.log(res);
          setTreeLoading(false);
          setTreeData(res);
          setTreeDataCopy(res);
          let aa = [];
          res.forEach(i => {
            aa.push(i.id);
          });
          setKeepTree(aa);
          console.log(e);
          setMenuID(e.toString());
          setExpendKey(e);
        } else {
          setTreeLoading(false);
          notification.error({
            message: '获取失败',
            // eslint-disable-next-line no-undef
            description: res.message,
          });
        }
      })
      .catch(err => {
        setTreeLoading(false);
        message.error(err);
      });
  };

陈前坚's avatar
陈前坚 committed
796
  // 点击树节点,获取当前机构下所有用户
797
  const onSelect = (props, e, size, index) => {
皮倩雯's avatar
皮倩雯 committed
798 799 800 801
    if (e) {
      props[0] = e.node.key;
    } else {
      props[0] = props.toString();
802
    }
皮倩雯's avatar
皮倩雯 committed
803
    setKeep1(props);
陈前坚's avatar
陈前坚 committed
804
    setTableLoading(true);
陈前坚's avatar
陈前坚 committed
805
    if (!props[0]) {
张烨's avatar
张烨 committed
806
      setCurrentSelectOrg(currentSelectOrg);
皮倩雯's avatar
皮倩雯 committed
807
      setCurrentSelectOrg1(currentSelectOrg);
陈前坚's avatar
陈前坚 committed
808
    } else {
张烨's avatar
张烨 committed
809
      setCurrentSelectOrg(props[0]);
皮倩雯's avatar
皮倩雯 committed
810
      setCurrentSelectOrg1(props[0]);
陈前坚's avatar
陈前坚 committed
811
    }
mayongxin's avatar
mayongxin committed
812
    GetMapSetByGroupID({
皮倩雯's avatar
皮倩雯 committed
813 814 815
      groupID: props[0],
    }).then(res => {
      if (res.code === 0) {
皮倩雯's avatar
皮倩雯 committed
816
        console.log(res);
皮倩雯's avatar
皮倩雯 committed
817
        if (res.code.MapRange != null) {
818 819 820
          setCurrentOrgArea(res.data.MapRange);
          setCurrentOrgDistinct(res.data.AreeName);
        }
mayongxin's avatar
mayongxin committed
821
      }
皮倩雯's avatar
皮倩雯 committed
822
    });
张烨's avatar
张烨 committed
823
    setOrgID(props[0] || currentSelectOrg);
陈前坚's avatar
陈前坚 committed
824 825
    // 树节点变化(即props不为空)时才请求,避免重复请求
    if (props[0]) {
826 827
      console.log(props[0]);
      setMenuID(props[0]);
皮倩雯's avatar
皮倩雯 committed
828
      // eslint-disable-next-line no-console
829 830

      setGroupId(props[0]);
831 832 833 834 835
      let sizedata = '';
      let currentData = '';
      if (currentSelectOrg !== props[0]) {
        setPageSize(20);
        setCurrentPage(1);
836 837
        sizedata = size || 20;
        currentData = index || 1;
838 839
      } else {
        // 分页查询
840 841
        sizedata = size || pageSize;
        currentData = index || currentPage;
842 843 844
      }

      getOneOUUserListNew(props[0] || currentSelectOrg, sizedata, currentData)
陈前坚's avatar
陈前坚 committed
845
        .then(res => {
846
          setCurrentOrgOperate(false); // 重置禁用当前机构操作为false
847
          setMultiOperate(true); // 重新禁止用户批量操作
848
          setSelectedRowKeys([]); // 重置选中用户数
陈前坚's avatar
陈前坚 committed
849
          if (res.code === 0) {
850
            setTotal(res.data.count);
陈前坚's avatar
陈前坚 committed
851 852 853 854
            setTableLoading(false);
            setSearchWord(''); // 搜索框置空
            setOrgTitle(res.data.GroupName);
            // 返回用户表数据结构处理,扁平化
855
            let temp = res.data.data;
陈前坚's avatar
陈前坚 committed
856
            // 设置过滤字段
857
            let arr = temp.map(item => item.groupName);
陈前坚's avatar
陈前坚 committed
858 859 860
            arr = arr.filter((value, index) => arr.indexOf(value) === index);
            setOrgFilters(arr.map(item => ({ text: item, value: item })));
            setTableLength(temp.length);
861
            let datalist = [];
陈前坚's avatar
陈前坚 committed
862
            const table = temp.map((item, index) => {
863
              if (item.loginName == 'panda' || item.loginName == 'admin') {
864
                datalist.push(item.userId);
865
              }
陈前坚's avatar
陈前坚 committed
866 867 868
              item.key = index;
              return item;
            });
869
            setKeepDataList(datalist);
皮倩雯's avatar
皮倩雯 committed
870
            setShowSearchStyle(false);
871
            console.log(table);
陈前坚's avatar
陈前坚 committed
872 873 874
            setTableData(table);
          } else {
            setTableLoading(false);
皮倩雯's avatar
皮倩雯 committed
875 876 877 878
            // notification.error({
            //   message: '获取失败',
            //   description: res.msg,
            // });
陈前坚's avatar
陈前坚 committed
879 880 881
          }
        })
        .catch(err => {
陈前坚's avatar
陈前坚 committed
882
          setTableLoading(false);
陈前坚's avatar
陈前坚 committed
883 884 885 886 887
          message.error(err);
        });
    } else {
      setTableLoading(false);
    }
陈前坚's avatar
陈前坚 committed
888
  };
陈前坚's avatar
陈前坚 committed
889

890 891 892 893 894 895 896 897 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 918 919 920 921 922 923 924 925 926 927
  // // 添加用户刷新表数据
  // 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);
  //     });
  // };
928

皮倩雯's avatar
皮倩雯 committed
929
  const getDescription = e => {
930
    getOneOUUserListNew(e, pageSize, currentPage).then(res => {
皮倩雯's avatar
皮倩雯 committed
931 932 933 934 935 936 937 938 939 940 941 942 943 944 945 946 947
      if (res.code === 0) {
        setDescription(res.data.Description);
      }
    });
  };

  const getMapSetByGroupID = e => {
    GetMapSetByGroupID({
      groupID: e,
    }).then(res => {
      if (res.code === 0) {
        console.log(res);
        setCurrentOrgArea(res.data.MapRange);
        setCurrentOrgDistinct(res.data.AreeName);
      }
    });
  };
陈前坚's avatar
陈前坚 committed
948
  // 返回用户表数据结构处理,扁平化
949 950 951 952 953 954 955 956 957 958
  // 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;
  // };
959 960 961 962 963 964
  const flatten = arr => {
    while (arr.some(item => Array.isArray(item))) {
      arr = [].concat(...arr);
    }
    return arr;
  };
陈前坚's avatar
陈前坚 committed
965
  // 添加用户
966
  const addUser = e => {
陈前坚's avatar
陈前坚 committed
967 968
    setUserVisible(true);
  };
陈前坚's avatar
陈前坚 committed
969 970
  // 添加顶级机构
  const addOrg = () => {
陈前坚's avatar
陈前坚 committed
971
    setAddOrgVisible(true);
陈前坚's avatar
陈前坚 committed
972
    setOrgID('-1');
陈前坚's avatar
陈前坚 committed
973
  };
陈前坚's avatar
陈前坚 committed
974
  // 添加下级机构
975
  const addSubOrg = e => {
陈前坚's avatar
陈前坚 committed
976 977 978 979
    setAddOrgVisible(true);
  };
  // 编辑机构
  const editOrg = () => {
陈前坚's avatar
陈前坚 committed
980
    setEditOrgVisible(true);
陈前坚's avatar
陈前坚 committed
981
  };
陈前坚's avatar
陈前坚 committed
982 983
  // 删除机构
  const deleteOrg = () => {
陈前坚's avatar
陈前坚 committed
984
    setDeleteOrgVisible(true);
985 986 987 988 989 990 991
    console.log(orgID);
    console.log(keep1);
    if (orgID.id == keep1) {
      setTreeState(true);
    } else {
      setTreeState(false);
    }
陈前坚's avatar
陈前坚 committed
992
  };
皮倩雯's avatar
皮倩雯 committed
993
  // 编辑机构范围
mayongxin's avatar
mayongxin committed
994
  const EditOrgScope = () => {
皮倩雯's avatar
皮倩雯 committed
995 996
    setEditOrgExtentVisible(true);
  };
陈前坚's avatar
陈前坚 committed
997

陈前坚's avatar
陈前坚 committed
998
  // 在currentUser变化后获取角色列表
999
  // useEffect(() => {
1000
  //   if (currentUser && currentUser.userId) {
1001 1002 1003
  //     getRoleList();
  //   }
  // }, [currentUser]);
陈前坚's avatar
陈前坚 committed
1004

陈前坚's avatar
陈前坚 committed
1005
  /** ***用户批量操作****** */
陈前坚's avatar
陈前坚 committed
1006
  // 关联角色
陈前坚's avatar
陈前坚 committed
1007
  const relateRoles = () => {
皮倩雯's avatar
皮倩雯 committed
1008
    setMult('Yes');
陈前坚's avatar
陈前坚 committed
1009
    getEmptyRoleList();
1010
    // getCheckList()
陈前坚's avatar
陈前坚 committed
1011
    setRoleVisible(true);
陈前坚's avatar
陈前坚 committed
1012
    setMultiRelateRoles(true);
陈前坚's avatar
陈前坚 committed
1013
  };
1014
  // 批量更改机构
陈前坚's avatar
陈前坚 committed
1015 1016 1017 1018 1019 1020 1021 1022 1023 1024
  const changeOrgs = () => {
    setChangeOrgVisible(true);
    setMultiChangeOrgs(true);
  };
  // 删除用户
  const deleteUsers = () => {
    setDeleteUserVisible(true);
    setMultiDelete(true);
  };

陈前坚's avatar
陈前坚 committed
1025
  /** ***右侧表格相关操作****** */
陈前坚's avatar
陈前坚 committed
1026
  // 关联角色
陈前坚's avatar
陈前坚 committed
1027
  const relateRole = record => {
1028
    // getEmptyRoleList(record.userId);
皮倩雯's avatar
皮倩雯 committed
1029 1030 1031
    setMult('No');
    console.log(record);
    getRoleList(record);
陈前坚's avatar
陈前坚 committed
1032
    setRoleVisible(true);
张烨's avatar
张烨 committed
1033
    setCurrentUser(record);
1034
    setSelectColor(record);
陈前坚's avatar
陈前坚 committed
1035
  };
陈前坚's avatar
陈前坚 committed
1036
  // 更改机构
陈前坚's avatar
陈前坚 committed
1037
  const changeOrg = record => {
1038
    setChangeOrgVisible(true);
1039
    setMultiChangeOrgs(false);
张烨's avatar
张烨 committed
1040
    setCurrentUser(record);
1041
    setSelectColor(record);
1042
    setCurrentSelectOldOrg(record.groupId);
陈前坚's avatar
陈前坚 committed
1043
  };
陈前坚's avatar
陈前坚 committed
1044
  // 修改密码
陈前坚's avatar
陈前坚 committed
1045 1046
  const changePassword = record => {
    setPasswordVisible(true);
张烨's avatar
张烨 committed
1047
    setCurrentUser(record);
1048
    setSelectColor(record);
陈前坚's avatar
陈前坚 committed
1049
  };
陈前坚's avatar
陈前坚 committed
1050
  // 编辑用户
陈前坚's avatar
陈前坚 committed
1051 1052
  const editUser = record => {
    setEditUserVisible(true);
张烨's avatar
张烨 committed
1053
    setCurrentUser(record);
1054
    setSelectColor(record);
陈前坚's avatar
陈前坚 committed
1055
  };
陈前坚's avatar
陈前坚 committed
1056
  // 冻结用户
陈前坚's avatar
陈前坚 committed
1057
  const freezeUser = record => {
1058
    console.log(currentUser);
皮倩雯's avatar
皮倩雯 committed
1059
    // setFreezeUserVisible(true);
张烨's avatar
张烨 committed
1060
    setCurrentUser(record);
1061
    setSelectColor(record);
皮倩雯's avatar
皮倩雯 committed
1062 1063 1064 1065 1066 1067 1068
    let state = '';
    console.log(record);
    if (record.state === '0' || record.state === null) {
      state = '1';
    } else {
      state = '0';
    }
1069
    UserStateOUNew({ ouid: record.userId })
皮倩雯's avatar
皮倩雯 committed
1070 1071 1072 1073
      .then(res => {
        if (res.code === 0) {
          // 重新获取用户表
          // eslint-disable-next-line no-unused-expressions
1074
          currentSelectOrg === '-1' ? submitSearchUser() : onSelect([currentSelectOrg]);
皮倩雯's avatar
皮倩雯 committed
1075 1076 1077 1078 1079 1080 1081 1082 1083 1084 1085 1086 1087 1088 1089
          notification.success({
            message: '提交成功',
            duration: 2,
          });
        } else {
          notification.error({
            message: '提交失败',
            description: res.msg,
          });
        }
      })
      .catch(err => {
        setTableLoading(false);
        message.error(err);
      });
陈前坚's avatar
陈前坚 committed
1090
  };
陈前坚's avatar
陈前坚 committed
1091
  // 删除用户
陈前坚's avatar
陈前坚 committed
1092
  const deleteUser = record => {
皮倩雯's avatar
皮倩雯 committed
1093 1094
    console.log(record.userName);
    setCurrentUser(record.userName);
1095
    setSelectColor(record);
皮倩雯's avatar
皮倩雯 committed
1096
    DeleteUserNew({
1097
      userId: record.userId,
皮倩雯's avatar
皮倩雯 committed
1098 1099 1100 1101 1102 1103 1104 1105
    })
      .then(res => {
        if (res.code === 0) {
          notification.success({
            message: '提交成功',
            duration: 2,
          });
          // eslint-disable-next-line no-unused-expressions
1106
          currentSelectOrg === '-1' ? submitSearchUser() : onSelect([currentSelectOrg]);
皮倩雯's avatar
皮倩雯 committed
1107 1108 1109 1110 1111 1112 1113 1114 1115 1116 1117
        } else {
          notification.error({
            message: '提交失败',
            description: res.msg,
          });
        }
      })
      .catch(err => {
        setTableLoading(false);
        message.error(err);
      });
陈前坚's avatar
陈前坚 committed
1118
  };
1119

皮倩雯's avatar
皮倩雯 committed
1120
  // 用户鉴权
1121
  //   useEffect(() => {
1122
  //     currentUser.userId
1123
  //     GetUserAuthSet({
1124
  //         UserId: currentUser.userId
1125 1126 1127 1128 1129 1130 1131 1132 1133 1134 1135 1136
  //     }).then(
  //         res => {
  //             if(res.code == 0){
  //                 setSelctValue(res.data)
  //                 console.log(selectValue);
  //                 console.log(res.data);
  //             }
  //         }
  //     )
  // }, [currentUser])
  const jianquan = record => {
    GetUserAuthSet({
1137
      UserId: record.userId,
1138
    }).then(res => {
皮倩雯's avatar
皮倩雯 committed
1139
      if (res.code === 0) {
1140 1141 1142 1143 1144 1145
        setSelctValue(res.data);
        console.log(res.data);
      }
    });
  };
  const onTypeChange = value => {
1146
    setSelctValue(value.target.value);
1147
  };
皮倩雯's avatar
皮倩雯 committed
1148
  const authUser = record => {
mayongxin's avatar
mayongxin committed
1149
    setCurrentUser(record);
皮倩雯's avatar
皮倩雯 committed
1150 1151
    console.log(selectValue);
    AddUserAuthSetting({
1152
      userId: record.userId,
皮倩雯's avatar
皮倩雯 committed
1153
      userLevel: selectValue,
1154 1155
    }).then(res => {
      if (res.code === 0) {
1156
        message.info('提交成功');
1157
      }
1158
    });
皮倩雯's avatar
皮倩雯 committed
1159
  };
1160

陈前坚's avatar
陈前坚 committed
1161 1162
  // 查找用户
  const submitSearchUser = () => {
1163 1164 1165 1166
    // if (!searchWord || searchWord.trim(' ').length == 0) {
    //   message.warning('请输入搜索内容');
    //   return;
    // }
1167
    setTableLoading(true);
1168 1169
    let data = searchWord != '' ? { key: searchWord } : '';
    GetUserByKeyNew(data)
陈前坚's avatar
陈前坚 committed
1170
      .then(res => {
1171
        setTableLoading(false);
皮倩雯's avatar
皮倩雯 committed
1172
        if (res.code === 0) {
1173
          setSelectedRowKeys([]); // 重置选中用户数
1174
          setCurrentOrgOperate(true); // 禁止当前机构操作
1175
          setMultiOperate(true); // 禁用批量操作
1176
          setOrgTitle('全部机构搜索结果'); // 设置表头
1177
          setCurrentSelectOrg('-1'); // 清空选中机构
皮倩雯's avatar
皮倩雯 committed
1178
          console.log(res.data);
皮倩雯's avatar
皮倩雯 committed
1179
          setShowSearchStyle(true);
mayongxin's avatar
mayongxin committed
1180 1181
          setTableData(res.data);
          setTableLength(res.data.length);
陈前坚's avatar
陈前坚 committed
1182 1183
        } else {
          notification.error({
皮倩雯's avatar
皮倩雯 committed
1184 1185 1186
            message: '提示',
            duration: 3,
            description: res.msg,
陈前坚's avatar
陈前坚 committed
1187 1188 1189 1190 1191 1192 1193
          });
        }
      })
      .catch(err => {
        message.error(err);
      });
  };
张烨's avatar
张烨 committed
1194

陈前坚's avatar
陈前坚 committed
1195
  /** ***表单提交相关操作****** */
1196
  // 根据当前 userId 获取用户关联角色
1197
  const getRoleList = e => {
1198
    setLoading(true);
1199
    GetUserRelationListNew({ userId: e.userId })
陈前坚's avatar
陈前坚 committed
1200
      .then(res => {
皮倩雯's avatar
皮倩雯 committed
1201 1202
        console.log(111);

皮倩雯's avatar
皮倩雯 committed
1203
        if (res.code === 0) {
mayongxin's avatar
mayongxin committed
1204
          const { roleList, stationList } = res.data;
皮倩雯's avatar
皮倩雯 committed
1205
          console.log(roleList);
1206 1207
          setRolelist(roleList);
          setStationlist(stationList);
1208
          setLoading(false);
陈前坚's avatar
陈前坚 committed
1209
        } else {
皮倩雯's avatar
皮倩雯 committed
1210
          console.log(res);
1211
          setLoading(false);
陈前坚's avatar
陈前坚 committed
1212 1213 1214
        }
      })
      .catch(err => {
1215
        setLoading(false);
陈前坚's avatar
陈前坚 committed
1216 1217 1218 1219
        setTableLoading(false);
        message.error(err);
      });
  };
陈前坚's avatar
陈前坚 committed
1220 1221 1222
  // 获取全部未勾选的角色列表与站点列表
  const getEmptyRoleList = () => {
    setLoading(true);
1223
    GetUserRelationListNew({ userId: 0 })
陈前坚's avatar
陈前坚 committed
1224
      .then(res => {
皮倩雯's avatar
皮倩雯 committed
1225
        console.log(222);
皮倩雯's avatar
皮倩雯 committed
1226
        if (res.code === 0) {
mayongxin's avatar
mayongxin committed
1227
          const { roleList, stationList } = res.data;
陈前坚's avatar
陈前坚 committed
1228 1229
          setRolelist(roleList);
          setStationlist(stationList);
1230
          setLoading(false);
陈前坚's avatar
陈前坚 committed
1231
        } else {
皮倩雯's avatar
皮倩雯 committed
1232
          console.log(res.msg);
1233
          setLoading(false);
陈前坚's avatar
陈前坚 committed
1234 1235 1236 1237 1238 1239 1240 1241
        }
      })
      .catch(err => {
        setLoading(false);
        setTableLoading(false);
        message.error(err);
      });
  };
1242

皮倩雯's avatar
皮倩雯 committed
1243
  const getCheckList = e => {
1244
    console.log(e);
皮倩雯's avatar
皮倩雯 committed
1245 1246 1247 1248 1249 1250 1251 1252 1253
    let aa = [];
    let bb = [];
    loadAllUserRole(e).then(res => {
      if (res.code === 0) {
        if (res.data.roleList !== undefined) {
          // eslint-disable-next-line array-callback-return
          Object.keys(res.data.roleList).map((item, index) => {
            aa.push(item);
          });
1254
        }
皮倩雯's avatar
皮倩雯 committed
1255 1256 1257 1258 1259
        if (res.data.siteList !== undefined) {
          // eslint-disable-next-line array-callback-return
          Object.keys(res.data.siteList).map((item1, index1) => {
            bb.push(item1);
          });
1260
        }
皮倩雯's avatar
皮倩雯 committed
1261 1262 1263 1264
        console.log(aa);
        console.log(bb);
        setMultiRoleList(aa);
        setMultiStationList(bb);
1265
      }
皮倩雯's avatar
皮倩雯 committed
1266 1267
    });
  };
陈前坚's avatar
陈前坚 committed
1268
  // 提交-更改机构
皮倩雯's avatar
皮倩雯 committed
1269
  const submitChangeOrg = () => {
1270
    // addToOrg(currentUser.userId, currentUser.OUID, newOrgID)
mayongxin's avatar
mayongxin committed
1271 1272 1273 1274 1275 1276 1277 1278 1279 1280 1281 1282 1283 1284 1285 1286 1287 1288 1289 1290
    // .then(res => {
    //   if (res.success) {
    //     setChangeOrgVisible(false);
    //     // 跳转到新组织机构下的用户表
    //     onSelect([newOrgID]);
    //     // setExpandedKeys([`${newOrgID}`]);
    //     notification.success({
    //       message: '提交成功',
    //       duration: 2,
    //     });
    //   } else {
    //     notification.error({
    //       message: '提交失败',
    //       description: res.message,
    //     });
    //   }
    // })
    // .catch(err => {
    //   message.error(err);
    // });
1291
    console.log(currentUser);
mayongxin's avatar
mayongxin committed
1292
    JumpToAnotherOUNew({
1293 1294
      userId: currentUser.userId,
      oldOUID: currentUser.groupId,
皮倩雯's avatar
皮倩雯 committed
1295
      newOUID: newOrgID,
mayongxin's avatar
mayongxin committed
1296
    })
陈前坚's avatar
陈前坚 committed
1297
      .then(res => {
陈前坚's avatar
陈前坚 committed
1298 1299 1300 1301
        if (res.code === 0) {
          setChangeOrgVisible(false);
          // 跳转到新组织机构下的用户表
          onSelect([newOrgID]);
皮倩雯's avatar
皮倩雯 committed
1302
          // setExpandedKeys([`${newOrgID}`]);
陈前坚's avatar
陈前坚 committed
1303 1304
          notification.success({
            message: '提交成功',
1305
            duration: 2,
陈前坚's avatar
陈前坚 committed
1306 1307 1308 1309
          });
        } else {
          notification.error({
            message: '提交失败',
陈前坚's avatar
陈前坚 committed
1310
            description: res.msg,
陈前坚's avatar
陈前坚 committed
1311 1312 1313 1314 1315 1316
          });
        }
      })
      .catch(err => {
        message.error(err);
      });
皮倩雯's avatar
皮倩雯 committed
1317
  };
1318

皮倩雯's avatar
皮倩雯 committed
1319 1320 1321 1322 1323 1324 1325 1326 1327 1328 1329
  // 提交-批量更改机构
  const submitChangeOrgs = () =>
    addToOrgs(userIDs, orgIDs, newOrgID)
      .then(res => {
        if (res.code === 0) {
          setChangeOrgVisible(false);
          // 跳转到新组织机构下的用户表
          const temp = orgIDs.split(',');
          // 批量更改机构成功后设置老的orgIDs为全部是newOrgID的数组,并转字符串
          setOrgIDs(temp.map(() => newOrgID).toString());
          onSelect([newOrgID]);
陈前坚's avatar
陈前坚 committed
1330 1331
          notification.success({
            message: '提交成功',
1332
            duration: 2,
陈前坚's avatar
陈前坚 committed
1333 1334 1335 1336
          });
        } else {
          notification.error({
            message: '提交失败',
mayongxin's avatar
mayongxin committed
1337
            description: res.msg,
陈前坚's avatar
陈前坚 committed
1338 1339 1340 1341 1342 1343
          });
        }
      })
      .catch(err => {
        message.error(err);
      });
皮倩雯's avatar
皮倩雯 committed
1344 1345 1346 1347 1348 1349 1350 1351 1352

  // 提交-冻结用户
  // const submitFreezeUser = () => {
  //   let state = '';
  //   if (currentUser.state === '0' || currentUser.state === null) {
  //     state = '1';
  //   } else {
  //     state = '0';
  //   }
1353
  //   // postSetUserState(currentUser.userId, state)
皮倩雯's avatar
皮倩雯 committed
1354 1355 1356 1357 1358 1359 1360 1361 1362 1363 1364 1365 1366 1367 1368 1369 1370 1371 1372 1373 1374 1375 1376
  //   //   .then(res => {
  //   //     if (res.success) {
  //   //       setFreezeUserVisible(false);
  //   //       // 重新获取用户表
  //   //       // eslint-disable-next-line no-unused-expressions
  //   //       currentSelectOrg === '-1'
  //   //         ? submitSearchUser()
  //   //         : onSelect([currentSelectOrg]);
  //   //       notification.success({
  //   //         message: '提交成功',
  //   //         duration: 2,
  //   //       });
  //   //     } else {
  //   //       notification.error({
  //   //         message: '提交失败',
  //   //         description: res.message,
  //   //       });
  //   //     }
  //   //   })
  //   //   .catch(err => {
  //   //     setTableLoading(false);
  //   //     message.error(err);
  //   //   });
1377
  //   UserStateOUNew({ ouid: currentUser.userId, state })
皮倩雯's avatar
皮倩雯 committed
1378 1379 1380 1381 1382 1383 1384 1385 1386 1387 1388 1389 1390 1391 1392 1393 1394 1395 1396 1397 1398 1399 1400 1401
  //     .then(res => {
  //       if (res.code === 0) {
  //         // setFreezeUserVisible(false);
  //         // 重新获取用户表
  //         // eslint-disable-next-line no-unused-expressions
  //         currentSelectOrg === '-1'
  //           ? submitSearchUser()
  //           : onSelect([currentSelectOrg]);
  //         notification.success({
  //           message: '提交成功',
  //           duration: 2,
  //         });
  //       } else {
  //         notification.error({
  //           message: '提交失败',
  //           description: res.msg,
  //         });
  //       }
  //     })
  //     .catch(err => {
  //       setTableLoading(false);
  //       message.error(err);
  //     });
  // };
陈前坚's avatar
陈前坚 committed
1402
  // 提交-删除用户
陈前坚's avatar
陈前坚 committed
1403
  const submitDeleteUser = () => {
皮倩雯's avatar
皮倩雯 committed
1404
    DeleteUserNew({
1405
      userId: currentUser.userId,
皮倩雯's avatar
皮倩雯 committed
1406 1407 1408
    })
      .then(res => {
        if (res.code === 0) {
陈前坚's avatar
陈前坚 committed
1409 1410
          notification.success({
            message: '提交成功',
1411
            duration: 2,
陈前坚's avatar
陈前坚 committed
1412
          });
1413
          // eslint-disable-next-line no-unused-expressions
1414
          currentSelectOrg === '-1' ? submitSearchUser() : onSelect([currentSelectOrg]);
陈前坚's avatar
陈前坚 committed
1415 1416 1417
        } else {
          notification.error({
            message: '提交失败',
mayongxin's avatar
mayongxin committed
1418
            description: res.msg,
陈前坚's avatar
陈前坚 committed
1419 1420 1421 1422 1423 1424 1425 1426 1427 1428
          });
        }
      })
      .catch(err => {
        setTableLoading(false);
        message.error(err);
      });
  };
  // 提交-批量删除用户
  const submitDeleteUsers = () => {
1429 1430 1431 1432 1433 1434 1435
    let data = [];
    keepDataList.length > 0 &&
      keepDataList.map(i => {
        let aa = userIDs.split(',').indexOf(i);
        console.log(aa);
        if (aa !== -1) {
          data.push(aa);
陈前坚's avatar
陈前坚 committed
1436 1437
        }
      });
1438 1439 1440 1441 1442 1443 1444 1445 1446 1447 1448 1449 1450 1451 1452 1453 1454 1455 1456 1457 1458 1459 1460 1461 1462 1463 1464 1465 1466 1467
    console.log(data);
    if (data.length > 0) {
      notification.error({
        message: '操作失败',
        description: '选中项包含不可删除的用户panda或admin',
      });
    } else {
      multiDeleteUsers(userIDs)
        .then(res => {
          if (res.code === 0) {
            setDeleteUserVisible(false);
            notification.success({
              message: '提交成功',
              duration: 2,
            });
            // 重新获取用户表,查找用户时currentSelectOrg为'-1',无需跳转
            // eslint-disable-next-line no-unused-expressions
            currentSelectOrg === '-1' ? submitSearchUser() : onSelect([currentSelectOrg]);
          } else {
            notification.error({
              message: '提交失败',
              description: res.msg,
            });
          }
        })
        .catch(err => {
          setTableLoading(false);
          message.error(err);
        });
    }
陈前坚's avatar
陈前坚 committed
1468
  };
1469
  // 重置默认第一个
1470
  const handleReset = () => {
1471
    GetOUTreeNew({ groupId: -1 })
1472 1473
      .then(newres => {
        if (newres.code === 0) {
1474
          let res = newres.data.list;
1475 1476
          setTreeLoading(false);
          setSearchWord('');
皮倩雯's avatar
皮倩雯 committed
1477
          setFilteredValue([]);
1478
          // 第一次加载,默认选择第一个组织
1479
          onSelect([res[0].id], false);
1480 1481 1482 1483 1484 1485 1486 1487 1488 1489 1490 1491 1492
        } else {
          setTreeLoading(false);
          notification.error({
            message: '获取失败',
            // eslint-disable-next-line no-undef
            description: res.message,
          });
        }
      })
      .catch(err => {
        setTreeLoading(false);
        message.error(err);
      });
1493
  };
皮倩雯's avatar
皮倩雯 committed
1494
  const onChangeInput = filters => {
1495
    setFilteredValue(filters.OUName);
皮倩雯's avatar
皮倩雯 committed
1496
  };
1497

皮倩雯's avatar
皮倩雯 committed
1498
  // 更改机构范围
1499
  const submitExtent = (extent, areaName, flags) => {
皮倩雯's avatar
皮倩雯 committed
1500 1501 1502
    setTreeLoading(true);
    console.log(extent);
    console.log(areaName);
1503
    console.log(flags);
皮倩雯's avatar
皮倩雯 committed
1504
    console.log(currentSelectOrg1);
1505
    if (flags === 0) {
1506 1507 1508 1509
      setTreeLoading(false);
      notification.warn({
        message: '提交失败',
        description: '请框选范围',
皮倩雯's avatar
皮倩雯 committed
1510
      });
皮倩雯's avatar
皮倩雯 committed
1511 1512 1513 1514 1515 1516 1517 1518 1519 1520 1521 1522 1523 1524 1525 1526 1527
    } else if (extent) {
      setOrgArea({
        OUID: currentSelectOrg1,
        areaName,
        extent,
      }).then(res => {
        if (res.msg === '') {
          setTreeLoading(false);
          setEditOrgExtentVisible(false);
          setSaveExtentFlag(saveExtentFlag + 1);
          message.success('机构范围设置成功!');
        } else {
          setTreeLoading(false);
          setEditOrgExtentVisible(false);
          message.warn(res.Message);
        }
      });
mayongxin's avatar
mayongxin committed
1528
    }
皮倩雯's avatar
皮倩雯 committed
1529
  };
1530 1531 1532 1533 1534 1535 1536 1537 1538 1539 1540 1541 1542 1543 1544 1545 1546
  // 返回拖拽完毕后的信息
  const loop = (datas, key, parentID, callback) => {
    for (let i = 0; i < datas.length; i++) {
      if (datas[i].id === key) {
        return callback(datas[i], i, datas, parentID);
      }
      if (datas[i].children) {
        loop(datas[i].children, key, datas[i].id, callback);
      }
    }
  };
  // 树的拖拽
  const handleDrop = infos => {
    console.log(infos);
    const dropKey = infos.node.key;
    const dragKey = infos.dragNode.key;
    const dropPos = infos.node.pos.split('-');
1547
    const dropPosition = infos.dropPosition - Number(dropPos[dropPos.length - 1]);
陈前坚's avatar
陈前坚 committed
1548

1549 1550 1551 1552 1553 1554 1555 1556 1557 1558 1559 1560 1561 1562 1563 1564 1565 1566 1567 1568 1569 1570 1571 1572 1573 1574 1575 1576 1577 1578 1579 1580 1581 1582 1583 1584 1585 1586 1587 1588 1589 1590 1591 1592 1593 1594 1595 1596 1597 1598 1599 1600 1601
    const datas = JSON.parse(JSON.stringify(treeData));
    console.log(dropKey, 'dropKey');
    console.log(dragKey, 'dragKey');
    // 找到拖拽的元素
    let dragObj;
    let dropObj;
    let parId;
    let dragList;
    // 保存拖拽到的节点信息
    loop(datas, dropKey, -1, item => {
      dropObj = item;
    });
    // 保存节点信息并删除节点
    loop(datas, dragKey, -1, (item, index, arr) => {
      arr.splice(index, 1);
      dragObj = item;
    });
    // 将节点插入到正确的位置
    if (!infos.dropToGap) {
      console.log('33333333333');
      dropObj.children = dropObj.children || [];
      // 在哪里插入,示例添加到头部,可以是随意位置
      dropObj.children.unshift(dragObj);
      parId = dropObj.id;
      dragList = dropObj.children.map(val => val.id);
    } else {
      let ar;
      let i;
      loop(datas, dropKey, -1, (item, index, arr, parentID) => {
        ar = arr;
        i = index;
        parId = parentID;
      });
      if (dropPosition === -1) {
        ar.splice(i, 0, dragObj);
      } else {
        ar.splice(i + 1, 0, dragObj);
      }
      dragList = ar.map(ele => ele.id);
    }
    DragGroup({
      dragGroupType: 2,
      groupId: dragKey.toString(),
      groupList: dragList.map(item => item.toString()),
      parentId: parId.toString(),
    }).then(res => {
      if (res.code === 0) {
        updateTrees();
      } else {
        message.error(res.msg);
      }
    });
  };
皮倩雯's avatar
皮倩雯 committed
1602 1603 1604
  const addChange = e => {
    e.domEvent.stopPropagation();
  };
1605

陈前坚's avatar
陈前坚 committed
1606 1607 1608
  /** ***操作按钮**** */
  // 机构操作
  const orgButtonMenu = (
皮倩雯's avatar
皮倩雯 committed
1609
    <Menu onClick={e => addChange(e)}>
1610
      <Menu.Item key="1" onClick={addUser} icon={<UserAddOutlined style={{ marginTop: '5px' }} />}>
陈前坚's avatar
陈前坚 committed
1611 1612
        添加用户
      </Menu.Item>
1613 1614 1615 1616
    </Menu>
  );
  const orgButtonMenu1 = (
    <Menu onClick={e => addChange(e)}>
1617 1618 1619 1620 1621
      <Menu.Item
        key="2"
        onClick={addSubOrg}
        icon={<ClusterOutlined style={{ marginTop: '5px' }} />}
      >
陈前坚's avatar
陈前坚 committed
1622
        添加下级机构
陈前坚's avatar
陈前坚 committed
1623
      </Menu.Item>
1624
      <Menu.Item key="3" onClick={editOrg} icon={<EditOutlined style={{ marginTop: '5px' }} />}>
陈前坚's avatar
陈前坚 committed
1625
        编辑当前机构
陈前坚's avatar
陈前坚 committed
1626
      </Menu.Item>
1627
      <Menu.Item key="4" onClick={deleteOrg} icon={<DeleteOutlined style={{ marginTop: '5px' }} />}>
陈前坚's avatar
陈前坚 committed
1628
        删除当前机构
陈前坚's avatar
陈前坚 committed
1629
      </Menu.Item>
1630
      {/* <Menu.Item
1631 1632 1633 1634
        key="5"
        onClick={EditOrgScope}
        icon={<BorderlessTableOutlined style={{ marginTop: '5px' }} />}
      >
mayongxin's avatar
mayongxin committed
1635
        编辑机构范围
1636
      </Menu.Item> */}
陈前坚's avatar
陈前坚 committed
1637 1638 1639 1640 1641
    </Menu>
  );
  // 用户批量操作
  const userButtonMenu = (
    <Menu>
1642
      <Menu.Item key="1" onClick={relateRoles} icon={<IdcardOutlined />}>
陈前坚's avatar
陈前坚 committed
1643 1644 1645 1646 1647 1648 1649 1650 1651 1652 1653
        批量关联角色
      </Menu.Item>
      <Menu.Item key="2" onClick={changeOrgs} icon={<ApartmentOutlined />}>
        批量更改机构
      </Menu.Item>
      <Menu.Item key="3" onClick={deleteUsers} icon={<DeleteOutlined />}>
        批量删除用户
      </Menu.Item>
    </Menu>
  );

皮倩雯's avatar
皮倩雯 committed
1654 1655 1656
  const kee = () => {
    setUserVisible(false);
  };
1657

1658 1659 1660 1661 1662 1663 1664 1665 1666 1667 1668 1669
  const onSearch = value => {
    setSearchTreeValue(value);
    updateTrees(value);
  };

  // 监听分页
  const paginationChange = (page, pageSizes) => {
    setCurrentPage(page);
    setPageSize(pageSizes);
    onSelect([currentSelectOrg], '', pageSizes, page);
  };

陈前坚's avatar
陈前坚 committed
1670
  return (
1671 1672
    <PageContainer className={styles.userManageContainer}>
      <div className={styles.contentContainer}>
陈前坚's avatar
陈前坚 committed
1673
        {/* 左侧机构树 */}
陈前坚's avatar
陈前坚 committed
1674
        <Spin spinning={treeLoading} tip="loading...">
陈前坚's avatar
陈前坚 committed
1675
          <Card
1676
            style={{ overflowY: 'hidden', height: '100%' }}
陈前坚's avatar
陈前坚 committed
1677 1678 1679 1680 1681
            className={classnames({
              [styles.orgContainer]: true,
              [styles.orgContainerHide]: !treeVisible,
            })}
          >
1682
            <div style={{ display: 'flex', flexDirection: 'column', height: '100%' }}>
1683 1684 1685
              <div
                style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}
              >
1686
                <span
陈前坚's avatar
陈前坚 committed
1687
                  style={{
1688 1689
                    fontSize: '15px ',
                    fontWeight: 'bold',
1690
                    marginLeft: '7px',
陈前坚's avatar
陈前坚 committed
1691
                  }}
1692
                >
1693
                  机构列表({treeDataTotal}个)
1694 1695 1696 1697 1698 1699 1700
                </span>
                <Tooltip title="添加顶级机构">
                  <PlusSquareFilled
                    onClick={() => addOrg()}
                    style={{
                      color: '#1890FF',
                      fontSize: '25px',
1701
                      // marginLeft: '51%',
1702 1703 1704 1705
                    }}
                  />
                </Tooltip>
              </div>
1706
              <hr style={{ width: '97%', color: '#eeecec', marginLeft: '8px' }} />
1707 1708 1709 1710 1711 1712 1713 1714 1715 1716 1717 1718 1719 1720 1721 1722 1723 1724 1725 1726 1727 1728 1729 1730 1731 1732 1733 1734 1735 1736 1737 1738 1739 1740 1741 1742 1743 1744 1745 1746 1747 1748 1749 1750 1751 1752
              <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>
                  )}
                </>
陈前坚's avatar
陈前坚 committed
1753 1754 1755 1756 1757 1758 1759 1760 1761 1762 1763 1764 1765 1766
              )}
            </div>
            <div className={styles.switcher}>
              {treeVisible && (
                <Tooltip title="隐藏机构列表">
                  <DoubleLeftOutlined onClick={() => setTreeVisible(false)} />
                </Tooltip>
              )}
              {!treeVisible && (
                <Tooltip title="显示机构列表">
                  <DoubleRightOutlined onClick={() => setTreeVisible(true)} />
                </Tooltip>
              )}
            </div>
陈前坚's avatar
陈前坚 committed
1767
          </Card>
陈前坚's avatar
陈前坚 committed
1768
        </Spin>
1769

陈前坚's avatar
陈前坚 committed
1770
        {/* 右侧用户表 */}
陈前坚's avatar
陈前坚 committed
1771
        <div
1772
          ref={userContainer}
陈前坚's avatar
陈前坚 committed
1773
          className={classnames({
1774
            [styles.userContainer]: true,
陈前坚's avatar
陈前坚 committed
1775 1776
          })}
        >
陈前坚's avatar
陈前坚 committed
1777
          <div style={{ height: '50px' }}>
1778
            <span
1779
              className={styles.title}
1780
              title={`${orgTitle}(已选${selectedRowKeys.length}/共${tableLength}人)`}
1781 1782
            >
              {orgTitle}(已选{selectedRowKeys.length}/共{tableLength}人)
1783
            </span>
陈前坚's avatar
陈前坚 committed
1784
            <span style={{ float: 'right', margin: '10px' }}>
陈前坚's avatar
陈前坚 committed
1785
              <Search
1786
                style={{ width: 260, marginRight: '15px' }}
1787
                placeholder="搜索登录名/用户姓名/手机号"
陈前坚's avatar
陈前坚 committed
1788 1789 1790 1791 1792
                onSearch={submitSearchUser}
                onChange={e => handleSearch(e)}
                enterButton
                value={searchWord}
              />
皮倩雯's avatar
皮倩雯 committed
1793

1794
              <Button style={{ marginRight: '15px' }} icon={<SyncOutlined />} onClick={handleReset}>
1795 1796
                重置
              </Button>
皮倩雯's avatar
皮倩雯 committed
1797

陈前坚's avatar
陈前坚 committed
1798 1799 1800 1801 1802
              <Dropdown overlay={userButtonMenu} disabled={multiOperate}>
                <Button type={multiOperateButtonType}>
                  用户批量操作 <DownOutlined />
                </Button>
              </Dropdown>
陈前坚's avatar
陈前坚 committed
1803 1804
            </span>
          </div>
1805 1806 1807 1808 1809 1810 1811 1812 1813
          {userContainer.current && (
            <Table
              // style={{ height: 'calc(100% -50px)' }}
              rowSelection={{
                type: 'checkbox',
                ...rowSelection,
              }}
              rowClassName={setRowClassName}
              size="small"
1814
              rowKey={record => record.userId}
1815 1816 1817 1818 1819 1820 1821 1822 1823
              locale={zhCN}
              bordered
              columns={columns}
              dataSource={tableData}
              loading={tableLoading}
              scroll={{
                x: 'max-content',
                y: `calc(${userContainer.current.clientHeight}px - 150px)`,
              }}
1824
              pagination={false}
1825 1826 1827 1828 1829
              onRow={record => ({
                onDoubleClick: () => {
                  editUser(record);
                },
              })}
1830 1831 1832
              onChange={onChangeInput}
            />
          )}
1833 1834 1835 1836 1837 1838 1839 1840 1841 1842 1843 1844 1845 1846 1847 1848 1849 1850 1851 1852 1853 1854
          <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>
1855
        </div>
1856

陈前坚's avatar
陈前坚 committed
1857
        {/* Modal弹框 */}
1858
        {/* 添加用户 */}
陈前坚's avatar
陈前坚 committed
1859 1860 1861
        <AddUserModal
          visible={userVisible}
          orgID={orgID}
1862
          orgTitle1={orgTitle1}
皮倩雯's avatar
皮倩雯 committed
1863
          onCancel={kee}
1864
          updateTrees1={updateTrees1}
1865
          siteList={siteList}
1866
          onSelect={onSelect}
陈前坚's avatar
陈前坚 committed
1867
        />
1868
        {/* 添加下级机构 */}
1869
        <AddSubOrgModal
1870
          visible={addOrgVisible}
1871
          orgTitle1={orgTitle1}
1872
          orgID={orgID}
1873
          onCancel={() => setAddOrgVisible(false)}
1874 1875
          onSelect={onSelect}
          updateTrees1={updateTrees1}
1876
        />
1877
        {/* 编辑机构 */}
1878
        <EditOrgModal
1879
          visible={editOrgVisible}
1880
          orgID={orgID}
1881
          orgTitle1={orgTitle1}
1882
          // description={description}
1883
          onCancel={() => setEditOrgVisible(false)}
1884 1885 1886 1887
          updateTrees={updateTrees}
        />
        {/* 删除机构 */}
        <DeleteOrgModal
皮倩雯's avatar
皮倩雯 committed
1888
          title="删除机构"
1889
          visible={deleteOrgVisible}
1890
          orgTitle={orgTitle1}
1891 1892
          orgID={orgID}
          updateTrees={updateTrees}
1893
          onCancel={() => setDeleteOrgVisible(false)}
1894
        />
陈前坚's avatar
陈前坚 committed
1895
        {/* 关联角色 */}
1896 1897 1898 1899
        <RelateRoleModal
          currentUser={currentUser}
          userIDs={userIDs}
          currentSelectOrg={currentSelectOrg}
陈前坚's avatar
陈前坚 committed
1900
          visible={roleVisible}
1901
          rolelist={rolelist}
1902 1903 1904
          multiRoleList={multiRoleList}
          multistationList={multistationList}
          mult={mult}
1905 1906 1907 1908
          loading={loading}
          stationlist={stationlist}
          multiRelateRoles={multiRelateRoles}
          onSelect={onSelect}
陈前坚's avatar
陈前坚 committed
1909 1910 1911 1912
          onCancel={() => {
            setRoleVisible(false);
            setMultiRelateRoles(false);
          }}
1913
        />
陈前坚's avatar
陈前坚 committed
1914
        {/* 更改机构 */}
1915 1916 1917
        <Modal
          title="更改机构"
          visible={changeOrgVisible}
陈前坚's avatar
陈前坚 committed
1918
          onOk={multiChangeOrgs ? submitChangeOrgs : submitChangeOrg}
1919
          maskClosable={false}
陈前坚's avatar
陈前坚 committed
1920 1921 1922 1923
          onCancel={() => {
            setChangeOrgVisible(false);
            setMultiChangeOrgs(false);
          }}
1924 1925
          okText="确认"
          cancelText="取消"
1926
          width="500px"
1927
        >
1928 1929 1930 1931 1932 1933 1934 1935 1936
          {/* <span>请选择要更改的目标机构:</span> */}
          <Search
            style={{ width: 260, marginBottom: '10px' }}
            placeholder="请输入机构名称"
            onSearch={submitSearch}
            onChange={e => handleSearchOrg(e)}
            enterButton
            value={searchWordOrg}
          />
1937 1938
          <div style={{ height: '500px', overflowY: 'scroll' }}>
            {changeOrgVisible && treeDataCopy.length > 0 && (
1939
              <TreeComponents
1940 1941 1942 1943 1944 1945 1946 1947 1948 1949 1950 1951 1952 1953 1954
                showIcon="true"
                showLine={{ showLeafIcon: false }}
                // defaultExpandAll
                // 未切换时原先的节点,注意要转字符串
                selectedKeys={[`${currentSelectOldOrg}`]}
                onSelect={value => {
                  setNewOrgID(value[0]);
                  // 切换后选中的节点
                  setCurrentSelectOldOrg(value[0]);
                }}
                expandedKeys={expendKeyOrg}
                treeData={treeDataCopy.map(t => mapTree1(t))}
              />
            )}
          </div>
1955
        </Modal>
陈前坚's avatar
陈前坚 committed
1956
        {/* 修改密码 */}
1957
        <ChangePasswordModal
陈前坚's avatar
陈前坚 committed
1958
          visible={passwordVisible}
1959
          currentUser={currentUser}
1960 1961
          submitSearchUser={submitSearchUser}
          currentSelectOrg={currentSelectOrg}
1962
          onSelect={onSelect}
陈前坚's avatar
陈前坚 committed
1963
          onCancel={() => setPasswordVisible(false)}
1964
        />
陈前坚's avatar
陈前坚 committed
1965
        {/* 编辑用户 */}
1966
        <EditUserModal
陈前坚's avatar
陈前坚 committed
1967
          visible={editUserVisible}
1968
          currentUser={currentUser}
1969 1970
          submitSearchUser={submitSearchUser}
          currentSelectOrg={currentSelectOrg}
1971
          onSelect={onSelect}
陈前坚's avatar
陈前坚 committed
1972
          onCancel={() => setEditUserVisible(false)}
1973
        />
陈前坚's avatar
陈前坚 committed
1974
        {/* 冻结用户 */}
皮倩雯's avatar
皮倩雯 committed
1975
        {/* <Modal
1976
          title="请确认"
陈前坚's avatar
陈前坚 committed
1977 1978 1979 1980 1981 1982
          visible={freezeUserVisible}
          onOk={submitFreezeUser}
          onCancel={() => setFreezeUserVisible(false)}
          okText="确认"
          cancelText="取消"
        >
张烨's avatar
张烨 committed
1983 1984
          <p>
            即将{+currentUser.state ? '激活' : '冻结'}用户{' '}
1985 1986 1987
            <span className={styles.redText}>
              {voca.stripTags(currentUser.loginName)}
            </span>
张烨's avatar
张烨 committed
1988 1989 1990
            ,是否确认
            {+currentUser.state ? '激活' : '冻结'}?
          </p>
皮倩雯's avatar
皮倩雯 committed
1991
        </Modal> */}
1992
        {/* 多选删除用户 */}
1993 1994 1995
        <Modal
          title="确认删除用户"
          visible={deleteUserVisible}
陈前坚's avatar
陈前坚 committed
1996
          onOk={multiDelete ? submitDeleteUsers : submitDeleteUser}
1997
          maskClosable={false}
陈前坚's avatar
陈前坚 committed
1998 1999 2000 2001
          onCancel={() => {
            setDeleteUserVisible(false);
            setMultiDelete(false);
          }}
2002 2003 2004
          okText="确认"
          cancelText="取消"
        >
2005
          <p>将删除多个用户, 是否确认删除?</p>
2006
        </Modal>
2007
        {/* <MapScopeEditModal
皮倩雯's avatar
皮倩雯 committed
2008
          title={id}
mayongxin's avatar
mayongxin committed
2009
          mapId={createGuid()}
mayongxin's avatar
mayongxin committed
2010
          visible={editOrgExtentVisible}
皮倩雯's avatar
皮倩雯 committed
2011
          stationId={currentSelectOrg1}
mayongxin's avatar
mayongxin committed
2012 2013 2014 2015
          onCancel={() => setEditOrgExtentVisible(false)}
          confirmModal={submitExtent}
          distinct={currentOrgDistinct}
          extent={currentOrgArea}
2016
        /> */}
2017
        {/* <AuthModal
皮倩雯's avatar
皮倩雯 committed
2018 2019 2020
          visible={authUserVisible}
          currentUser={currentUser}
          onCancel={() => setAuthUserVisible(false)}
2021
        /> */}
陈前坚's avatar
陈前坚 committed
2022 2023
      </div>
    </PageContainer>
2024 2025 2026 2027 2028 2029 2030 2031 2032 2033 2034 2035 2036 2037 2038 2039 2040 2041 2042 2043 2044 2045 2046 2047 2048 2049 2050 2051 2052 2053 2054 2055 2056 2057 2058 2059 2060 2061 2062 2063 2064 2065
    // <DraggleLayout
    //     containerWidth={550}
    //     containerHeight={220}
    //     min={50}
    //     max={500}
    //     initLeftWidth={100}
    //     onWidthChange={w => setWidth(w)}
    //     handler={
    //       <div
    //         style={{
    //           width: 4,
    //           height: '100%',
    //           background: 'rgb(77, 81, 100)',
    //         }}
    //       />
    //     }
    //   >
    //     <div
    //       style={{
    //         backgroundColor: `rgb(36, 205, 208)`,
    //         color: `#fff`,
    //         height: '100%',
    //         display: 'flex',
    //         alignItems: 'center',
    //         justifyContent: 'center',
    //       }}
    //     >
    //       left
    //     </div>
    //     <div
    //       style={{
    //         backgroundColor: `rgb(116, 140, 253)`,
    //         color: `#fff`,
    //         height: '100%',
    //         display: 'flex',
    //         alignItems: 'center',
    //         justifyContent: 'center',
    //       }}
    //     >
    //       right
    //     </div>
    //   </DraggleLayout>
陈前坚's avatar
陈前坚 committed
2066 2067 2068 2069
  );
};

export default UserManage;