第一次提交

2025-05-09 15:47:54 +08:00
parent 25e596b591
commit f9d7986df0
357 changed files with 26943 additions and 0 deletions
@@ -0,0 +1,149 @@
+import promptAction from '@ohos.promptAction';
+import { router } from '@kit.ArkUI';
+
+@Preview
+@Component
+export struct ForgetPasswordComp {
+  @State phoneNumber: string = ''
+  @State smsCode: string = ''
+  @State password: string = ''
+  @State showPassword: boolean = false
+  @State countdown: number = 0
+  @State passWordSrc1: Resource = $r('app.media.icon_forgetpassword_show');
+  @State passWordSrc2: Resource = $r('app.media.icon_forgetpassword');
+
+  // 验证码倒计时
+  private startCountdown() {
+    this.countdown = 60
+    const timer = setInterval(() => {
+      if (this.countdown > 0) {
+        this.countdown--
+      } else {
+        clearInterval(timer)
+      }
+    }, 1000)
+  }
+
+  build() {
+    Column() {
+      Row() {
+        Image($r('app.media.icon_phone'))
+          .width(18)
+          .height(18)
+          .objectFit(ImageFit.Contain)
+          .margin({left:10})
+        // 手机号输入框
+        TextInput({ placeholder: '请输入手机号码' })
+          .fontSize(16)
+          .backgroundColor(Color.White)
+          .onChange((value: string) => {
+            this.phoneNumber = value
+          })
+      }
+      .margin({ top: 10 })
+      .width('95%')
+      .height(48)
+      .borderRadius(4)
+      .borderWidth(1)
+      .borderColor('#CCCCCC')
+
+      // 验证码输入区域
+      Row() {
+        Row() {
+          Image($r('app.media.icon_verification_code'))
+            .width(18)
+            .height(18)
+            .objectFit(ImageFit.Contain)
+            .margin({left:10})
+          TextInput({ placeholder: '请输入验证码' })
+            .fontSize(16)
+            .backgroundColor(Color.White)
+        }
+        .margin({ top: 10 })
+        .width('60%')
+        .height(48)
+        .borderRadius(4)
+        .borderWidth(1)
+        .borderColor('#CCCCCC')
+
+        Button({type:ButtonType.Normal}){
+          Text(this.countdown ? `${this.countdown}s` : '获取验证码')
+        }
+        .width('37%')
+        .height(32)
+        .borderRadius(5)
+        .borderColor($r('app.color.main_color'))
+        .borderWidth(1)
+        .backgroundColor(Color.White)
+        .fontColor($r('app.color.main_color'))
+        .fontSize(12)
+        .margin({ top: 10 })
+        .enabled(this.countdown === 0)
+        .onClick(() => {
+          if (this.phoneNumber.length >= 11) {
+            this.startCountdown()
+          } else {
+            promptAction.showToast({message:'请输入手机号'})
+          }
+        })
+      }
+      .width('95%')
+      .justifyContent(FlexAlign.SpaceBetween)
+
+      Row() {
+        Image($r('app.media.icon_forgetpassword_show'))
+          .width(18)
+          .height(18)
+          .objectFit(ImageFit.Contain)
+          .margin({left:10})
+        // 密码输入框
+        TextInput({ placeholder: '6~16位数字字母组合' })
+          .fontSize(16)
+          .width('95%')
+          .backgroundColor(Color.White)
+          .type(this.showPassword ? InputType.Normal : InputType.Password)
+          .passwordIcon({ onIconSrc: this.passWordSrc1, offIconSrc: this.passWordSrc2 })
+      }
+      .margin({ top: 10 })
+      .width('95%')
+      .height(48)
+      .borderRadius(4)
+      .borderWidth(1)
+      .borderColor('#CCCCCC')
+
+      // 登录按钮
+      Button({type:ButtonType.Normal}){
+        Text('登 录')
+      }
+        .width('90%')
+        .height(48)
+        .margin({ top: 40 })
+        .borderRadius(8)
+        .backgroundColor($r('app.color.main_color'))
+        .fontColor('#FFFFFF')
+        .fontSize(18)
+        .onClick(() => {
+          // 处理登录逻辑
+          if (!/^1[3-9]\d{9}$/.test(this.phoneNumber)) {
+            promptAction.showToast({message:'请输入有效手机号'})
+            return
+          }
+
+          if (!this.smsCode) {
+            promptAction.showToast({message:'请输入验证码'})
+            return
+          }
+
+          if (!/^(?=.*[a-zA-Z])(?=.*\d)[\w]{6,16}$/.test(this.password)) {
+            promptAction.showToast({message:'密码格式不正确'})
+            return
+          }
+
+          // 执行登录操作...
+        })
+    }
+    .width('100%')
+    .height('100%')
+    .backgroundColor('#FFFFFF')
+  }
+}