updated retirement field

src/modules/06_retirement/components/resign/Resign.vue

@@ -55,26 +55,24 @@ const columns = ref<QTableProps["columns"]>([
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "positionTypeOld",
+    name: "positionLevel",
     align: "left",
-    label: "ตำแหน่งในสายงาน",
+    label: "ประเภทตำแหน่ง",
     sortable: true,
-    field: "positionTypeOld",
+    field: "positionLevel",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "positionLevelOld",
-    align: "left",
-    label: "ระดับ",
-    sortable: true,
-    field: "positionLevelOld",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    format(val, row) {
+      let name = "";
+      if (row.positionTypeOld && row.positionLevelOld) {
+        name = `${row.positionTypeOld} (${row.positionLevelOld})`;
+      } else if (row.positionTypeOld) {
+        name = `${row.positionTypeOld}`;
+      } else if (row.positionLevelOld) {
+        name = `(${row.positionLevelOld})`;
+      } else name = "-";
+      return name;
+    },
   },
   {
     name: "positionNumberOld",
@@ -90,7 +88,7 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "organizationPositionOld",
     align: "left",
-    label: "สังกัด",
+    label: "ตำแหน่ง/สังกัดเดิม",
     sortable: true,
     field: "organizationPositionOld",
     headerStyle: "font-size: 14px",
@@ -129,8 +127,7 @@ const visibleColumns = ref<string[]>([
   "prefix",
   "fullname",
   "location",
-  "positionTypeOld",
-  "positionLevelOld",
+  "positionLevel",
   "positionNumberOld",
   "organizationPositionOld",
   "datetext",
@@ -310,40 +307,27 @@ const pagination = ref({
               </q-tr>
             </template>
             <template v-slot:body="props">
-              <q-tr
-                :props="props"
-                class="cursor-pointer"
-                @click="router.push(`/retirement/resign/${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="location" :props="props">
-                  {{ props.row.location }}
-                </q-td>
-                <q-td key="positionTypeOld" :props="props">
-                  {{ props.row.positionTypeOld }}
-                </q-td>
-                <q-td key="positionLevelOld" :props="props">
-                  {{ props.row.positionLevelOld }}
-                </q-td>
-                <q-td key="positionNumberOld" :props="props">
-                  {{ props.row.positionNumberOld }}
-                </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"
+                  @click="router.push(`/retirement/resign/${props.row.id}`)"
+                >
+                  <div v-if="col.name === 'no'">
+                    {{ props.rowIndex + 1 }}
+                  </div>
+
+                  <div
+                    v-else
+                    :class="
+                      col.name === 'organizationPositionOld' ||
+                      col.name === 'organization'
+                        ? 'table_ellipsis'
+                        : ''
+                    "
+                  >
+                    {{ col.value == null ? "" : 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>