├── .editorconfig ├── .env ├── .eslintrc.js ├── .gitignore ├── .npmrc ├── .prettierignore ├── .prettierrc ├── README.md ├── commitlint.config.js ├── config-overrides.js ├── package.json ├── paths.json ├── public ├── favicon.ico ├── index.html ├── logo192.png ├── logo512.png ├── manifest.json └── robots.txt ├── src ├── App.tsx ├── assets │ └── images │ │ └── logo.svg ├── base │ └── GlobalLoading │ │ ├── index.scss │ │ └── index.tsx ├── components │ ├── ErrorBoundary │ │ └── index.tsx │ └── RenderRouter │ │ └── index.tsx ├── config │ ├── antd.ts │ ├── index.ts │ ├── layout.ts │ └── menu.tsx ├── hooks │ └── useBoolean │ │ └── index.ts ├── index.tsx ├── layout │ ├── AuthorityLayout.scss │ ├── AuthorityLayout.tsx │ ├── NormalLayout.scss │ ├── NormalLayout.tsx │ └── components │ │ ├── AuthorityHeader │ │ ├── index.scss │ │ └── index.tsx │ │ ├── AuthoritySider │ │ ├── index.scss │ │ └── index.tsx │ │ └── Footer │ │ └── index.tsx ├── pages │ ├── 404 │ │ └── index.tsx │ ├── home │ │ └── index.tsx │ └── login │ │ ├── index.scss │ │ └── index.tsx ├── react-app-env.d.ts ├── routes │ ├── history.ts │ └── index.ts ├── serviceWorker.ts ├── setupTests.ts ├── store │ └── login.ts ├── styles │ ├── global.scss │ ├── index.scss │ └── reset.scss └── utils │ ├── dom.ts │ ├── filter.ts │ ├── index.ts │ ├── request │ ├── axios.ts │ └── index.ts │ ├── storage │ ├── index.ts │ └── storage.ts │ └── type.ts ├── tsconfig.json └── yarn.lock /.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | 12 | [*.md] 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /.env: -------------------------------------------------------------------------------- 1 | PORT=9527 2 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | // 运行环境 3 | env: { 4 | browser: true, 5 | es2020: true 6 | }, 7 | // 继承的规则 / 插件 8 | extends: [ 9 | 'plugin:react/recommended', 10 | 'plugin:@typescript-eslint/recommended', 11 | 'prettier' 12 | ], 13 | // 解析器 14 | parser: '@typescript-eslint/parser', 15 | // 解析器配置 16 | parserOptions: { 17 | ecmaFeatures: { 18 | jsx: true 19 | }, 20 | ecmaVersion: 11, 21 | sourceType: 'module' 22 | }, 23 | // 插件 24 | plugins: ['@typescript-eslint', 'react', 'react-hooks'], 25 | settings: { 26 | // 自动检测 React 的版本 27 | react: { 28 | version: 'detect' 29 | } 30 | }, 31 | // 规则 32 | rules: { 33 | 'react/prop-types': 0, 34 | 'react/forbid-prop-types': 0, 35 | 'react/require-default-props': 0, 36 | 'react/default-props-match-prop-types': 0, 37 | 'react/jsx-indent': 0, 38 | 'react/jsx-filename-extension': 0, 39 | 'react/display-name': 0, 40 | 'react/button-has-type': 0, 41 | '@typescript-eslint/no-non-null-assertion': 0, 42 | '@typescript-eslint/no-explicit-any': 0, 43 | '@typescript-eslint/no-unused-vars': [1, { argsIgnorePattern: '^_' }], 44 | '@typescript-eslint/no-var-requires': 0, 45 | '@typescript-eslint/explicit-module-boundary-types': 0 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .idea 17 | .env.local 18 | .env.development.local 19 | .env.test.local 20 | .env.production.local 21 | 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | registry=https://registry.npmmirror.com 2 | sass_binary_site=https://npmmirror.com/mirrors/node-sass 3 | phantomjs_cdnurl=https://npmmirror.com/mirrors/phantomjs 4 | electron_mirror=https://npmmirror.com/mirrors/electron 5 | profiler_binary_host_mirror=https://npmmirror.com/mirrors/node-inspector 6 | chromedriver_cdnurl=https://npmmirror.com/mirrors/chromedriver 7 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | *.svg 2 | *.html 3 | package.json 4 | tsconfig.json 5 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "singleQuote": true, 3 | "semi": false, 4 | "trailingComma": "none", 5 | "printWidth": 100, 6 | "overrides": [ 7 | { 8 | "files": ".prettierrc", 9 | "options": { "parser": "json" } 10 | } 11 | ] 12 | } 13 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # react-admin-template 2 | 3 | React 管理后台基础模板 -------------------------------------------------------------------------------- /commitlint.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: ['@commitlint/config-conventional'] 3 | } 4 | -------------------------------------------------------------------------------- /config-overrides.js: -------------------------------------------------------------------------------- 1 | const { 2 | override, 3 | fixBabelImports, 4 | addWebpackAlias, 5 | addWebpackExternals, 6 | addWebpackPlugin 7 | } = require('customize-cra') 8 | const path = require('path') 9 | const { DefinePlugin } = require('webpack') 10 | const AntdDayjsWebpackPlugin = require('antd-dayjs-webpack-plugin') 11 | 12 | const isEnvDevelopment = process.env.NODE_ENV === 'development' 13 | const isEnvProduction = process.env.NODE_ENV === 'production' 14 | 15 | const customWebpackConfig = (config) => { 16 | /* 开发环境相关配置 */ 17 | if (isEnvDevelopment) { 18 | // 增加 module rules 配置 19 | config.module.rules.push({ 20 | test: /\.[jt]sx?$/, 21 | loader: 'react-dev-inspector/plugins/webpack/inspector-loader' 22 | }) 23 | } 24 | 25 | /* 生产环境相关配置 */ 26 | if (isEnvProduction) { 27 | // 修改 HtmlWebpackPlugin 配置 28 | config.plugins = config.plugins.map((plugin) => { 29 | if (plugin.constructor.name === 'HtmlWebpackPlugin') { 30 | plugin.userOptions.cdn = [ 31 | 'https://cdn.jsdelivr.net/npm/react@16.13.1/umd/react.production.min.js', 32 | 'https://cdn.jsdelivr.net/npm/react-dom@16.13.1/umd/react-dom.production.min.js', 33 | 'https://cdn.jsdelivr.net/npm/react-router-dom@5.2.0/umd/react-router-dom.min.js', 34 | 'https://cdn.jsdelivr.net/npm/axios@0.19.2/dist/axios.min.js' 35 | ] 36 | } 37 | return plugin 38 | }) 39 | } 40 | 41 | return config 42 | } 43 | 44 | module.exports = override( 45 | // 配置别名 46 | addWebpackAlias({ 47 | '@': path.resolve(__dirname, 'src') 48 | }), 49 | // 配置 antd 按需加载 50 | fixBabelImports('import', { 51 | libraryName: 'antd', 52 | libraryDirectory: 'es', 53 | style: 'css' 54 | }), 55 | addWebpackPlugin( 56 | // 添加全局变量 57 | new DefinePlugin({ 58 | 'process.env.PWD': JSON.stringify(process.env.PWD) 59 | }), 60 | // 配置 antd dayjs 61 | new AntdDayjsWebpackPlugin() 62 | ), 63 | // 配置 externals 64 | isEnvProduction && 65 | addWebpackExternals({ 66 | react: 'React', 67 | 'react-dom': 'ReactDOM', 68 | 'react-router-dom': 'ReactRouterDOM', 69 | axios: 'axios' 70 | }), 71 | // 自定义 webpack 配置 72 | customWebpackConfig 73 | ) 74 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-admin-template", 3 | "version": "0.1.0", 4 | "private": true, 5 | "author": "maomao1996 <1714487678@qq.com>", 6 | "bugs": { 7 | "url": "https://github.com/maomao1996/react-admin-template/issues" 8 | }, 9 | "repository": { 10 | "type": "git", 11 | "url": "https://github.com/maomao1996/react-admin-template" 12 | }, 13 | "dependencies": { 14 | "@testing-library/jest-dom": "^5.11.0", 15 | "@testing-library/react": "^10.4.3", 16 | "@testing-library/user-event": "^12.0.11", 17 | "@types/jest": "^26.0.3", 18 | "@types/node": "^14.0.14", 19 | "@types/react": "^16.9.41", 20 | "@types/react-dom": "^16.9.8", 21 | "ahooks": "^2.6.0", 22 | "antd": "4.6.4", 23 | "axios": "0.19.2", 24 | "dayjs": "^1.10.4", 25 | "path-to-regexp": "^6.1.0", 26 | "react": "16.13.1", 27 | "react-dom": "16.13.1", 28 | "react-router-dom": "5.2.0", 29 | "react-scripts": "5.0.0", 30 | "typescript": "~4.5.4", 31 | "unstated-next": "^1.1.0" 32 | }, 33 | "scripts": { 34 | "start": "react-app-rewired start", 35 | "build": "react-app-rewired build", 36 | "analyze": "source-map-explorer build/static/js/*.js", 37 | "test": "react-app-rewired test", 38 | "commit": "git-cz", 39 | "eject": "react-scripts eject", 40 | "lint": "eslint --ext js,ts,tsx src", 41 | "fix": "prettier --write ./src" 42 | }, 43 | "eslintConfig": { 44 | "extends": "react-app" 45 | }, 46 | "browserslist": { 47 | "production": [ 48 | ">0.2%", 49 | "not dead", 50 | "not op_mini all" 51 | ], 52 | "development": [ 53 | "last 1 chrome version", 54 | "last 1 firefox version", 55 | "last 1 safari version" 56 | ] 57 | }, 58 | "devDependencies": { 59 | "@commitlint/cli": "^9.0.1", 60 | "@commitlint/config-conventional": "^9.0.1", 61 | "@types/path-to-regexp": "^1.7.0", 62 | "@types/react-router-dom": "^5.1.5", 63 | "@typescript-eslint/eslint-plugin": "^5.9.1", 64 | "@typescript-eslint/parser": "^5.9.1", 65 | "antd-dayjs-webpack-plugin": "^1.0.6", 66 | "babel-plugin-import": "^1.13.0", 67 | "commitizen": "^4.1.2", 68 | "customize-cra": "^0.9.1", 69 | "cz-conventional-changelog": "^3.2.0", 70 | "eslint-config-prettier": "^6.11.0", 71 | "eslint-plugin-prettier": "^3.1.4", 72 | "eslint-plugin-react": "^7.20.3", 73 | "eslint-plugin-react-hooks": "^4.0.5", 74 | "husky": "^4.2.5", 75 | "lint-staged": "^10.2.11", 76 | "prettier": "^2.0.5", 77 | "react-app-rewired": "^2.1.6", 78 | "react-dev-inspector": "^1.1.1", 79 | "sass": "^1.26.9", 80 | "source-map-explorer": "^2.4.2" 81 | }, 82 | "husky": { 83 | "hooks": { 84 | "pre-commit": "lint-staged", 85 | "commit-msg": "commitlint -E HUSKY_GIT_PARAMS" 86 | } 87 | }, 88 | "lint-staged": { 89 | "src/**/*.{js,ts,tsx}": [ 90 | "eslint --fix", 91 | "prettier --write" 92 | ] 93 | }, 94 | "config": { 95 | "commitizen": { 96 | "path": "cz-conventional-changelog" 97 | } 98 | } 99 | } 100 | -------------------------------------------------------------------------------- /paths.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "paths": { 5 | "@/*": ["src/*"] 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/maomao1996/react-admin-template/1f5e7f0999f7ea6f97af070d44c6e24eb1717695/public/favicon.ico -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 13 | 17 | 18 | 27 | React App 28 | 29 | 30 | 31 |
32 | <% htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.forEach(src => { %> 33 | 34 | <% }) %> 35 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/maomao1996/react-admin-template/1f5e7f0999f7ea6f97af070d44c6e24eb1717695/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/maomao1996/react-admin-template/1f5e7f0999f7ea6f97af070d44c6e24eb1717695/public/logo512.png -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /src/App.tsx: -------------------------------------------------------------------------------- 1 | import React, { Suspense } from 'react' 2 | import { Router } from 'react-router-dom' 3 | import { ConfigProvider } from 'antd' 4 | 5 | import RenderRouter from '@/components/RenderRouter' 6 | import { authorizedRoutes, normalRoutes } from '@/routes' 7 | import history from '@/routes/history' 8 | import LoginContainer from '@/store/login' 9 | import { antdConfig } from './config' 10 | 11 | const App: React.FC = () => { 12 | const { isLogin } = LoginContainer.useContainer() 13 | 14 | return ( 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | ) 23 | } 24 | 25 | export default App 26 | -------------------------------------------------------------------------------- /src/assets/images/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /src/base/GlobalLoading/index.scss: -------------------------------------------------------------------------------- 1 | .global-loading { 2 | display: flex; 3 | justify-content: center; 4 | align-items: center; 5 | position: fixed; 6 | top: 0; 7 | right: 0; 8 | bottom: 0; 9 | left: 0; 10 | z-index: 1996; 11 | background-color: rgba(#000, 0.35); 12 | } 13 | -------------------------------------------------------------------------------- /src/base/GlobalLoading/index.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import { Spin } from 'antd' 4 | import { SpinProps } from 'antd/es/spin' 5 | 6 | import { isHidden } from '@/utils' 7 | 8 | import './index.scss' 9 | 10 | export const Loading: React.FC = (props) => ( 11 |
12 | 13 |
14 | ) 15 | 16 | let dom: HTMLElement | null 17 | const GlobalLoading = { 18 | open(props: React.ComponentProps = {}): void { 19 | if (!dom) { 20 | dom = document.createElement('div') 21 | ReactDOM.render(, dom) 22 | document.body.appendChild(dom) 23 | } 24 | if (isHidden(dom)) { 25 | dom.style.display = '' 26 | } 27 | }, 28 | close(): void { 29 | dom!.style.display = 'none' 30 | }, 31 | remove(): void { 32 | ReactDOM.unmountComponentAtNode(dom!) 33 | document.body.removeChild(dom!) 34 | dom = null 35 | } 36 | } 37 | 38 | export default GlobalLoading 39 | -------------------------------------------------------------------------------- /src/components/ErrorBoundary/index.tsx: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import { Result } from 'antd' 3 | 4 | // 用于捕获渲染时错误的组件 5 | 6 | class ErrorBoundary extends Component { 7 | state = { 8 | error: null 9 | } 10 | 11 | static getDerivedStateFromError(error: unknown): unknown { 12 | return { error } 13 | } 14 | 15 | render(): React.ReactNode { 16 | if (this.state.error) { 17 | return ( 18 | 23 | ) 24 | } 25 | return this.props.children 26 | } 27 | } 28 | 29 | export default ErrorBoundary 30 | -------------------------------------------------------------------------------- /src/components/RenderRouter/index.tsx: -------------------------------------------------------------------------------- 1 | import React, { Suspense, SuspenseProps } from 'react' 2 | import { Switch, Route, RouteProps, Redirect } from 'react-router-dom' 3 | 4 | // 路由渲染组件 5 | 6 | export interface RouteItem extends Omit { 7 | redirect?: string 8 | icon?: React.ReactNode 9 | routes?: RouteItem[] 10 | } 11 | 12 | const renderRedirectRoute = (route: RouteItem) => { 13 | return ( 14 | } 18 | /> 19 | ) 20 | } 21 | 22 | const renderRoute = (route: RouteItem) => { 23 | if (route.redirect) { 24 | return renderRedirectRoute(route) 25 | } 26 | const { component: Component, ...rest } = route 27 | return ( 28 | 32 | Component && ( 33 | 34 | 35 | 36 | ) 37 | } 38 | /> 39 | ) 40 | } 41 | 42 | interface RenderRouterProps { 43 | routes: RouteItem[] 44 | fallback?: SuspenseProps['fallback'] 45 | } 46 | 47 | const RenderRouter: React.FC = ({ routes, fallback = null }) => { 48 | if (!routes.length) { 49 | return null 50 | } 51 | return ( 52 | 53 | {routes.map((route) => renderRoute(route))} 54 | 55 | ) 56 | } 57 | 58 | export default RenderRouter 59 | -------------------------------------------------------------------------------- /src/config/antd.ts: -------------------------------------------------------------------------------- 1 | import zhCN from 'antd/es/locale/zh_CN' 2 | import { ConfigProviderProps } from 'antd/es/config-provider' 3 | 4 | import dayjs from 'dayjs' 5 | import 'dayjs/locale/zh-cn' 6 | 7 | dayjs.locale('zh-cn') 8 | 9 | /** 10 | * antd 全局配置 11 | * https://ant.design/components/config-provider-cn/#API 12 | */ 13 | 14 | export const antdConfig: ConfigProviderProps = { 15 | // 组件大小 16 | componentSize: 'middle', 17 | // 语言包配置 18 | locale: zhCN 19 | } 20 | -------------------------------------------------------------------------------- /src/config/index.ts: -------------------------------------------------------------------------------- 1 | export * from './antd' 2 | 3 | export * from './layout' 4 | -------------------------------------------------------------------------------- /src/config/layout.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * layout 配置 3 | */ 4 | 5 | /** 6 | * 侧边栏最大宽度 7 | */ 8 | export const SIDER_MAX_WIDTH = 260 9 | 10 | /** 11 | * 侧边栏自动收缩宽度 12 | */ 13 | export const SIDER_AUTO_SHRINK_WIDTH = 1000 14 | -------------------------------------------------------------------------------- /src/config/menu.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { DatabaseOutlined, WarningOutlined } from '@ant-design/icons' 3 | 4 | import { MenuProps } from '@/layout/components/AuthoritySider' 5 | 6 | /** 7 | * 侧边栏配置 8 | * 图标查询地址 https://ant.design/components/icon-cn/ 9 | */ 10 | 11 | export const menuConfig: MenuProps[] = [ 12 | { 13 | title: '首页', 14 | path: 'home', 15 | icon: 16 | }, 17 | { 18 | title: '404', 19 | path: '404', 20 | icon: 21 | } 22 | ] 23 | -------------------------------------------------------------------------------- /src/hooks/useBoolean/index.ts: -------------------------------------------------------------------------------- 1 | import { useState, useMemo } from 'react' 2 | 3 | /* 用于管理 boolean 值的 Hook */ 4 | 5 | export interface Actions { 6 | setTrue: () => void 7 | setFalse: () => void 8 | toggle: () => void 9 | } 10 | 11 | const useBoolean = (defaultValue = false): [boolean, Actions] => { 12 | const [state, setState] = useState(defaultValue) 13 | 14 | const actions: Actions = useMemo(() => { 15 | const setTrue = () => setState(true) 16 | const setFalse = () => setState(false) 17 | // 取反 18 | const toggle = () => setState((v) => !v) 19 | return { toggle, setTrue, setFalse } 20 | }, []) 21 | 22 | return [state, actions] 23 | } 24 | 25 | export default useBoolean 26 | -------------------------------------------------------------------------------- /src/index.tsx: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from 'react' 2 | import ReactDOM from 'react-dom' 3 | import { Inspector } from 'react-dev-inspector' 4 | 5 | import ErrorBoundary from '@/components/ErrorBoundary' 6 | import App from './App' 7 | import LoginContainer from '@/store/login' 8 | 9 | import * as serviceWorker from './serviceWorker' 10 | 11 | import '@/styles/index.scss' 12 | 13 | const InspectorWrapper = process.env.NODE_ENV === 'development' ? Inspector : Fragment 14 | 15 | ReactDOM.render( 16 | 17 | 18 | 19 | 20 | 21 | 22 | , 23 | document.getElementById('root') 24 | ) 25 | 26 | // If you want your app to work offline and load faster, you can change 27 | // unregister() to register() below. Note this comes with some pitfalls. 28 | // Learn more about service workers: https://bit.ly/CRA-PWA 29 | serviceWorker.unregister() 30 | -------------------------------------------------------------------------------- /src/layout/AuthorityLayout.scss: -------------------------------------------------------------------------------- 1 | .m-authoritylayout { 2 | display: flex; 3 | flex-direction: column; 4 | width: 100%; 5 | min-height: 100%; 6 | &-content { 7 | margin: 20px; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /src/layout/AuthorityLayout.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from 'react' 2 | import { Layout } from 'antd' 3 | 4 | import Header from './components/AuthorityHeader' 5 | import Sider from './components/AuthoritySider' 6 | import Footer from './components/Footer' 7 | 8 | import { SIDER_MAX_WIDTH, SIDER_AUTO_SHRINK_WIDTH } from '@/config' 9 | 10 | import './AuthorityLayout.scss' 11 | 12 | const { Content } = Layout 13 | 14 | const AuthorityLayout: React.FC = (props) => { 15 | const { children } = props 16 | 17 | const [collapsed, setCollapsed] = useState( 18 | () => window.innerWidth < SIDER_AUTO_SHRINK_WIDTH 19 | ) 20 | 21 | return ( 22 | 23 | 24 | 30 |
31 | {children} 32 |