diff --git a/.env.development b/.env.development
index cf33834..b01cd99 100644
--- a/.env.development
+++ b/.env.development
@@ -18,3 +18,6 @@ VITE_APP_TOKEN_KEY='schisandra'
# the upload url
VITE_UPLOAD_URL='http://127.0.0.1:3000'
+
+# the websocket url
+VITE_WEB_SOCKET_URL='ws://127.0.0.1:3010/wx/socket'
diff --git a/src/App.tsx b/src/App.tsx
deleted file mode 100644
index c350d53..0000000
--- a/src/App.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-/** @format */
-
-import routes from "@/router/routes.ts";
-import { RouterGuard } from "@/router/guard.ts";
-
-function App() {
- return {RouterGuard(routes)}
;
-}
-
-export default App;
diff --git a/src/components/Main/Bucket/index.tsx b/src/components/Main/Bucket/index.tsx
new file mode 100644
index 0000000..d526060
--- /dev/null
+++ b/src/components/Main/Bucket/index.tsx
@@ -0,0 +1,7 @@
+/** @format */
+import { FunctionComponent } from "react";
+
+const Bucket: FunctionComponent = () => {
+ return 存储桶
;
+};
+export default Bucket;
diff --git a/src/components/Main/File/index.tsx b/src/components/Main/File/index.tsx
new file mode 100644
index 0000000..8c8a362
--- /dev/null
+++ b/src/components/Main/File/index.tsx
@@ -0,0 +1,7 @@
+/** @format */
+import { FunctionComponent } from "react";
+
+const File: FunctionComponent = () => {
+ return 文件管理
;
+};
+export default File;
diff --git a/src/components/Main/Home/index.tsx b/src/components/Main/Home/index.tsx
new file mode 100644
index 0000000..58c6069
--- /dev/null
+++ b/src/components/Main/Home/index.tsx
@@ -0,0 +1,7 @@
+/** @format */
+import { FunctionComponent } from "react";
+
+const MainHome: FunctionComponent = () => {
+ return 首页
;
+};
+export default MainHome;
diff --git a/src/components/Main/User/index.tsx b/src/components/Main/User/index.tsx
new file mode 100644
index 0000000..8d5e613
--- /dev/null
+++ b/src/components/Main/User/index.tsx
@@ -0,0 +1,7 @@
+/** @format */
+import { FunctionComponent } from "react";
+
+const User: FunctionComponent = () => {
+ return 用户中心
;
+};
+export default User;
diff --git a/src/main.tsx b/src/main.tsx
index ac37b61..0fef842 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -5,13 +5,12 @@ import "./assets/styles/index.less";
import "virtual:svg-icons-register";
import { Provider as MobxProvider } from "mobx-react";
import { RootStore } from "@/store";
-import { BrowserRouter } from "react-router-dom";
-import App from "@/App.tsx";
+import routeConfig from "@/router/routes.ts";
+import { createBrowserRouter, RouterProvider } from "react-router-dom";
+const router = createBrowserRouter(routeConfig);
ReactDOM.createRoot(document.getElementById("root")!).render(
-
-
-
+
,
);
diff --git a/src/router/guard.ts b/src/router/guard.ts
deleted file mode 100644
index 6c9a523..0000000
--- a/src/router/guard.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-/** @format */
-
-import { useEffect } from "react";
-import {
- Location,
- NavigateFunction,
- RouteObject,
- useLocation,
- useNavigate,
- useRoutes,
-} from "react-router-dom";
-
-/**
- * 递归查询对应的路由
- * @param path
- * @param routes
- */
-export function searchRouteDetail(path: string, routes: RouteObject[]): RouteObject | null {
- for (const item of routes) {
- if (item.path === path) return item;
- if (item.children) {
- return searchRouteDetail(path, item.children);
- }
- }
- return null;
-}
-
-/**
- * 全局路由守卫
- * @param location
- * @param navigate
- * @param routes
- */
-async function guard(location: Location, navigate: NavigateFunction, routes: RouteObject[]) {
- const { pathname } = location;
-
- //找到对应的路由信息
- const routerDetail: RouteObject | null = searchRouteDetail(pathname, routes);
-
- //没有找到路由，跳转404
- if (!routerDetail) {
- navigate("/404");
- return false;
- }
- //如果需要权限验证
- // if (
- // routerDetail.path !== "/login" &&
- // routerDetail.path !== "/register" &&
- // routerDetail.path !== "/" &&
- // routerDetail.path !== "/404" &&
- // routerDetail.path !== "/forget"
- // ) {
- // const token: string | null = getStorageFromKey("token");
- // if (!token) {
- // message.warning("请先登录！").then();
- // navigate("/login");
- // return false;
- // }
- // }
- return true;
-}
-
-/**
- * 路由守卫
- * @param routes
- * @constructor
- */
-export const RouterGuard = (routes: RouteObject[]) => {
- const location: Location = useLocation();
- const navigate: NavigateFunction = useNavigate();
- useEffect(() => {
- guard(location, navigate, routes).then();
- }, [location, navigate, routes]);
- return useRoutes(routes);
-};
diff --git a/src/router/modules/main/bucket/index.ts b/src/router/modules/main/bucket/index.ts
new file mode 100644
index 0000000..0f8efb8
--- /dev/null
+++ b/src/router/modules/main/bucket/index.ts
@@ -0,0 +1,11 @@
+/** @format */
+
+import { lazy } from "react";
+
+const MainBucket = lazy(
+ () =>
+ new Promise((resolve: any) => {
+ setTimeout(() => resolve(import("@/components/Main/Bucket")), 500);
+ }),
+);
+export default MainBucket;
diff --git a/src/router/modules/main/file/index.ts b/src/router/modules/main/file/index.ts
new file mode 100644
index 0000000..669e0b4
--- /dev/null
+++ b/src/router/modules/main/file/index.ts
@@ -0,0 +1,11 @@
+/** @format */
+
+import { lazy } from "react";
+
+const MainFile = lazy(
+ () =>
+ new Promise((resolve: any) => {
+ setTimeout(() => resolve(import("@/components/Main/File")), 500);
+ }),
+);
+export default MainFile;
diff --git a/src/router/modules/main/home/index.ts b/src/router/modules/main/home/index.ts
new file mode 100644
index 0000000..29eed58
--- /dev/null
+++ b/src/router/modules/main/home/index.ts
@@ -0,0 +1,11 @@
+/** @format */
+
+import { lazy } from "react";
+
+const MainHome = lazy(
+ () =>
+ new Promise((resolve: any) => {
+ setTimeout(() => resolve(import("@/components/Main/Home")), 500);
+ }),
+);
+export default MainHome;
diff --git a/src/router/modules/main/user/index.ts b/src/router/modules/main/user/index.ts
new file mode 100644
index 0000000..1ada381
--- /dev/null
+++ b/src/router/modules/main/user/index.ts
@@ -0,0 +1,11 @@
+/** @format */
+
+import { lazy } from "react";
+
+const MainUser = lazy(
+ () =>
+ new Promise((resolve: any) => {
+ setTimeout(() => resolve(import("@/components/Main/User")), 500);
+ }),
+);
+export default MainUser;
diff --git a/src/router/routes.ts b/src/router/routes.ts
index 5347edc..e438364 100644
--- a/src/router/routes.ts
+++ b/src/router/routes.ts
@@ -10,6 +10,10 @@ import ComponentLoading from "@/components/ComponentLoading";
import Loading from "./modules/loading";
import Forget from "@/router/modules/forget";
import Home from "@/router/modules/home";
+import MainHome from "@/router/modules/main/home";
+import MainBucket from "@/router/modules/main/bucket";
+import MainFile from "@/router/modules/main/file";
+import MainUser from "@/router/modules/main/user";
const routes: RouteObject[] = [
{
@@ -35,6 +39,25 @@ const routes: RouteObject[] = [
{
path: "/main",
Component: (props) => ComponentLoading(Main, props),
+ children: [
+ {
+ index: true,
+ path: "/main/home",
+ Component: MainHome,
+ },
+ {
+ path: "/main/bucket",
+ Component: MainBucket,
+ },
+ {
+ path: "/main/file",
+ Component: MainFile,
+ },
+ {
+ path: "/main/user",
+ Component: MainUser,
+ },
+ ],
},
{
path: "/home",
diff --git a/src/views/Main/_defaultProps.tsx b/src/views/Main/_defaultProps.tsx
new file mode 100644
index 0000000..88d81e0
--- /dev/null
+++ b/src/views/Main/_defaultProps.tsx
@@ -0,0 +1,86 @@
+/** @format */
+
+import { SmileFilled } from "@ant-design/icons";
+
+export default {
+ route: {
+ path: "/",
+ routes: [
+ {
+ path: "main/home",
+ name: "首 页",
+ icon: ,
+ },
+ {
+ path: "main/bucket",
+ name: "存储桶",
+ icon: ,
+ },
+ {
+ path: "main/file",
+ name: "文件管理",
+ icon: ,
+ },
+ {
+ path: "main/user",
+ name: "个人中心",
+ icon: ,
+ },
+ ],
+ },
+ location: {
+ pathname: "/",
+ },
+ appList: [
+ {
+ icon: "https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg",
+ title: "Ant Design",
+ desc: "杭州市较知名的 UI 设计语言",
+ url: "https://ant.design",
+ },
+ {
+ icon: "https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png",
+ title: "AntV",
+ desc: "蚂蚁集团全新一代数据可视化解决方案",
+ url: "https://antv.vision/",
+ target: "_blank",
+ },
+ {
+ icon: "https://gw.alipayobjects.com/zos/antfincdn/upvrAjAPQX/Logo_Tech%252520UI.svg",
+ title: "Pro Components",
+ desc: "专业级 UI 组件库",
+ url: "https://procomponents.ant.design/",
+ },
+ {
+ icon: "https://img.alicdn.com/tfs/TB1zomHwxv1gK0jSZFFXXb0sXXa-200-200.png",
+ title: "umi",
+ desc: "插件化的企业级前端应用框架。",
+ url: "https://umijs.org/zh-CN/docs",
+ },
+
+ {
+ icon: "https://gw.alipayobjects.com/zos/bmw-prod/8a74c1d3-16f3-4719-be63-15e467a68a24/km0cv8vn_w500_h500.png",
+ title: "qiankun",
+ desc: "可能是你见过最完善的微前端解决方案🧐",
+ url: "https://qiankun.umijs.org/",
+ },
+ {
+ icon: "https://gw.alipayobjects.com/zos/rmsportal/XuVpGqBFxXplzvLjJBZB.svg",
+ title: "语雀",
+ desc: "知识创作与分享工具",
+ url: "https://www.yuque.com/",
+ },
+ {
+ icon: "https://gw.alipayobjects.com/zos/rmsportal/LFooOLwmxGLsltmUjTAP.svg",
+ title: "Kitchen ",
+ desc: "Sketch 工具集",
+ url: "https://kitchen.alipay.com/",
+ },
+ {
+ icon: "https://gw.alipayobjects.com/zos/bmw-prod/d3e3eb39-1cd7-4aa5-827c-877deced6b7e/lalxt4g3_w256_h256.png",
+ title: "dumi",
+ desc: "为组件开发场景而生的文档工具",
+ url: "https://d.umijs.org/zh-CN",
+ },
+ ],
+};
diff --git a/src/views/Main/index.tsx b/src/views/Main/index.tsx
index 275a498..790fd17 100644
--- a/src/views/Main/index.tsx
+++ b/src/views/Main/index.tsx
@@ -1,14 +1,57 @@
/** @format */
-import DefaultLayOut from "@/layout/default";
-import { useEffect } from "react";
-import { observer } from "mobx-react";
+import { GithubFilled, InfoCircleFilled, QuestionCircleFilled } from "@ant-design/icons";
+import { PageContainer, ProCard, ProLayout } from "@ant-design/pro-components";
+import { useState } from "react";
+import defaultProps from "./_defaultProps";
+import { Link, Outlet } from "react-router-dom";
+
+export default () => {
+ const [pathname, setPathname] = useState("/mainRouter/homeRouter");
-export default observer(() => {
- useEffect(() => {}, []);
return (
- <>
-
-
+
+
{
+ if (menuItemProps.isUrl || !menuItemProps.path) {
+ return defaultDom;
+ }
+ return {defaultDom};
+ }}
+ {...defaultProps}
+ location={{
+ pathname,
+ }}
+ avatarProps={{
+ src: "https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg",
+ title: "七妮妮",
+ size: "small",
+ }}
+ actionsRender={(props) => {
+ if (props.isMobile) return [];
+ return [
+ ,
+ ,
+ ,
+ ];
+ }}>
+
+
+
+
+
+
+
+
+