#

luxiaotao1123

2024-09-29 585b14712879ab9412b9749723819202093d2520

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
import React, { useState, useRef, useEffect, useMemo } from "react";
import { Route } from 'react-router-dom'
import {
  Admin,
  Resource,
  CustomRoutes,
  localStorageStore,
  useStore,
  StoreContextProvider,
} from "react-admin";
import polyglotI18nProvider from 'ra-i18n-polyglot';
import englishMessages from './i18n/en';
import { Layout } from "./layout";
import AuthProvider from "./config/authProvider";
import DataProvider from "./config/dataProvider";
import Dashboard from "./page/dashboard/Dashboard";
import Settings from "./page/settings/Settings";
import Login from "./page/login/Login";
import * as Common from './utils/common'
import { themes } from './themes/themes';
import { SPA_NAME, SPA_VERSION, DEFAULT_THEME_NAME, DEFAULT_THEME_MODE, DATA_PROVIDER_SPRING } from "./config/setting";
import ResourceContent from "./page/ResourceContent";
 
const i18nProvider = polyglotI18nProvider(
  locale => {
    if (locale === 'zh') {
      return import('./i18n/zh').then(messages => messages.default);
    }
    // fallback
    return englishMessages;
  },
  // default
  'en',
  [
    { locale: 'en', name: 'English' },
    { locale: 'zh', name: '简体中文' },
  ]
);
 
const store = localStorageStore(SPA_VERSION, SPA_NAME);
 
const App = () => {
  const [themeName] = useStore('themeName', DEFAULT_THEME_NAME);
  const lightTheme = themes.find(theme => theme.name === themeName)?.light;
  const darkTheme = themes.find(theme => theme.name === themeName)?.dark;
 
  return (
    <>
      <Admin
        disableTelemetry
        layout={Layout}
        authProvider={AuthProvider}
        store={store}
        lightTheme={lightTheme}
        darkTheme={darkTheme}
        defaultTheme={DEFAULT_THEME_MODE}
        i18nProvider={i18nProvider}
        dataProvider={DataProvider(DATA_PROVIDER_SPRING)}
        loginPage={Login}
        dashboard={Dashboard}
      >
        {permissions => (
          <>
            {
              Common.extractNavMenus(permissions)?.map(node => {
                return (
                  <Resource
                    key={node.id}
                    name={node.component}
                    {...ResourceContent(node)}
                  />
                )
              })
            }
          </>
        )}
        <CustomRoutes>
          <Route path="/dashboard" element={<Dashboard />} />
          <Route path="/settings" element={<Settings />} />
        </CustomRoutes>
      </Admin>
    </>
  )
};
 
const AppWrapper = () => (
  <StoreContextProvider value={store}>
    <App />
  </StoreContextProvider>
);
 
export default AppWrapper;