From 6a048c23d9c54ee8ec52f1553adda7435142f477 Mon Sep 17 00:00:00 2001
From: AnandaTon <125332905+anandaAiemvong@users.noreply.github.com>
Date: Thu, 27 Jul 2023 14:07:53 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=E0=B8=9A=E0=B8=B1?=
 =?UTF-8?q?=E0=B8=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../08_registryEmployee/views/Detail.vue      | 155 +-----------------
 .../08_registryEmployee/views/Main.vue        | 110 ++++++++++---
 .../08_registryEmployee/views/information.vue |  87 +++++-----
 3 files changed, 129 insertions(+), 223 deletions(-)

diff --git a/src/modules/08_registryEmployee/views/Detail.vue b/src/modules/08_registryEmployee/views/Detail.vue
index ab1cc1b79..9bff1cb28 100644
--- a/src/modules/08_registryEmployee/views/Detail.vue
+++ b/src/modules/08_registryEmployee/views/Detail.vue
@@ -284,157 +284,6 @@
       </q-card-actions>
     </q-card>
   </q-dialog>
-  <!-- Dialog เลือก เกษียณ -->
-  <q-dialog v-model="dialogLeave" persistent>
-    <q-card style="width: 600px">
-      <q-toolbar>
-        <q-toolbar-title class="text-subtitle2 text-bold"
-          >ประเภทการพ้นราชการ
-        </q-toolbar-title>
-        <q-btn
-          icon="close"
-          unelevated
-          round
-          dense
-          @click="closeLeave"
-          style="color: #ff8080; background-color: #ffdede"
-        />
-      </q-toolbar>
-
-      <q-separator />
-      <q-card-section class="q-p-sm">
-        <div
-          class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
-        >
-          <div class="col-xs-6 col-sm-6 col-md-6">
-            <q-select
-              class="full-width inputgreen cursor-pointer"
-              outlined
-              dense
-              lazy-rules
-              v-model="reason"
-              :rules="[(val) => !!val || `${'กรุณาเลือกประเภทการพ้นราชการ'}`]"
-              hide-bottom-space
-              :label="`${'ประเภทการพ้นราชการ'}`"
-              emit-value
-              map-options
-              option-label="name"
-              :options="reasonOptions"
-              option-value="id"
-            />
-          </div>
-          <div class="col-xs-6 col-sm-6 col-md-6">
-            <datepicker
-              menu-class-name="modalfix"
-              v-model="leaveDate"
-              :locale="'th'"
-              autoApply
-              :enableTimePicker="false"
-              week-start="0"
-            >
-              <template #year="{ year }">{{ year + 543 }}</template>
-              <template #year-overlay-value="{ value }">{{
-                parseInt(value + 543)
-              }}</template>
-              <template #trigger>
-                <q-input
-                  class="full-width inputgreen cursor-pointer"
-                  outlined
-                  dense
-                  lazy-rules
-                  :model-value="date2Thai(leaveDate)"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกวันที่พ้นราชการ'}`]"
-                  hide-bottom-space
-                  :label="`${'วันที่พ้นราชการ'}`"
-                >
-                  <template v-slot:prepend>
-                    <q-icon
-                      name="event"
-                      class="cursor-pointer"
-                      style="color: var(--q-primary)"
-                    >
-                    </q-icon>
-                  </template>
-                </q-input>
-              </template>
-            </datepicker>
-          </div>
-          <div class="col-xs-6 col-sm-6 col-md-6">
-            <q-input
-              class="full-width inputgreen cursor-pointer"
-              outlined
-              dense
-              lazy-rules
-              autogrow
-              v-model="leaveDetail"
-              :rules="[
-                (val) =>
-                  !!val || `${'กรุณากรอกสาเหตุ/เหตุผลของการพ้นจากราชการ'}`,
-              ]"
-              hide-bottom-space
-              :label="`${'สาเหตุ/เหตุผลของการพ้นจากราชการ'}`"
-            />
-          </div>
-          <div class="col-xs-6 col-sm-6 col-md-6">
-            <q-input
-              class="full-width inputgreen cursor-pointer"
-              outlined
-              dense
-              lazy-rules
-              autogrow
-              v-model="leaveNumberOrder"
-              :rules="[(val) => !!val || `${'กรุณากรอกคำสั่ง/เอกสารอ้างอิง'}`]"
-              hide-bottom-space
-              :label="`${'คำสั่ง/เอกสารอ้างอิง'}`"
-            />
-          </div>
-          <div class="col-xs-6 col-sm-6 col-md-6">
-            <datepicker
-              menu-class-name="modalfix"
-              v-model="leaveDateOrder"
-              :locale="'th'"
-              autoApply
-              :enableTimePicker="false"
-              week-start="0"
-            >
-              <template #year="{ year }">{{ year + 543 }}</template>
-              <template #year-overlay-value="{ value }">{{
-                parseInt(value + 543)
-              }}</template>
-              <template #trigger>
-                <q-input
-                  class="full-width inputgreen cursor-pointer"
-                  outlined
-                  dense
-                  lazy-rules
-                  :model-value="date2Thai(leaveDateOrder)"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกวันที่ออกคำสั่ง'}`]"
-                  hide-bottom-space
-                  :label="`${'วันที่ออกคำสั่ง'}`"
-                >
-                  <template v-slot:prepend>
-                    <q-icon
-                      name="event"
-                      class="cursor-pointer"
-                      style="color: var(--q-primary)"
-                    >
-                    </q-icon>
-                  </template>
-                </q-input>
-              </template>
-            </datepicker>
-          </div>
-        </div>
-      </q-card-section>
-      <q-separator />
-      <q-card-actions align="right">
-        <q-btn unelevated label="บันทึก" color="public" @click="Retire"
-          >
-            <q-tooltip>บันทึก</q-tooltip>
-        </q-btn>
-      </q-card-actions>
-    </q-card>
-  </q-dialog>
 </template>
 <script setup lang="ts">
 import { ref, onMounted } from "vue";
