YT_TEST/features/user/src/main/ets/components/LoginInput.ets

import { IBestToast, YTRequest } from 'basic'
import { CodeInputType } from '../models'

@Component
export struct LoginInput {
  item?: CodeInputType
  mgBottom: number = 24
  @Link inputData: string
  @Prop phoneNumber: string
  code: string = ''
  @State time: number = 61
  needCode: boolean = true
  private declare sa: number

  aboutToDisappear(): void {
    clearInterval(this.sa)
  }

  build() {
    Row({ space: 8 }) {
      Text(this.item?.txt)
        .width(73)
        .height(31)
        .fontSize(12)
        .border({ width: { bottom: 1 }, color: $r('[basic].color.main_na_color') })
        .textAlign(TextAlign.Start)
        .fontColor(Color.Black)
      TextInput({ placeholder: this.item?.placeHolder, text: $$this.inputData })
        .layoutWeight(1)
        .type(InputType.PhoneNumber)
        .borderRadius(0)
        .border({ width: { bottom: 1 }, color: $r('[basic].color.main_na_color') })
        .textAlign(TextAlign.Start)
        .height(31)
        .placeholderFont({ size: 12 })
        .placeholderColor($r('[basic].color.main_na_color'))
        .backgroundColor(Color.Transparent)
        .padding(0)
        .caretColor($r('[basic].color.main_ac_color_dark'))
      if (this.needCode) {
        Text(this.time == 61 ? '获取验证码' : this.time + '后重新发送')
          .position({ right: 0 })
          .height(31)
          .fontSize(12)
          .fontColor($r('[basic].color.main_ac_color_dark'))
          .onClick(() => {
            const rep = new RegExp('^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\\d{8}$');
            if (this.phoneNumber.match(rep) && this.time == 61) {
              this.time = 60
              this.sa = setInterval(() => {
                this.time--
                if (this.time < 1) {
                  this.time = 61
                  clearInterval(this.sa)
                }
              }, 1000)
              // TODO  此处放置验证码获取逻辑
              YTRequest.getCaptcha(this.phoneNumber, (res) => {
                if (!res) {
                  IBestToast.show({ message: '请勿重复发送验证码' })
                  return
                }

                AppStorage.setOrCreate<string>('uuid', res)
              }, (err) => {
                IBestToast.show({ message: '验证码发送失败' })
                this.time = 61
              })
              // YTRequest.post<CodeType, AskCodeNum>('/api/friendcase/member/sendSmsCode',
              //   { phonenumber: this.phoneNumber })
              //   .then(res => {
              //     if (!res) {
              //       IBestToast.show({ type: 'warning', message: '请勿重复发送验证码' })
              //       return
              //     }
              //
              //     AppStorage.setOrCreate<CodeType>('smsCode', res)
              //   })
              //   .catch((err: Error) => {
              //     IBestToast.show({ type: 'fail', message: '验证码发送失败' })
              //     this.time = 61
              //   })
            } else {
              if (!this.phoneNumber.match(rep)) {
                IBestToast.show({ message: '请输入正确的手机号' })
              }
            }
          })
          .enabled(this.time == 61)
      }

    }
    .margin({ bottom: this.mgBottom })
  }
}