MyDeptStruct.js 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. import { Tree } from 'antd';
  2. import React, { useState, useEffect, useRef } from 'react';
  3. import goUp from "@images/goUp.png";
  4. import apiObj from '@api/index';
  5. /****
  6. * 公用
  7. * 当前登录用户权限下的组织结构树
  8. * 自带获取数据源功能
  9. *入参:checkEv选中事件,checkeds已选中项
  10. * *****/
  11. const { post, api } = apiObj;
  12. function MyDeptStruct(props) {
  13. useEffect(() => {
  14. getHospitalTree();
  15. }, []);
  16. const { checkEv, checkeds } = props;
  17. const [treeData, setTreeData] = useState(null);
  18. const [hasScrolled, setHasScrolled] = useState(false);
  19. const box = useRef();
  20. //获取当前用户组织
  21. function getHospitalTree() {
  22. post(api.getHospitalTree).then((res) => {
  23. if (res.data.code === 200) {
  24. const data = res.data.data
  25. let arr = structureTreeData(data)
  26. setTreeData(arr)
  27. }
  28. })
  29. }
  30. //数据转换为树形结构所需字段
  31. function structureTreeData(arr) {
  32. arr.forEach(item => {
  33. item.key = item.hospitalId + '-' + item.hospitalName;
  34. item.title = item.hospitalName;
  35. if (!item.children && item.depts) { //有科室时已选中区域要显示上级医院名称+科室名称,传参需传医院id及科室id
  36. item.depts.forEach(it => {
  37. it.key = item.hospitalId + '-'+item.hospitalName + '-' + it.deptId + '-' + it.deptName;
  38. });
  39. item.children = JSON.parse(JSON.stringify(item.depts).replace(/deptName/g, 'title').replace(/deptId/g, 'key'))
  40. return
  41. }
  42. if (item.children) {
  43. structureTreeData(item.children)
  44. }
  45. })
  46. return arr
  47. }
  48. //菜单选中事件
  49. function onCheck(checkedKeys,e) {
  50. checkEv(checkedKeys,e)
  51. }
  52. function handleScroll(e) {
  53. if (e.target.scrollTop > 500) {
  54. setHasScrolled(true)
  55. } else {
  56. setHasScrolled(false)
  57. }
  58. }
  59. function goTop() {
  60. box.current.scrollTop = 0
  61. }
  62. function onSelect() { }
  63. //const defaultCheckedKeys = checkeds && checkeds.softwareMenuIds ? checkeds.softwareMenuIds.slice() : []
  64. return (
  65. <div className='treeContent' >
  66. <p className='title'>组织结构</p>
  67. <div className='tree' onScrollCapture={handleScroll} ref={box}>
  68. <Tree
  69. checkable
  70. checkedKeys={checkeds}
  71. onCheck={onCheck}
  72. onSelect={onSelect}
  73. treeData={treeData}
  74. />
  75. </div>
  76. {
  77. hasScrolled ?
  78. <div className='goTop' onClick={goTop} >
  79. <img src={goUp} />
  80. </div>
  81. : null
  82. }
  83. </div>
  84. )
  85. }
  86. export default MyDeptStruct;