@@ -518,8 +367,8 @@ const reasonOptions = ref<DataOption[]>([
 ]);
 
 onMounted(async () => {
-  //   await checkProfileData();
-  //   await fetchData();
+  await checkProfileData();
+  await fetchData();
   //   await changeTab("information");
 });
 
diff --git a/src/modules/08_registryEmployee/views/Main.vue b/src/modules/08_registryEmployee/views/Main.vue
index 1faa17ad9..c89d46bee 100644
--- a/src/modules/08_registryEmployee/views/Main.vue
+++ b/src/modules/08_registryEmployee/views/Main.vue
@@ -78,63 +78,123 @@
           </q-tr>
         </template>
         <template v-slot:body="props">
-          <q-tr
-            :props="props"
-            class="cursor-pointer"
-            @click="redirectToPage(props.row.id)"
-          >
-            <q-td key="no" :props="props">
+          <q-tr :props="props" class="cursor-pointer">
+            <q-td key="no" :props="props" @click="redirectToPage(props.row.id)">
               {{ props.rowIndex + 1 }}
             </q-td>
-            <q-td key="fullname" :props="props">
+            <q-td
+              key="fullname"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.fullname }}
             </q-td>
-            <q-td key="positionEmployeePosition" :props="props">
+            <q-td
+              key="positionEmployeePosition"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.positionEmployeePosition }}
             </q-td>
-            <q-td key="positionEmployeePositionSide" :props="props">
+            <q-td
+              key="positionEmployeePositionSide"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.positionEmployeePositionSide }}
             </q-td>
-            <q-td key="positionLine" :props="props">
+            <q-td
+              key="positionLine"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.positionLine }}
             </q-td>
-            <q-td key="positionEmployeeGroup" :props="props">
+            <q-td
+              key="positionEmployeeGroup"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.positionEmployeeGroup }}
             </q-td>
