F

src/layouts/AuthLayout/components/Header/User.jsx

-import React, { useState, forwardRef, useRef, useImperativeHandle } from 'react'
-import { Avatar, Dropdown } from 'antd'
+import React, {
+  useState,
+  forwardRef,
+  useRef,
+  useImperativeHandle,
+} from "react";
+import { Avatar, Dropdown } from "antd";
 import {
   ModalForm,
   ProFormText,
   ProFormDependency,
-} from '@ant-design/pro-components'
-import md5 from 'md5'
-import { changePassword } from '@/services/login'
+} from "@ant-design/pro-components";
+import md5 from "md5";
+import { changePassword } from "@/services/login";
+import { useNavigate } from "react-router-dom";
 
-const DefaultAvatar = ({ color = '#1296db' }) => (
+const DefaultAvatar = ({ color = "#1296db" }) => (
   <svg
     viewBox="0 0 1024 1024"
     version="1.1"
       fill={color}
     ></path>
   </svg>
-)
+);
 
 const ChangePassword = forwardRef((props, ref) => {
-  const { user } = props
+  const { user } = props;
+  const navigate = useNavigate();
 
-  const [visible, setVisible] = useState(false)
+  const [visible, setVisible] = useState(false);
 
   const onFinish = async (values) => {
-    console.log('values', values);
+    console.log("values", values);
     const data = {
       // originPassword: values.password,
       // newPassword: values.newPassword,
       originPassword: md5(values.password),
       newPassword: md5(values.newPassword),
-    }
-    await changePassword(data)
-
-    return true
-  }
+    };
+    await changePassword(data);
+    const tenantId = localStorage.getItem("tenantId");
+    navigate(`/login?id=${tenantId}`);
+    localStorage.removeItem("token");
+    return true;
+  };
 
   useImperativeHandle(ref, () => {
     return {
       show: () => setVisible(true),
-    }
-  })
+    };
+  });
 
   return (
     <ModalForm
       <ProFormText.Password
         label="原始密码"
         name="password"
-        rules={[{ required: true, message: '请输入原始密码!' }]}
+        rules={[{ required: true, message: "请输入原始密码!" }]}
       />
       <ProFormText.Password
         label="新密码"
         name="newPassword"
-        rules={[{ required: true, message: '请输入新密码!' }]}
+        rules={[{ required: true, message: "请输入新密码!" }]}
       />
 
-      <ProFormDependency name={['newPassword']}>
+      <ProFormDependency name={["newPassword"]}>
         {({ newPassword }) => (
           <ProFormText.Password
             label="确认新密码"
             name="newPassword2"
             rules={[
-              { required: true, message: '请输入新密码!' },
+              { required: true, message: "请输入新密码!" },
               () => ({
-                validator (_, value) {
+                validator(_, value) {
                   if (!value || value == newPassword) {
-                    return Promise.resolve()
+                    return Promise.resolve();
                   }
 
-                  return Promise.reject('两次输入密码不一致')
+                  return Promise.reject("两次输入密码不一致");
                 },
               }),
             ]}
         )}
       </ProFormDependency>
     </ModalForm>
-  )
-})
+  );
+});
 
 export default (props) => {
   const items = [
     {
-      key: 'changePassword',
-      label: '修改密码',
+      key: "changePassword",
+      label: "修改密码",
     },
-  ]
+  ];
 
-  const passRef = useRef()
-  const { user = {} } = props
+  const passRef = useRef();
+  const { user = {} } = props;
   const onClick = ({ key }) => {
-    if (key === 'changePassword') {
-      passRef.current.show()
+    if (key === "changePassword") {
+      passRef.current.show();
     }
-  }
+  };
   return (
     <Dropdown menu={{ items, onClick }}>
       <div className="user-info">
         <ChangePassword user={user} ref={passRef} />
       </div>
     </Dropdown>
-  )
-}
+  );
+};

src/layouts/AuthLayout/components/Menus.jsx

-import React from 'react'
-import { Menu } from 'antd'
+import React from "react";
+import { Menu } from "antd";
 
