diff --git a/src/pages/group/index.scss b/src/pages/group/index.scss
index e69de29..b2d9b98 100644
--- a/src/pages/group/index.scss
+++ b/src/pages/group/index.scss
@@ -0,0 +1,13 @@
+.group{
+ padding: 40px;
+
+ .formCode{
+ display: flex;
+ flex-direction: row;
+ .codeBtn{
+ background-color: aquamarine;
+ // height: 80px;
+ // color: red;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/group/index.tsx b/src/pages/group/index.tsx
index 2085adf..e04aa09 100644
--- a/src/pages/group/index.tsx
+++ b/src/pages/group/index.tsx
@@ -1,7 +1,8 @@
+// @ts-nocheck
import { Component } from "react";
import { View, Text, Image } from "@tarojs/components";
import "./index.scss";
-import { AtTabBar } from "taro-ui";
+import { AtButton, AtInput, AtTabBar } from "taro-ui";
import React, { useCallback, useEffect, useState } from "react";
import { AtGrid } from "taro-ui";
import { Swiper, SwiperItem } from "@tarojs/components";
@@ -11,11 +12,16 @@ import Taro from "@tarojs/taro";
import { AtAvatar } from "taro-ui";
import { AtTag } from "taro-ui";
import { AtList, AtListItem } from "taro-ui";
+import { AtForm, AtMessage } from "taro-ui";
// export default class Index extends Component {
const Group = () => {
const [current, setcurrent] = useState(2);
const [wxid, setwxid] = useState(null);
+ const [phoneNum, setphoneNum] = useState(null);
+ const [vCode, setvCode] = useState(null);
+ const [waitTime, setWaitTime] = useState(0); // 等待秒数
+ const [isButtonDisabled, setIsButtonDisabled] = useState(false); // 按钮是否禁用
useEffect(() => {}, []);
@@ -26,7 +32,99 @@ const Group = () => {
});
};
- return qqq;
+ const startTimer = () => {
+ setIsButtonDisabled(true);
+ let localWaitTime = 60; // 使用局部变量
+
+ // 更新状态的函数
+ const updateTime = () => {
+ if (localWaitTime <= 0) {
+ clearInterval(timer);
+ setIsButtonDisabled(false);
+ setWaitTime(0);
+ } else {
+ setWaitTime(localWaitTime);
+ localWaitTime -= 1;
+ }
+ };
+
+ // 设定计时器
+ const timer = setInterval(updateTime, 1000);
+ // 初始调用
+ updateTime();
+ };
+
+ const validatePhoneNumber=(phoneNum) =>{
+ // 检查是否为11位数字
+ const phoneRegex = /^[0-9]{11}$/;
+ return phoneRegex.test(phoneNum);
+ }
+
+
+ return (
+
+ {
+ console.log("onSubmit-event--", event[0]?.detail?.value);
+ }}
+ onReset={(event) => {
+ // 重置数据
+ }}
+ >
+ {
+ console.log("value", value);
+ setphoneNum(value);
+ }}
+ />
+
+ {
+ setvCode(value);
+ }}
+ />
+ {
+ if (!!phoneNum & !!validatePhoneNumber(phoneNum)) {
+ // 提交手机数据
+ setIsButtonDisabled(true);
+ startTimer(); // 开始防抖计时
+ } else {
+ Taro.atMessage({
+ message: "请检查手机号",
+ type: `warning`,
+ });
+ }
+ }}
+ // type="primary"
+ disabled={isButtonDisabled}
+ >
+ {isButtonDisabled ? `${waitTime} 秒` : "获取"}
+
+
+
+
+ {"提交"}
+
+
+
+
+
+ );
};
export default Group;