diff --git a/web/src/App.tsx b/web/src/App.tsx
index 72342454..80244fda 100644
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -13,6 +13,10 @@ const EntryRoute = Loadable(() =>
import('./routes/Entry').then((module) => module.EntryRoute)
);
+const InviteRoute = Loadable(() =>
+ import('./routes/Invite').then((module) => module.InviteRoute)
+);
+
const AppProvider: React.FC = React.memo((props) => {
const getPopupContainer = useCallback(
(triggerNode: HTMLElement): HTMLElement => {
@@ -52,6 +56,7 @@ export const App: React.FC = React.memo(() => {
+
diff --git a/web/src/routes/Invite/index.tsx b/web/src/routes/Invite/index.tsx
new file mode 100644
index 00000000..aa7c6a73
--- /dev/null
+++ b/web/src/routes/Invite/index.tsx
@@ -0,0 +1,43 @@
+import { Button, Divider } from 'antd';
+import React, { useCallback } from 'react';
+import { useHistory, useParams } from 'react-router';
+
+/**
+ * 邀请界面路由
+ */
+export const InviteRoute: React.FC = React.memo(() => {
+ const history = useHistory();
+ const { inviteCode } = useParams<{ inviteCode: string }>();
+ const isLogin = true;
+
+ const handleRegister = useCallback(() => {
+ history.push(
+ `/entry/register?redirect=${encodeURIComponent(location.pathname)}`
+ );
+ }, []);
+
+ const handleJoinGroup = useCallback(() => {
+ // TODO
+ console.log('TODO');
+ }, []);
+
+ return (
+
+
+
{inviteCode}
+
xxx 邀请您加入
+
[群组名]
+
成员数:
+
+
+
+ {isLogin ? (
+
+ ) : (
+
+ )}
+
+
+ );
+});
+InviteRoute.displayName = 'InviteRoute';