Browse Source

实现在登录前不显示主页面,为登录与主页面显示之间留出空隙,为插入初始化做准备

dengdx 2 months ago
parent
commit
8a389c3e88
2 changed files with 22 additions and 17 deletions
  1. 0 8
      src/layouts/BasicLayout.tsx
  2. 22 9
      src/pages/demo/App.tsx

+ 0 - 8
src/layouts/BasicLayout.tsx

@@ -2,7 +2,6 @@
 import React, { useState } from 'react';
 import { Layout, Row, Col, ConfigProvider, Image } from 'antd';
 import { TabBar } from 'antd-mobile';
-import { useSelector } from 'react-redux';
 
 import logo from '../assets/imgs/logo-v3.jpg';
 import NavbarFloat from './NavbarFloat';
@@ -19,9 +18,6 @@ import OutputlistPage from '@/pages/patient/OutputList';
 import PatientManagement from '@/pages/patient/PatientManagement';
 import MeButton from '@/pages/security/components/MeButton';
 import Profile from '@/pages/security/Profile';
-import Login from '@/pages/security/Login';
-
-import type { RootState } from '@/states/store';
 
 // import { Link } from 'react-router-dom';
 // import { MenuOutlined } from '@ant-design/icons';
@@ -68,8 +64,6 @@ const BasicLayout: React.FC<BasicLayoutProps> = () => {
     setCurrentKey(key);
   };
 
-  const userInfo = useSelector((state: RootState) => state.userInfo);
-
   return (
     // ConfigProvider 用于自定义 Ant Design 的主题和 breakpoints
     <ConfigProvider
@@ -87,8 +81,6 @@ const BasicLayout: React.FC<BasicLayoutProps> = () => {
         }
       }
     >
-      {/* 登录遮罩层 */}
-      {userInfo.uid === 0 && <Login />}
       <Layout
         style={{
           minHeight: '100vh',

+ 22 - 9
src/pages/demo/App.tsx

@@ -1,24 +1,37 @@
 // App.tsx
 import React from 'react';
 import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
-import { Provider } from 'react-redux';
+import { Provider, useSelector } from 'react-redux';
 import store from '@/states/store';
 import BasicLayout from '../../layouts/BasicLayout';
 import HomePage from './HomePage';
 import AboutPage from './AboutPage';
+import Login from '@/pages/security/Login';
+import type { RootState } from '@/states/store';
+
+// 登录判断组件
+const AppContent: React.FC = () => {
+  const userInfo = useSelector((state: RootState) => state.userInfo);
+  if (!userInfo || userInfo.uid === 0) {
+    return <Login />;
+  }
+  return (
+    <Router>
+      <BasicLayout>
+        <Routes>
+          <Route path="/" element={<HomePage />} />
+          <Route path="/about" element={<AboutPage />} />
+        </Routes>
+      </BasicLayout>
+    </Router>
+  );
+};
 
 const App: React.FC = () => {
   console.log('App component rendered');
   return (
     <Provider store={store}>
-      <Router>
-        <BasicLayout>
-          <Routes>
-            <Route path="/" element={<HomePage />} />
-            <Route path="/about" element={<AboutPage />} />
-          </Routes>
-        </BasicLayout>
-      </Router>
+      <AppContent />
     </Provider>
   );
 };