Add permissions check frontend

backend/app/Http/Controllers/UserController.php

@@ -11,9 +11,13 @@ class UserController extends Controller
     /**
      * Display a listing of the resource.
      */
-    public function index()
+    public function index(Request $request)
     {
+        $requestedCols = ['id', 'chief', 'last_access', 'name', 'available', 'driver', 'services', 'availability_minutes'];
+        if($request->user()->isAbleTo("users-read")) $requestedCols[] = "phone_number";
+
         return User::where('hidden', 0)
+            ->select($requestedCols)
             ->orderBy('available', 'desc')
             ->orderBy('chief', 'desc')
             ->orderBy('services', 'asc')

frontend/src/app/_components/modal-alert/modal-alert.component.html

@@ -42,7 +42,7 @@
             </ng-container>
         </tbody>
     </table>
-    <ng-container *ngIf="auth.profile.hasRole('SUPER_EDITOR') && alertEnabled">
+    <ng-container *ngIf="auth.profile.can('users-read') && alertEnabled">
         <button type="button" class="btn btn-primary mb-2" (click)="isAdvancedCollapsed = !isAdvancedCollapsed"
         [attr.aria-expanded]="!isAdvancedCollapsed" aria-controls="collapseBasic">
             <ng-container *ngIf="isAdvancedCollapsed">Mostra impostazioni avanzate</ng-container>
@@ -56,7 +56,7 @@
             </div>
         </div>
     </ng-container>
-    <ng-container *ngIf="(!auth.profile.hasRole('SUPER_EDITOR') && notes !== '') || !alertEnabled">
+    <ng-container *ngIf="(!auth.profile.can('users-read') && notes !== '') || !alertEnabled">
         <div class="well well-lg card card-block card-header">
             <h5>Dettagli allerta</h5>
             <h2>{{ notes }}</h2>
@@ -64,6 +64,6 @@
     </ng-container>
 </div>
 <div class="modal-footer">
-    <button type="button" class="btn btn-danger" (click)="deleteAlert()" *ngIf="auth.profile.hasRole('SUPER_EDITOR') && alertEnabled">Rimuovi allerta corrente <i class="fas fa-exclamation-triangle"></i></button>
+    <button type="button" class="btn btn-danger" (click)="deleteAlert()" *ngIf="auth.profile.can('users-read') && alertEnabled">Rimuovi allerta corrente <i class="fas fa-exclamation-triangle"></i></button>
     <button type="button" class="btn btn-secondary" (click)="bsModalRef.hide()">{{ 'close'|translate }}</button>
 </div>

frontend/src/app/_components/modal-alert/modal-alert.component.ts

@@ -60,7 +60,7 @@ export class ModalAlertComponent implements OnInit, OnDestroy {
   }
 
   saveAlertSettings() {
-    if(!this.auth.profile.hasRole('SUPER_EDITOR')) return;
+    if(!this.auth.profile.can('users-read')) return;
     this.api.post(`alerts/${this.id}/settings`, {
       notes: this.notes
     }).then((response) => {
@@ -69,7 +69,7 @@ export class ModalAlertComponent implements OnInit, OnDestroy {
   }
 
   deleteAlert() {
-    if(!this.auth.profile.hasRole('SUPER_EDITOR')) return;
+    if(!this.auth.profile.can('users-read')) return;
     Swal.fire({
       title: "Sei sicuro di voler ritirare l'allarme?",
       text: "I vigili verranno avvisati dell'azione",

frontend/src/app/_components/table/table.component.html

@@ -5,7 +5,7 @@
                 <th>{{ 'name'|translate|titlecase }}</th>
                 <th>{{ 'available'|translate|titlecase }}</th>
                 <th>{{ 'driver'|translate|titlecase }}</th>
-                <ng-container *ngIf="auth.profile.hasRole('SUPER_EDITOR')">
+                <ng-container *ngIf="auth.profile.can('users-read')">
                 <th>{{ 'call'|translate|titlecase }}</th>
                 </ng-container>
                 <th>{{ 'services'|translate|titlecase }}</th>
@@ -16,7 +16,7 @@
             <tr *ngFor="let row of data">
                 <td>
                     <!-- TODO: implement user impersonation -->
-                    <i *ngIf="false && auth.profile.hasRole('SUPER_ADMIN') && row.id !== auth.profile.auth_user_id" class="fa fa-user me-2" (click)="onUserImpersonate(row.id)"></i>
+                    <i *ngIf="false && auth.profile.can('users-read') && row.id !== auth.profile.auth_user_id" class="fa fa-user me-2" (click)="onUserImpersonate(row.id)"></i>
                     <img alt="red helmet" src="./assets/icons/red_helmet.png" width="20px" *ngIf="row.chief">
                     <img alt="red helmet" src="./assets/icons/black_helmet.png" width="20px" *ngIf="!row.chief">
                     <ng-container *ngIf="(getTime() - row.last_access) < 30"><u>{{ row.name }}</u></ng-container>
@@ -29,8 +29,10 @@
                 <td>
                     <img alt="driver" src="./assets/icons/wheel.png" width="20px" *ngIf="row.driver">
                 </td>
-                <td *ngIf="auth.profile.hasRole('SUPER_EDITOR')">
-                    <a href="tel:{{row.phone_number}}"><i class="fa fa-phone"></i></a>
+                <td *ngIf="auth.profile.can('users-read')">
+                    <ng-container *ngIf="row.phone_number">
+                        <a href="tel:{{row.phone_number}}"><i class="fa fa-phone"></i></a>
+                    </ng-container>
                 </td>
                 <td>{{ row.services }}</td>
                 <td>{{ row.availability_minutes }}</td>

frontend/src/app/_components/table/table.component.ts

@@ -68,7 +68,7 @@ export class TableComponent implements OnInit, OnDestroy {
   }
 
   onChangeAvailability(user: number, newState: 0|1) {
-    if(this.auth.profile.hasRole('SUPER_EDITOR')) {
+    if(this.auth.profile.can('users-read')) {
       this.changeAvailability.emit({user, newState});
     }
   }

frontend/src/app/_routes/list/list.component.html

@@ -18,7 +18,7 @@
     </button>
 </div>
 <owner-image></owner-image>
-<div class="text-center" *ngIf="false && auth.profile.hasRole('SUPER_EDITOR')">
+<div class="text-center" *ngIf="false && auth.profile.can('users-read')">
     <div class="btn-group" role="group">
         <button type="button" class="btn btn-danger" (click)="addAlertFull()" [disabled]="!api.availableUsers || api.availableUsers! < 5 || alertLoading">
             🚒 Richiedi squadra completa

frontend/src/app/_routes/list/list.component.ts

@@ -74,7 +74,7 @@ export class ListComponent implements OnInit, OnDestroy {
 
   addAlertFull() {
     this.alertLoading = true;
-    if(!this.auth.profile.hasRole('SUPER_EDITOR')) return;
+    if(!this.auth.profile.can('users-read')) return;
     this.api.post("alerts", {
       type: "full"
     }).then((response) => {
@@ -96,7 +96,7 @@ export class ListComponent implements OnInit, OnDestroy {
 
   addAlertSupport() {
     this.alertLoading = true;
-    if(!this.auth.profile.hasRole('SUPER_EDITOR')) return;
+    if(!this.auth.profile.can('users-read')) return;
     this.api.post("alerts", {
       type: "support"
     }).then((response) => {

frontend/src/app/_services/auth.service.ts

@@ -12,7 +12,9 @@ export interface LoginResponse {
   providedIn: 'root'
 })
 export class AuthService {
-    public profile: any = undefined;
+    public profile: any = {
+        can: (permission: string) => false
+    };
     public authChanged = new Subject<void>();
     public authLoaded = false;
 
@@ -22,8 +24,8 @@ export class AuthService {
             this.api.post("me").then((data: any) => {
                 this.profile = data;
     
-                this.profile.hasRole = (role: string) => {
-                    return true;
+                this.profile.can = (permission: string) => {
+                    return this.profile.permissions.includes(permission);
                 }
 
                 resolve();