From 38fbce2093646834e0e0b23e1cd68a4d413416d3 Mon Sep 17 00:00:00 2001
From: setthawutttty <stw.ttty@gmail.com>
Date: Thu, 17 Aug 2023 09:54:35 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A=E0=B8=9F?=
 =?UTF-8?q?=E0=B8=B4=E0=B8=A5=E0=B8=94=E0=B9=8C=20=E0=B8=A3=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A2=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=A2=E0=B9=89=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Relocation/RelocationMain.vue  | 284 +++++++++---------
 .../components/Relocation/RelocationModal.vue |   3 +-
 2 files changed, 137 insertions(+), 150 deletions(-)

diff --git a/src/modules/05_placement/components/Relocation/RelocationMain.vue b/src/modules/05_placement/components/Relocation/RelocationMain.vue
index ed978cbbc..86f0f85a2 100644
--- a/src/modules/05_placement/components/Relocation/RelocationMain.vue
+++ b/src/modules/05_placement/components/Relocation/RelocationMain.vue
@@ -40,22 +40,18 @@ const {
 const modal = ref<boolean>(false);
 const visibleColumns = ref<string[]>([
   "no",
+  "citizenId",
   "fullname",
-  "position",
-  "positionLevel",
-  "organizationPositionOld",
-  "organization",
-  "statusText",
+  "organizationName",
+  "dateOfBirth",
   "btn",
 ]);
 const visibleColumns2 = ref<string[]>([
   "no",
+  "citizenId",
   "fullname",
-  "position",
-  "positionLevel",
-  "organizationPositionOld",
-  "organization",
-  "statusText",
+  "organizationName",
+  "dateOfBirth",
 ]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
 const filterKeyword = ref<string>("");
 const filterKeyword2 = ref<string>("");
@@ -66,57 +62,9 @@ const resetFilter = () => {
   filterRef.value.focus();
 };
 
-// const nextPage = (id:string) => {
-//   router.push("/retirement/resign/"+id);
-// };
+
 const rows = ref<relocationType[]>([]);
-const rows2 = ref<any>([
-  {
-    personalId: "0a846508-4932-40de-9a9e-5b519492217c",
-    fullname: "นางสาวอย พชช",
-    position: "นักบริหาร",
-    positionLevel: "ต้น",
-    oc: "สำนักงานคณะกรรมการข้าราชการกรุงเทพมหานคร",
-    agency: "กลุ่มงานกุมารเวชกรรม",
-    status: "รออนุมัติ",
-  },
-  {
-    personalId: "08db721d-add6-47b0-8a13-5f45d106e8d1",
-    fullname: "นางสาววญ สพ",
-    position: "นักจัดการงานทั่วไป",
-    positionLevel: "ปฏิบัติการ",
-    oc: "กลุ่มงานช่วยนักบริหาร",
-    agency: "กลุ่มงานข้อมูลเมือง",
-    status: "รออนุมัติ",
-  },
-  {
-    personalId: "08db721d-adf2-4842-8056-1abb1539356e",
-    fullname: "นางสาววญ สพ",
-    position: "นักจัดการงานทั่วไป",
-    positionLevel: "ปฏิบัติการ",
-    oc: "กลุ่มงานช่วยนักบริหาร",
-    agency: "กลุ่มงานข้อมูลเมือง",
-    status: "รออนุมัติ",
-  },
-  {
-    personalId: "08db721d-adff-47b0-8762-41cd5c991001",
-    fullname: "นางสาววญ สพ",
-    position: "นักจัดการงานทั่วไป",
-    positionLevel: "ปฏิบัติการ",
-    oc: "กลุ่มงานช่วยนักบริหาร",
-    agency: "กลุ่มงานข้อมูลเมือง",
-    status: "รออนุมัติ",
-  },
-  {
-    personalId: "08db721d-ae22-424d-8f4a-87ba30cc3ee7",
-    fullname: "นางสาววญ สพ",
-    position: "นักจัดการงานทั่วไป",
-    positionLevel: "ปฏิบัติการ",
-    oc: "กลุ่มงานช่วยนักบริหาร",
-    agency: "กลุ่มงานข้อมูลเมือง",
-    status: "รออนุมัติ",
-  },
-]);
+const rows2 = ref<any[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "no",
@@ -127,6 +75,15 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
+  {
+    name: "citizenId",
+    align: "left",
+    label: "เลขประจำตัวประชาชน",
+    sortable: true,
+    field: "fullname",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
   {
     name: "fullname",
     align: "left",
@@ -137,47 +94,22 @@ const columns = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
   {
-    name: "position",
+    name: "organizationName",
     align: "left",
-    label: "ตำแหน่งในสายงาน",
+    label: "หน่วยงานที่รับโอน",
     sortable: true,
-    field: "position",
+    field: "organizationName",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "positionLevel",
+    name: "dateOfBirth",
     align: "left",
-    label: "ระดับ",
+    label: "วัน/เดือน/ปี เกิด",
     sortable: true,
-    field: "positionLevel",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "organizationPositionOld",
-    align: "left",
-    label: "สังกัด",
-    sortable: true,
-    field: "organizationPositionOld",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงานที่ขอย้ายไป",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "statusText",
-    align: "left",
-    label: "สถานะ",
-    sortable: true,
-    field: "statusText",
+    field: "dateOfBirth",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
@@ -190,6 +122,7 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
+
 ]);
 const columns2 = ref<QTableProps["columns"]>([
   {
@@ -201,6 +134,15 @@ const columns2 = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
+  {
+    name: "citizenId",
+    align: "left",
+    label: "เลขประจำตัวประชาชน",
+    sortable: true,
+    field: "citizenId",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
   {
     name: "fullname",
     align: "left",
@@ -211,47 +153,22 @@ const columns2 = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
   {
-    name: "position",
+    name: "organizationName",
     align: "left",
-    label: "ตำแหน่งในสายงาน",
+    label: "หน่วยงานที่รับโอน",
     sortable: true,
-    field: "position",
+    field: "organizationName",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "positionLevel",
+    name: "dateOfBirth",
     align: "left",
-    label: "ระดับ",
+    label: "วัน/เดือน/ปี เกิด",
     sortable: true,
-    field: "positionLevel",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "organizationPositionOld",
-    align: "left",
-    label: "สังกัด",
-    sortable: true,
-    field: "organizationPositionOld",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "organization",
-    align: "left",
-    label: "หน่วยงานที่ขอย้ายไป",
-    sortable: true,
-    field: "organization",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "statusText",
-    align: "left",
-    label: "สถานะ",
-    sortable: true,
-    field: "statusText",
+    field: "dateOfBirth",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
@@ -294,7 +211,7 @@ const getData = async () => {
         prefix: item.prefix,
         firstname: item.firstname,
         lastname: item.lastname,
-        dateOfBirth: item.dateOfBirth,
+        dateOfBirth: date2Thai(item.dateOfBirth),
         gender: item.gender,
         status: item.status,
         statusText:statusText(item.status),
@@ -468,6 +385,13 @@ onMounted(async () => {
                 <q-td key="no" :props="props" @click="openDetail(props.row.id)">
                   {{ props.rowIndex + 1 }}
                 </q-td>
+                <q-td
+                  key="citizenId"
+                  :props="props"
+                  @click="openDetail(props.row.id)"
+                >
+                  {{ props.row.citizenId !== null ? props.row.citizenId : "-" }}
+                </q-td>
                 <q-td
                   key="fullname"
                   :props="props"
@@ -476,20 +400,55 @@ onMounted(async () => {
                   {{ props.row.fullname !== null ? props.row.fullname : "-" }}
                 </q-td>
                 <q-td
-                  key="position"
+                  key="organizationName"
                   :props="props"
                   @click="openDetail(props.row.id)"
                 >
-                  {{ props.row.position !== null ? props.row.position : "-" }}
-                </q-td>
+                  <div
+                    v-if="
+                      props.row.organizationName !== null ||
+                      props.row.positionPath !== null
+                    "
+                  >
+                    <div class="col-4">
+                      <div class="text-weight-medium">
+                        {{
+                          props.row.organizationName !== null ? props.row.organizationName : "-"
+                        }}
+                        {{
+                          props.row.organizationShortName !== null
+                            ? `(${props.row.organizationShortName})`
+                            : ""
+                        }}
+                      </div>
+                      <div class="text-weight-light">
+                        {{
+                          props.row.positionPath !== null
+                            ? props.row.positionPath
+                            : "-"
+                        }}
+                        {{
+                          props.row.positionNumber !== null
+                            ? `(${props.row.positionNumber})`
+                            : ""
+                        }}
+                      </div>
+                    </div>
+                  </div>
+                  <div v-else>
+                    <div class="col-4">
+                      <div class="text-weight-medium">-</div>
+                    </div>
+                  </div>
+                </q-td> 
                 <q-td
-                  key="positionLevel"
+                  key="dateOfBirth"
                   :props="props"
                   @click="openDetail(props.row.id)"
                 >
                   {{
-                    props.row.positionLevel !== null
-                      ? props.row.positionLevel
+                    props.row.dateOfBirth !== null
+                      ? props.row.dateOfBirth
                       : "-"
                   }}
                 </q-td>
@@ -668,28 +627,55 @@ onMounted(async () => {
               <q-td key="no" :props="props">
                 {{ props.rowIndex + 1 }}
               </q-td>
+              <q-td key="citizenId" :props="props">
+                {{ props.row.citizenId }}
+              </q-td>
               <q-td key="fullname" :props="props">
                 {{ props.row.fullname }}
               </q-td>
-              <q-td key="position" :props="props">
-                {{ props.row.position }}
-              </q-td>
-              <q-td key="positionLevel" :props="props">
-                {{ props.row.positionLevel }}
-              </q-td>
-              <q-td key="organizationPositionOld" :props="props">
-                <div class="table_ellipsis">
-                  {{ props.row.organizationPositionOld }}
+              <q-td
+                key="organizationName"
+                :props="props"
+              >
+                <div
+                  v-if="
+                    props.row.organizationName !== null ||
+                    props.row.positionPath !== null
+                  "
+                >
+                  <div class="col-4">
+                    <div class="text-weight-medium">
+                      {{ props.row.organizationName !== null ? props.row.organizationName : "-" }}
+                      {{
+                        props.row.organizationShortName !== null
+                          ? `(${props.row.organizationShortName})`
+                          : ""
+                      }}
+                    </div>
+                    <div class="text-weight-light">
+                      {{
+                        props.row.positionPath !== null
+                          ? props.row.positionPath
+                          : "-"
+                      }}
+                      {{
+                        props.row.positionNumber !== null
+                          ? `(${props.row.positionNumber})`
+                          : ""
+                      }}
+                    </div>
+                  </div>
+                </div>
+                <div v-else>
+                  <div class="col-4">
+                    <div class="text-weight-medium">-</div>
+                  </div>
                 </div>
               </q-td>
-              <q-td key="organization" :props="props">
-                <div class="table_ellipsis">
-                  {{ props.row.organization }}
-                </div>
-              </q-td>
-              <q-td key="statusText" :props="props">
-                {{ props.row.statusText }}
+              <q-td key="dateOfBirth" :props="props">
+                {{ props.row.dateOfBirth }}
               </q-td>
+
             </q-tr>
           </template>
         </d-table>
diff --git a/src/modules/05_placement/components/Relocation/RelocationModal.vue b/src/modules/05_placement/components/Relocation/RelocationModal.vue
index 8a1df91c6..b85d268b7 100644
--- a/src/modules/05_placement/components/Relocation/RelocationModal.vue
+++ b/src/modules/05_placement/components/Relocation/RelocationModal.vue
@@ -319,6 +319,7 @@ const selectedPosition = async (data: any) => {
         positionPathSideArr.length > 1 || positionPathSideArr.length == 0
           ? ""
           : positionPathSideArr[0].value;
+          
     }
 
     // positionType Options
@@ -658,6 +659,7 @@ function findByPerson(element: any): any {
                         outlined
                         class="full-width inputgreen cursor-pointer custom-input"
                         standout
+                        emit-value
                         dense
                         hide-bottom-space
                         lazy-rules
@@ -667,7 +669,6 @@ function findByPerson(element: any): any {
                         map-options
                       />
                     </div>
-
                     <div class="col-xs-12 col-sm-12 col-md-12">
                       <q-select
                         outlined