-            <q-td key="oc" :props="props">
+            <q-td key="oc" :props="props" @click="redirectToPage(props.row.id)">
               {{ props.row.oc }}
             </q-td>
-            <q-td key="amount" :props="props">
+            <q-td
+              key="amount"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.amount }}
             </q-td>
-            <q-td key="govAge" :props="props">
+            <q-td
+              key="govAge"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.govAge }}
             </q-td>
-            <q-td key="dateAppoint" :props="props">
+            <q-td
+              key="dateAppoint"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.dateAppoint }}
             </q-td>
-            <q-td key="dateStart" :props="props">
+            <q-td
+              key="dateStart"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.dateStart }}
             </q-td>
-            <q-td key="salaryDate" :props="props">
+            <q-td
+              key="salaryDate"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.salaryDate }}
             </q-td>
-            <q-td key="refSalary" :props="props">
+            <q-td
+              key="refSalary"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.refSalary }}
             </q-td>
-            <q-td key="age" :props="props">
+            <q-td
+              key="age"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.age }}
             </q-td>
-            <q-td key="fullnameOld" :props="props">
+            <q-td
+              key="fullnameOld"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.fullnameOld }}
             </q-td>
-            <q-td key="createdAt" :props="props">
+            <q-td
+              key="createdAt"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.createdAt }}
             </q-td>
-            <q-td key="isLeave" :props="props">
+            <q-td
+              key="isLeave"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.isLeave }}
             </q-td>
-            <q-td key="leaveDateOrder" :props="props">
+            <q-td
+              key="leaveDateOrder"
+              :props="props"
+              @click="redirectToPage(props.row.id)"
+            >
               {{ props.row.leaveDateOrder }}
             </q-td>
 
@@ -1294,8 +1354,8 @@ const clickAdd = () => {
 };
 
 // ดูรายการแก้ไขรายชื่อ
-const redirectToPage = (Id?: number) => {
-  router.push(`/registryEmployee/Edit/${Id}`);
+const redirectToPage = (profileId?: string) => {
+  router.push(`/registryEmployee/Edit/${profileId}`);
 };
 const editDetail = async (row: any) => {
   await getPosition(row.id);
diff --git a/src/modules/08_registryEmployee/views/information.vue b/src/modules/08_registryEmployee/views/information.vue
index ab210617d..2dd575d24 100644
--- a/src/modules/08_registryEmployee/views/information.vue
+++ b/src/modules/08_registryEmployee/views/information.vue
@@ -19,21 +19,23 @@
             :class="getClass(edit)"
             hide-bottom-space
             :outlined="edit"
+            v-model="informaData.cardid"
             dense
+            @update:model-value="changeCardID"
             lazy-rules
+            :rules="[
+              (val:string) => !!val || `${'กรุณากรอก เลขบัตรประจำตัวประชาชน'}`,
+              (val:string) =>
+                val.length >= 13 ||
+                `${'กรุณากรอกเลขบัตรประจำตัวประชาชนให้ครบ'}`,
+            ]"
             :readonly="!edit"
             :borderless="!edit"
-            @update:model-value="changeCardID"
-            :rules="[
-                (val:string) => !!val || `${'กรุณากรอก เลขบัตรประจำตัวประชาชน'}`,
-                (val:string) =>
-                  val.length >= 13 ||
-                  `${'กรุณากรอกเลขบัตรประจำตัวประชาชนให้ครบ'}`,
-              ]"
             label="เลขบัตรประจำตัวประชาชน"
             maxlength="13"
             mask="#############"
           />
+          <!-- :rules="[(val:any) =>val.length != 13 ||`${'กรุณากรอกเลขบัตรประจำตัวประชาชนให้ครบ'}`,]" -->
         </div>
         <div class="col-xs-6 col-sm-3 col-md-3">
           <selector
