样式修改

src/components/DataManager/AddData.js

@@ -129,9 +129,9 @@ function AddData(props) {
           software.forEach((it, index) => {
             tag.forEach((item, i) => {
               tags[index] = []
-              if(i == index){
+              if (i == index) {
                 tags[index] = tag[i]
-              } 
+              }
             })
             setTags([...tags])
           })
@@ -401,7 +401,7 @@ function AddData(props) {
                         </Card>
                       </Form.Item>
                       <Form.Item key={i + "d"} style={{ display: value[index] == 7 && it.id == key ? 'block' : 'none' }}>
-                        <Tabs defaultActiveKey="0">
+                        <Tabs defaultActiveKey="0" className='tab-content'>
                           <TabPane tab="可看医生" key="0" forceRender={type == 3 && form.getFieldValue().softwareVOS[i] ? true : false}>
                             <Form.Item
                               name={['softwareVOS', i, 'selectedRowKeys']}

src/components/DataManager/MenuTree.js

@@ -1,26 +1,63 @@
-import { Tree } from 'antd';
+import { Tree, BackTop } from 'antd';
+import React, { useState, useEffect, useRef } from 'react';
+import goUp from "@images/goUp.png";
 function MenuTree(props) {
+  useEffect(() => {
+    //监听resize事件
+    // setTableHt(window.innerHeight - 260);
+    window.addEventListener('scroll', () => {
+      console.log(document.documentElement.scrollTop);
+    });
+    //解绑事件
+    // return function clear() {
+    //     window.removeEventListener("resize");
+    // }
+
+  }, []);
   const { data, checkEv, checkeds } = props;
-  //console.log(42,checkeds)
+  const [hasScrolled, setHasScrolled] = useState(false);
+  const box = useRef()
   //菜单选中事件
-
-
   function onCheck(checkedKeys, e) {
     checkEv(checkedKeys)
   }
-  function onSelect() {
-
+  function handleScroll(e) {
+    if (e.target.scrollTop > 500) {
+      setHasScrolled(true)
+    } else {
+      setHasScrolled(false)
+    }
   }
+  function goTop() { 
+    box.current.scrollTop = 0
+  }
+  function onSelect() { }
   const treeData = data ? data : null;
   const defaultCheckedKeys = checkeds && checkeds.softwareMenuIds ? checkeds.softwareMenuIds.slice() : []
   return (
-    <Tree
-      checkable
-      defaultCheckedKeys={defaultCheckedKeys}
-      onCheck={onCheck}
-      onSelect={onSelect}
-      treeData={treeData}
-    />
+    <div className='treeContent' >
+      <p className='title'>组织结构</p>
+      <div className='tree' onScrollCapture={handleScroll} ref={box}>
+        <Tree
+          checkable
+          defaultCheckedKeys={defaultCheckedKeys}
+          onCheck={onCheck}
+          onSelect={onSelect}
+          treeData={treeData}
+
+        />
+      </div>
+      
+      {
+        hasScrolled ?
+          <div className='goTop' onClick={goTop} >
+            <img src={goUp} />
+          </div>
+          : null
+      }
+
+    </div>
+
   )
 }
 

src/components/DataManager/doctorList.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useContext, componentWillReceiveProps } from 'react';
+import React, { useState, useEffect, useContext } from 'react';
 import { Form, Input, Button, Table, Select, Pagination, Space, TreeSelect, Tag } from 'antd';
 import { DownOutlined, PlusOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
 import apiObj from '@api/index';
@@ -22,6 +22,7 @@ function DoctorList(props) {
   const [phone, setPhone] = useState("");
   const [treeData, setTreeData] = useState([]);
   const [total, setTotal] = useState(0);
+  const [size, setSize] = useState(10);
   // const [selectedRowKeys, setSelectedRowKeys] = useState();
   const [addHospitalTreeVO, setAddHospitalTreeVO] = useState({
     depts: [],
@@ -32,7 +33,7 @@ function DoctorList(props) {
     asc: ["id"],
     pages: 1,
     current: 1,
-    size: 5
+    size: 10
   }
   //获取可看医生列表
   function getDoctorPage() {
@@ -114,6 +115,12 @@ function DoctorList(props) {
     params.size = pageSize
     getDoctorPage()
   }
+  function onSizeChange(current, pageSize) {
+    params.current = current
+    params.size = pageSize
+    setSize(pageSize)
+    getDoctorPage()
+  }
   function onSelectChange(selectedRowKeys) {
     checkDoct(selectedRowKeys)
   }
@@ -173,14 +180,17 @@ function DoctorList(props) {
             selectedRowKeys,
             onChange: onSelectChange,
           }}
+          scroll={{ y: '260px' }}
           className='doctorTable'
           columns={columns}
           dataSource={doctorList}
           rowKey={record => record.id + '-' + record.name}
           pagination={{
             pageNo: 1,
-            pageSize: 5,
+            size,
+            pageSizeOptions: ['15', '30', '60', '120'],
             showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
+            onShowSizeChange: (current, pageSize) => onSizeChange(current, pageSize), // 改变每页数量时更新显示
             onChange: (page, pageSize) => changePage(page, pageSize),//点击页码事件
             total: total
           }} />

src/components/DataManager/index.less

@@ -16,11 +16,7 @@
     font-size: 16px;
   }
 }
-.ant-tree-list-holder-inner{
-  min-height: 100px;
-  max-height: 500px;
-  overflow-y: auto;
-}
+
 .form-center{
   height: calc(100vh - 180px);
   overflow-y: auto;
@@ -60,3 +56,48 @@
     vertical-align: middle;
   }
 }
+.tab-content{
+  .ant-tabs-nav{
+    padding-bottom: 10px;
+  }
+  .ant-tabs-nav::before{
+    border: none;
+  }
+  .wrapper{
+    height: 496px;
+    border: 1px solid #DEE2E9;
+  }
+  .treeContent{
+    height: 408px;
+    overflow-y: auto;
+    border: 1px solid #DEE2E9;
+    padding-bottom: 20px;
+    position: relative;
+    .title{
+      height: 30px;
+      font-size: 14px;
+      font-weight: 500;
+      color: #333333;
+      line-height: 30px;
+      background: #F2F4F6;
+      padding-left: 20px;
+    }
+    .tree{
+      min-height: 100px;
+      max-height: 342px;
+      overflow-y: auto;
+    }
+    .goTop{
+      position: fixed;
+      right: 11%;
+      top: 67%;
+      width: 30px;
+      height: 30px;
+      border: 1px solid #D4D4D4;
+      border-radius: 4px;
+      vertical-align: middle;
+      text-align: center;
+    }
+  }
+  
+}