feat: 友盟deepLink

src/page/RegisterPageBak.tsx

@@ -0,0 +1,174 @@
+// RegisterPage.js
+import { Button, Form, Input, Toast, Image } from "antd-mobile";
+import React, { useEffect } from "react";
+import { useNavigate, useParams } from "react-router-dom";
+import { api } from "../api";
+import { MatrixAppBo, RegisterBo } from "../api/generated";
+
+const RegisterPage = () => {
+  const [count, setCount] = React.useState(60);
+  const [app, setApp] = React.useState<MatrixAppBo>();
+  const [form] = Form.useForm();
+  const navigate = useNavigate();
+  const { inviteCode } = useParams();
+
+  const onFinish = async (values: RegisterBo) => {
+    const data = form.getFieldsValue();
+    if (data.pwd !== data.confirmPassword) {
+      Toast.show({
+        content: "密码不一致，请重新输入",
+      });
+      return;
+    }
+    const res = await api.submitRegister(values);
+    if (res.data.code !== 0) {
+      Toast.show({
+        content: res.data.message,
+      });
+      return;
+    }
+    Toast.show({
+      content: "注册成功",
+    });
+    navigate("/download/" + inviteCode);
+  };
+
+  const send = async () => {
+    const values = form.getFieldsValue();
+    const mobile: string = values.mobile;
+    if (!mobile) {
+      Toast.show({
+        content: "请输入手机号",
+      });
+      return;
+    }
+    const res = await api.sendCode(mobile, "register");
+    if (res.data.code !== 0) {
+      Toast.show({
+        content: res.data.message,
+      });
+      return;
+    }
+    Toast.show({
+      content: "验证码发送成功:" + mobile,
+    });
+    startCountdown();
+  };
+
+  const startCountdown = () => {
+    setCount(60);
+    const timer = setInterval(() => {
+      setCount((count) => count - 1);
+    }, 1000);
+    setTimeout(() => {
+      clearInterval(timer);
+      setCount(60);
+    }, 60000);
+  };
+
+  useEffect(() => {
+    const getApp = async () => {
+      if (!inviteCode) {
+        return;
+      }
+      const res = await api.getApp(inviteCode);
+      if (res.data.code !== 0) {
+        Toast.show({
+          content: res.data.message,
+        });
+        return;
+      }
+      setApp(res.data.data);
+    };
+    getApp();
+  }, [inviteCode]);
+
+  return (
+    <div style={{ maxWidth: 500, margin: "auto" }}>
+      <Image
+        style={{ margin: "auto", paddingTop: 20 }}
+        src={app?.img}
+        width={100}
+        height={100}
+      />
+      <p style={{ textAlign: "center", fontSize: 20, fontWeight: "bold" }}>
+        {app?.name}
+      </p>
+      <Form
+        onFinish={onFinish}
+        layout="horizontal"
+        mode="card"
+        form={form}
+        initialValues={{ inviteCode: inviteCode }}
+      >
+        <Form.Item
+          name="mobile"
+          label="手机号"
+          rules={[
+            { required: true, message: "请输入手机号" },
+            { pattern: /^1\d{10}$/, message: "手机号格式错误" },
+          ]}
+        >
+          <Input placeholder="请输入手机号" maxLength={11} />
+        </Form.Item>
+        <Form.Item
+          name="code"
+          label="短信验证码"
+          extra={
+            <Button
+              size="small"
+              color="primary"
+              onClick={send}
+              disabled={count !== 60}
+            >
+              {count === 60 ? "发送验证码" : `${count}s`}
+            </Button>
+          }
+          rules={[{ required: true, message: "请输入短信验证码!" }]}
+        >
+          <Input />
+        </Form.Item>
+        <Form.Item
+          name="pwd"
+          label="密码"
+          rules={[{ required: true, message: "请输入密码" }]}
+        >
+          <Input
+            minLength={8}
+            type="password"
+            placeholder="请输入密码，最少8位"
+          />
+        </Form.Item>
+        <Form.Item
+          name="confirmPassword"
+          label="确认密码"
+          rules={[
+            { required: true, message: "请再次输入密码" },
+            {
+              validator: (rules, value, callback) => {
+                let pwd = form.getFieldValue("pwd");
+                if (pwd && pwd !== value) {
+                  callback("密码不一致");
+                } else {
+                  callback();
+                }
+              },
+            },
+          ]}
+        >
+          <Input minLength={8} type="password" placeholder="请再次输入密码" />
+        </Form.Item>
+        <Form.Item name="inviteCode" label="邀请码" disabled>
+          <Input />
+        </Form.Item>
+        <Form.Item>
+          <Button color="primary" block type="submit">
+            注册
+          </Button>
+        </Form.Item>
+      </Form>
+    </div>
+  );
+};
+
+export default RegisterPage;