@@ -378,7 +380,7 @@
         class="q-px-md items-center"
         color="light-blue-10"
         label="บันทึก"
-        @click="saveData"
+        @click="saveData, router.go(-1)"
       />
     </div>
     <q-separator />
@@ -433,7 +435,7 @@ const { loaderPage } = dataStore;
 const profileStore = useProfileDataStore();
 const { changeRetireText, changeBirth } = profileStore;
 const edit = ref<boolean>(false);
-const defaultCitizenData = ref<string | null>("");
+const defaultCitizenData = ref<string>("");
 const informaData = ref<Information>(defaultInformation);
 const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
 const tittleHistory = ref<string>("ประวัติแก้ไขข้อมูลส่วนตัว"); //
@@ -673,7 +675,6 @@ const visibleColumnsHistory = ref<String[]>([
 
 onMounted(async () => {
   await fetchPerson();
-  await fetchData();
   emit("update:statusEdit", false);
   defaultAdd();
 });
@@ -681,28 +682,28 @@ onMounted(async () => {
 const statusAdd = () => props.statusAdd;
 
 const defaultAdd = () => {
-  if (props.statusAdd) {
-    edit.value = props.statusAdd;
-    informaData.value = {
-      cardid: null,
-      age: null,
-      prefix: null,
-      prefixId: null,
-      firstname: null,
-      lastname: null,
-      birthDate: new Date(),
-      genderId: null,
-      bloodId: null,
-      nationality: null,
-      ethnicity: null,
-      statusId: null,
-      religionId: null,
-      tel: null,
-      employeeType: null,
-      employeeClass: null,
-      profileType: null,
-    };
-  }
+  //   if (props.statusAdd) {
+  edit.value = props.statusAdd;
+  informaData.value = {
+    cardid: null,
+    age: null,
+    prefix: null,
+    prefixId: null,
+    firstname: null,
+    lastname: null,
+    birthDate: new Date(),
+    genderId: null,
+    bloodId: null,
+    nationality: null,
+    ethnicity: null,
+    statusId: null,
+    religionId: null,
+    tel: null,
+    employeeType: null,
+    employeeClass: null,
+    profileType: null,
+  };
+  //   }
 };
 
 const onCancel = async () => {
@@ -777,18 +778,17 @@ const fetchPerson = async () => {
     });
 };
 
-const changeCardID = (value: string | number | null) => {
+const changeCardID = async (value: string | number | null) => {
   if (value != null && typeof value == "string") {
     if (value.length == 13 && value != defaultCitizenData.value) {
-      async () => {
-        await checkCitizen(value);
-        informaData.value.cardid = defaultCitizenData.value;
-      };
+      await checkCitizen(value);
+      //   informaData.value.cardid = defaultCitizenData.value;
     }
   }
 };
 
 const checkCitizen = async (id: string) => {
+  console.log("String");
   loaderPage(true);
   await http
     .get(config.API.profileCitizenId(id))
@@ -968,7 +968,7 @@ const fetchData = async () => {
       .get(config.API.profileInforId(route.params.id.toString()))
       .then(async (res: any) => {
         const data: ResponseObject = res.data.result;
-        defaultCitizenData.value = data.citizenId;
+        defaultCitizenData.value = data.citizenId == null ? "" : data.citizenId;
         informaData.value.cardid = data.citizenId;
         informaData.value.prefix = "";
         informaData.value.prefixId = data.prefixId;
@@ -1088,14 +1088,11 @@ const addData = async () => {
 };
 
 const saveData = async () => {
+  console.log(myform.value);
   if (myform.value != null) {
-    await myform.value.validate().then(async (success: boolean) => {
-      if (success) {
-        if (props.statusAdd) {
-          await addData();
-        } else {
-          await editData();
-        }
+    await myform.value.validate().then(async (saveDataTest: Boolean) => {
+      if (saveDataTest) {
+        await addData();
       }
     });
   }