modal-user-edit.component.ts 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. import { 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, ToastController } from '@ionic/angular/standalone';
  4. import { CloudUser } from 'src/lib/ncloud';
  5. @Component({
  6. selector: 'app-modal-user-edit',
  7. templateUrl: './modal-user-edit.component.html',
  8. styleUrls: ['./modal-user-edit.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 ModalUserEditComponent implements OnInit {
  17. currentUser:CloudUser|undefined
  18. userData:any = {}
  19. userDataChange(key:string,ev:any){
  20. let value = ev?.detail?.value
  21. if(value){
  22. this.userData[key] = value
  23. }
  24. }
  25. constructor(private modalCtrl:ModalController,private toastController: ToastController) {
  26. this.currentUser = new CloudUser();
  27. this.userData = this.currentUser.data;
  28. }
  29. ngOnInit() {}
  30. async save(){
  31. Object.keys(this.userData).forEach(key=>{
  32. if(key=="age"){
  33. this.userData[key] = Number(this.userData[key])
  34. }
  35. })
  36. this.currentUser?.set(this.userData)
  37. await this.currentUser?.save()
  38. this.modalCtrl.dismiss(this.currentUser,"confirm")
  39. // 创建并显示提示
  40. const toast = await this.toastController.create({
  41. message: '编辑成功!',
  42. duration: 2000, // 持续时间(毫秒)
  43. position: 'bottom', // 显示位置
  44. });
  45. toast.present(); // 显示提示
  46. }
  47. cancel(){
  48. this.modalCtrl.dismiss(null,"cancel")
  49. }
  50. }
  51. export async function openUserEditModal(modalCtrl:ModalController):Promise<CloudUser|null>{
  52. const modal = await modalCtrl.create({
  53. component: ModalUserEditComponent,
  54. breakpoints:[0.7,1.0],
  55. initialBreakpoint:0.7
  56. });
  57. modal.present();
  58. const { data, role } = await modal.onWillDismiss();
  59. if (role === 'confirm') {
  60. return data;
  61. }
  62. return null
  63. }