modal-user-login.component.ts 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. import { Input, OnInit } from '@angular/core';
  2. import { Component } from '@angular/core';
  3. import { IonHeader, IonToolbar, IonTitle, IonContent, IonCard, IonCardContent, IonButton, IonCardHeader, IonCardTitle, IonCardSubtitle, ModalController, IonInput, IonItem, IonSegment, IonSegmentButton, IonLabel } from '@ionic/angular/standalone';
  4. import { CloudUser } from 'src/lib/ncloud';
  5. @Component({
  6. selector: 'app-modal-user-login',
  7. templateUrl: './modal-user-login.component.html',
  8. styleUrls: ['./modal-user-login.component.scss'],
  9. standalone: true,
  10. imports: [IonHeader, IonToolbar, IonTitle, IonContent,
  11. IonCard,IonCardContent,IonButton,IonCardHeader,IonCardTitle,IonCardSubtitle,
  12. IonInput,IonItem,
  13. IonSegment,IonSegmentButton,IonLabel
  14. ],
  15. })
  16. export class ModalUserLoginComponent implements OnInit {
  17. @Input()
  18. type:"login"|"signup" = "login"
  19. typeChange(ev:any){
  20. this.type = ev?.detail?.value || ev?.value || 'login'
  21. }
  22. username:string = ""
  23. usernameChange(ev:any){
  24. console.log(ev)
  25. this.username = ev?.detail?.value
  26. }
  27. password:string = ""
  28. passwordChange(ev:any){
  29. this.password = ev?.detail?.value
  30. }
  31. password2:string = ""
  32. password2Change(ev:any){
  33. this.password2 = ev?.detail?.value
  34. }
  35. constructor(private modalCtrl:ModalController) {
  36. console.log(this.type)
  37. }
  38. ngOnInit() {}
  39. async login(){
  40. if(!this.username || !this.password){
  41. console.log("请输入完整")
  42. return
  43. }
  44. let user:any = new CloudUser();
  45. user = await user.login(this.username,this.password);
  46. if(user?.id){
  47. this.modalCtrl.dismiss(user,"confirm")
  48. }else{
  49. console.log("登录失败")
  50. }
  51. }
  52. async signup(){
  53. if(!this.username || !this.password || !this.password2){
  54. console.log("请输入完整")
  55. return
  56. }
  57. if(this.password!=this.password2){
  58. console.log("两次密码不符,请修改")
  59. return
  60. }
  61. let user:any = new CloudUser();
  62. user = await user.signUp(this.username,this.password);
  63. if(user){
  64. this.type = "login"
  65. console.log("注册成功请登录")
  66. }
  67. }
  68. }
  69. export async function openUserLoginModal(modalCtrl:ModalController,type:"login"|"signup"="login"):Promise<CloudUser|null>{
  70. const modal = await modalCtrl.create({
  71. component: ModalUserLoginComponent,
  72. componentProps:{
  73. type:type
  74. },
  75. breakpoints:[0.5,0.7],
  76. initialBreakpoint:0.5
  77. });
  78. modal.present();
  79. const { data, role } = await modal.onWillDismiss();
  80. if (role === 'confirm') {
  81. return data;
  82. }
  83. return null
  84. }