AAAAAAAAAAAAAAABBBBBBBBBBBBBBBBBBBBBBBBBBBBBMerge branch 'master' of https://bitbucket.org/sriramv18/pd_officer

config.xml

@@ -1,5 +1,5 @@
 <?xml version='1.0' encoding='utf-8'?>
-<widget id="com.sineedge.pdgenie" version="0.0.19" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+<widget id="com.sineedge.pdgenie" version="0.0.20" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
     <name>PD Genie Officer </name>
     <description>info@pdgenie.com</description>
     <author email="info@pdgenie.com" href="https://pdgenie.com">PD Genie</author>

src/app/app.module.ts

@@ -143,6 +143,8 @@ import { OfficerNotesModalPage } from '../pages/officer-notes-modal/officer-note
 import { QueriesDocsPage } from '../pages/queries-docs/queries-docs';
 import {Market} from '@ionic-native/market'
 import { PdGeneralImagesModule } from '../pages/pd-general-images/Pd-general-images.module';
+import { ReqTokenInterceptor } from '../providers/_guard/req-token.interceptor';
+import { ImageNameModelPage } from '../pages/Modal/image-name-model/image-name-model';
 
 @NgModule({
     declarations: [
@@ -202,6 +204,7 @@ import { PdGeneralImagesModule } from '../pages/pd-general-images/Pd-general-ima
         MapAddressPage,
         FormCompleteCheckModalPage,
         OfficerNotesModalPage,
+        ImageNameModelPage,
         // PipesModule,
        
         QueriesDocsPage
@@ -305,18 +308,19 @@ import { PdGeneralImagesModule } from '../pages/pd-general-images/Pd-general-ima
         MapAddressPage,
         FormCompleteCheckModalPage,
         OfficerNotesModalPage,
+        ImageNameModelPage,
        
         QueriesDocsPage
         
        
     ],
     providers: [
-        StatusBar,AwsServiceProvider,AuthGuard,TokenInterceptor,ToastProvider,
+        StatusBar,AwsServiceProvider,AuthGuard,TokenInterceptor,ToastProvider,ReqTokenInterceptor,
         ConstantsProvider,CognitoServiceProvider,SplashScreen,PdtriggerProvider,FingerprintAIO,SQLite,AndroidPermissions,BackgroundGeolocation,
         Push,Events,AppVersion,
         {
             provide:HTTP_INTERCEPTORS,
-            useClass: TokenInterceptor,
+            useClass: ReqTokenInterceptor,
             multi: true
           },
         {

src/app/app.scss

@@ -365,4 +365,5 @@ ion-content {
 @import "theme/mapAddress";
 @import "theme/imgCompleteModal";
 @import "theme/officer-notes-modal";
+@import "theme/imageNameModal";
 

src/pages/Modal/image-name-model/image-name-model.html

@@ -0,0 +1,27 @@
+<mat-card >
+  <!-- <mat-card-header> -->
+    <mat-card-title>
+      Document Details
+    </mat-card-title>
+  <!-- </mat-card-header> -->
+  <mat-card-content no-padding><!--*ngIf="pdDetails.form_id  ==  '5'"
+  *ngIf="image.is_show_report == 1"-->
+  
+      <mat-form-field appearance="outline">
+          <mat-label>Document Name</mat-label>
+          <input #searchInput matInput type="text" placeholder="Enter the document name" [(ngModel)]="doc_name" autocomplete="off" [disabled]="pdDetails.doc_name != ''" required>
+        </mat-form-field>
+    <div *ngIf="pdDetails.form_id  ==  '5' && pdDetails.doc_name != ''">
+    <mat-label >Select an option</mat-label><br/>
+     <mat-radio-group aria-label="Select an option" [(ngModel)]="is_show_report">
+       <mat-radio-button value=1>Shown On Report</mat-radio-button><br/>
+       <mat-radio-button value=0>Hide On Report</mat-radio-button>
+     </mat-radio-group>
+</div>
+</mat-card-content>
+<!-- <ion-item no-lines>
+ 
+  </ion-item> -->
+  <!-- <button float-right  ion-button color="tertiary" round (click)="saveNotes()">Save</button>&nbsp;&nbsp; -->
+  <button float-right  ion-button style="color:green;" round outline (click)="submit()">Submit</button>
+</mat-card>

src/pages/Modal/image-name-model/image-name-model.scss

@@ -0,0 +1,3 @@
+page-image-name-model {
+
+}

src/pages/Modal/image-name-model/image-name-model.ts

@@ -0,0 +1,49 @@
+import { Component, ViewChild } from '@angular/core';
+import { IonicPage, NavController, NavParams, ViewController, ToastController } from 'ionic-angular';
+import { ToastProvider } from '../../../providers/common-provider/toast';
+
+/**
+ * Generated class for the ImageNameModelPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+
+@Component({
+  selector: 'page-image-name-model',
+  templateUrl: 'image-name-model.html',
+})
+export class ImageNameModelPage {
+  pdDetails={form_id:'',doc_name:''}
+  doc_name:string='';
+  is_show_report:any;
+  @ViewChild('searchInput') sInput;
+  constructor(private viewCtrl:ViewController,private navParams:NavParams,private toastCtrl:ToastProvider) {
+    this.pdDetails=this.navParams.get('FormDet')
+    console.log("pd ",this.pdDetails);
+    this.doc_name=this.pdDetails.doc_name
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad ImageNameModelPage');
+    // this.sInput.setFocus();
+  }
+  submit(){
+    // console.log(this.doc_name,this.is_show_report);
+    if(this.doc_name == ''){
+      this.toastCtrl.pdTriggerappmessage("Please Enter the Document Name")
+      return;
+    }
+    let data:any;
+    if(this.pdDetails.form_id == '5' && this.pdDetails.doc_name != ''){
+     data= {doc_name:this.pdDetails.doc_name,is_show_report:this.is_show_report}
+    }
+    else{
+      data={doc_name:this.doc_name}
+    }
+    console.log(data)
+    this.viewCtrl.dismiss(data)
+  }
+
+}

src/pages/officer-notes-modal/officer-notes-modal.html

@@ -13,7 +13,7 @@
     </mat-card-header>
     <mat-card-content>
   <mat-form-field style="width: 100%;">
-<textarea matInput rows=10 type="text" placeholder="QC Officer Notes" [(ngModel)]="qc_notes"></textarea>
+<textarea matInput rows=7 type="text" placeholder="QC Officer Notes" [(ngModel)]="qc_notes"></textarea>
 </mat-form-field>
 </mat-card-content>
 <!-- <ion-item no-lines>

src/pages/pd-general-images/pd-general-images.html

@@ -65,7 +65,7 @@
                 <div *ngIf="image.type == 'jpg' || image.type == 'png' || image.type == 'jpeg'">
                     <img src="{{image.image}}" imageViewer  class="doc-image-bucket"><br/>
                     <label *ngIf="image.Name != ''"><strong>{{image.Name}}</strong></label>
-                    <div  *ngIf="pdDetails.form_id  ==  '5'">  <label *ngIf="image.is_show_report != '0'"><small>Shown On Report</small></label></div>
+                    <div  *ngIf="pdDetails.form_id  ==  '5'">  <label *ngIf="image.is_show_report == '1'"><small>Shown On Report</small></label></div>
 
                     <input  *ngIf="image.Name =='' && image.option != 'dummy'" width="20px" ion-input type="text" placeholder="Document Name" (blur)="changeName($event.target.value,i,image.image)">
                     <button *ngIf="image.option != 'dummy'" ion-button clear color="optblue" (click)="removeImg(i)"><ion-icon style="font-size:22px" name="md-trash"></ion-icon></button>

src/pages/pd-general-images/pd-general-images.ts

@@ -1,11 +1,12 @@
 import { Component, ViewChild, NgModule, Input, ElementRef,OnDestroy, HostListener, Output, EventEmitter } from '@angular/core';
-import { NavController, NavParams } from 'ionic-angular';
+import { NavController, NavParams, ModalOptions, ModalController } from 'ionic-angular';
 import { CameraProvider } from '../../providers/common-provider/camera';
 import { QuestionCategoryProvider } from '../../providers/question-category/question-category';
 import { ToastProvider } from '../../providers/common-provider/toast';
 import { LoadingProvider } from '../../providers/common-provider/loading';
 import { ConstantsProvider } from '../../providers/constants/constants';
 import * as watermark from 'watermarkjs'
+import { ImageNameModelPage } from '../Modal/image-name-model/image-name-model';
 
 /**
  * Generated class for the PdGeneralImagesPage page.
@@ -35,7 +36,7 @@ export class PdGeneralImagesPage {
   geoCoordinates:any='-';
   @Output() imageDatalength_forParent = new EventEmitter<any>();
  
-  constructor(public navCtrl: NavController, public navParams: NavParams,public camera:CameraProvider,public qustCat:QuestionCategoryProvider,public toast:ToastProvider,private  loading:LoadingProvider,private cameraProvider:CameraProvider,private constant:ConstantsProvider) {
+  constructor(public navCtrl: NavController, public navParams: NavParams,public camera:CameraProvider,public qustCat:QuestionCategoryProvider,public toast:ToastProvider,private  loading:LoadingProvider,private cameraProvider:CameraProvider,private constant:ConstantsProvider,private modalCtrl:ModalController) {
 
     // this.applicatentDetails = this.navParams.get('pdDetails');
   
@@ -102,10 +103,10 @@ export class PdGeneralImagesPage {
           if(result.pd_document_name != null){
             let split=result.pd_document_name.split('.')
           
-            this.imageDisplay.push({'image':result.doc_url,'Name':result.pd_document_title,'option':'dummy','type':split[1]})
+            this.imageDisplay.push({'image':result.doc_url,'Name':result.pd_document_title,'option':'dummy','type':split[1],'is_show_report':result.is_show_report})
             }
             else{
-          this.imageDisplay.push({'image':result.doc_url,'Name':result.pd_document_title,'option':'dummy','type':''})
+          this.imageDisplay.push({'image':result.doc_url,'Name':result.pd_document_title,'option':'dummy','type':'','is_show_report':result.is_show_report})
             }
         })
        console.log("dis",this.imageDisplay);
@@ -160,20 +161,36 @@ export class PdGeneralImagesPage {
                 delete res[index]
               }
               bucket_value.Name = value
+              this.imageBucket.push(bucket_value)
+              this.sendImage()
               // this.imageBucket.push(bucket_value);
             })
+          }else if(this.pdDetails.form_id == '5' && value && value != '' && value != undefined){
+            bucket_value.Name=value
+            this.imageBucket.push(bucket_value)
+            this.modalForImageDet(value)
+            return
           }
+          else{
           // this.loading.dismissLoader()
-          bucket_value.Name = value
+
+         
+           bucket_value.Name = value
+           this.imageBucket.push(bucket_value)
+           this.sendImage()
           // this.imageBucket.push({ 'image': res, 'Name': value, 'link': geoCoordinates });
-          this.cardLast.nativeElement.scrollIntoView({behavior:"smooth",block:"start"})
+          // this.cardLast.nativeElement.scrollIntoView({behavior:"smooth",block:"start"})
+          return
+          }
         }
+        
         else {
           bucket_value.Name = ''
           // this.imageBucket.push({'image':raw_img,'Name':'','link':geoCoordinates});
           console.log("3rd", watermarkedImage)
+          this.imageBucket.push(bucket_value)
         }
-        this.imageBucket.push(bucket_value)
+       
       
 
         // console.log("geo promise",geoCoordinates)
@@ -181,15 +198,16 @@ export class PdGeneralImagesPage {
         //FOR GETTING THE DOC NAME FROM ALERT
         if (!value || value == '' || value == undefined) {
           // this.loading.dismissLoader()
-          let alert = this.toast.setAlertForDocName()
+          // let alert = this.toast.setAlertForDocName()
-          alert.present()
+          // alert.present()
-          alert.onDidDismiss(value => {
+          // alert.onDidDismiss(value => {
 
-            if (value) {
+          //   if (value) {
-              this.imageBucket[this.imageBucket.length - 1].Name = value.Name
+          //     this.imageBucket[this.imageBucket.length - 1].Name = value.Name
-            }
+          //   }
-            this.cardLast.nativeElement.scrollIntoView({behavior:"smooth",block:"start"})
+          //  
-          })
+          // })
+          this.modalForImageDet('')
         }
         // this.loading.dismissLoader()
       })
@@ -199,6 +217,25 @@ export class PdGeneralImagesPage {
       console.log("Camera Error ", JSON.stringify(error));
     })
   }
+  modalForImageDet(doc_name?){
+    const modalOption:ModalOptions={
+      cssClass:'imageNameModal'
+    }
+    let records:any={form_id:this.pdDetails.form_id,doc_name:doc_name}
+    const modalCtrl=this.modalCtrl.create(ImageNameModelPage,{'FormDet':records},modalOption)
+    modalCtrl.present();
+    modalCtrl.onDidDismiss((data)=>{
+      console.log("Image Data",data);
+      if(data){
+        this.imageBucket[this.imageBucket.length - 1].Name = data.doc_name
+        if(this.pdDetails.form_id == '5'){
+          this.imageBucket[this.imageBucket.length - 1].is_show_report = data.is_show_report
+        }
+      }
+      this.sendImage();
+      // this.cardLast.nativeElement.scrollIntoView({behavior:"smooth",block:"start"})
+    })
+  }
   addWatermarks(base64Img){
   
     return new Promise((resolve,reject)=>{
@@ -247,7 +284,7 @@ export class PdGeneralImagesPage {
         
   }
   sendImage(){
-    this.loading.loaderForSendImage()
+    // this.loading.loaderForSendImage()
    // console.log("ll",JSON.stringify(this.imageBucket));
  
     let records:any={
@@ -261,18 +298,19 @@ export class PdGeneralImagesPage {
   
     this.qustCat.savePDImages(records).subscribe(res=>{
       if(res['dataStatus']== true){
-       this.toast.pdTriggerappmessage("Image Saved Successfully")
+       this.toast.pdTriggerappmessage(this.imageBucket[0].Name+" Saved Successfully")
       //  this.imageDisplay.push(this.imageBucket)
       //  console.log("length",this.imageDisplay.length)
        this.imageBucket=[]
        this.getPDImages();
+       this.cardLast.nativeElement.scrollIntoView({behavior:"smooth",block:"start"})
       }
       else{
         this.toast.pdTriggerappmessage('Something went wrong');
       }
-      this.loading.dismissLoader();
+      // this.loading.dismissLoader();
     },err=>{
-      this.loading.dismissLoader();
+      // this.loading.dismissLoader();
       this.toast.pdTriggerappmessage("Network Error")
     })
  

src/pages/pd-question-category/pd-question-category.ts

@@ -1,5 +1,5 @@
 import { Component, ViewChild } from '@angular/core';
-import { IonicPage, NavController, NavParams,ModalController,ModalOptions, Modal } from 'ionic-angular';
+import { IonicPage, NavController, NavParams,ModalController,ModalOptions, Modal, ViewController } from 'ionic-angular';
 import { GoogleplaytabPage } from '../googleplaytab/googleplaytab';
 import { QuestionCategoryProvider } from '../../providers/question-category/question-category';
 import { CognitoServiceProvider } from '../../providers/aws-service/cognito.service';
@@ -76,7 +76,7 @@ searchitem:any;
   complete_btn:boolean=true;
   complete_status : boolean = false;
 
-  constructor(public navCtrl: NavController, public navParams: NavParams,public templateget:QuestionCategoryProvider,
+  constructor(public navCtrl: NavController, public navParams: NavParams,public templateget:QuestionCategoryProvider,private viewCtrl:ViewController,
     public aws:AwsServiceProvider, public shared:CognitoServiceProvider,public toast:ToastProvider,
     public pdstatusprovide:PdtriggerProvider, private modalCtrl:ModalController,private constantProvider:ConstantsProvider,private storage:StorageProvider) {
     this.pddetails = this.navParams.get('pdDetails');
@@ -101,7 +101,8 @@ searchitem:any;
 
   ionViewCanEnter()
   {
-    this.getcategoryList();    
+    this.getcategoryList();   
+    this.viewCtrl.dismiss();
   }
   ionViewCanLeave(){
     // this.storage.clearItem('qc_notes')

src/pages/pd-question/pd-question-address/pd-question-address.ts

@@ -16,6 +16,7 @@ import 'rxjs/add/observable/interval';
 import { DatePipe } from '@angular/common';
 import { OfficerNotesModalPage } from '../../officer-notes-modal/officer-notes-modal';
 import { PdGeneralImagesPage } from '../../pd-general-images/pd-general-images';
+import { ImageNameModelPage } from '../../Modal/image-name-model/image-name-model';
 // import{CacheService} from 'ionic-cache-observable'
 /**
  * Generated class for the PdQuestionAddressPage page.
@@ -1531,6 +1532,12 @@ else{
 
     savePhoto(flag){
       this.tab='1';
+      // const modalOption:ModalOptions={
+      //   cssClass:'imageNameModal'
+      // }
+      // let records:any={form_id:'5',doc_name:''}
+      // const modalCtrl=this.modalCtrl.create(ImageNameModelPage,{'FormDet':records},modalOption)
+      // modalCtrl.present();
       
       setTimeout(()=>{
         if(flag == 1){

src/pages/pd-question/pd-question-general-info/pd-question-general-info.ts

@@ -522,7 +522,7 @@ export class PdQuestionGeneralInfoPage {
       // console.log('full data',this.fulldata[control.length]);
 
       let formData:FormGroup=this.fb.group({
-        pd_co_applicant_id:[''],
+        pd_co_applicant_id:[this.fulldata[control.length].pd_co_applicant_id],
         applicant_name:[this.fulldata[control.length].applicant_name],
         relationship:[''],
         relation_to:[''],

src/providers/_guard/req-token.interceptor.ts

@@ -0,0 +1,160 @@
+import { Injectable, Injector } from '@angular/core';
+import {
+  HttpRequest,
+  HttpHandler,
+  HttpInterceptor,
+  HttpSentEvent,
+  HttpHeaderResponse,
+  HttpProgressEvent,
+  HttpResponse,
+  HttpUserEvent
+} from '@angular/common/http';
+// import { AuthGuard } from './auth.guard';
+import { Observable, of, BehaviorSubject} from 'rxjs';
+
+// import { Router } from '@angular/router';
+
+import { catchError, switchMap } from 'rxjs/operators';
+import { HttpErrorResponse } from "@angular/common/http";
+
+import { CognitoServiceProvider } from '../aws-service/cognito.service';
+import { ConstantsProvider } from '../constants/constants';
+// import { Observable, EMPTY, throwError } from 'rxjs';
+// import { catchError } from 'rxjs/operators';
+import 'rxjs/add/operator/catch';
+import { AwsServiceProvider } from '../aws-service/aws-service';
+
+// const cognitoService=this.injector.get(CognitoServiceProvider)
+// const constantProvider=this.injector.get(ConstantsProvider)
+
+@Injectable()
+export class ReqTokenInterceptor implements HttpInterceptor{
+  
+  constructor(public injector:Injector ) {
+    
+  }
+  isRefreshingToken: boolean = false;
+  tokenSubject: BehaviorSubject<string> = new BehaviorSubject<string>(null);
+  
+  addToken(req: HttpRequest<any>, token: string): HttpRequest<any> {
+
+    const constantProvider = this.injector.get(ConstantsProvider)
+    return req.clone({
+      setHeaders: {
+        'Authorization': constantProvider.environment().authorization,
+        'Token': token,
+        'From': '2',
+      }
+    })
+  }
+// addToken1(req: HttpRequest<any>, token: string): HttpRequest<any> {
+ 
+//     const constantProvider=this.injector.get(ConstantsProvider)
+//     console.log("Token 1",token,req);
+//     return req.clone({ setHeaders: {'Authorization': constantProvider.environment().authorization,
+//                                     'Token':token,
+//                                     'From':'2',
+//                                     }})
+// }
+intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpSentEvent | HttpHeaderResponse | HttpProgressEvent | HttpResponse<any> | HttpUserEvent<any>> {
+    const cognitoService=this.injector.get(CognitoServiceProvider)
+   
+  let token=cognitoService.getToken() || ''
+  console.log("Token From Interceptor >>",cognitoService.getToken())
+  if(token!=''){
+  token=token.getIdToken().getJwtToken()
+  }
+    return <any>next.handle(this.addToken(req, token)).pipe(
+    catchError(error => {
+      if (error instanceof HttpErrorResponse) {
+        if((<HttpErrorResponse>error).status) {
+            return this.handle401Error(req,next,error)
+        }
+    } else {
+      console.log("observable error")
+        return Observable.throw(error);
+    }
+    }));
+  }
+   
+  handle401Error(req: HttpRequest<any>, next: HttpHandler,err) {
+      console.log("err",err)
+    const cognitoService=this.injector.get(CognitoServiceProvider)
+      console.log("entered",this.isRefreshingToken,this.tokenSubject);
+
+      if (err instanceof HttpErrorResponse) {
+      if(err.status == 401 && err.error.error.toLowerCase() == 'invalid token!'){
+    if (!this.isRefreshingToken) {
+        this.isRefreshingToken = true;
+
+        // Reset here so that the following requests wait until the token
+        // comes back from the refreshToken call.
+        this.tokenSubject.next(null);
+
+        //  return cognitoService.refresh()
+        //     .subscribe((newToken: string) => {
+        //         console.log("new",newToken)
+        //         if (newToken) {
+        //             this.tokenSubject.next( cognitoService.getToken().getIdToken().getJwtToken());
+                   
+        //             console.log(this.tokenSubject);
+        //              next.handle(this.addToken1(req, cognitoService.getToken().getIdToken().getJwtToken()));
+        //         }
+
+        //         // If we don't get a new token, we are in trouble so logout.
+        //        const awsService=this.injector.get(AwsServiceProvider)
+        //        awsService.logout();
+        //     },err=>console.log("Error refresh",err))
+        return cognitoService.refresh().pipe(
+          switchMap((newToken: string) =>{
+            if(newToken){
+              this.isRefreshingToken=false
+              this.tokenSubject.next(newToken);
+             
+              return next.handle(this.addToken(req, cognitoService.getToken().getIdToken().getJwtToken()))
+            }
+            const awsService=this.injector.get(AwsServiceProvider)
+           return awsService.logout();
+          })
+        )
+       
+            // .catch(error => {
+            //     // If there is an exception calling 'refreshToken', bad news so logout.
+            //     return this.logoutUser();
+            // })
+            // .finally(() => {
+            //     this.isRefreshingToken = false;
+            // });
+    } else {
+        console.log("Else Part 1201")
+        // return this.tokenSubject
+        //     // .filter(token => token != null)
+        //     .take(1)
+        //     .switchMap(token => {
+                return next.handle(this.addToken(req, cognitoService.getToken().getIdToken().getJwtToken()));
+            // });
+    }
+  }
+  else{
+    this.handleError('Error From Token Interceptor',err);
+  }
+}
+  else{
+    return Observable.throw("Observable throw",err);
+  }
+}
+   
+
+  private handleError<T> (operation = 'operation', result?: T) {
+    return (error: any): Observable<T> => {
+      if(error instanceof HttpErrorResponse){
+        console.error("Error: " + error.status);
+        if(error.status == 401){
+            localStorage.clear();
+            // this.router.navigate(['/authentication/login']);
+        }
+        return of(result as T);
+      }
+    };
+  }
+}

src/providers/aws-service/cognito.service.ts

@@ -93,10 +93,10 @@ isloggin:boolean = false;
   
 refresh() {
   let tokenexp:boolean;
-  
+  return Observable.create(observer=>{
   if(this.getCurrentUser() !=null){
     
-  this.getCurrentUser().getSession(function (err, session) {
+  return this.getCurrentUser().getSession(function (err, session) {
       if (err) {
           console.log("CognitoUtil: Can't set the credentials:" + err);
       }
@@ -114,12 +114,16 @@ refresh() {
           }
       }
       
-         return tokenexp;
+        //  return tokenexp;
+        observer.next(tokenexp)
+        observer.complete()
       
   });
   }else{
     this.loggedIn = false;
+    return false
   }
+});
 }
 getAccessToken(){
   this.refresh();

src/theme/imageNameModal.scss

@@ -0,0 +1,65 @@
+.imageNameModal{
+    padding: 6.4%;
+    // padding: 30px;
+     color:red;
+    // filter:blur(5px); 
+     //color:lightcyan;
+     // background-color:gray;
+     .modal-wrapper {
+        //  border-radius: 7px;
+         // background: rgba(0, 0, 0, 0.5);
+         // color: gray;
+         
+        //   height: 98% !important;
+        //   width:10% !important;
+        //   margin-top: 13.5%;
+        margin-top:10%;
+         
+        mat-card{
+            // background-color:rgb(252, 252, 161);
+            background-color:white;
+            box-shadow: 2px 2px lavender;
+            border-radius: 5px;
+            min-height: 13em;
+            // height: 16.5em;
+            max-height: 16.5em;
+            border:1px solid lavender;
+        }
+       .mat-card-title{
+          
+            font-weight: bold;
+            font-size: 16px;
+            color:green;
+        }
+        mat-card-content{
+            margin-left: 4%;
+        }
+        ion-item{
+            // background-color:rgb(252, 252, 161);
+            background-color: lightcyan;
+        }
+        //   margin-right: 15%;
+         
+         button{
+             font-size: 35px;
+            //  height: 40px;
+             color:green;
+            //  margin-bottom: 10px;
+            position: relative;
+            bottom:0.5em;
+         }
+        //  input{
+        //     // border:1px solid blueviolet;
+        //  }
+         mat-form-field{
+             width: 100%;
+             margin-top: 3%;
+         }
+         mat-radio-button{
+             margin-top: 2%;
+         }
+       
+             
+          }
+     
+ }

src/theme/officer-notes-modal.scss

@@ -13,13 +13,13 @@
         //   height: 98% !important;
         //   width:10% !important;
         //   margin-top: 13.5%;
-        margin-top:15%;
+        margin-top:13%;
          
         mat-card{
             // background-color:rgb(252, 252, 161);
             background-color: lightcyan;
             border-radius: 20px;
-            height: 68%;
+            height: 20em;
         }
        mat-card-title{