diff --git a/src/modules/04_registry/components/TableProfile.vue b/src/modules/04_registry/components/TableProfile.vue
index 89485a106..2d4066578 100644
--- a/src/modules/04_registry/components/TableProfile.vue
+++ b/src/modules/04_registry/components/TableProfile.vue
@@ -450,6 +450,7 @@
   </d-table>
   <PopupADdEmployee v-model:modal="modalEmployee" />
 </template>
+
 <script setup lang="ts">
 import { ref, useAttrs, reactive, watch } from "vue";
 import type { Pagination } from "@/modules/04_registry/interface/index/Main";
diff --git a/src/modules/04_registryPerson/components/TableView.vue b/src/modules/04_registryPerson/components/TableView.vue
index 1a572faf0..df44c3ce2 100644
--- a/src/modules/04_registryPerson/components/TableView.vue
+++ b/src/modules/04_registryPerson/components/TableView.vue
@@ -308,7 +308,6 @@ watch(
     >
     <template v-slot:header="props">
       <q-tr :props="props">
-        <q-th auto-width />
         <q-th v-for="col in props.cols" :key="col.name" :props="props">
           <span class="text-weight-medium" v-if="col.name === 'posLevel'">{{
             empType === "officer" ? col.label : "ระดับชั้นงาน"
@@ -328,21 +327,6 @@ watch(
     </template>
     <template v-slot:body="props" v-if="store.mode === 'table'">
       <q-tr :props="props">
-        <q-td auto-width>
-          <q-btn
-            icon="mdi-eye"
-            round
-            dense
-            flat
-            color="info"
-            @click.stpo.pervent="
-              checkPermission($route)?.attrIsGet &&
-                onClickViewDetail(props.row.id)
-            "
-          >
-            <q-tooltip>รายละเอียด</q-tooltip>
-          </q-btn>
-        </q-td>
         <q-td v-for="col in props.cols" :key="col.id">
           <div v-if="col.name === 'no'">
             {{
@@ -358,12 +342,20 @@ watch(
                   </q-avatar>
                 </q-item-section>
                 <q-item-section>
-                  <div class="text-weight-medium">
+                  <div
+                    class="text-weight-medium text-blue-4 cursor-pointer"
+                    @click="
+                      checkPermission($route)?.attrIsGet &&
+                        onClickViewDetail(props.row.id)
+                    "
+                  >
+                    <q-tooltip>รายละเอียด</q-tooltip>
                     {{
                       `${props.row.prefix ? props.row.prefix : ""}${
                         props.row.firstName
                       } ${props.row.lastName}`
                     }}
+                    <q-icon name="mdi-open-in-new" size="xs"></q-icon>
                   </div>
                   <div class="text-weight-light">{{ props.row.citizenId }}</div>
                 </q-item-section>
@@ -379,35 +371,25 @@ watch(
     <template v-slot:item="props" v-else>
       <div class="col-xs-12 col-sm-4 col-md-3">
         <q-card flat bordered>
-          <div
-            class="row justify-end q-mr-md"
-            v-if="checkPermission($route)?.attrIsGet"
-          >
-            <div class="col-1">
-              <q-btn
-                flat
-                dense
-                round
-                icon="mdi-eye"
-                color="info"
-                @click="onClickViewDetail(props.row.id)"
-              >
-                <q-tooltip>รายละเอียด</q-tooltip>
-              </q-btn>
-            </div>
-          </div>
-          <q-separator />
           <q-card-section class="text-center q-pb-none">
             <q-avatar size="80px" class="bg-grey-2">
               <q-img :src="props.row.avatar" />
             </q-avatar>
 
-            <div class="text-weight-medium q-mt-md">
+            <div
+              class="text-weight-medium q-mt-md text-blue-4 cursor-pointer"
+              @click="
+                checkPermission($route)?.attrIsGet &&
+                  onClickViewDetail(props.row.id)
+              "
+            >
+              <q-tooltip>รายละเอียด</q-tooltip>
               {{
                 `${props.row.prefix ? props.row.prefix : ""}${
                   props.row.firstName
                 } ${props.row.lastName}`
               }}
+              <q-icon name="mdi-open-in-new" size="xs"></q-icon>
             </div>
             <div class="text-weight-light full-width text-center">
               {{ props.row.citizenId }}
diff --git a/src/modules/04_registryPerson/views/detailView.vue b/src/modules/04_registryPerson/views/detailView.vue
index 5e09ed635..84bb4f9a3 100644
--- a/src/modules/04_registryPerson/views/detailView.vue
+++ b/src/modules/04_registryPerson/views/detailView.vue
@@ -742,13 +742,14 @@ onMounted(async () => {
         <q-btn
           v-if="checkPermission($route)?.attrIsUpdate"
           round
-          text-color="primary"
-          icon="mdi-pencil-outline"
+          text-color="edit"
+          icon="mdi-pencil"
           @click="openDialogImg"
           size="sm"
           unelevated
           class="bg-white btnEditImg"
         >
+          <q-tooltip>แก้ไขรูปโปรไฟล์</q-tooltip>
         </q-btn>
       </div>