fix bug

2024-11-04 15:21:23 +07:00 · 2024-11-04 15:21:23 +07:00 · 3b6c22027c
commit 3b6c22027c
parent aa9b04772b
26 changed files with 155 additions and 134 deletions
--- a/src/modules/04_registryPerson/components/detail/Achievement/01_ProfessionalLicense.vue
+++ b/src/modules/04_registryPerson/components/detail/Achievement/01_ProfessionalLicense.vue
@ -32,8 +32,8 @@ const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
 /**
 * props
 */
-const props = defineProps({
-  isLeave: Boolean,
+ const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const mode = ref<string>("table"); //การแสดงผล Table,Card
@ -377,7 +377,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+      v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
      round
      flat
      color="primary"
@ -486,7 +486,7 @@ onMounted(() => {
            <q-tooltip>ประวัติแก้ไขใบอนุญาตประกอบวิชาชีพ</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
            flat
            dense
            round
@ -527,7 +527,7 @@ onMounted(() => {
              <q-tooltip>ประวัติแก้ไขใบอนุญาตประกอบวิชาชีพ</q-tooltip>
            </q-btn>
            <q-btn
-              v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+              v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
              flat
              round
              color="edit"
--- a/src/modules/04_registryPerson/components/detail/Achievement/02_Train.vue
+++ b/src/modules/04_registryPerson/components/detail/Achievement/02_Train.vue
@ -16,8 +16,8 @@ import dialogHeader from "@/components/DialogHeader.vue";
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const route = useRoute();
@ -531,7 +531,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      round
      dense
      flat
@ -642,7 +642,9 @@ onMounted(() => {
            <q-tooltip>ประวัติแก้ไขการฝึกอบรม/ดูงาน</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="
+              isLeave == false && checkPermission($route)?.attrIsUpdate
+            "
            flat
            dense
            round
@ -682,7 +684,9 @@ onMounted(() => {
              <q-tooltip>ประวัติแก้ไขการฝึกอบรม/ดูงาน</q-tooltip>
            </q-btn>
            <q-btn
-              v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+              v-if="
+                isLeave == false && checkPermission($route)?.attrIsUpdate
+              "
              flat
              round
              color="edit"
--- a/src/modules/04_registryPerson/components/detail/Achievement/03_Insignia.vue
+++ b/src/modules/04_registryPerson/components/detail/Achievement/03_Insignia.vue
@ -38,8 +38,8 @@ const {
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const profileId = ref<string>(
@ -656,7 +656,7 @@ onMounted(async () => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      dense
      color="primary"
      icon="add"
@ -776,7 +776,9 @@ onMounted(async () => {
          </q-btn>

          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="
+              isLeave == false && checkPermission($route)?.attrIsUpdate
+            "
            flat
            dense
            round
@ -809,7 +811,9 @@ onMounted(async () => {
              <q-tooltip>ประวัติแก้ไขเครื่องราชอิสริยาภรณ์</q-tooltip>
            </q-btn>
            <q-btn
-              v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+              v-if="
+                isLeave == false && checkPermission($route)?.attrIsUpdate
+              "
              flat
              round
              color="edit"
--- a/src/modules/04_registryPerson/components/detail/Achievement/04_DeclarationHonor.vue
+++ b/src/modules/04_registryPerson/components/detail/Achievement/04_DeclarationHonor.vue
@ -35,8 +35,8 @@ const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+ const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const id = ref<string>(""); //id ที่ต้องการแก้ไข
@ -372,7 +372,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      dense
      color="primary"
      icon="add"
@ -491,7 +491,7 @@ onMounted(() => {
            <q-tooltip>ประวัติแก้ไขประกาศเกียรติคุณ</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
            flat
            dense
            round
@ -524,7 +524,7 @@ onMounted(() => {
              <q-tooltip>ประวัติแก้ไขประกาศเกียรติคุณ</q-tooltip>
            </q-btn>
            <q-btn
-              v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+              v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
              flat
              round
              color="edit"
--- a/src/modules/04_registryPerson/components/detail/Achievement/05_ResultsPerformance.vue
+++ b/src/modules/04_registryPerson/components/detail/Achievement/05_ResultsPerformance.vue
@ -49,8 +49,8 @@ const kpiDevelopmentId = ref<string>(""); // id การพัฒนารา
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+ const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const totalIdp = ref<number>(0);
@ -587,7 +587,7 @@ onMounted(async () => {
        <div class="col-12">
          <div class="row items-center q-gutter-x-sm q-pb-sm">
            <q-btn
-              v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+              v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
              dense
              color="primary"
              icon="add"
@ -710,7 +710,7 @@ onMounted(async () => {
                    >
                  </q-btn>
                  <q-btn
-                    v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+                    v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
                    flat
                    dense
                    round
@ -745,7 +745,7 @@ onMounted(async () => {
                      >
                    </q-btn>
                    <q-btn
-                      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+                      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
                      flat
                      round
                      color="edit"
--- a/src/modules/04_registryPerson/components/detail/Employee/01_DataEmployee.vue
+++ b/src/modules/04_registryPerson/components/detail/Employee/01_DataEmployee.vue
@ -36,8 +36,8 @@ const profileId = ref<string>(
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+ const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 /** ข้อมูลลูกจ้างชั่วคราว*/
@ -303,7 +303,7 @@ onMounted(() => {
  <div class="row q-gutter-sm items-center">
    <div class="toptitle col text-right q-gutter-x-sm">
      <q-btn
-        v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+        v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
        flat
        round
        dense
--- a/src/modules/04_registryPerson/components/detail/Employee/02_Employment.vue
+++ b/src/modules/04_registryPerson/components/detail/Employee/02_Employment.vue
@ -34,8 +34,8 @@ const profileId = ref<string>(route.params.id.toString());
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+ const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 /** ข้อมูลการจ้าง*/
@ -234,7 +234,7 @@ onMounted(() => {
  <div class="flex items-center">
    <div class="q-gutter-sm">
      <q-btn
-        v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+        v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
        size="12px"
        flat
        round
@ -317,7 +317,7 @@ onMounted(() => {
              <q-tooltip>ประวัติข้อมูลการจ้าง </q-tooltip>
            </q-btn>
            <q-btn
-              v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+              v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
              dense
              flat
              round
@ -328,7 +328,7 @@ onMounted(() => {
              <q-tooltip>แก้ไขข้อมูล</q-tooltip>
            </q-btn>
            <q-btn
-              v-if="props.isLeave == false && checkPermission($route)?.attrIsDelete"
+              v-if="isLeave == false && checkPermission($route)?.attrIsDelete"
              dense
              flat
              round
--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/01_Info.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/01_Info.vue
@ -33,8 +33,8 @@ const {
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });
 const profileId = ref<string>(route.params.id.toString());
 const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
@ -298,7 +298,7 @@ onMounted(() => {
    <q-space />
    <div class="q-gutter-x-sm">
      <q-btn
-        v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+        v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
        flat
        dense
        round
@ -326,26 +326,32 @@ onMounted(() => {
          <div class="col-12 col-sm-12 col-md-5 text-grey-6 text-weight-medium">
            <div>สังกัด</div>
          </div>
-          <div class="col-12 col-sm-12 col-md-7">{{ formMain.ocId ? formMain.ocId:'-' }}</div>
+          <div class="col-12 col-sm-12 col-md-7">
+            {{ formMain.ocId ? formMain.ocId : "-" }}
+          </div>
        </div>
        <div class="row items-center">
          <div class="col-12 col-sm-12 col-md-5 text-grey-6 text-weight-medium">
            <div>{{ empType === "" ? `ตำแหน่งในสายงาน` : `ตำแหน่ง` }}</div>
          </div>
-          <div class="col-12 col-sm-12 col-md-7">{{ formMain.positionId ? formMain.positionId:'-' }}</div>
+          <div class="col-12 col-sm-12 col-md-7">
+            {{ formMain.positionId ? formMain.positionId : "-" }}
+          </div>
        </div>
        <div class="row items-center">
          <div class="col-12 col-sm-12 col-md-5 text-grey-6 text-weight-medium">
            <div>ตำแหน่งเลขที่</div>
          </div>
-          <div class="col-12 col-sm-12 col-md-7">{{ formMain.numberId? formMain.numberId:'-' }}</div>
+          <div class="col-12 col-sm-12 col-md-7">
+            {{ formMain.numberId ? formMain.numberId : "-" }}
+          </div>
        </div>
        <div class="row items-center" v-if="empType === ''">
          <div class="col-12 col-sm-12 col-md-5 text-grey-6 text-weight-medium">
            <div>ตำแหน่งทางการบริหาร</div>
          </div>
          <div class="col-12 col-sm-12 col-md-7">
-            {{ formMain.positionExecutive ? formMain.positionExecutive:'-' }}
+            {{ formMain.positionExecutive ? formMain.positionExecutive : "-" }}
          </div>
        </div>
        <div class="row items-center" v-if="empType === ''">
@ -353,7 +359,11 @@ onMounted(() => {
            <div>ด้านทางการบริหาร</div>
          </div>
          <div class="col-12 col-sm-12 col-md-7">
-            {{ formMain.positionExecutiveSide ? formMain.positionExecutiveSide:'-' }}
+            {{
+              formMain.positionExecutiveSide
+                ? formMain.positionExecutiveSide
+                : "-"
+            }}
          </div>
        </div>
      </div>
@ -363,7 +373,7 @@ onMounted(() => {
            <div>สายงาน</div>
          </div>
          <div class="col-12 col-sm-12 col-md-7">
-            {{ formMain.positionLine ? formMain.positionLine:'-' }}
+            {{ formMain.positionLine ? formMain.positionLine : "-" }}
          </div>
        </div>
        <div class="row items-center">
@ -371,7 +381,7 @@ onMounted(() => {
            <div>{{ empType === "" ? "ตำแหน่งประเภท" : "กลุ่มงาน" }}</div>
          </div>
          <div class="col-12 col-sm-12 col-md-7">
-            {{ formMain.positionType ? formMain.positionType:'-' }}
+            {{ formMain.positionType ? formMain.positionType : "-" }}
          </div>
        </div>
        <div class="row items-center">
@ -379,7 +389,7 @@ onMounted(() => {
            <div>{{ empType === "" ? "ระดับ" : "ระดับชั้นงาน" }}</div>
          </div>
          <div class="col-12 col-sm-12 col-md-7">
-            {{ formMain.positionLevel ? formMain.positionLevel:'-' }}
+            {{ formMain.positionLevel ? formMain.positionLevel : "-" }}
          </div>
        </div>
        <div class="row items-center" v-if="empType === ''">
@ -387,7 +397,7 @@ onMounted(() => {
            <div>ด้าน/สาขา</div>
          </div>
          <div class="col-12 col-sm-12 col-md-7">
-            {{ formMain.positionPathSide ? formMain.positionPathSide:'-' }}
+            {{ formMain.positionPathSide ? formMain.positionPathSide : "-" }}
          </div>
        </div>
      </div>
--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/02_Discipline.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/02_Discipline.vue
@ -39,8 +39,8 @@ const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+ const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 //ฟอร์มข้อมูลวินัย
@ -351,7 +351,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      dense
      color="primary"
      icon="add"
@ -472,7 +472,7 @@ onMounted(() => {
            <q-tooltip>ประวัติแก้ไขวินัย</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
            flat
            dense
            round
@ -506,7 +506,7 @@ onMounted(() => {
                ><q-tooltip>ประวิติแก้ไขวินัย</q-tooltip></q-btn
              >
              <q-btn
-                v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+                v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
                color="edit"
                icon="edit"
                flat
--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/02_DisciplineHistory.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/02_DisciplineHistory.vue
@ -27,9 +27,7 @@ const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
-});
+
 const filterKeyword = ref<string>(""); //คำค้นหา
 const rows = ref<RequestItemsObject[]>([]); //รายการประวัติแก้ไขวินัย
 const columns = ref<QTableProps["columns"]>([
--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/03_Leave.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/03_Leave.vue
@ -25,8 +25,8 @@ import DialogHistory from "@/modules/04_registryPerson/components/detail/Governm
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });
 const route = useRoute();

@ -449,7 +449,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      dense
      color="primary"
      icon="add"
@ -568,7 +568,9 @@ onMounted(() => {
            <q-tooltip>ประวัติแก้ไขการลา</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="
+              isLeave == false && checkPermission($route)?.attrIsUpdate
+            "
            flat
            dense
            round
@ -613,7 +615,10 @@ onMounted(() => {
                ><q-tooltip>ประวิติแก้ไขการลา</q-tooltip></q-btn
              >
              <q-btn
-                v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+                v-if="
+                  isLeave == false &&
+                  checkPermission($route)?.attrIsUpdate
+                "
                color="edit"
                icon="edit"
                flat
--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/03_LeaveHistory.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/03_LeaveHistory.vue
@ -26,12 +26,6 @@ const { showLoader, hideLoader, messageError, date2Thai, pathRegistryEmp } =

 const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));

-/**
- * props
- */
- const props = defineProps({
-  isLeave:Boolean
-});
 const filterKeyword = ref<string>("");
 const rows = ref<DetailData[]>([]); //data history
 const formFilter = reactive<FormFilter>({
--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/04_PerformSpecialWork.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/04_PerformSpecialWork.vue
@ -35,8 +35,8 @@ const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });
 const id = ref<string>(""); //id ที่ต้องการแก้ไข
 const modal = ref<boolean>(false); //แสดง popup ข้อมูลปฏิบัติราชการพิเศษ
@ -274,7 +274,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      dense
      color="primary"
      icon="add"
@ -394,7 +394,9 @@ onMounted(() => {
            <q-tooltip>ประวัติแก้ไขปฏิบัติราชการพิเศษ</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="
+              isLeave == false && checkPermission($route)?.attrIsUpdate
+            "
            flat
            dense
            round
@ -428,7 +430,10 @@ onMounted(() => {
                ><q-tooltip>ประวัติแก้ไขปฏิบัติราชการพิเศษ</q-tooltip>
              </q-btn>
              <q-btn
-                v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+                v-if="
+                  isLeave == false &&
+                  checkPermission($route)?.attrIsUpdate
+                "
                color="edit"
                icon="edit"
                flat
--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/04_PerformSpecialWorkHistory.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/04_PerformSpecialWorkHistory.vue
@ -21,12 +21,6 @@ const { showLoader, hideLoader, messageError, date2Thai, pathRegistryEmp } =

 const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));

-/**
- * props
- */
- const props = defineProps({
-  isLeave:Boolean
-});
 const filterKeyword = ref<string>(""); //คำค้นหา
 const rows = ref<ResponseObject[]>([]); //data history
 const columns = ref<QTableProps["columns"]>([
--- a/src/modules/04_registryPerson/components/detail/Other/01_OtherInformation.vue
+++ b/src/modules/04_registryPerson/components/detail/Other/01_OtherInformation.vue
@ -31,8 +31,8 @@ const id = ref<string>("");
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const profileId = ref<string>(
@ -209,7 +209,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      dense
      color="primary"
      icon="add"
@ -327,7 +327,7 @@ onMounted(() => {
            <q-tooltip>ประวัติแก้ไขอื่นๆ</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
            flat
            dense
            round
@ -360,7 +360,7 @@ onMounted(() => {
                ><q-tooltip>ประวิติแก้ไขอื่นๆ</q-tooltip></q-btn
              >
              <q-btn
-                v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+                v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
                color="edit"
                icon="edit"
                flat
--- a/src/modules/04_registryPerson/components/detail/Other/02_Document.vue
+++ b/src/modules/04_registryPerson/components/detail/Other/02_Document.vue
@ -26,8 +26,8 @@ const {
 /**
 * props
 */
-const props = defineProps({
-  isLeave: Boolean,
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const profileId = ref<string>(
@ -193,7 +193,7 @@ onMounted(() => {
    <div class="row col-12 q-col-gutter-y-sm q-pa-sm">
      <div class="col-12 row">
        <q-file
-          v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+          v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
          for="inputFiles"
          class="col-12"
          outlined
@ -248,7 +248,7 @@ onMounted(() => {
                ><q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
              >
              <q-btn
-                v-if="props.isLeave == false"
+                v-if="isLeave == false"
                size="12px"
                flat
                round
--- a/src/modules/04_registryPerson/components/detail/PersonalInformation/01_Profile.vue
+++ b/src/modules/04_registryPerson/components/detail/PersonalInformation/01_Profile.vue
@ -41,9 +41,11 @@ const {
 /**
 * props
 */
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
+});
 const props = defineProps({
  fetchDataPersonal: { type: Function, require: true },
-  isLeave: Boolean,
 });

 const profileId = ref<string>(
@ -65,7 +67,7 @@ const filterHistory = ref<string>(""); //คำค้นหาช้อมูล
 const modalHistory = ref<boolean>(false); // แสดงช้อมูลรายการประวัติการแก้ไข
 const age = ref<string | null>(""); //อายุ
 const formData = reactive<RequestObject>(store.defaultProfile); //ฟอร์มข้อมูลการแก่้ไข
-const emailVerify = ref<string|null>('')
+const emailVerify = ref<string | null>("");

 /** ข้อมูล Label*/
 const dataLabel = {
@ -294,7 +296,7 @@ async function getData() {
    .then((res) => {
      informaData.value = res.data.result;
      id.value = res.data.result.id;
-      emailVerify.value = res.data.result.statusEmail
+      emailVerify.value = res.data.result.statusEmail;
      if (res.data.result.birthDate) {
        // กำหนดอายุ ส่งวันเกิดไปคำนวน
        age.value = calculateAge(res.data.result.birthDate);
@ -448,7 +450,7 @@ onMounted(() => {
  <div class="row q-gutter-sm items-center">
    <div class="toptitle col text-right">
      <q-btn
-        v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+        v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
        flat
        round
        dense
@ -539,7 +541,11 @@ onMounted(() => {
          </div>
          <div class="q-py-xs">
            {{ informaData.email ? informaData.email : "-"
-            }}<q-icon v-if="emailVerify == 'NOT_VERIFIED'" name="mdi-alert-box" color="warning" size="sm"
+            }}<q-icon
+              v-if="emailVerify == 'NOT_VERIFIED'"
+              name="mdi-alert-box"
+              color="warning"
+              size="sm"
              ><q-tooltip>รอยืนยันอีเมล</q-tooltip></q-icon
            >
          </div>
--- a/src/modules/04_registryPerson/components/detail/PersonalInformation/02_NameChangeHistory.vue
+++ b/src/modules/04_registryPerson/components/detail/PersonalInformation/02_NameChangeHistory.vue
@ -44,9 +44,11 @@ const {
 /**
 * props
 */
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
+});
 const props = defineProps({
  fetchDataPersonal: { type: Function, require: true },
-  isLeave:Boolean
 });

 const profileId = ref<string>(route.params.id.toString()); //id Profile
@ -451,7 +453,7 @@ onMounted(async () => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      round
      flat
      color="primary"
--- a/src/modules/04_registryPerson/components/detail/PersonalInformation/03_Address.vue
+++ b/src/modules/04_registryPerson/components/detail/PersonalInformation/03_Address.vue
@ -40,8 +40,8 @@ const {
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const profileId = ref<string>(
@ -533,7 +533,7 @@ onMounted(async () => {
  <div class="row q-gutter-sm items-center">
    <div class="toptitle col text-right">
      <q-btn
-        v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+        v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
        flat
        round
        dense
--- a/src/modules/04_registryPerson/components/detail/PersonalInformation/04_FamilyNew.vue
+++ b/src/modules/04_registryPerson/components/detail/PersonalInformation/04_FamilyNew.vue
@ -35,8 +35,8 @@ const {
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });
 const profileId = ref<string>(
  route.params.id ? route.params.id.toString() : ""
@ -511,7 +511,7 @@ onMounted(async () => {
        </q-toolbar-title>
        <div class="row q-col-gutter-sm">
          <q-btn
-            v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+            v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
            round
            flat
            color="edit"
@ -585,7 +585,7 @@ onMounted(async () => {
        </q-toolbar-title>
        <div class="row q-col-gutter-sm">
          <q-btn
-            v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+            v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
            round
            flat
            color="edit"
@ -659,7 +659,7 @@ onMounted(async () => {
            • คู่สมรส
          </div>
          <q-btn
-            v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+            v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
            round
            flat
            dense
@ -758,7 +758,7 @@ onMounted(async () => {
        <div class="row q-col-gutter-sm">
          <div class="text-weight-bold text-primary text-subtitle1">• บุตร</div>
          <q-btn
-            v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+            v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
            round
            flat
            dense
@ -781,7 +781,7 @@ onMounted(async () => {
            <q-space />
            <div class="row q-col-gutter-sm">
              <q-btn
-                v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+                v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
                round
                flat
                color="edit"
--- a/src/modules/04_registryPerson/components/detail/PersonalInformation/05_Education.vue
+++ b/src/modules/04_registryPerson/components/detail/PersonalInformation/05_Education.vue
@ -42,8 +42,8 @@ const mode = ref<string>("table"); //การแสดงของ Table card
 /**
 * props
 */
-const props = defineProps({
-  isLeave: Boolean,
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });
 //Table
 const rows = ref<ResponseObject[]>([]);
@ -752,7 +752,7 @@ onMounted(async () => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      round
      flat
      dense
@ -863,7 +863,9 @@ onMounted(async () => {
            <q-tooltip>ประวัติแก้ไขประวัติการศึกษา</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="
+              isLeave == false && checkPermission($route)?.attrIsUpdate
+            "
            flat
            dense
            round
@ -904,7 +906,7 @@ onMounted(async () => {
              <q-tooltip>ประวัติแก้ไขประวัติการศึกษา</q-tooltip>
            </q-btn>
            <q-btn
-              v-if="props.isLeave == false"
+              v-if="isLeave == false"
              dense
              flat
              round
--- a/src/modules/04_registryPerson/components/detail/PersonalInformation/06_SpecialSkill.vue
+++ b/src/modules/04_registryPerson/components/detail/PersonalInformation/06_SpecialSkill.vue
@ -35,8 +35,8 @@ const mode = ref<string>("table"); //การแสดงของ Table card
 /**
 * props
 */
-const props = defineProps({
-  isLeave: Boolean,
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });
 //Table
 const keyword = ref<string>(""); //คำต้นหา
@ -352,7 +352,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      flat
      round
      color="primary"
@ -456,9 +456,7 @@ onMounted(() => {
            <q-tooltip>ประวัติแก้ไขความสามารถพิเศษ</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="
-              props.isLeave == false && checkPermission($route)?.attrIsUpdate
-            "
+            v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
            flat
            dense
            round
@ -498,7 +496,7 @@ onMounted(() => {
              <q-tooltip>ประวัติแก้ไขความสามารถพิเศษ</q-tooltip>
            </q-btn>
            <q-btn
-              v-if="props.isLeave == false"
+              v-if="isLeave == false"
              dense
              flat
              round
--- a/src/modules/04_registryPerson/components/detail/Salary/01_PositionSalary.vue
+++ b/src/modules/04_registryPerson/components/detail/Salary/01_PositionSalary.vue
@ -35,8 +35,8 @@ const profileId = ref<string>(
 /**
 * props
 */
-const props = defineProps({
-  isLeave: Boolean,
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const store = useSalaryDataStore();
@ -628,7 +628,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="!props.isLeave && checkPermission($route)?.attrIsUpdate"
+      v-if="!isLeave && checkPermission($route)?.attrIsUpdate"
      flat
      color="primary"
      round
@ -703,9 +703,7 @@ onMounted(() => {
          </q-btn>

          <q-btn
-            v-if="
-              props.isLeave == false && checkPermission($route)?.attrIsUpdate
-            "
+            v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
            flat
            dense
            round
@ -717,9 +715,7 @@ onMounted(() => {
            <q-tooltip>แก้ไขข้อมูล</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="
-              props.isLeave == false && checkPermission($route)?.attrIsUpdate
-            "
+            v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
            dense
            flat
            round
@ -731,9 +727,7 @@ onMounted(() => {
          </q-btn>

          <q-btn
-            v-if="
-              props.isLeave == false && checkPermission($route)?.attrIsUpdate
-            "
+            v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
            dense
            flat
            round
--- a/src/modules/04_registryPerson/components/detail/Salary/02_NotReceiveSalary.vue
+++ b/src/modules/04_registryPerson/components/detail/Salary/02_NotReceiveSalary.vue
@ -36,8 +36,8 @@ const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
 /**
 * props
 */
- const props = defineProps({
-  isLeave:Boolean
+const isLeave = defineModel<boolean>("isLeave", {
+  required: true,
 });

 const modelView = ref<string>("table"); //การแสดงผล Table,Card
@ -244,7 +244,7 @@ onMounted(() => {
 <template>
  <div class="row items-center q-gutter-x-sm q-pb-sm">
    <q-btn
-      v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+      v-if="isLeave == false && checkPermission($route)?.attrIsUpdate"
      dense
      color="primary"
      icon="add"
@ -363,7 +363,9 @@ onMounted(() => {
            <q-tooltip>ประวัติบันทึกวันที่ไม่ได้รับเงินเดือนฯ</q-tooltip>
          </q-btn>
          <q-btn
-            v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+            v-if="
+              isLeave == false && checkPermission($route)?.attrIsUpdate
+            "
            flat
            dense
            round
@ -395,7 +397,9 @@ onMounted(() => {
              <q-tooltip>ประวัติบันทึกวันที่ไม่ได้รับเงินเดือนฯ</q-tooltip>
            </q-btn>
            <q-btn
-              v-if="props.isLeave == false && checkPermission($route)?.attrIsUpdate"
+              v-if="
+                isLeave == false && checkPermission($route)?.attrIsUpdate
+              "
              flat
              round
              color="edit"
--- a/src/modules/04_registryPerson/components/detail/Salary/Main.vue
+++ b/src/modules/04_registryPerson/components/detail/Salary/Main.vue
@ -1,13 +1,13 @@
 <script setup lang="ts">
 import { ref } from "vue";

-import { useRegistryNewDataStore } from '@/modules/04_registryPerson/store'
+import { useRegistryNewDataStore } from "@/modules/04_registryPerson/store";

 /** importComponents*/
 import PositionSalary from "@/modules/04_registryPerson/components/detail/Salary/01_PositionSalary.vue"; //ตำแหน่งเงินเดือน
 import NotReceiveSalary from "@/modules/04_registryPerson/components/detail/Salary/02_NotReceiveSalary.vue"; //วันที่ไม่ได้รับเงินเดิอน

-const storeRegistry = useRegistryNewDataStore()
+const storeRegistry = useRegistryNewDataStore();

 const tab = ref<string>("1");
 </script>
@ -37,10 +37,10 @@ const tab = ref<string>("1");

  <q-tab-panels v-model="tab" animated>
    <q-tab-panel name="1">
-      <PositionSalary :is-leave="storeRegistry.isLeave"/>
+      <PositionSalary :is-leave="storeRegistry.isLeave" />
    </q-tab-panel>
    <q-tab-panel name="2">
-      <NotReceiveSalary :is-leave="storeRegistry.isLeave"/>
+      <NotReceiveSalary :is-leave="storeRegistry.isLeave" />
    </q-tab-panel>
  </q-tab-panels>
 </template>
--- a/src/modules/04_registryPerson/interface/request/Profile.ts
+++ b/src/modules/04_registryPerson/interface/request/Profile.ts
@ -14,6 +14,7 @@ interface RequestObject {
  rank: string | null;
  relationship: string | null;
  religion: string | null;
+  phone: string | null;
  // telephoneNumber: string | null;
 }