FEAT #8218 improve lazy loading for get ressources

apps/maarch_entreprise/Views/home.component.html

@@ -8,9 +8,6 @@
             <mat-divider></mat-divider>
         </mat-sidenav>
         <mat-sidenav-content>
-            <div *ngIf="loading" style="display:flex;height:100%;">
-                <mat-spinner style="margin:auto;"></mat-spinner>
-            </div>
             <mat-card class="card-app-content">
                 <mat-card id="viewThumbnail" style="display:none;position: absolute;z-index: 2;height: 600px;width: 400px;"></mat-card>
                 <mat-card>
@@ -29,8 +26,10 @@
 
                 <mat-tab-group>
                     <mat-tab label="Mes derniers courriers">
-                        <table mat-table [dataSource]="dataSource" matSort matSortActive="res_id" matSortDisableClear matSortDirection="asc"
-                    style="width:100%;table-layout: fixed;">
+                        <div *ngIf="loading" style="display:flex;height:100%;">
+                            <mat-spinner style="margin:auto;"></mat-spinner>
+                        </div>
+                        <table *ngIf="!loading" mat-table [dataSource]="dataSource" matSort matSortActive="res_id" matSortDisableClear matSortDirection="asc" style="width:100%;table-layout: fixed;">
                     <!-- Number Column -->
                     <ng-container matColumnDef="res_id">
                         <td mat-cell *matCellDef="let row" [ngStyle]="{'width': mobileMode ? '30%' : '10%'}" style="text-align:center;overflow:hidden;text-overflow: ellipsis;white-space: nowrap;padding: 5px;vertical-align: middle;">

apps/maarch_entreprise/js/angular/app/home.component.ts

@@ -52,10 +52,10 @@ export class HomeComponent extends AutoCompletePlugin implements OnInit {
     }
 
     ngOnInit(): void {
+        this.loading = true;
         if (this.mobileMode) {
             this.displayedColumns = ['res_id', 'subject'];
         }
-
         window['MainHeaderComponent'].refreshTitle(this.lang.home);
         window['MainHeaderComponent'].setSnav(this.snav);
         window['MainHeaderComponent'].setSnavRight(null);
@@ -64,17 +64,21 @@ export class HomeComponent extends AutoCompletePlugin implements OnInit {
         let options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
 
         this.currentDate = event.toLocaleDateString('fr-FR', options);
-        this.loading = false;
 
         this.http.get(this.coreUrl + "rest/home")
         .subscribe((data: any) => {
             this.homeData = data;
-            this.loading = false;
+        });
+    }
+
+    ngAfterViewInit(): void {
+        this.http.get(this.coreUrl + "rest/home/lastRessources")
+        .subscribe((data: any) => {
             setTimeout(() => {
-                this.dataSource = new MatTableDataSource(this.homeData.lastResources);
+                this.dataSource = new MatTableDataSource(data.lastResources);
+                this.loading = false;
             }, 0);
         });
-
     }
 
     goTo(row:any){
@@ -85,15 +89,11 @@ export class HomeComponent extends AutoCompletePlugin implements OnInit {
             this.innerHtml = this.sanitizer.bypassSecurityTrustHtml(
                 "<iframe style='height:100%;width:100%;' src='" + this.docUrl + "' class='embed-responsive-item'>" +
                 "</iframe>");  
-                /*"<object style='height:100%;width:100%;' data='" + this.docUrl + "' type='application/pdf' class='embed-responsive-item'>" +
-                "<div>Le document "+row.res_id+" ne peut pas être chargé</div>" +
-                "</object>");*/
             this.sidenavRight.open();
         }
     }
 
     viewThumbnail(row:any) {
-        console.log('ok');
         $j('#viewThumbnail').css({'background':'white url('+this.coreUrl+'rest/res/' + row.res_id + '/thumbnail) no-repeat 100%'});
         $j('#viewThumbnail').css({'background-size': '100%'});
         $j('#viewThumbnail').show();

rest/index.php

@@ -161,6 +161,7 @@ $app->get('/header', \SrcCore\controllers\CoreController::class . ':getHeader');
 
 //Home
 $app->get('/home', \Home\controllers\HomeController::class . ':get');
+$app->get('/home/lastRessources', \Home\controllers\HomeController::class . ':getLastRessources');
 
 //Jnlp
 $app->post('/jnlp', \ContentManagement\controllers\JnlpController::class . ':generateJnlp');

src/app/home/controllers/HomeController.php

@@ -75,6 +75,14 @@ class HomeController
             $assignedBaskets[$key]['resourceNumber'] = BasketModel::getResourceNumberByClause(['userId' => $assignedBasket['user_abs'], 'clause' => $basket['basket_clause']]);
         }
 
+        return $response->withJson([
+            'regroupedBaskets'  => $regroupedBaskets,
+            'assignedBaskets'   => $assignedBaskets,
+        ]);
+    }
+
+    public function getLastRessources(Request $request, Response $response)
+    {
         $lastResources = ResModel::getLastResources([
             'select'    => [
                 'r.alt_identifier',
@@ -106,8 +114,6 @@ class HomeController
         ]);
 
         return $response->withJson([
-            'regroupedBaskets'  => $regroupedBaskets,
-            'assignedBaskets'   => $assignedBaskets,
             'lastResources'     => $lastResources,
         ]);
     }