diff --git a/src/modules/04_registryNew/components/detail/PersonalInformation/02_NameChangeHistory.vue b/src/modules/04_registryNew/components/detail/PersonalInformation/02_NameChangeHistory.vue
index 91fd224cd..b5be35f35 100644
--- a/src/modules/04_registryNew/components/detail/PersonalInformation/02_NameChangeHistory.vue
+++ b/src/modules/04_registryNew/components/detail/PersonalInformation/02_NameChangeHistory.vue
@@ -24,20 +24,19 @@ const {
   success,
   dialogConfirm,
   messageError,
-  typeChangeName,
   showLoader,
   hideLoader,
   dialogRemove,
 } = mixin;
 
-const { calculateAge, fetchPerson } = store;
+const { fetchPerson } = store;
 const profileId = ref<string>(route.params.id.toString());
 const editId = ref<string>("");
 const dialog = ref<boolean>(false);
 const dialogStatus = ref<string>("create");
 const filterSearch = ref("");
 const filterHistory = ref<string>("");
-const fileName = ref<string>("");
+
 const modalHistory = ref<boolean>(false);
 const rowsHistory = ref<RequestItemsObject[]>([]);
 const changeNameData = reactive<any>({
@@ -50,20 +49,23 @@ const changeNameData = reactive<any>({
   documentId: "",
 });
 
+const profileInfo = ref<any>([]);
+
 const statusOption = ref([
   "เปลี่ยนคำนำหน้าชื่อ",
   "เปลี่ยนชื่อ",
   "เปลี่ยนนามสกุล",
   "เปลี่ยนชื่อ-นามสกุล",
+  "เปลี่ยนคำนำหน้าชื่อ และชื่อ",
   "เปลี่ยนคำนำหน้าชื่อ และนามสกุล",
   "เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล",
 ]);
-const prefixFilter = ref([]);
 const statusOptionFilter = ref([
   "เปลี่ยนคำนำหน้าชื่อ",
   "เปลี่ยนชื่อ",
   "เปลี่ยนนามสกุล",
   "เปลี่ยนชื่อ-นามสกุล",
+  "เปลี่ยนคำนำหน้าชื่อ และชื่อ",
   "เปลี่ยนคำนำหน้าชื่อ และนามสกุล",
   "เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล",
 ]);
@@ -258,13 +260,13 @@ function closeDialog() {
   dialog.value = false;
 }
 
-function clearForm() {
-  changeNameData.status = "";
-  changeNameData.prefix = "";
-  changeNameData.firstName = "";
-  changeNameData.lastName = "";
-  alertUpload.value = false;
-}
+// function clearForm() {
+//   changeNameData.status = "";
+//   changeNameData.prefix = "";
+//   changeNameData.firstName = "";
+//   changeNameData.lastName = "";
+//   alertUpload.value = false;
+// }
 
 async function onSubmit() {
   if (!!fileUpload.value) {
@@ -334,6 +336,21 @@ async function uploadFileURL(uploadUrl: string, file: any) {
     });
 }
 
+async function fetchDataPersonal() {
+  showLoader();
+  await http
+    .get(config.API.registryNewByProfileId(profileId.value))
+    .then((res) => {
+      profileInfo.value = res.data.result;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
 async function fetchProfile(id: string) {
   showLoader();
   await http
@@ -396,24 +413,23 @@ function editData(idData: string) {
 }
 
 function deleteData(idData: string) {
-  // dialogRemove($q, () =>
-  http
-    .delete(config.API.profileNewChangeNameByChangeNameId(idData))
-    .then(() => {
-      fetchData(profileId.value);
-      success($q, "ลบข้อมูลสำเร็จ");
-    })
-    .catch((err) => {
-      messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-  // );
+  dialogRemove($q, () =>
+    http
+      .delete(config.API.profileNewChangeNameByChangeNameId(idData))
+      .then(() => {
+        fetchData(profileId.value);
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      })
+  );
 }
 
 function deleteFileData(idData: string) {
-  // dialogRemove($q, () =>
   http
     .delete(
       config.API.subFile(
@@ -432,7 +448,6 @@ function deleteFileData(idData: string) {
     .finally(() => {
       hideLoader();
     });
-  // );
 }
 
 async function fetchHistoryData(id: string) {
@@ -487,9 +502,9 @@ onMounted(async () => {
   ) {
     await fetchPerson();
   }
-  prefixFilter.value = store.Ops.prefixOps;
 
   fetchData(profileId.value);
+  fetchDataPersonal();
 });
 function filterSelector(val: string, update: Function, refData: string) {
   switch (refData) {
@@ -502,7 +517,7 @@ function filterSelector(val: string, update: Function, refData: string) {
       break;
     case "prefixOps":
       update(() => {
-        store.Ops.prefixOps = prefixFilter.value.filter(
+        store.Ops.prefixOps = store.OpsFilter.prefixOps.filter(
           (v: any) => v.name.indexOf(val) > -1
         );
       });
@@ -523,9 +538,12 @@ function filterSelector(val: string, update: Function, refData: string) {
       size="16px"
       @click="
         () => {
+          changeNameData.prefix = profileInfo.prefix;
+          changeNameData.firstName = profileInfo.firstName;
+          changeNameData.lastName = profileInfo.lastName;
+          changeNameData.status = '';
           dialogStatus = 'create';
           dialog = true;
-          clearForm();
         }
       "
     >
@@ -669,7 +687,7 @@ function filterSelector(val: string, update: Function, refData: string) {
         </q-td>
         <q-td auto-width>
           <q-btn
-            v-if="props.row.file != null"
+            v-if="props.row.file !== null"
             color="green"
             flat
             dense
@@ -688,7 +706,7 @@ function filterSelector(val: string, update: Function, refData: string) {
       <q-form @submit.prevent greedy @validation-success="onSubmit()">
         <q-card-section class="flex justify-between" style="padding: 0">
           <dialog-header
-            :tittle="dialogStatus == 'edit' ? 'แก้ไขข้อมูล' : 'เพิ่มข้อมูล'"
+            :tittle="dialogStatus === 'edit' ? 'แก้ไขข้อมูล' : 'เพิ่มข้อมูล'"
             :close="closeDialog"
           />
         </q-card-section>
@@ -717,6 +735,15 @@ function filterSelector(val: string, update: Function, refData: string) {
           <div class="row q-gutter-md q-mb-md">
             <div class="col">
               <q-select
+                :readonly="
+                  !changeNameData.status ||
+                  (changeNameData.status !== 'เปลี่ยนคำนำหน้าชื่อ' &&
+                    changeNameData.status !== 'เปลี่ยนคำนำหน้าชื่อ และชื่อ' &&
+                    changeNameData.status !==
+                      'เปลี่ยนคำนำหน้าชื่อ และนามสกุล' &&
+                    changeNameData.status !==
+                      'เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล')
+                "
                 v-model="changeNameData.prefix"
                 :options="store.Ops.prefixOps"
                 label="คำนำหน้าชื่อ"
@@ -739,6 +766,14 @@ function filterSelector(val: string, update: Function, refData: string) {
             </div>
             <div class="col">
               <q-input
+                :readonly="
+                  !changeNameData.status ||
+                  (changeNameData.status !== 'เปลี่ยนชื่อ' &&
+                    changeNameData.status !== 'เปลี่ยนคำนำหน้าชื่อ และชื่อ' &&
+                    changeNameData.status !== 'เปลี่ยนชื่อ-นามสกุล' &&
+                    changeNameData.status !==
+                      'เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล')
+                "
                 outlined
                 v-model="changeNameData.firstName"
                 label="ชื่อ"
@@ -750,6 +785,15 @@ function filterSelector(val: string, update: Function, refData: string) {
             </div>
             <div class="col">
               <q-input
+                :readonly="
+                  !changeNameData.status ||
+                  (changeNameData.status !== 'เปลี่ยนนามสกุล' &&
+                    changeNameData.status !== 'เปลี่ยนชื่อ-นามสกุล' &&
+                    changeNameData.status !==
+                      'เปลี่ยนคำนำหน้าชื่อ และนามสกุล' &&
+                    changeNameData.status !==
+                      'เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล')
+                "
                 outlined
                 v-model="changeNameData.lastName"
                 label="นามสกุล"
diff --git a/src/modules/13_salary/components/SalaryLists/Dashboard.vue b/src/modules/13_salary/components/SalaryLists/Dashboard.vue
index 25d8c3541..b2051636f 100644
--- a/src/modules/13_salary/components/SalaryLists/Dashboard.vue
+++ b/src/modules/13_salary/components/SalaryLists/Dashboard.vue
@@ -1,10 +1,30 @@
 <script setup lang="ts">
-import { ref, onMounted, reactive, computed } from "vue";
+import { ref, onMounted, computed, watch } from "vue";
+import { useQuasar } from "quasar";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
 import type { QTableProps } from "quasar";
 
 import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
+import { useCounterMixin } from "@/stores/mixin";
 
+const $q = useQuasar();
 const store = useSalaryListSDataStore();
+const { messageError, showLoader, hideLoader } = useCounterMixin();
+
+const props = defineProps({
+  year: Number,
+  snapShot: String,
+  roundFilter: Object,
+});
+
+const gruup = ref<string>("ALL");
+const options = ref([
+  { id: "ALL", name: "ทั้งหมด" },
+  { id: "group1", name: "กลุ่ม 1" },
+  { id: "group2", name: "กลุ่ม 2" },
+]);
 
 /** itemsCard*/
 const itemsCardAPR = ref([
@@ -256,8 +276,45 @@ const visibleColumns = ref<string[]>(
     : []
 );
 
-const gruup = ref<string>("ทั้งหมด");
-const options = ref(["ทั้งหมด", "กลุ่ม 1", "กลุ่ม 2"]);
+function fetchDataDashboard() {
+  const formData = {
+    year: props?.year,
+    group: gruup.value,
+    period: props?.roundFilter?.id,
+    snapshot: props?.snapShot,
+  };
+  http
+    .post(config.API.salaryDashboardEmp, formData)
+    .then((res) => {
+      const quota = res.data.result.dashboard;
+      itemsCardAPR.value[0].total = quota.total;
+      itemsCardAPR.value[1].total = quota.fifteenPercent;
+      itemsCardAPR.value[2].total = quota.chosen;
+      itemsCardAPR.value[3].total = quota.remaining;
+      itemsCardAPR.value[4].total = quota.totalBackup;
+
+      itemsCardOCT.value[0].total = quota.currentAmount;
+      itemsCardOCT.value[1].total = quota.sixPercentAmount;
+      itemsCardOCT.value[2].total = quota.spentAmount;
+      itemsCardOCT.value[3].total = quota.sixPercentSpentAmount;
+      itemsCardOCT.value[4].total = quota.useAmount;
+      itemsCardOCT.value[5].total = quota.remainingAmount;
+      itemsCardOCT.value[6].total = quota.totalBackup;
+
+      rows.value = res.data.result.salaryOrg;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    });
+}
+
+onMounted(() => {
+  fetchDataDashboard();
+});
+
+watch([() => props?.snapShot, () => props.roundFilter], () => {
+  fetchDataDashboard();
+});
 </script>
 
 <template>
@@ -269,7 +326,12 @@ const options = ref(["ทั้งหมด", "กลุ่ม 1", "กลุ่
       v-model="gruup"
       :options="options"
       label="กลุ่ม"
+      emit-value
+      map-options
+      option-label="name"
+      option-value="id"
       style="width: 150px"
+      @update:model-value="fetchDataDashboard"
     />
   </q-toolbar>
   <div class="row col-12 q-pa-md bg-grey-2">
diff --git a/src/modules/13_salary/views/salaryEmployeeLists.vue b/src/modules/13_salary/views/salaryEmployeeLists.vue
index cc202d66f..a975ce0ad 100644
--- a/src/modules/13_salary/views/salaryEmployeeLists.vue
+++ b/src/modules/13_salary/views/salaryEmployeeLists.vue
@@ -40,6 +40,7 @@ const snapOptions = ref<DataOption[]>();
 const periodLatest = ref<DataPeriodLatest>();
 
 const isLoad = ref<boolean>(false);
+const isDisable = ref<boolean>(false);
 
 /** ตัวแปร select*/
 const page = ref<number>(1);
@@ -51,6 +52,7 @@ const nextPage = ref<number>(1);
 /**function เรียกข้อมูลรอบการขึ้นเงินเดือน*/
 function getRound() {
   roundOptions.value = [];
+  isDisable.value = false;
   showLoader();
   http
     .get(
@@ -60,6 +62,7 @@ function getRound() {
     .then(async (res) => {
       const data = res.data.result.data;
       if (data.length !== 0) {
+        isDisable.value = true;
         lastPage.value = Math.ceil(res.data.result.total / pageSize.value);
         const optionMain = await data.map((x: DataRound) => ({
           id: x.id,
@@ -372,7 +375,7 @@ onMounted(() => {
       @update:model-value="onChangeRound"
       :loading="loading"
       @virtual-scroll="onScroll"
-      :disable="!isLoad"
+      :disable="!isDisable"
     >
       <template v-slot:option="scope">
         <q-item v-bind="scope.itemProps">
@@ -398,7 +401,7 @@ onMounted(() => {
       hide-bottom-space
       bg-color="white"
       @update:model-value="onChangeSnap"
-      :disable="!isLoad"
+      :disable="!isDisable"
     />
     <q-select
       class="q-ml-xs"
@@ -415,7 +418,7 @@ onMounted(() => {
       hide-bottom-space
       bg-color="white"
       @update:model-value="onChangeAgency"
-      :disable="!isLoad"
+      :disable="!isDisable"
     />
   </div>
 
diff --git a/src/modules/13_salary/views/salaryLists.vue b/src/modules/13_salary/views/salaryLists.vue
index 80bf65ffd..622797995 100644
--- a/src/modules/13_salary/views/salaryLists.vue
+++ b/src/modules/13_salary/views/salaryLists.vue
@@ -39,6 +39,7 @@ const snapOptions = ref<DataOption[]>();
 const periodLatest = ref<DataPeriodLatest>();
 
 const isLoad = ref<boolean>(false);
+const isDisable = ref<boolean>(false);
 
 /** ตัวแปร select*/
 const page = ref<number>(1);
@@ -51,6 +52,7 @@ const nextPage = ref<number>(1);
 function getRound() {
   roundOptions.value = [];
   showLoader();
+  isDisable.value = false;
   http
     .get(
       config.API.salaryPeriodActive(year.value.toString()) +
@@ -59,6 +61,7 @@ function getRound() {
     .then(async (res) => {
       const data = res.data.result.data;
       if (data.length !== 0) {
+        isDisable.value = true;
         lastPage.value = Math.ceil(res.data.result.total / pageSize.value);
         const optionMain = await data.map((x: DataRound) => ({
           id: x.id,
@@ -220,8 +223,6 @@ function fetchSalalyPeriod(rootId: string, periodId: string, snap: string) {
       .then(async (res) => {
         const data = res.data.result;
 
-        console.log(roundFilter.value.shortCode);
-
         if (roundFilter.value.shortCode !== "SPECIAL") {
           if (Object.values(data).includes(null)) {
             isLoad.value = false;
@@ -238,6 +239,7 @@ function fetchSalalyPeriod(rootId: string, periodId: string, snap: string) {
       })
       .catch((err) => {
         messageError($q, err);
+        // isLoad.value = true;
       })
       .finally(() => {
         setTimeout(() => {
@@ -396,7 +398,7 @@ onMounted(async () => {
       @update:model-value="onChangeRound"
       :loading="loading"
       @virtual-scroll="onScroll"
-      :disable="!isLoad"
+      :disable="!isDisable"
     >
       <template v-slot:option="scope">
         <q-item v-bind="scope.itemProps">
@@ -422,7 +424,7 @@ onMounted(async () => {
       hide-bottom-space
       bg-color="white"
       @update:model-value="onChangeSnap"
-      :disable="!isLoad"
+      :disable="!isDisable"
     />
     <q-select
       class="q-ml-xs"
@@ -439,7 +441,7 @@ onMounted(async () => {
       hide-bottom-space
       bg-color="white"
       @update:model-value="onChangeAgency"
-      :disable="!isLoad"
+      :disable="!isDisable"
     />
   </div>
 
@@ -480,7 +482,11 @@ onMounted(async () => {
       </q-card>
     </div>
     <div v-else>
-      <PageDashBoard />
+      <PageDashBoard
+        :year="year"
+        :snapShot="snapFilter"
+        :roundFilter="roundFilter"
+      />
     </div>
   </q-card>