fixing column บรรจุ แต่งตั้ง ย้าย

src/modules/05_placement/components/Transfer/transferMain.vue

@@ -15,9 +15,10 @@ const router = useRouter();
 const mixin = useCounterMixin();
 const transferStore = useTransferDataStore();
 
-const { date2Thai, messageError, showLoader, hideLoader, success } = mixin;
 const { statusText } = transferStore;
 
+const { date2Thai, messageError, showLoader, hideLoader } = mixin;
+
 const modal = ref<boolean>(false);
 const filterKeyword = ref<string>("");
 const filterKeyword2 = ref<string>("");
@@ -30,12 +31,11 @@ const filters = ref<ResponseData[]>([]);
 const visibleColumns = ref<string[]>([
   "no",
   "fullname",
-  "position",
-  "positionLevel",
+  "posType",
   "organizationPositionOld",
   "organization",
-  "statustext",
-  "dateText",
+  "status",
+  "createdAt",
 ]);
 
 const resetFilter = () => {
@@ -65,33 +65,26 @@ const columns = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    format(val, row) {
+      return `${row.prefix}${row.firstName} ${row.lastName}`;
+    },
   },
   {
-    name: "position",
+    name: "posType",
     align: "left",
-    label: "ตำแหน่งในสายงาน",
+    label: "ประเภทตำแหน่ง",
     sortable: true,
-    field: "position",
+    field: "posType",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "positionLevel",
-    align: "left",
-    label: "ระดับ",
-    sortable: true,
-    field: "positionLevel",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    format(val, row) {
+      return row.positionTypeOld + " (" + row.positionLevelOld + ")";
+    },
   },
   {
     name: "organizationPositionOld",
     align: "left",
-    label: "สังกัด",
+    label: "ตำแหน่งและหน่วยงานเดิม",
     sortable: true,
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
@@ -111,27 +104,28 @@ const columns = ref<QTableProps["columns"]>([
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "dateText",
+    name: "createdAt",
     align: "left",
     label: "วันที่ดำเนินการ",
     sortable: true,
-    field: "dateText",
+    field: "createdAt",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    sortOrder: "da",
+    format(val) {
+      return date2Thai(val);
+    },
   },
   {
-    name: "statustext",
+    name: "status",
     align: "left",
     label: "สถานะ",
     sortable: true,
-    field: "statustext",
+    field: "status",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    format: (val) => statusText(val),
   },
 ]);
 
@@ -144,17 +138,16 @@ const closeModal = () => {
 // เปิดโมเดล
 const openModalOrder = () => {
   openModal();
-  console.log("filters===>",filters.value)
   const row = filters.value.filter(
     (r: ResponseData) =>
-      (r.status == "APPROVE") &&
+      r.status == "APPROVE" &&
       r.organizationPositionOld &&
       r.positionTypeOld &&
       r.positionLevelOld &&
       r.positionNumberOld &&
       r.salary !== null &&
       r.organization &&
-      r.date 
+      r.date
   );
   rows2.value = row;
 };
@@ -164,38 +157,8 @@ const getData = async () => {
   await http
     .get(config.API.transfer)
     .then((res: any) => {
-      const data = res.data.result;
-      let list: ResponseData[] = [];
-      data.map((r: ResponseData) => {
-        list.push({
-          dateText:
-            r.createdAt !== null ? date2Thai(new Date(r.createdAt)) : "-",
-          createdAt: r.createdAt !== null ? new Date(r.createdAt) : null,
-          date: r.date,
-          firstName: r.firstName ?? "",
-          id: r.id ?? "",
-          isActive: r.isActive ? r.isActive : false,
-          lastName: r.lastName ?? "",
-          organization: r.organization ?? "",
-          organizationPositionOld: r.organizationPositionOld ?? "",
-          posNo: r.posNo ?? "",
-          position: r.position ?? "",
-          positionLevel: r.positionLevel ?? "",
-          positionLevelOld: r.positionLevelOld ?? "",
-          positionNumberOld: r.positionNumberOld ?? "",
-          positionTypeOld: r.positionTypeOld ?? "",
-          prefix: r.prefix ?? "",
-          reason: r.reason ?? "",
-          salary: r.salary ? r.salary : 0,
-          status: r.status ?? "",
-          statustext: statusText(r.status ?? ""),
-          fullname: `${r.prefix ?? ""} ${r.firstName ?? ""} ${
-            r.lastName ?? ""
-          }`,
-        });
-      });
-      rows.value = list;
-      filters.value = list;
+      rows.value = res.data.result;
+      filters.value = rows.value;
     })
     .catch((e) => {
       messageError($q, e);
@@ -282,39 +245,23 @@ onMounted(async () => {
               </q-tr>
             </template>
             <template v-slot:body="props">
-              <q-tr
-                :props="props"
-                class="cursor-pointer"
-                @click="router.push(`/transfer/${props.row.id}`)"
-              >
-                <q-td key="no" :props="props">
-                  {{ props.rowIndex + 1 }}
-                </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-tr :props="props" class="cursor-pointer">
+                <q-td
+                  v-for="col in props.cols"
+                  :key="col.id"
+                  class="cursor-pointer"
+                  @click="router.push(`/transfer/${props.row.id}`)"
+                >
+                  <div v-if="col.name === 'no'">
+                    {{ props.rowIndex + 1 }}
                   </div>
-                </q-td>
-                <q-td key="organization" :props="props">
-                  <div class="table_ellipsis">
-                    {{ props.row.organization }}
+
+                  <div v-else>
+                    {{
+                      col.value == null ? "" : col.value == "" ? "-" : col.value
+                    }}
                   </div>
                 </q-td>
-                <q-td key="dateText" :props="props">
-                  {{ props.row.dateText }}
-                </q-td>
-                <q-td key="statustext" :props="props">
-                  {{ props.row.statustext }}
-                </q-td>
               </q-tr>
             </template>
           </d-table>