fix: code badge & edit profile on drawer

src/components/UsersDetailCardComponent.vue

@@ -26,6 +26,7 @@ withDefaults(
     };
     hideButton?: boolean;
     badge?: CustomerBranch[];
+    canEditProfile?: boolean;
   }>(),
   {
     hideButton: false,
@@ -36,6 +37,7 @@ withDefaults(
 );
 
 defineEmits<{
+  (e: 'editProfile'): void;
   (e: 'deleteCard', id: string): void;
   (e: 'updateCard', action: 'FORM' | 'INFO', id: string): void;
   (e: 'viewCard', action: 'FORM' | 'INFO', id: string): void;
@@ -161,6 +163,12 @@ defineEmits<{
                 bordered
                 class="avatar"
                 style="border: 2px solid var(--border-color); height: 80px"
+                :class="{ 'edit-profile': canEditProfile }"
+                @click="
+                  () => {
+                    if (canEditProfile) $emit('editProfile');
+                  }
+                "
               >
                 <q-img
                   :src="list.imageUrl ?? '/no-profile.png'"
@@ -345,4 +353,13 @@ defineEmits<{
   justify-content: center;
   align-items: center;
 }
+
+.edit-profile {
+  cursor: pointer;
+  transition: opacity 0.2s ease;
+
+  &:hover {
+    opacity: 80%;
+  }
+}
 </style>