fix permissions and teacher attendance workflows

apps/admin/src/App.tsx

@@ -1,35 +1,37 @@
-import React from 'react';
+import React, { Suspense, lazy } from 'react';
 import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
-import { ConfigProvider, App as AntdApp } from 'antd';
+import { ConfigProvider, App as AntdApp, Spin } from 'antd';
 import zhCN from 'antd/es/locale/zh_CN';
 import MainLayout from './layouts/MainLayout';
-import LoginPage from './pages/Login';
-import DashboardPage from './pages/Dashboard';
-import StudentsPage from './pages/Students';
-import RoomsPage from './pages/Rooms';
-import OccupanciesPage from './pages/Occupancies';
-import ExpensesPage from './pages/Expenses';
-import BillsPage from './pages/Bills';
-import RoomVisualPage from './pages/RoomVisual';
-import OperationLogsPage from './pages/OperationLogs';
-import UsersPage from './pages/Users';
-import ClassroomsPage from './pages/Classrooms';
-import DepositsPage from './pages/Deposits';
-import TeachersPage from './pages/Teachers';
-import StudentProfilePage from './pages/StudentProfile';
-import ClassesPage from './pages/Classes';
-import ClassDetailPage from './pages/Classes/detail';
-import TenantsPage from './pages/Tenants';
-import ClassroomRentalsPage from './pages/ClassroomRentals';
-import ClassroomSchedulePage from './pages/ClassroomSchedule';
-import SchedulesPage from './pages/Schedules';
-import RolesPage from './pages/Roles';
-import PermissionsPage from './pages/Permissions';
-import AttendancePage from './pages/Attendance';
-import TeacherWorkspacePage from './pages/TeacherWorkspace';
-import NotificationsPage from './pages/Notifications';
-import IntegrationConfigPage from './pages/IntegrationConfig';
 import PermissionRoute from './components/PermissionRoute';
+import AppMessageBridge from './ui/AppMessageBridge';
+
+const LoginPage = lazy(() => import('./pages/Login'));
+const DashboardPage = lazy(() => import('./pages/Dashboard'));
+const StudentsPage = lazy(() => import('./pages/Students'));
+const RoomsPage = lazy(() => import('./pages/Rooms'));
+const OccupanciesPage = lazy(() => import('./pages/Occupancies'));
+const ExpensesPage = lazy(() => import('./pages/Expenses'));
+const BillsPage = lazy(() => import('./pages/Bills'));
+const RoomVisualPage = lazy(() => import('./pages/RoomVisual'));
+const OperationLogsPage = lazy(() => import('./pages/OperationLogs'));
+const UsersPage = lazy(() => import('./pages/Users'));
+const ClassroomsPage = lazy(() => import('./pages/Classrooms'));
+const DepositsPage = lazy(() => import('./pages/Deposits'));
+const TeachersPage = lazy(() => import('./pages/Teachers'));
+const StudentProfilePage = lazy(() => import('./pages/StudentProfile'));
+const ClassesPage = lazy(() => import('./pages/Classes'));
+const ClassDetailPage = lazy(() => import('./pages/Classes/detail'));
+const TenantsPage = lazy(() => import('./pages/Tenants'));
+const ClassroomRentalsPage = lazy(() => import('./pages/ClassroomRentals'));
+const ClassroomSchedulePage = lazy(() => import('./pages/ClassroomSchedule'));
+const SchedulesPage = lazy(() => import('./pages/Schedules'));
+const RolesPage = lazy(() => import('./pages/Roles'));
+const PermissionsPage = lazy(() => import('./pages/Permissions'));
+const AttendancePage = lazy(() => import('./pages/Attendance'));
+const TeacherWorkspacePage = lazy(() => import('./pages/TeacherWorkspace'));
+const NotificationsPage = lazy(() => import('./pages/Notifications'));
+const IntegrationConfigPage = lazy(() => import('./pages/IntegrationConfig'));
 
 const PrivateRoute: React.FC<{ children: React.ReactNode }> = ({ children }) => {
   const token = localStorage.getItem('token');
@@ -51,7 +53,9 @@ const App: React.FC = () => {
       }}
     >
       <AntdApp>
+        <AppMessageBridge />
         <BrowserRouter>
+          <Suspense fallback={<div style={{ minHeight: '40vh', display: 'grid', placeItems: 'center' }}><Spin size="large" /></div>}>
           <Routes>
             <Route path="/login" element={<LoginPage />} />
             <Route
@@ -252,7 +256,14 @@ const App: React.FC = () => {
                 }
               />
 
-              <Route path="notifications" element={<NotificationsPage />} />
+              <Route
+                path="notifications"
+                element={
+                  <PermissionRoute permission="notification:view">
+                    <NotificationsPage />
+                  </PermissionRoute>
+                }
+              />
 
 
               <Route
@@ -265,6 +276,7 @@ const App: React.FC = () => {
               />
             </Route>
           </Routes>
+          </Suspense>
         </BrowserRouter>
       </AntdApp>
     </ConfigProvider>