-const menuStyle = { height: '100%' }
+const menuStyle = { height: "100%" };
 
 export default (props) => {
-  const { theme, items, location } = props
+  const { theme, items, location } = props;
 
   // const selectedKeys = React.useMemo(() => {
   //   const parts = location.pathname.split('/').filter(Boolean);
 
   //   return keys;
   // }, [location.pathname]);
-  const selectedKeys = [location.pathname]
+  const selectedKeys = [location.pathname];
+
+
   return (
     <Menu
       mode="inline"
       items={items}
       selectedKeys={selectedKeys}
     />
-  )
-}
+  );
+};

src/layouts/AuthLayout/components/SiderBar.jsx

-import React, { useMemo } from 'react'
-import { Layout, Spin } from 'antd'
-import { getPropertyValue } from '@/utils/css'
-import Menus from './Menus'
+import React, { useMemo } from "react";
+import { Layout, Spin } from "antd";
+import { getPropertyValue } from "@/utils/css";
+import Menus from "./Menus";
 
-const { Sider } = Layout
+const { Sider } = Layout;
 
 export default (props) => {
-  const { theme, location, menus } = props
+  const { theme, location, menus } = props;
 
   const width = useMemo(() => {
-    return /\d+/.exec(getPropertyValue('--siderbar-width'))[0] - 0
-  }, [])
+    return /\d+/.exec(getPropertyValue("--siderbar-width"))[0] - 0;
+  }, []);
+
+  // console.log(theme);
+  // console.log(menus);
+  // console.log(location);
 
   return (
-    <Sider className="layout-sidebar" theme={theme}  collapsible width={width}>
+    <Sider className="layout-sidebar" theme={theme} collapsible width={width}>
       <Menus theme={theme} items={menus} location={location} />
     </Sider>
-  )
-}
+  );
+};

src/routes/routes.jsx

   PayCircleOutlined,
   TabletOutlined,
   HddOutlined,
-  WalletOutlined
-} from '@ant-design/icons'
-import { Outlet, Navigate } from 'react-router-dom'
-import AuthLayout from '@/layouts/AuthLayout'
-import Login from '@/pages/login'
-import Page404 from '@/pages/404'
-import AdUser from '@/pages/adUser'
-import AdUserEdit from '@/pages/adUser/Edit'
-import Project from '@/pages/project'
-import ProjectEdit from '@/pages/project/Edit'
-import ProjectContact from '@/pages/projectContact'
-import ProjectContactEdit from '@/pages/projectContact/Edit'
-import ProjectDeploy from '@/pages/projectDeploy'
-import ProjectDeployEdit from '@/pages/project/components/ProjectDeployEdit'
-import ProjectNode from '@/pages/projectNode'
+  WalletOutlined,
+  BorderInnerOutlined,
+  HeatMapOutlined,
+  MediumOutlined,
+} from "@ant-design/icons";
+import { Outlet, Navigate } from "react-router-dom";
+import AuthLayout from "@/layouts/AuthLayout";
+import Login from "@/pages/login";
+import Page404 from "@/pages/404";
+import AdUser from "@/pages/adUser";
+import AdUserEdit from "@/pages/adUser/Edit";
+import Project from "@/pages/project";
+import ProjectEdit from "@/pages/project/Edit";
+import ProjectContact from "@/pages/projectContact";
+import ProjectContactEdit from "@/pages/projectContact/Edit";
+import ProjectDeploy from "@/pages/projectDeploy";
+import ProjectDeployEdit from "@/pages/project/components/ProjectDeployEdit";
+import ProjectNode from "@/pages/projectNode";
 
