LoginInput.ets 3.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. import { IBestToast, yTRequest } from 'basic'
  2. import { CodeInputType } from '../models'
  3. @Component
  4. export struct LoginInput {
  5. item?: CodeInputType
  6. mgBottom: number = 24
  7. @Link inputData: string
  8. @Prop phoneNumber: string
  9. code: string = ''
  10. @State time: number = 61
  11. private declare sa: number
  12. needCode: boolean = true
  13. aboutToDisappear(): void {
  14. clearInterval(this.sa)
  15. }
  16. build() {
  17. Row({ space: 8 }) {
  18. Text(this.item?.txt)
  19. .width(73)
  20. .height(31)
  21. .fontSize(12)
  22. .border({ width: { bottom: 1 }, color: $r('[basic].color.main_na_color') })
  23. .textAlign(TextAlign.Start)
  24. TextInput({ placeholder: this.item?.placeHolder, text: $$this.inputData })
  25. .layoutWeight(1)
  26. .type(InputType.PhoneNumber)
  27. .borderRadius(0)
  28. .border({ width: { bottom: 1 }, color: $r('[basic].color.main_na_color') })
  29. .textAlign(TextAlign.Start)
  30. .height(31)
  31. .placeholderFont({ size: 12 })
  32. .placeholderColor($r('[basic].color.main_na_color'))
  33. .backgroundColor(Color.Transparent)
  34. .padding(0)
  35. .caretColor($r('[basic].color.main_ac_color_dark'))
  36. if (this.needCode) {
  37. Text(this.time == 61 ? '获取验证码' : this.time + '后重新发送')
  38. .position({ right: 0 })
  39. .height(31)
  40. .fontSize(12)
  41. .fontColor($r('[basic].color.main_ac_color_dark'))
  42. .onClick(() => {
  43. 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}$');
  44. if (this.phoneNumber.match(rep) && this.time == 61) {
  45. this.time = 60
  46. this.sa = setInterval(() => {
  47. this.time--
  48. if (this.time < 1) {
  49. this.time = 61
  50. clearInterval(this.sa)
  51. }
  52. }, 1000)
  53. // TODO 此处放置验证码获取逻辑
  54. yTRequest.getCaptcha(this.phoneNumber, (res) => {
  55. if (!res) {
  56. IBestToast.show({ type: 'warning', message: '请勿重复发送验证码' })
  57. return
  58. }
  59. AppStorage.setOrCreate<string>('uuid', res)
  60. }, (err) => {
  61. IBestToast.show({ type: 'fail', message: '验证码发送失败' })
  62. this.time = 61
  63. })
  64. // yTRequest.post<CodeType, AskCodeNum>('/api/friendcase/member/sendSmsCode',
  65. // { phonenumber: this.phoneNumber })
  66. // .then(res => {
  67. // if (!res) {
  68. // IBestToast.show({ type: 'warning', message: '请勿重复发送验证码' })
  69. // return
  70. // }
  71. //
  72. // AppStorage.setOrCreate<CodeType>('smsCode', res)
  73. // })
  74. // .catch((err: Error) => {
  75. // IBestToast.show({ type: 'fail', message: '验证码发送失败' })
  76. // this.time = 61
  77. // })
  78. } else {
  79. if (!this.phoneNumber.match(rep)) {
  80. IBestToast.show({ message: '请输入正确的手机号', type: 'warning' })
  81. }
  82. }
  83. })
  84. .enabled(this.time == 61)
  85. }
  86. }
  87. .margin({ bottom: this.mgBottom })
  88. }
  89. }