状态列表数据公用

src/components/OrgManager/AddSubOrg.js

@@ -66,7 +66,7 @@ function StepContent(props){
     const [tabDatas, setTabDatas] = useState([]);
     const [activeTab, setActiveTab] = useState('');
     const [sysCheckeds, setSysCheckeds] = useState([]);
-    const {orgId,orgName,typeList,save}  = useContext(OrgContext);
+    const {orgId,orgName,hisTypeList,save}  = useContext(OrgContext);
     const {current,pre,next} = props;
     const initialValues={
         parentId:orgId,
@@ -194,7 +194,7 @@ function StepContent(props){
                 label="组织名称"
                 name='name'
                 hidden={current!==0}
-                rules={[{ required: true},({ getFieldValue }) => ({
+                rules={[{ required: true},() => ({
                     validator(_, value) {
                         if (value.length<51) {
                             return Promise.resolve();
@@ -228,7 +228,7 @@ function StepContent(props){
                 hidden={current!==0}
                 rules={[{ required: true }]}>
                 <Select placeholder='请选择类型'>
-                    {typeList.map((item,i)=>{
+                    {hisTypeList.map((item,i)=>{
                         return (
                             <Option value={item.name} key={i}>{item.val}</Option>
                         )

src/components/OrgManager/index.js

@@ -1,5 +1,5 @@
 import {useEffect,useState} from 'react';
-/*import { useDispatch,useSelector } from 'react-redux'*/
+import { useSelector } from 'react-redux'
 import { Table,Modal, message, Menu, Breadcrumb, Dropdown, Space, Form, Input, Button, Row, Col, Select } from 'antd';
 import { DownOutlined,PlusOutlined } from '@ant-design/icons';
 import AddSubOrg from './AddSubOrg';
@@ -11,14 +11,12 @@ const {post,api,xPost} = apiObj;
 const { Option } = Select;
 function OrgManager(){
     useEffect(() => {
-        getFilterList();
+        //getFilterList();
         getTableData();
     },[]);
 
     const [dataSource, setDataSource] = useState([]);   //列表数据
     const [orgDetail, setOrgDetail] = useState([]);   //组织详情数据
-    const [typeList,setTypeList] = useState([]);        //组织类型
-    const [statusList,setStatusList] = useState([]);        //状态
     const [visible,setVisible] = useState(false);   //删除禁用确认弹窗显示
     const [addVisible,setAddVisible] = useState(false);         //新增页面显示
     const [confirmLoading, setConfirmLoading] = useState(false);
@@ -27,6 +25,11 @@ function OrgManager(){
     const [operId,setOperId] = useState('');    //当前操作的组织id
     const [orgId,setOrgId] = useState('');      //上级组织id
     const [orgName,setOrgName] = useState('');      //上级组织名称，新增修改用
+    //从state中取出状态、类型列表
+    const staticInfo =useSelector(state => {
+        return state.staticInfo;
+    });
+    const {hisTypeList,statusList} = staticInfo;
 
     const tipText={
         1:'确定要删除该组织？',
@@ -36,16 +39,6 @@ function OrgManager(){
         5:'确定要重置该组织密码？',
     };
 
-    //获取筛选下拉数据
-    function getFilterList(){
-        post(api.getManagerBoxInfo).then((res)=>{
-            if(res.data.code===200){
-                const data = res.data.data;
-                setTypeList(data[43]);
-                setStatusList(data[47]);
-            }
-        })
-    }
     //获取表格数据
     function getTableData(param={}){
         post(api.getHospitalListInfo,param).then((res)=>{
@@ -226,7 +219,7 @@ function OrgManager(){
     };
     if(addVisible){
         return (
-                <OrgContext.Provider value={{orgId,orgName,typeList,save:addSubOrg}}>
+                <OrgContext.Provider value={{orgId,orgName,hisTypeList,save:addSubOrg}}>
                     <AddSubOrg back={goBack}/>
                 </OrgContext.Provider>
         )
@@ -247,7 +240,7 @@ function OrgManager(){
                                 <Select
                                     allowClear
                                 >
-                                    {typeList.map((item)=>{
+                                    {hisTypeList.map((item)=>{
                                         return (
                                             <Option value={item.name}  key={item.name}>{item.val}</Option>
                                         )

src/components/PageLayout/index.js

@@ -1,33 +1,55 @@
+import {useEffect,useState} from 'react';
+import { useDispatch,useSelector } from 'react-redux'
 import { Layout, Menu } from 'antd';
 import AHeader from '../AHeader'
 import AMenu from '../AMenu'
 import ATabs from '../ATabs'
-import {Component} from "react";
+import apiObj from '@api/index';
+import { setStatusList, setHisTypeList} from '@reducers/staticInfo';
 
 const { Header, Content, Sider } = Layout;
+const {post,api,xPost} = apiObj;
 const propTypes = {
 
 }
 const defaultProps = {};
 
-class PageLayout extends Component{
-    render() {
-        return (
+function PageLayout(){
+    const dispatch = useDispatch();
+    const staticInfo =useSelector(state => {
+        return state.staticInfo;
+    });
+    function getStaticInfos(){
+        const {hisTypeList,statusList} = staticInfo;
+        if([...hisTypeList,...statusList].length>0){
+            return;
+        }
+        post(api.getManagerBoxInfo).then((res)=>{
+            if(res.data.code===200){
+                const data = res.data.data;
+                dispatch(setHisTypeList(data[43]));
+                dispatch(setStatusList(data[47]));
+            }
+        })
+    }
+    useEffect(()=>{
+        getStaticInfos()
+    },[]);
+    return (
+        <Layout>
+            <Header className='page-header'>
+                <AHeader></AHeader>
+            </Header>
             <Layout>
-                <Header className='page-header'>
-                    <AHeader></AHeader>
-                </Header>
-                <Layout>
-                    <Sider className='page-sider'>
-                        <AMenu></AMenu>
-                    </Sider>
-                    <Content className='page-content'>
-                        <ATabs></ATabs>
-                    </Content>
-                </Layout>
+                <Sider className='page-sider'>
+                    <AMenu></AMenu>
+                </Sider>
+                <Content className='page-content'>
+                    <ATabs></ATabs>
+                </Content>
             </Layout>
-        )
-    }
+        </Layout>
+    )
 }
 
 PageLayout.propTypes = propTypes;

src/components/RoleManager/index.js

@@ -1,4 +1,5 @@
 import {useEffect,useState} from 'react';
+import { useSelector } from 'react-redux'
 /*import { useDispatch,useSelector } from 'react-redux'*/
 import { Table,Modal, message, Menu, Breadcrumb, Dropdown, Space, Form, Input, Button, Row, Col, Select } from 'antd';
 import { DownOutlined,PlusOutlined } from '@ant-design/icons';
@@ -11,13 +12,11 @@ const {post,api,xPost} = apiObj;
 const { Option } = Select;
 function RoleManager(){
     useEffect(() => {
-        getFilterList();
         getTableData();
     },[]);
 
     const [dataSource, setDataSource] = useState([]);   //列表数据
     const [roleDetail, setRoleDetail] = useState([]);   //角色详情数据
-    const [statusList,setStatusList] = useState([]);        //状态
     const [visible,setVisible] = useState(false);   //删除禁用确认弹窗显示
     const [addVisible,setAddVisible] = useState(false);         //新增页面显示
     const [confirmLoading, setConfirmLoading] = useState(false);
@@ -25,6 +24,13 @@ function RoleManager(){
     const [modalType,setModalType] = useState(1);
     const [operId,setOperId] = useState('');    //当前操作的角色id
 
+    //从state中取出状态、类型列表
+    const staticInfo =useSelector(state => {
+        return state.staticInfo;
+    });
+    const {statusList} = staticInfo;
+
+
     const tipText={
         1:'确定要删除该角色？',
         2:'当前角色存在用户，删除后用户将一并被删除',
@@ -32,15 +38,6 @@ function RoleManager(){
         4:'当前角色存在用户，禁用后用户将一并被禁用',
     };
 
-    //获取筛选下拉数据
-    function getFilterList(){
-        post(api.getManagerBoxInfo).then((res)=>{
-            if(res.data.code===200){
-                const data = res.data.data;
-                setStatusList(data[47]);
-            }
-        })
-    }
     //获取表格数据
     function getTableData(param={}){
         post(api.getRolePage,param).then((res)=>{

src/store/reducers/index.js

@@ -1,10 +1,12 @@
 import { combineReducers } from 'redux';
 import tabPanes from './tabPanes';
 import userInfo from './userInfo';
+import staticInfo from './staticInfo';
 
 const rootReducer = combineReducers({
     tabPanes,
-    userInfo
+    userInfo,
+    staticInfo
 });
 
 export default rootReducer;

src/store/reducers/staticInfo.js

@@ -0,0 +1,21 @@
+import { createSlice } from '@reduxjs/toolkit';
+
+export const slice = createSlice({
+    name: 'staticInfo',
+    initialState: {
+        hisTypeList:[],        //医院类型列表
+        statusList:[],      //启/禁用状态列表
+    },
+    reducers: {
+        setStatusList: (state,action) => {
+            state.statusList = action.payload;
+        },
+        setHisTypeList: (state,action) => {
+            state.hisTypeList = action.payload;
+        },
+    },
+});
+
+export const { setStatusList, setHisTypeList} = slice.actions;
+
+export default slice.reducer;

src/store/reducers/userSlice.js

@@ -1,20 +0,0 @@
-import { createSlice } from '@reduxjs/toolkit';
-
-export const slice = createSlice({
-    name: 'user',
-    initialState: {
-        userName: '',
-    },
-    reducers: {
-        login: state => {
-            state.userName = '用户1';
-        },
-        loginOut: state => {
-            state.userName = '';
-        },
-    },
-});
-
-export const { login, loginOut} = slice.actions;
-
-export default slice.reducer;