AI Changes:FAIROJ

package.json

@@ -36,6 +36,7 @@
     "@ionic-native/sqlite": "^4.19.0",
     "@ionic-native/status-bar": "^4.16.0",
     "@ionic/storage": "2.1.3",
+    "@netbasal/content-loader": "^1.1.0",
     "@types/chart.js": "^2.7.40",
     "amazon-cognito-identity-js": "^3.0.3",
     "chart.js": "^2.7.3",

src/app/app.module.ts

@@ -118,6 +118,7 @@ import { PdQuestionSalaryInfoPage } from '../pages/pd-question/pd-question-salar
 import { LocationAccuracy } from '@ionic-native/location-accuracy';
 import {PdQuestionAssessedSummaryPage} from '../pages/pd-question/pd-question-assessed-summary/pd-question-assessed-summary'
 import { NgxMatSelectSearchModule} from 'ngx-mat-select-search'
+import { ContentLoaderModule } from '@netbasal/content-loader';
 
 @NgModule({
     declarations: [
@@ -204,7 +205,8 @@ import { NgxMatSelectSearchModule} from 'ngx-mat-select-search'
         MatTabsModule,
         MatToolbarModule,
         MatTooltipModule,
-        MatStepperModule,HttpClientModule,IonicImageViewerModule,NgxMatSelectSearchModule
+        MatStepperModule,HttpClientModule,IonicImageViewerModule,NgxMatSelectSearchModule,
+        ContentLoaderModule
     ],
     bootstrap: [IonicApp],
     entryComponents: [

src/pages/pd-list/pd-list.html

@@ -105,6 +105,18 @@
            <ion-slide>
             <!-- <ion-list *ngSwitchCase="'inpro'"> -->
                 <ion-grid class="fadeIn">
+                    <div *ngIf="pdlistaccess else allocateaccess">  
+                        <div *ngFor="let i of [1,2,3,4,5]">
+                            <content-loader>
+                              <svg:rect x="80" y="40" rx="5" ry="5" width="300" height="70" />
+                                
+                                <svg:circle cx="40" cy="70" r="30" stroke="3" stroke-width="3" fill="red" />  
+                                
+                              </content-loader>
+                        </div>
+                        </div>
+                <ng-template #allocateaccess>
+                          
              <mat-card class="md-box" reorder="true" *ngFor="let progess of pdinprogress;let i = index;">
               
                 <ion-list >
@@ -136,6 +148,7 @@
                  </ion-list>
                  <hr/>
              </mat-card>
+                </ng-template>
                 </ion-grid>
                <!-- </ion-list> -->
               </ion-slide>
@@ -147,7 +160,21 @@
             <ion-slide>
             <!-- <ion-list *ngSwitchCase="'past'"> -->
                <ion-grid class="fadeIn"> 
+                  <div *ngIf="pdlistaccess else access">  
+                      <div *ngFor="let i of [1,2,3,4,5]">
+                          <content-loader>
+                            <svg:rect x="80" y="40" rx="5" ry="5" width="300" height="70" />
+                              
+                              <svg:circle cx="40" cy="70" r="30" stroke="3" stroke-width="3" fill="red" />  
+                              
+                            </content-loader>
+                      </div>
+                      </div>
+                      <!-- {{access}} -->
+                <ng-template #access>
                   <mat-card class="md-box" reorder="true" *ngFor="let progess of pdschduleDetails;let i = index;">
+                    
+                       
                     <ion-list >
                              <ion-item (click)="PdAllocation(progess)"> 
                                <ion-icon item-start="" class="lettericon" [style.background]="bgColorPast[i]">{{progess.applicat_details[0].applicant_name | slice : 0 :1 | uppercase}}</ion-icon>
@@ -181,7 +208,9 @@
 
                        </ion-list>
                        <hr/>
+                       
                    </mat-card>
+                </ng-template>
           </ion-grid>
             <!-- </ion-list> -->
           </ion-slide>

src/pages/pd-list/pd-list.ts

@@ -119,15 +119,15 @@ export class PdListPage {
    
     let userid = this.aws.getlocale();
     //.log("User",userid)
+    this.pdlistaccess = true;
 
     this.pdofficer.getpddetails(userid).subscribe(res=>
       {
        this.pdlistdetails = res;
        if(this.pdlistdetails.dataStatus == true)
        {
+        this.pdlistaccess = false;
         
-        
-          this.pdlistaccess = true;
           this.pdschduleDetails = this.pdlistdetails.records.filter(sch=>sch.pd_status =="ACCEPTED" || sch.pd_status =="SCHEDULED" || sch.pd_status =="INITIATED" || sch.pd_status =="STARTED" || sch.pd_status =="INPROGRESS" && sch.applicat_details);
           this.searchpast = this.pdschduleDetails;
           
@@ -169,7 +169,7 @@ export class PdListPage {
     this.bgColor = [];
     this.pdschduleDetails = [];
     this.pdinprogress = [];
-   
+    // this.pdlistaccess = true;
       this.shared.refresh();
       this.getpdTriggerdetails();
     setTimeout(() => {