LoginPage.ets 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. import { BasicType, YtAvoid, YtButton, yTRequest, yTRouter, yTToast } from 'basic'
  2. import { CodeInputType } from '../models'
  3. import { LoginInput } from '../components/LoginInput'
  4. import { Terms } from '../components/Terms'
  5. import { OtherLoginMethods } from '../components/OtherLoginMethods'
  6. // import { OtherLoginMethods } from '../views/OtherLoginMethods'
  7. @Builder
  8. function LoginBuilder() {
  9. NavDestination() {
  10. LoginPage()
  11. }
  12. .hideTitleBar(true)
  13. }
  14. @Component
  15. struct LoginPage {
  16. @State isAgree: boolean = false
  17. @StorageProp(YtAvoid.safeTopKey) safeTop: number = 0
  18. @StorageProp(YtAvoid.safeBottomKey) safeBottom: number = 0
  19. @State phoneNumber: string = ''
  20. @State Captcha: string = ''
  21. inputPhoneNumberType: CodeInputType = {
  22. txt: '+86',
  23. placeHolder: '请输入手机号'
  24. }
  25. inputCaptchaType: CodeInputType = {
  26. txt: '验证码',
  27. placeHolder: '请输入验证码'
  28. }
  29. loginMethodArr: BasicType<undefined>[] = [
  30. // {
  31. // src: $r('app.media.wechat'),
  32. // txt: '微信登入',
  33. // click: () => {
  34. // //使用微信sdk实现微信登录
  35. //
  36. // }
  37. // },
  38. {
  39. // src: $r('app.media.hua_wei'),
  40. text: '华为登录',
  41. click: () => {
  42. if (!this.isAgree) {
  43. yTToast.agreePrivacy({ text: '华为登录' })
  44. return
  45. }
  46. yTRequest.huaweiLogin()
  47. }
  48. }
  49. ]
  50. aboutToAppear(): void {
  51. }
  52. build() {
  53. Column() {
  54. Image($r('[basic].media.ic_back'))
  55. .width(24)
  56. .aspectRatio(1)
  57. .margin({ bottom: 66 })
  58. .onClick(() => {
  59. yTRouter.routerBack()
  60. })
  61. Text('使用电话号码访问')
  62. .fontSize($r('[basic].float.page_text_font_size_10'))
  63. .margin({ bottom: 39 })
  64. .fontColor(Color.Black)
  65. LoginInput({ item: this.inputPhoneNumberType, inputData: this.phoneNumber, needCode: false })
  66. LoginInput({ item: this.inputCaptchaType, inputData: this.Captcha, phoneNumber: this.phoneNumber })
  67. Terms({ isAgree: this.isAgree, mg: 13 })
  68. .margin({ bottom: 74 })
  69. YtButton({
  70. btContent: '登录', click: () => {
  71. if (!this.isAgree) {
  72. AppStorage.setOrCreate<Record<string, string>>('captchaLogin',
  73. {
  74. 'phonenumber': this.phoneNumber,
  75. 'captcha': this.Captcha
  76. })
  77. yTToast.agreePrivacy({ text: '验证码登录' })
  78. return
  79. }
  80. yTRequest.phonenumberLogin({
  81. 'phonenumber': this.phoneNumber,
  82. 'captcha': this.Captcha
  83. })
  84. }
  85. })
  86. .margin({ bottom: 81 })
  87. // LoginButton('登录', () => {
  88. // if (!this.isAgree) {
  89. // PromptActionClass.openAgreePrivacy({})
  90. // return
  91. // }
  92. // const code = AppStorage.get<CodeType>('smsCode')
  93. // const askCodeNum: AskCodeNum = {
  94. // phonenumber: this.phoneNumber,
  95. // smsCode: this.Captcha,
  96. // uuid: code?.uuid
  97. // }
  98. //
  99. // yTRequest.post<TokenType, AskCodeNum>('/api/friendcase/member/phoneLogin', askCodeNum)
  100. // .then(res => {
  101. // AppStorage.setOrCreate(AppstorageKey.TOKEN, res.token)
  102. // yTRequest.refreshUserInfo()
  103. // yTRouter.routerBack()
  104. // AppStorage.setOrCreate<string>(AppstorageKey.PHONE_NUMBER, this.phoneNumber)
  105. // IBestToast.show('登录成功')
  106. // })
  107. // .catch((err: Error) => {
  108. // YTLog.error(err)
  109. //
  110. // })
  111. //
  112. // })
  113. OtherLoginMethods({ loginMethodArr: this.loginMethodArr })
  114. }
  115. .backgroundColor(Color.White)
  116. .padding({
  117. top: 10 + this.safeTop,
  118. left: 16,
  119. right: 16,
  120. bottom: this.safeBottom
  121. })
  122. .alignItems(HorizontalAlign.Start)
  123. .height('100%')
  124. }
  125. }