diff --git a/src/modules/04_registryPerson/views/detailView.vue b/src/modules/04_registryPerson/views/detailView.vue
index 9f24833b2..2187e6603 100644
--- a/src/modules/04_registryPerson/views/detailView.vue
+++ b/src/modules/04_registryPerson/views/detailView.vue
@@ -695,7 +695,7 @@ function closeImage() {
  * ฟังก์ชันยืนยันการลบรูป
  * @param id  รูปภาพ
  */
-function deletePhoto(id: string) {
+function deletePhoto(id: string, isActive: boolean) {
   dialogRemove(
     $q,
     async () => {
@@ -706,6 +706,10 @@ function deletePhoto(id: string) {
         .delete(config.API.orgProfileAvatarbyType(empType.value) + `/${id}`)
         .then(async () => {
           await getImage();
+          if (isActive) {
+            activeImage.value = null;
+            await fetchDataPersonal();
+          }
         })
         .catch((e) => {
           messageError($q, e);
@@ -1215,13 +1219,16 @@ onMounted(async () => {
                     icon="delete"
                     unelevated
                     dense
-                    @click="deletePhoto(n.id)"
+                    @click="deletePhoto(n.id, n.isActive)"
                     class="bg-white"
                     style="color: #ff8080"
                   >
                     <q-tooltip>ลบรูปภาพ</q-tooltip>
                   </q-btn>
                 </div>
+                <div class="absolute-top-right" v-if="n.isActive">
+                  <q-icon name="star" color="yellow" size="24px" />
+                </div>
               </q-img>
             </div>
           </div>
@@ -1229,7 +1236,12 @@ onMounted(async () => {
       </q-card-section>
       <q-separator />
       <q-card-actions align="right">
-        <q-btn @click="selectAvatarHistory" color="public" label="เลือกรูปภาพ">
+        <q-btn
+          @click="selectAvatarHistory"
+          color="public"
+          label="เลือกรูปภาพ"
+          :disable="images.length == 0"
+        >
           <q-tooltip>เลือกรูปภาพ</q-tooltip>
         </q-btn>
       </q-card-actions>