Improve pin

src/app/shared/pin/pin.page.ts

@@ -1,4 +1,7 @@
 import { Component, OnInit } from '@angular/core';
+import { ModalController } from '@ionic/angular';
+import { BadRequestComponent } from '../popover/bad-request/bad-request.component';
+import { SuccessMessageComponent } from '../popover/success-message/success-message.component';
 
 @Component({
   selector: 'app-pin',
@@ -8,7 +11,7 @@ import { Component, OnInit } from '@angular/core';
 export class PinPage implements OnInit {
 
   code = []
-  constructor() { }
+  constructor( private modalController: ModalController,) { }
 
   ngOnInit() {
   }
@@ -16,6 +19,8 @@ export class PinPage implements OnInit {
   setCode(code: string) {
     if(this.code.length < 4) {
       this.code.push(code)
+    } else {
+      this.clearCode()
     }
     
   }
@@ -24,4 +29,58 @@ export class PinPage implements OnInit {
     this.code =[]
   }
 
+  close() {
+    /* console.log(this.isEventEdited); */
+    alert('close modal')
+    this.modalController.dismiss();
+  }
+
+   async save() {
+    if(this.code.length == 4) {
+      
+      this.successMessage()
+      localStorage.setItem('PIN', this.code.join(''))
+    } else {
+      this.badRequest()
+    }
+
+  }
+
+  async successMessage(message?: string) {
+    
+    const modal = await this.modalController.create({
+      component: SuccessMessageComponent,
+       componentProps: {
+        message: message || 'Processo efetuado' ,
+      },
+      cssClass: 'modal modal-desktop'
+    });
+
+    modal.present()
+    
+    setTimeout(()=>{
+
+      this.close()
+      modal.dismiss()
+    },3000)
+    
+  }
+
+  async badRequest(message?: string) {
+    const modal = await this.modalController.create({
+      component: BadRequestComponent,
+       componentProps: {
+        message: message || 'Processo não efetuado' ,
+      },
+      cssClass: 'modal modal-desktop'
+    });
+
+    modal.present()
+    
+    setTimeout(()=>{
+      modal.dismiss()
+    },3000)
+  }
+
+
 }