KC-MiddlePlatform/src/pages/index/index.tsx

/*
 * @Author: your name
 * @Date: 2021-11-10 09:33:30
 * @LastEditTime: 2021-11-29 10:13:27
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: /KC-MiddlePlatform/src/pages/index.tsx
 */


import React, { useState,useEffect } from 'react';
import TopBar from './components/topBar';
import IframePage from './components/iframePage'
import { useModel } from 'umi';
import './index.less';

const IndexPage = () => {

      const { 
            systemLists,  //当前医院可选子系统列表
            setInitialState,
            openedSysLists, //当前已打开的系统列表
            loading,
            currentSelectedSys, //当前选中的系统
      } = useModel('@@initialState',model=>{
          return {
                systemLists:model.initialState?.systemLists,
                setInitialState:model.setInitialState,
                openedSysLists:model.initialState?.openedSysLists,
                loading:model.loading,
                currentSelectedSys:model.initialState?.currentSelectedSys,
            }
      });
      const [selectableSysList,setSelectableSysList] = useState<SystemListItem[]>([]);
      const [openedTabs,setOpenTabs] = useState<SystemListItem[]>();
      const [currentOpenedTab,setCurrentOpenedTab] = useState<SystemListItem>();


      const onTabChangeHandle = ()=>{
            
      }

      const onCurrentSystemChanged = async (data:SystemListItem)=>{
            console.log({'当前选中tab':data});
            setCurrentOpenedTab(data);
            const index = openedSysLists?.findIndex(t=>t.id == data.id);
            if(index != -1){
                  //现在打开的tab里已经存在
                  await setInitialState((s)=>{
                        return {
                              ...s,
                              currentSelectedSystem:data
                        }
                  });
            }else {
                  //新打开的tab
                  await setInitialState((s)=>{
                        return {
                              ...s,
                              currentSelectedSystem:data,
                              openedSysLists:openedSysLists?.concat(data)
                        }
                  });
            }
      }

      useEffect(() => {
            if(systemLists)setSelectableSysList(systemLists);
      }, [systemLists]);


      useEffect(() => {
            if(openedSysLists)setOpenTabs(openedSysLists);
      }, [openedSysLists]);


      if(loading)return <h1>Loading...</h1>
      
      return (
            <div className='indexPage'>
                  <TopBar 
                        openedTabs={openedTabs?openedTabs:[]}
                        onTabChange={()=>onTabChangeHandle()} 
                        onCurrentSystemChanged={data=>onCurrentSystemChanged(data)} 
                        sysList={selectableSysList} 
                        currentTab={currentOpenedTab}
                  />
                  <IframePage url={`http://118.31.245.65:8804/user/login/?redirect=%2FDataManagement%2FpublicData&hospSign=tYAoFaa20yCAgaiy`} />
            </div>
      )
}


export default IndexPage;