-import Role from '@/pages/role'
-import Dept from '@/pages/dept'
-import Package from '@/pages/package'
-import PackageEdit from '@/pages/package/Edit'
-import Member from '@/pages/member'
-import MemberEdit from '@/pages/member/Edit'
-import Custom from '@/pages/custom'
-import CustomEdit from '@/pages/custom/Edit'
-import Finance from '@/pages/finance'
-import FinanceEdit from '@/pages/finance/Edit'
-import FinanceItem from '@/pages/financeItem'
-import FinanceItemEdit from '@/pages/financeItem/Edit'
-import Tenant from '@/pages/tenant'
-import TenantEdit from '@/pages/tenant/Edit'
+import Role from "@/pages/role";
+import Dept from "@/pages/dept";
+import Package from "@/pages/package";
+import PackageEdit from "@/pages/package/Edit";
+import Member from "@/pages/member";
+import MemberEdit from "@/pages/member/Edit";
+import Custom from "@/pages/custom";
+import CustomEdit from "@/pages/custom/Edit";
+import Finance from "@/pages/finance";
+import FinanceEdit from "@/pages/finance/Edit";
+import FinanceItem from "@/pages/financeItem";
+import FinanceItemEdit from "@/pages/financeItem/Edit";
+import Tenant from "@/pages/tenant";
+import TenantEdit from "@/pages/tenant/Edit";
 
 // import RoleEdit from "@/pages/role/Edit";
 /**
     element: <Navigate to="/aduser" replace={true} />,
   },
   {
-    path: '/custom',
+    path: "/custom",
     element: <Outlet />,
     meta: {
-      title: '客户管理',
-      menuType: 'group',
+      title: "客户管理",
+      menuType: "group",
+      icon: <HeatMapOutlined />,
     },
     children: [
       {
-        path: 'aduser',
+        path: "aduser",
         element: <AdUser />,
         meta: {
-          title: '用户管理',
+          title: "用户管理",
           icon: <SolutionOutlined />,
         },
       },
       {
-        path: 'aduser/edit',
+        path: "aduser/edit",
         element: <AdUserEdit />,
         meta: {
-          title: '用户维护',
+          title: "用户维护",
           hideInMenu: true,
         },
       },
       {
-        path: 'dept',
+        path: "dept",
         element: <Dept />,
         meta: {
-          title: '部门管理',
+          title: "部门管理",
           icon: <TabletOutlined />,
         },
       },
       {
-        path: 'tenant/edit',
+        path: "tenant/edit",
         element: <TenantEdit />,
         meta: {
-          title: '租户编辑',
+          title: "租户编辑",
           hideInMenu: true,
         },
       },
       {
-        path: 'role',
+        path: "role",
         element: <Role />,
         meta: {
-          title: '角色管理',
+          title: "角色管理",
           icon: <UserOutlined />,
         },
       },
 
       {
-        path: 'package',
+        path: "package",
         element: <Package />,
         meta: {
-          title: '套餐管理',
+          title: "套餐管理",
           icon: <HddOutlined />,
         },
       },
       {
-        path: 'package/edit',
+        path: "package/edit",
         element: <PackageEdit />,
         meta: {
-          title: '套餐维护',
+          title: "套餐维护",
           hideInMenu: true,
         },
       },
       {
-        path: 'member',
+        path: "member",
         element: <Member />,
         meta: {
-          title: '会员管理',
+          title: "会员管理",
           icon: <WalletOutlined />,
         },
       },
       {
-        path: 'member/edit',
+        path: "member/edit",
         element: <MemberEdit />,
         meta: {
-          title: '会员详情',
+          title: "会员详情",
           hideInMenu: true,
         },
-      }
-    ]
+      },
+    ],
   },
   {
-    path: '/project',
+    path: "/project",
     element: <Outlet />,
     meta: {
-      title: '项目管理',
-      menuType: 'group',
+      title: "项目管理",
+      menuType: "group",
+      icon: <BorderInnerOutlined />,
     },
     children: [
       {
-        path: 'project',
+        path: "project",
         element: <Project />,
         meta: {
-          title: '项目管理',
+          title: "项目管理",
           icon: <FileTextOutlined />,
         },
       },
       {
-        path: 'project/edit',
+        path: "project/edit",
         element: <ProjectEdit />,
         meta: {
-          title: '项目维护',
+          title: "项目维护",
           hideInMenu: true,
         },
       },
       {
-        path: 'projectDeploy/edit',
+        path: "projectDeploy/edit",
         element: <ProjectDeployEdit />,
         meta: {
-          title: '部署维护',
+          title: "部署维护",
           hideInMenu: true,
         },
       },
       {
-        path: 'projectContact',
+        path: "projectContact",
         element: <ProjectContact />,
         meta: {
-          title: '项目联系人管理',
+          title: "项目联系人管理",
           icon: <UserAddOutlined />,
         },
       },
       {
-        path: 'projectContact/edit',
+        path: "projectContact/edit",
         element: <ProjectContactEdit />,
         meta: {
-          title: '项目联系人维护',
+          title: "项目联系人维护",
           hideInMenu: true,
         },
       },
 
       {
-        path: 'custom',
+        path: "custom",
         element: <Custom />,
         meta: {
-          title: '客户管理',
+          title: "客户管理",
           icon: <UsergroupAddOutlined />,
         },
       },
       {
-        path: 'custom/edit',
+        path: "custom/edit",
         element: <CustomEdit />,
         meta: {
-          title: '客户维护',
+          title: "客户维护",
           hideInMenu: true,
         },
       },
-    ]
+    ],
   },
   {
-    path: '/finance',
+    path: "/finance",
     element: <Outlet />,
     meta: {
-      title: '财务管理',
-      menuType: 'group',
+      title: "财务管理",
+      menuType: "group",
+      icon: <MediumOutlined />,
     },
     children: [
-      ,
       {
-        path: 'finance',
+        path: "finance",
         element: <Finance />,
         meta: {
-          title: '公司财务管理',
+          title: "公司财务管理",
           icon: <TransactionOutlined />,
         },
       },
       {
-        path: 'finance/edit',
+        path: "finance/edit",
         element: <FinanceEdit />,
         meta: {
-          title: '财务维护',
+          title: "财务维护",
           hideInMenu: true,
         },
       },
       {
-        path: 'financeItem',
+        path: "financeItem",
         element: <FinanceItem />,
         meta: {
-          title: '收付款管理',
+          title: "收付款管理",
           icon: <PayCircleOutlined />,
         },
       },
       {
-        path: 'financeItem/edit',
+        path: "financeItem/edit",
         element: <FinanceItemEdit />,
         meta: {
-          title: '收付款维护',
+          title: "收付款维护",
           hideInMenu: true,
         },
       },
-    ]
+    ],
   },
 
-
-
   // {
   //   path: 'projectDeploy',
   //   element: <ProjectDeploy />,
   //     icon: <UserOutlined />,
   //   },
   // },
-
-]
+];
 
 export const defaultRoutes = [
   {
-    path: '/',
+    path: "/",
     element: <AuthLayout />,
     children: [
       {
-        path: '*',
+        path: "*",
         element: <Page404 />,
       },
     ],
   },
   {
-    path: '/login',
+    path: "/login",
     element: <Login />,
   },
   {
-    path: '*',
+    path: "*",
     element: <Page404 />,
   },
-]
+];
 
-export function mergeAuthRoutes (r1, r2) {
-  const r = r1.slice()
-  const children = r1[0].children.slice()
-  r[0].children = children.concat(r2)
-  return r
+export function mergeAuthRoutes(r1, r2) {
+  const r = r1.slice();
+  const children = r1[0].children.slice();
+  r[0].children = children.concat(r2);
+  return r;
 }
 
 // 全部路由
-export const routes = mergeAuthRoutes(defaultRoutes, authRoutes)
-function getPath (parent = '/', current = '') {
-  if (current.indexOf('/') === 0 || current.indexOf('http') === 0)
-    return current
-  return `${parent}/${current}`.replace(/\/\//g, '/')
+export const routes = mergeAuthRoutes(defaultRoutes, authRoutes);
+function getPath(parent = "/", current = "") {
+  if (current.indexOf("/") === 0 || current.indexOf("http") === 0)
+    return current;
+  return `${parent}/${current}`.replace(/\/\//g, "/");
 }
 
 // 路由数组, 一维数组
 export const routeArr = (() => {
-  const flatten = (routes, parentPath = '/') => {
+  const flatten = (routes, parentPath = "/") => {
     return routes.reduce((acc, route) => {
-      const path = getPath(parentPath, route.path)
-      const children = route.children ? flatten(route.children, path) : []
+      const path = getPath(parentPath, route.path);
+      const children = route.children ? flatten(route.children, path) : [];
 
-      return acc.concat([{ ...route, path }].concat(children))
-    }, [])
-  }
+      return acc.concat([{ ...route, path }].concat(children));
+    }, []);
+  };
 
-  return flatten(routes)
-})()
+  return flatten(routes);
+})();