fix แสดงประวัติคนครอง

src/modules/02_organization/components/DialogHistoryPos.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, watch } from "vue";
+import { ref, watch, computed } from "vue";
 import { useQuasar } from "quasar";
 
 import http from "@/plugins/http";
@@ -13,9 +13,7 @@ import { useOrganizational } from "@/modules/02_organization/store/organizationa
 import type { QTableProps } from "quasar";
 import type { HistoryPos } from "@/modules/02_organization/interface/response/organizational";
 
-/**
- * import Components
- */
+/** import Components*/
 import Header from "@/components/DialogHeader.vue";
 
 /** Use*/
@@ -23,21 +21,20 @@ const $q = useQuasar();
 const store = useOrganizational();
 const { showLoader, hideLoader, messageError, date2Thai } = useCounterMixin();
 
-/**
- * props
- */
+/** props*/
 const modal = defineModel<boolean>("modal", { required: true });
 const props = defineProps({
+  historyType: {
+    type: String,
+    default: "HISTORY",
+  },
   rowId: {
     type: String,
   },
 });
 
-/**
- * ข้อมูล Table
- */
 const rows = ref<HistoryPos[]>([]); //ข้อมูลรายการประวัติตำแหน่ง
-const columns = ref<QTableProps["columns"]>([
+const baseColumns = ref<QTableProps["columns"]>([
   {
     name: "no",
     align: "left",
@@ -47,17 +44,17 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  // {
-  //   name: "fullname",
-  //   align: "left",
-  //   label: "ชื่อคนครอง",
-  //   sortable: true,
-  //   field: "fullname",
-  //   headerStyle: "font-size: 14px",
-  //   style: "font-size: 14px",
-  //   sort: (a: string, b: string) =>
-  //     a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  // },
+  {
+    name: "fullname",
+    align: "left",
+    label: "ชื่อคนครอง",
+    sortable: true,
+    field: "fullname",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
   {
     name: "orgShortName",
     align: "left",
@@ -165,15 +162,33 @@ const columns = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
 ]);
+const pagination = ref<QTableProps["pagination"]>({
+  page: 1,
+  rowsPerPage: 10,
+});
+
+const columns = computed(() =>
+  props.historyType === "HISTORY"
+    ? (baseColumns.value || []).filter((col: any) => col.name !== "fullname")
+    : baseColumns.value || []
+);
+
+const titleName = computed(() =>
+  props.historyType === "HISTORY" ? "ประวัติตำแหน่ง" : "ประวัติคนครอง"
+);
 
 /**
  *  function เรียกข้อมูลประวัติตำแหน่ง
  * @param id
  */
-function fetchHistoryPos(id: string) {
+async function fetchHistoryPos(id: string) {
   showLoader();
-  http
-    .get(config.API.orgPosHistory(id))
+  const pathAPI =
+    props.historyType === "HISTORY"
+      ? config.API.orgPosHistory(id)
+      : config.API.orgPosHistoryUpdate(id);
+  await http
+    .get(pathAPI)
     .then((res) => {
       const data = res.data.result;
       rows.value = data;
@@ -198,7 +213,7 @@ watch(
   <q-dialog v-model="modal" persistent>
     <q-card style="min-width: 80%">
       <Header
-        :tittle="'ประวัติตำแหน่ง'"
+        :tittle="titleName"
         :close="
           () => {
             modal = false;