frontend: user card

ui design update
rkshaon · Jul 23, 2024 · 1d7ba61 · 1d7ba61
1 parent 4948569
commit 1d7ba61
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 14 deletions.
diff --git a/frontend/src/components/admin/page/AdminProfilePage.vue b/frontend/src/components/admin/page/AdminProfilePage.vue
@@ -1,15 +1,6 @@
 <template>
     <div class="container mt-5">
-        <AdminProfileCardComponent :profileData="profileData" />
-        <!-- <h2 v-if="profileData.name">{{ profileData.name }}</h2>
-        <h2 v-else>Update your profile to set name.</h2>
-            <img v-if="profileData.picture" :src="`${API_BASE_URL}${profileData.picture}`" :alt="profileData.name"
-                height="250" />
-            <img v-else src="@/assets/loading.gif" alt="Static Photo" height="250">
-            <p>Email: {{ profileData.email }}</p>
-            <p>Username: {{ profileData.username }}</p>
-            <button class="btn btn-warning">Change Password</button>
-            <button class="btn btn-info">Edit Profile</button> -->
+        <AdminProfileCardComponent :profileData="profileData" class="mb-3" />
         <button class="btn btn-warning">Change Password</button>
         <button class="btn btn-info">Edit Profile</button>
     </div>

diff --git a/frontend/src/components/admin/user/AdminProfileCardComponent.vue b/frontend/src/components/admin/user/AdminProfileCardComponent.vue
@@ -4,6 +4,7 @@
             class="card-img-top" height="250" width="250" />
         <img v-else src="@/assets/loading.gif" alt="Static Photo" class="card-img-top" height="250" width="250">
         <h5 class="card-title">{{ profileData.name }}</h5>
+        <h6 class="card-title">{{ profileData.role }}</h6>
         <div class="card-body">
             <p class="card-text">
                 <font-awesome-icon :icon="['fas', 'envelope']" size="lg" />
@@ -13,10 +14,6 @@
                 <font-awesome-icon :icon="['fas', 'envelope']" size="lg" />
                 {{ profileData.username }}
             </p>
-            <p class="card-text">
-                <font-awesome-icon :icon="['fas', 'envelope']" size="lg" />
-                {{ profileData.role }}
-            </p>
         </div>
     </div>
 </template>