feat: er komt een popup scherm bij het uitloggen waarbij nog geannuleerd kan worden
This commit is contained in:
		
							parent
							
								
									43a0cba300
								
							
						
					
					
						commit
						639b765112
					
				
					 1 changed files with 45 additions and 5 deletions
				
			
		|  | @ -31,12 +31,15 @@ | ||||||
|         localStorage.setItem("user-lang", langCode); |         localStorage.setItem("user-lang", langCode); | ||||||
|     }; |     }; | ||||||
| 
 | 
 | ||||||
|  |     // contains functionality to let the collapsed menu appear and disappear | ||||||
|  |     // when the screen size varies | ||||||
|     const drawer = ref(false); |     const drawer = ref(false); | ||||||
| 
 | 
 | ||||||
|     // when the user wants to logout, the authentication must be set to False |     // when the user wants to logout, a popup is shown to verify this | ||||||
|     function performLogout() { |     // if verified, the user should be logged out | ||||||
|  |     const performLogout = () => { | ||||||
|         auth.logout(); |         auth.logout(); | ||||||
|     } |     }; | ||||||
| </script> | </script> | ||||||
| 
 | 
 | ||||||
| <template> | <template> | ||||||
|  | @ -222,7 +225,7 @@ | ||||||
|             </div> |             </div> | ||||||
|             <div class="right"> |             <div class="right"> | ||||||
|                 <li> |                 <li> | ||||||
|                     <v-btn |                     <!-- <v-btn | ||||||
|                         @click="performLogout" |                         @click="performLogout" | ||||||
|                         to="/login" |                         to="/login" | ||||||
|                         style="background-color: transparent; box-shadow: none !important" |                         style="background-color: transparent; box-shadow: none !important" | ||||||
|  | @ -240,7 +243,44 @@ | ||||||
|                                 ></v-icon> |                                 ></v-icon> | ||||||
|                             </template> |                             </template> | ||||||
|                         </v-tooltip> |                         </v-tooltip> | ||||||
|                     </v-btn> |                     </v-btn> --> | ||||||
|  |                     <v-dialog max-width="500"> | ||||||
|  |                         <template v-slot:activator="{ props: activatorProps }"> | ||||||
|  |                             <v-btn | ||||||
|  |                                 v-bind="activatorProps" | ||||||
|  |                                 style="background-color: transparent; box-shadow: none !important" | ||||||
|  |                             > | ||||||
|  |                                 <v-tooltip | ||||||
|  |                                     :text="t('logout')" | ||||||
|  |                                     location="bottom" | ||||||
|  |                                 > | ||||||
|  |                                     <template v-slot:activator="{ props }"> | ||||||
|  |                                         <v-icon | ||||||
|  |                                             v-bind="props" | ||||||
|  |                                             icon="mdi-logout" | ||||||
|  |                                             size="x-large" | ||||||
|  |                                             color="#0e6942" | ||||||
|  |                                         > | ||||||
|  |                                         </v-icon> | ||||||
|  |                                     </template> | ||||||
|  |                                 </v-tooltip> | ||||||
|  |                             </v-btn> | ||||||
|  |                         </template> | ||||||
|  | 
 | ||||||
|  |                         <template v-slot:default="{ isActive }"> | ||||||
|  |                             <v-card :title="t('logoutVerification')"> | ||||||
|  |                                 <v-card-actions> | ||||||
|  |                                     <v-spacer></v-spacer> | ||||||
|  | 
 | ||||||
|  |                                     <v-btn | ||||||
|  |                                         :text="t('cancel')" | ||||||
|  |                                         @click="isActive.value = false" | ||||||
|  |                                     ></v-btn> | ||||||
|  |                                     <v-btn :text="t('logout')"  @click="performLogout" to="/login"></v-btn> | ||||||
|  |                                 </v-card-actions> | ||||||
|  |                             </v-card> | ||||||
|  |                         </template> | ||||||
|  |                     </v-dialog> | ||||||
|                 </li> |                 </li> | ||||||
|                 <li> |                 <li> | ||||||
|                     <v-avatar |                     <v-avatar | ||||||
|  |  | ||||||
		Reference in a new issue
	
	 Laure Jablonski
						Laure Jablonski