整体样式修改

config/config.js

@@ -71,7 +71,7 @@ export default defineConfig({
               routes: [
                 {
                   path: '/system/role',
-                  name: 'role',
+                  name: '角色管理',
                   icon: 'SolutionOutlined',
                   component: './role',
                 },

src/components/GlobalFooter/index.jsx

+import React from 'react';
+import './style.less';
+
+const GlobalFooter = () => {
+  return (
+    <div className="sage-global-footer">
+      © 2020 江苏圣捷远创科技有限公司版权所有 ⋅ 苏ICP备17030519号
+    </div>
+  );
+};
+
+export default GlobalFooter;

src/components/GlobalFooter/style.less

+.sage-global-footer {
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  height: 40px;
+  margin-left: -24px;
+  padding-left: 10px;
+  line-height: 40px;
+  background: #f0f2f5;
+  border-top: 1px solid #e7eaec;
+}

src/components/TabBar/style.less

 .sage-tabbar {
+  position: fixed;
+  z-index: 3;
   display: flex;
+  width: calc(100% - 256px);
   height: 40px;
   margin: -24px -24px -4px;
   background: #fff;

src/global.less

@@ -43,7 +43,28 @@ ol {
 }
 
 .ant-pro-basicLayout-content .ant-pro-page-header-wrap {
-  margin-top: 0px !important;
+  margin-top: 24px !important;
+  padding-bottom: 40px;
+}
+
+.ant-layout-header {
+  position: fixed;
+  top: 0;
+  width: calc(100% - 256px) !important;
+}
+
+.ant-pro-basicLayout-content {
+  position: absolute;
+  top: 64px;
+  width: calc(100% - 48px);
+}
+
+.ant-layout-footer {
+  display: none;
+}
+
+.ant-table-pagination-right {
+  margin-right: 10px !important;
 }
 
 // 公共样式
@@ -53,8 +74,6 @@ ol {
 
 // 新增组件样式
 
-
-
 @media (max-width: @screen-xs) {
   .ant-table {
     width: 100%;

src/layouts/BasicLayout.jsx

@@ -11,6 +11,7 @@ import { Result, Button } from 'antd';
 import Authorized from '@/utils/Authorized';
 import RightContent from '@/components/GlobalHeader/RightContent';
 import TabBar from '@/components/TabBar';
+import GlobalFooter from '@/components/GlobalFooter';
 import { getAuthorityFromRouter } from '@/utils/utils';
 import logo from '../assets/logo.svg';
 
@@ -152,8 +153,11 @@ const BasicLayout = (props) => {
     >
       <TabBar ref={tabBarRef} currentUser={currentUser} />
       <Authorized authority={authorized.authority} noMatch={noMatch}>
-        <KeepAliveLayout {...props}>{children}</KeepAliveLayout>
+        <div style={{ position: 'absolute', top: 0, bottom: 0, left: 0, right: 0 }}>
+          <KeepAliveLayout {...props}>{children}</KeepAliveLayout>
+        </div>
       </Authorized>
+      <GlobalFooter />
     </ProLayout>
   );
 };