Merge branch 'develop' into devTee

src/modules/04_registryPerson/components/detail/GovernmentInformation/07_Position.vue

@@ -51,6 +51,7 @@ const {
   onSearchDataTable,
   formatDatePosition,
   findOrgName,
+  convertDateToAPI
 } = useCounterMixin();
 
 const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
@@ -419,8 +420,6 @@ async function fetchDataOption() {
     .then((res) => {
       const data = res.data.result;
 
-      console.log(data);
-
       const seen = new Set();
       const seen2 = new Set();
 
@@ -566,7 +565,12 @@ async function onClickOpenDialog(
   } else {
     await fetchOptionGroup();
   }
-
+  commandCodeOptions.value = store.commandCodeData;
+  posTypeOptions.value = store.posTypeData;
+  posLevelOptions.value = store.posLevelData;
+  posLineOptions.value = store.posLineData;
+  posPathSideOptions.value = store.posPathSideData;
+  posExecutiveOptions.value = store.posExecutiveData;
   //  หาระดับตำแหน่ง
   statusEdit && (await updateSelectType(data.positionType, true));
   isStatusEdit.value = statusEdit;
@@ -601,27 +605,6 @@ async function onClickOpenDialog(
 /** function  ปิด dialog ตำแหน่งเงินเดือน*/
 function onClickCloseDialog() {
   modalDialogSalary.value = false;
-  formData.commandCode = "";
-  formData.commandNo = "";
-  formData.commandYear = null;
-  formData.commandDateAffect = null;
-  formData.commandDateSign = null;
-  formData.posNoAbb = "";
-  formData.posNo = "";
-  formData.positionName = "";
-  formData.positionType = "";
-  formData.positionLevel = "";
-  formData.positionLine = "";
-  formData.positionPathSide = "";
-  formData.positionExecutive = "";
-  formData.amount = null;
-  formData.amountSpecial = null;
-  formData.orgRoot = "";
-  formData.orgChild1 = "";
-  formData.orgChild2 = "";
-  formData.orgChild3 = "";
-  formData.orgChild4 = "";
-  formData.remark = "";
 }
 
 /**
@@ -704,6 +687,8 @@ function onSubmit() {
             ? profileId.value
             : undefined,
         ...formData,
+        commandDateAffect: convertDateToAPI(formData.commandDateAffect),
+        commandDateSign: convertDateToAPI(formData.commandDateSign),
         amount: Number(String(formData.amount)?.replace(/,/g, "")),
         amountSpecial: Number(
           String(formData.amountSpecial)?.replace(/,/g, "")
@@ -921,9 +906,7 @@ onMounted(async () => {
     <q-card style="min-width: 40vw">
       <q-form greedy @submit.prevent @validation-success="onSubmit">
         <DialogHeader
-          :tittle="
+          :tittle="isStatusEdit ? 'แก้ไขตำแหน่ง' : 'เพิ่มตำแหน่ง'"
-            isStatusEdit ? 'แก้ไขตำแหน่ง/เงินเดือน' : 'เพิ่มตำแหน่ง/เงินเดือน'
-          "
           :close="onClickCloseDialog"
         />
         <q-separator color="grey-4" />
@@ -1417,6 +1400,7 @@ onMounted(async () => {
                 </div>
               </div>
             </div>
+
             <div class="col-xs-12 col-sm-12 col-md-12">
               <q-input
                 :class="classInput(true)"

src/modules/04_registryPerson/components/detail/PersonalInformation/05_Education.vue

@@ -1,3 +1,4 @@
+div
 <script setup lang="ts">
 import { ref, reactive, onMounted } from "vue";
 import { QForm, useQuasar } from "quasar";
@@ -34,6 +35,7 @@ const {
   date2Thai,
   pathRegistryEmp,
   onSearchDataTable,
+  convertDateToAPI,
 } = mixin;
 
 const id = ref<string>(route.params.id.toString()); //id profile
@@ -132,6 +134,20 @@ const columns = ref<QTableProps["columns"]>([
         .toString()
         .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+  {
+    name: "isHigh",
+    align: "left",
+    label: "วุฒิการศึกษาสูงสุด",
+    sortable: true,
+    field: "isHigh",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    format: (v) => (v === true ? "ใช่" : v === false ? "ไม่ใช่" : "-"),
+    sort: (a: string, b: string) =>
+      a
+        .toString()
+        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
   {
     name: "degree",
     align: "left",
@@ -258,6 +274,7 @@ const visibleColumns = ref<string[]>([
   "other",
   "fundName",
   "isEducation",
+  "isHigh",
   "endDate",
   "startDate",
   "finishDate",
@@ -265,7 +282,7 @@ const visibleColumns = ref<string[]>([
   "lastUpdatedAt",
 ]);
 const pagination = ref({
-  sortBy: "lastUpdatedAt",
+  sortBy: "",
 });
 
 /** Table ประวัติแก้ไขประวัติการศึกษา*/
@@ -351,6 +368,20 @@ const historyColumns = ref<QTableProps["columns"]>([
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+  {
+    name: "isHigh",
+    align: "left",
+    label: "วุฒิการศึกษาสูงสุด",
+    sortable: true,
+    field: "isHigh",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    format: (v) => (v === true ? "ใช่" : v === false ? "ไม่ใช่" : "-"),
+    sort: (a: string, b: string) =>
+      a
+        .toString()
+        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
   {
     name: "degree",
     align: "left",
@@ -486,6 +517,7 @@ const historyVisibleColumns = ref<string[]>([
   "other",
   "fundName",
   "isEducation",
+  "isHigh",
   "endDate",
   "startDate",
   "finishDate",
@@ -524,6 +556,7 @@ const educationData = reactive<RequestItemsObject>({
   startDate: new Date(),
   endDate: new Date(),
   isEducation: null,
+  isHigh: null,
   degree: "",
   field: "",
   fundName: "",
@@ -591,6 +624,7 @@ function clearForm() {
   educationData.startDate = new Date();
   educationData.endDate = new Date();
   educationData.isEducation = null;
+  educationData.isHigh = false;
   educationData.degree = "";
   educationData.field = "";
   educationData.fundName = "";
@@ -610,12 +644,14 @@ function editForm(row: any) {
   dialogStatus.value = "edit";
   editId.value = row?.id;
   isDate.value = row.isDate ? "true" : "false";
+
   educationData.educationLevel = row.educationLevel;
   educationData.institute = row.institute;
   educationData.finishDate = row.finishDate;
   educationData.startDate = row.startDate;
   educationData.endDate = row.endDate;
   educationData.isEducation = row.isEducation;
+  educationData.isHigh = row.isHigh ? true : false;
   educationData.degree = row.degree;
   educationData.field = row.field;
   educationData.fundName = row.fundName;
@@ -719,6 +755,9 @@ function addData() {
       isDate: isDate.value === "false" ? false : true,
       profileId: empType.value === "" ? id.value : undefined,
       profileEmployeeId: empType.value !== "" ? id.value : undefined,
+      finishDate: convertDateToAPI(educationData.finishDate),
+      startDate: convertDateToAPI(educationData.startDate),
+      endDate: convertDateToAPI(educationData.endDate),
     })
     .then(async () => {
       await fetchData(id.value);
@@ -748,6 +787,9 @@ function editData(idData: string) {
       isDate: isDate.value === "false" ? false : true,
       durationYear:
         educationData.durationYear === "" ? null : educationData.durationYear,
+      finishDate: convertDateToAPI(educationData.finishDate),
+      startDate: convertDateToAPI(educationData.startDate),
+      endDate: convertDateToAPI(educationData.endDate),
     })
     .then(async () => {
       await fetchData(id.value);
@@ -1467,6 +1509,15 @@ onMounted(async () => {
               />
             </div>
 
+            <div class="col-12">
+              <q-checkbox
+                keep-color
+                color="primary"
+                v-model="educationData.isHigh"
+                label="วุฒิการศึกษาสูงสุด"
+              />
+            </div>
+
             <div class="col-12">
               <q-input
                 outlined

src/modules/04_registryPerson/components/detail/Salary/01_PositionSalaryHistory.vue

@@ -4,6 +4,8 @@ import { useQuasar } from "quasar";
 
 import { useRoute } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
+import { useSalaryDataStore } from "@/modules/04_registryPerson/stores/salary";
+
 import http from "@/plugins/http";
 import config from "@/app.config";
 
@@ -14,6 +16,7 @@ import DialogHeader from "@/components/DialogHeader.vue";
 
 const $q = useQuasar();
 const route = useRoute();
+const store = useSalaryDataStore();
 const {
   date2Thai,
   showLoader,
@@ -21,6 +24,7 @@ const {
   messageError,
   pathRegistryEmp,
   onSearchDataTable,
+  findOrgName,
 } = useCounterMixin();
 
 /** props*/
@@ -36,7 +40,7 @@ const baseColumns = ref<QTableProps["columns"]>([
   {
     name: "commandDateAffect",
     align: "left",
-    label: "วัน เดือน ปี",
+    label: "วันที่คำสั่งมีผล",
     sortable: true,
     field: "commandDateAffect",
     headerStyle: "font-size: 14px",
@@ -47,74 +51,6 @@ const baseColumns = ref<QTableProps["columns"]>([
         .toString()
         .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
-  {
-    name: "amount",
-    align: "left",
-    label: empType.value === "-employee" ? "ค่าตอบแทนรายเดือน" : "เงินเดือน",
-    sortable: true,
-    field: "amount",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    format: (v) => Number(v).toLocaleString(),
-    sort: (a: string, b: string) =>
-      a
-        .toString()
-        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "positionSalaryAmount",
-    align: "left",
-    label: "เงินประจำตำแหน่ง",
-    sortable: true,
-    field: "positionSalaryAmount",
-    headerStyle: "font-size: 14px",
-    format: (v) => Number(v).toLocaleString(),
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a
-        .toString()
-        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "mouthSalaryAmount",
-    align: "left",
-    label: "เงินค่าตอบแทนรายเดือน",
-    sortable: true,
-    field: "mouthSalaryAmount",
-    headerStyle: "font-size: 14px",
-    format: (v) => Number(v).toLocaleString(),
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a
-        .toString()
-        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "oc",
-    align: "left",
-    label: "สังกัด",
-    sortable: true,
-    field: "oc",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a
-        .toString()
-        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "positionName",
-    align: "left",
-    label: "ตำแหน่ง",
-    sortable: true,
-    field: "positionName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a
-        .toString()
-        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
   {
     name: "posNo",
     align: "left",
@@ -125,7 +61,7 @@ const baseColumns = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
     format(val, row) {
       return row.posNoAbb && row.posNo
-        ? `${row.posNoAbb}${row.posNo}`
+        ? `${row.posNoAbb}.${row.posNo}`
         : row.posNo
         ? row.posNo
         : "-";
@@ -136,24 +72,11 @@ const baseColumns = ref<QTableProps["columns"]>([
         .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "positionLine",
+    name: "positionName",
     align: "left",
-    label: "สายงาน",
+    label: empType.value === "-employee" ? "ตำแหน่ง" : "ตำแหน่งในสายงาน",
     sortable: true,
-    field: "positionLine",
+    field: "positionName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-    sort: (a: string, b: string) =>
-      a
-        .toString()
-        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-  },
-  {
-    name: "positionPathSide",
-    align: "left",
-    label: "ด้าน/สาขา",
-    sortable: true,
-    field: "positionPathSide",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
     sort: (a: string, b: string) =>
@@ -164,7 +87,7 @@ const baseColumns = ref<QTableProps["columns"]>([
   {
     name: "positionType",
     align: "left",
-    label: "ตำแหน่งประเภท",
+    label: empType.value === "-employee" ? "กลุ่มงาน" : "ประเภทตำแหน่ง",
     sortable: true,
     field: "positionType",
     headerStyle: "font-size: 14px",
@@ -177,7 +100,7 @@ const baseColumns = ref<QTableProps["columns"]>([
   {
     name: "positionLevel",
     align: "left",
-    label: "ระดับ",
+    label: empType.value === "-employee" ? "ระดับชั้นงาน" : "ระดับ",
     sortable: true,
     field: "positionLevel",
     format(val, row) {
@@ -192,9 +115,7 @@ const baseColumns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
     sort: (a: string, b: string) =>
-      a
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-        .toString()
-        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
     name: "positionExecutive",
@@ -205,55 +126,64 @@ const baseColumns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
     sort: (a: string, b: string) =>
-      a
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-        .toString()
-        .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "positionExecutiveSide",
+    name: "amount",
     align: "left",
-    label: "ด้านทางการบริหาร",
+    label: empType.value === "-employee" ? "ค่าตอบแทนรายเดือน" : "เงินเดือน",
     sortable: true,
-    field: "positionExecutiveSide",
+    field: "amount",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format(v, row) {
+      return row.amount
+        ? `${row.amount.toLocaleString()}${
+            row.amountSpecial !== 0 && row.amountSpecial
+              ? ` (${row.amountSpecial.toLocaleString()})`
+              : ""
+          }`
+        : "-";
+    },
     sort: (a: string, b: string) =>
       a
         .toString()
         .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "salaryClass",
+    name: "positionSalaryAmount",
     align: "left",
-    label: "ตำแหน่ง (รายละเอียด)",
+    label: "เงินประจำตำแหน่ง",
     sortable: true,
-    field: "salaryClass",
+    field: "positionSalaryAmount",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format: (v) => Number(v).toLocaleString(),
     sort: (a: string, b: string) =>
       a
         .toString()
         .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "commandName",
+    name: "mouthSalaryAmount",
     align: "left",
-    label: "เอกสารอ้างอิง",
+    label: "เงินค่าตอบแทนรายเดือน",
     sortable: true,
-    field: "commandName",
+    field: "mouthSalaryAmount",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    format: (v) => Number(v).toLocaleString(),
     sort: (a: string, b: string) =>
       a
         .toString()
         .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
   {
-    name: "refCommandNo",
+    name: "commandNo",
     align: "left",
     label: "เลขที่คำสั่ง",
     sortable: true,
-    field: "refCommandNo",
+    field: "commandNo",
     format(val, row) {
       return row.commandNo && row.commandYear
         ? `${row.commandNo}/${row.commandYear}`
@@ -261,11 +191,58 @@ const baseColumns = ref<QTableProps["columns"]>([
     },
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "commandCode",
+    align: "left",
+    label: "ประเภทคำสั่ง",
+    sortable: true,
+    field: "commandCode",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    format(val, row) {
+      return store.convertCommandCodeName(val);
+    },
+
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "commandDateSign",
+    align: "left",
+    label: "วันที่ลงนาม",
+    sortable: true,
+    field: "commandDateSign",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    format: (v) => date2Thai(v),
     sort: (a: string, b: string) =>
       a
         .toString()
         .localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+  {
+    name: "organization",
+    align: "left",
+    label: "สังกัด",
+    sortable: true,
+    field: "organization",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    format(val, row) {
+      return findOrgName({
+        root: row.orgRoot,
+        child1: row.orgChild1,
+        child2: row.orgChild2,
+        child3: row.orgChild3,
+        child4: row.orgChild4,
+      });
+    },
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
   {
     name: "remark",
     align: "left",
@@ -309,21 +286,18 @@ const baseColumns = ref<QTableProps["columns"]>([
 ]);
 const visibleColumns = ref<string[]>([
   "commandDateAffect",
-  "amount",
-  "positionSalaryAmount",
-  "mouthSalaryAmount",
-  "oc",
-  "positionName",
   "posNo",
-  "positionLine",
+  "positionName",
-  "positionPathSide",
   "positionType",
   "positionLevel",
   "positionExecutive",
-  "positionExecutiveSide",
+  "amount",
-  "salaryClass",
+  "positionSalaryAmount",
-  "commandName",
+  "mouthSalaryAmount",
-  "refCommandNo",
+  "commandNo",
+  "commandCode",
+  "commandDateSign",
+  "organization",
   "remark",
   "lastUpdateFullName",
   "lastUpdatedAt",

src/modules/04_registryPerson/components/detail/Salary/Main.vue

@@ -30,7 +30,7 @@ const tab = ref<string>("1");
     dense
     class="text-grey q-pl-sm"
   >
-    <q-tab name="1" label="ตำแหน่ง/เงินเดือน" />
+    <q-tab name="1" label="เงินเดือน" />
     <q-tab name="2" label="บันทึกวันที่ไม่ได้รับเงินเดือนฯ" />
   </q-tabs>
   <q-separator />

src/modules/04_registryPerson/interface/request/Education.ts

@@ -8,6 +8,7 @@ interface RequestItemsObject {
   startDate: Date;
   endDate: Date;
   isEducation: boolean | null;
+  isHigh: boolean | null;
   degree: string;
   field: string;
   fundName: string;

src/modules/04_registryPerson/interface/request/Salary.ts

@@ -1,20 +1,27 @@
-interface FormSalaryNew {
+interface FormSalary {
-  date: Date | null;
+  commandCode: string; //ประเภทคำสั่ง
-  posNo: string;
+  commandNo: string; //เลขที่คำสั่ง
-  templatePos: string;
+  commandYear: number | null; //ปี
-  position: string;
+  commandDateAffect: Date | null; //วันที่มีผล
-  positionLine: string;
+  commandDateSign: Date | null; //วันที่ลงนาม
-  positionPathSide: string;
+  posNoAbb: string; //ตัวย่อเลขที่ตำแหน่ง
-  positionType: string;
+  posNo: string; //เลขที่ตำแหน่ง
-  positionLevel: string;
+  positionName: string; //ตำแหน่ง
-  positionExecutive: string;
+  positionType: string; //ประเภทตำแหน่ง, กลุ่มงาน
-  salary: number | string | null;
+  positionLevel: string; //ระดับตำแหน่ง, ระดับชั้นงาน
-  amountSpecial: number | string | null;
+  positionLine: string; // สายงาน
-  salaryPos: number | string | null;
+  positionPathSide: string; //ด้าน/สาขา
-  salaryCompensation: number | string | null;
+  positionExecutive: string; //ตำแหน่งทางการบริหาร
-  refCommandNo: string;
+  amount: number | null; //เงินเดือน
-  templateDoc: string;
+  amountSpecial: number | null; //เงินค่าตอบแทนพิเศษ
-  doc: string;
+  positionSalaryAmount: number | null; //เงินประจำตำแหน่ง
+  mouthSalaryAmount: number | null; //เงินค่าตอบแทนรายเดือน
+  orgRoot: string; //หน่วยงาน
+  orgChild1: string; //ส่วนราชการระดับ 1
+  orgChild2: string; //ส่วนราชการระดับ 2
+  orgChild3: string; //ส่วนราชการระดับ 3
+  orgChild4: string; //ส่วนราชการระดับ 4
+  remark: string; //หมายเหตุstring
 }
 
 interface RequestNoPaidObject {
@@ -26,4 +33,4 @@ interface RequestNoPaidObject {
   refCommandNo: string;
 }
 
-export type { FormSalaryNew, RequestNoPaidObject };
+export type { FormSalary, RequestNoPaidObject };

src/modules/04_registryPerson/stores/Position.ts

@@ -24,7 +24,9 @@ export const useGovernmentPosDataStore = defineStore("GovernmentPos", () => {
   const posExecutiveData = ref<DataOption[]>([]); //รายการตำแหน่งทางการบริหาร
 
   function convertCommandCodeName(val: string) {
-    return commandCodeData.value.find((e: DataOption) => e.id === val)?.name;
+    return (
+      commandCodeData.value.find((e: DataOption) => e.id === val)?.name ?? "-"
+    );
   }
 
   return {

src/modules/04_registryPerson/stores/salary.ts

@@ -1,187 +1,36 @@
 import { defineStore } from "pinia";
 import { ref } from "vue";
 
-import type { DataOption2 } from "@/modules/04_registryPerson/interface/index/Main";
+import type { DataOption } from "@/modules/04_registryPerson/interface/index/Main";
 
 export const useSalaryDataStore = defineStore("salatyDataStore", () => {
-  const optionTemplatePos = ref<DataOption2[]>([
+  //  commandCode ขอตำแหน่ง
-    {
+  const salaryCode = ref<number[]>([5, 6, 7]);
-      id: 1,
-      name: "เลื่อนเงินเดือน",
-    },
-    {
-      id: 2,
-      name: "เลื่อนเงินเดือน (ดีเด่น)",
-    },
-    {
-      id: 3,
-      name: "เลื่อนเงินเดือน (เพิ่มเติม)",
-    },
 
-    {
+  const commandCodeData = ref<DataOption[]>([]);
-      id: 4,
+  const posTypeData = ref<DataOption[]>([]); //รายการประเภทตำแหน่ง | กลุ่มงาน
-      name: "ปรับเงินเดือน",
+  const posLevelData = ref<DataOption[]>([]); //รายการระดับตำแหน่ง | ระดับชั้นงาน
-    },
+  const posLineData = ref<DataOption[]>([]); //รายการสายงาน
+  const posPathSideData = ref<DataOption[]>([]); //รายการด้าน/สาขา
+  const posExecutiveData = ref<DataOption[]>([]); //รายการตำแหน่งทางการบริหาร
 
-    {
+  function convertCommandCodeName(val: string) {
-      id: 5,
+    return (
-      name: "ปรับเงินเดือนเพิ่มเติมตามคุณวุฒิการศึกษา",
+      commandCodeData.value.find((e: DataOption) => e.id === val)?.name ?? "-"
-    },
+    );
-    {
+  }
-      id: 6,
-      name: "ปรับเงินเดือนเพิ่มเติมตามคุณวุฒิการศึกษา (เพิ่มเติม)",
-    },
-    {
-      id: 7,
-      name: "เลื่อนเงินเดือนและให้ข้าราชการ กทม. สามัญได้รับเงินเดือนสูงกว่าขั้นสูงของตำแหน่งที่ได้รับแต่งตั้ง",
-    },
-    {
-      id: 8,
-      name: "เลื่อนเงินเดือนกรณีพิเศษให้แก่ผู้ปฏิบัติงานด้านยาเสพติด",
-    },
-    {
-      id: 9,
-      name: "{ประเภทตำแหน่ง} {ชื่อตำแหน่ง} สำนัก{ชื่อสำนัก}",
-    },
-    {
-      id: 10,
-      name: "แต่งตั้งข้าราชการ {ประเภทตำแหน่ง} {ชื่อตำแหน่ง} สำนัก{ชื่อสำนัก}",
-    },
-    {
-      id: 11,
-      name: "แก้ไขคำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-
-    {
-      id: 12,
-      name: "โปรดเกล้าฯ {ชื่อตำแหน่ง} สำนัก{ชื่อสำนัก}",
-    },
-
-    {
-      id: 13,
-      name: "ช่วยราชการที่{หน่วยงานและรายละเอียดต่างๆ}",
-    },
-
-    {
-      id: 14,
-      name: "ปฏิบัติหน้าที่ในตำแหน่ง{ชื่อตำแหน่ง} สำนัก{ชื่อสำนัก}",
-    },
-
-    {
-      id: 15,
-      name: "รักษาการในตำแหน่ง{ชื่อตำแหน่ง} สำนัก{ชื่อสำนัก}",
-    },
-    {
-      id: 16,
-      name: "พ้นจากการทดลองปฏิบัติหน้าที่ราชการ",
-    },
-
-    {
-      id: 17,
-      name: "งดเลื่อนขั้นเงินเดือน",
-    },
-    {
-      id: 18,
-      name: "แก้ไขคำสั่งเลื่อนขั้นเงินเดือน {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 19,
-      name: "ยกเลิกคำสั่งเลื่อนขั้นเงินเดือน {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 20,
-      name: "กลับไปปฏิบัติงานทางต้นสังกัดเดิม",
-    },
-    {
-      id: 21,
-      name: "โปรดเกล้าฯ แต่งตั้งให้ดำรงตำแหน่ง{รายละเอียดของตำแหน่งและหน่วยงาน}",
-    },
-  ]);
-
-  const optionTemplateDoc = ref<DataOption2[]>([
-    {
-      id: 1,
-      name: "บรรจุและแต่งตั้งผู้สอบแข่งขันได้ คำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 2,
-      name: "ปรับเงินเดือนตาม{รายละเอียดของบัญชี เช่นชื่อ ฉบับที่ ปี พ.ศ.}",
-    },
-    {
-      id: 3,
-      name: "เลื่อนขั้นเงินเดือนตามคำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-
-    {
-      id: 4,
-      name: "เลื่อนขั้นเงินเดือน คำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-
-    {
-      id: 5,
-      name: "เลื่อนขั้นเงินเดือน (1 ขั้น) คำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 6,
-      name: "เลื่อนขั้นเงินเดือน (1.5 ขั้น) คำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 7,
-      name: "แต่งตั้งตามคำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 8,
-      name: "คำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 9,
-      name: "ปรับเงินเดือนตาม{รายละเอียดข้อมูล}",
-    },
-    {
-      id: 10,
-      name: "แก้ไขคำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม} ตามคำสั่ง {หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 11,
-      name: "เลื่อนระดับและแต่งตั้งคำสั่ง{หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-
-    {
-      id: 12,
-      name: "แต่งตั้งดำรงตำแหน่ง{ชื่อตำแหน่ง} คำสั่ง{หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-
-    {
-      id: 13,
-      name: "แต่งตั้งคำสั่ง{หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-
-    {
-      id: 14,
-      name: "เลื่อนและแต่งตั้งโดยการสอบคัดเลือก คำสั่ง{หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-
-    {
-      id: 15,
-      name: "แต่งตั้งข้าราชการให้ดำรงตำแหน่งของ{รายละเอียดของตำแหน่งและหน่วยงาน} คำสั่ง{หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 16,
-      name: "ย้ายตามคำสั่ง{หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-
-    {
-      id: 17,
-      name: "แต่งตั้งข้าราชการให้ดำรงตำแหน่งตามคำสั่ง{หน่วยงาน/สำนัก} ที่ {เลขที่}/{ปีงบประมาณ} ลว. {วันที่ลงนาม}",
-    },
-    {
-      id: 18,
-      name: "ปรับอัตราเงินเดือนตามพระราชกฤษฎีกาการปรับอัตราเงินเดือนของข้าราชการ พ.ศ. (.............)",
-    },
-  ]);
 
   return {
-    optionTemplatePos,
+    // Data
-    optionTemplateDoc,
+    salaryCode,
+    commandCodeData,
+    posTypeData,
+    posLevelData,
+    posLineData,
+    posPathSideData,
+    posExecutiveData,
+
+    // Function
+    convertCommandCodeName,
   };
 });

src/modules/21_report/views/02_reportRegistry.vue

@@ -21,7 +21,6 @@ import type {
   DataOption,
   OptionExecutive,
   ResOptionPerson,
-  DataEducationLevel,
 } from "@/modules/21_report/interface/Main";
 import type { DataRoles } from "@/interface/response/main";
 import type { DataStructureTree } from "@/interface/main";
@@ -44,6 +43,7 @@ const {
   hideLoader,
   date2Thai,
   formatDatePositionReport,
+  convertDateToAPI,
 } = useCounterMixin();
 
 const loadingBtn = ref<boolean>(false);
@@ -94,6 +94,9 @@ const statusOps = ref<DataOption[]>([]); //ตัวเลือก สถาน
 const education = ref<string>("");
 const educationOp = ref<DataOption[]>([]);
 const educationOpMain = ref<DataOption[]>([]);
+const educationLevel = ref<string>("");
+const field = ref<string>("");
+const positionArea = ref<string>("");
 
 /** ตัวแปรสังกัด */
 const modalOrg = ref<boolean>(false);
@@ -123,11 +126,14 @@ const visibleColumnsBase = ref<string[]>([
   "position",
   "posType",
   "posLevel",
+  "positionArea",
   "org",
   "positionExecutive",
   "gender",
   "status",
   "education",
+  "educationLevel",
+  "field",
   "dateAppoint",
   "dateRetireLaw",
   "age",
@@ -184,7 +190,7 @@ const columns = computed<QTableProps["columns"]>(() => {
     {
       name: "posType",
       align: "left",
-      label: "ตำแหน่งประเภท",
+      label: employeeClass.value === "officer" ? "ตำแหน่งประเภท" : "กลุ่มงาน",
       sortable: true,
       field: "posType",
       headerStyle: "font-size: 14px",
@@ -195,7 +201,7 @@ const columns = computed<QTableProps["columns"]>(() => {
     {
       name: "posLevel",
       align: "left",
-      label: "ระดับ",
+      label: employeeClass.value === "officer" ? "ระดับ" : "ระดับชั้นงาน",
       sortable: true,
       field: "posLevel",
       headerStyle: "font-size: 14px",
@@ -203,6 +209,17 @@ const columns = computed<QTableProps["columns"]>(() => {
       sort: (a: string, b: string) =>
         a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
     },
+    {
+      name: "positionArea",
+      align: "left",
+      label: "ด้าน/สาขา",
+      sortable: true,
+      field: "positionArea",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
     {
       name: "org",
       align: "left",
@@ -247,6 +264,17 @@ const columns = computed<QTableProps["columns"]>(() => {
       sort: (a: string, b: string) =>
         a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
     },
+    {
+      name: "educationLevel",
+      align: "left",
+      label: "ระดับการศึกษา",
+      sortable: true,
+      field: "educationLevel",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
     {
       name: "education",
       align: "left",
@@ -258,6 +286,18 @@ const columns = computed<QTableProps["columns"]>(() => {
       sort: (a: string, b: string) =>
         a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
     },
+
+    {
+      name: "field",
+      align: "left",
+      label: "สาขา",
+      sortable: true,
+      field: "field",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
+      sort: (a: string, b: string) =>
+        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
     {
       name: "dateAppoint",
       align: "left",
@@ -326,7 +366,9 @@ const columns = computed<QTableProps["columns"]>(() => {
 const visibleColumns = computed<string[]>(() => {
   return employeeClass.value === "officer"
     ? visibleColumnsBase.value
-    : visibleColumnsBase.value.filter((e: string) => e !== "positionExecutive");
+    : visibleColumnsBase.value.filter(
+        (e: string) => e !== "positionExecutive" && e !== "positionArea"
+      );
 });
 
 const typeTerm = ref<string>("");
@@ -336,10 +378,6 @@ const rangeTerm = ref<RangeAge>({
 });
 const isLoadStructureTree = ref<boolean>(true);
 
-function onOpenOrg() {
-  modalOrg.value = true;
-}
-
 /**
  * ฟังก์ชั่นค้นหาข้อมูลของ Option Filter
  * @param val คำที่ค้นหา
@@ -491,29 +529,12 @@ function getDataPerson() {
   });
 }
 
-/** function ดึง ข้อมูลระดับการศึกษา*/
-function getEducationLevel() {
-  http
-    .get(config.API.orgEducationLevel)
-    .then(async (res) => {
-      const list = res.data.result.map((r: DataEducationLevel) => ({
-        id: r.id,
-        name: r.name,
-      }));
-      educationOpMain.value = list;
-    })
-    .catch((err) => {
-      messageError($q, err);
-    });
-}
-
 async function onSearch() {
   loadingBtn.value = true;
   pagination.value.page = 1;
   const queryParams = {
     node: storeReport.formFilter.node ?? null,
     nodeId: storeReport.formFilter.nodeId ?? "",
-
     posType: posType.value,
     posLevel: posLevel.value,
     position: position.value,
@@ -521,11 +542,13 @@ async function onSearch() {
     gender: gender.value,
     status: status.value,
     education: education.value.trim(),
+    educationLevel: educationLevel.value.trim(),
+    field: field.value.trim(),
+    positionArea: positionArea.value.trim(),
     ageMin: rangeAge.value.min,
     ageMax: rangeAge.value.max,
-    dateStart: dateStart.value ?? null,
+    dateStart: convertDateToAPI(dateStart.value) ?? null,
-    dateEnd: dateEnd.value ?? null,
+    dateEnd: convertDateToAPI(dateEnd.value) ?? null,
-
     isProbation: isProbation.value,
     isRetire: isRetire.value,
     retireType: retireType.value,
@@ -546,6 +569,7 @@ async function onSearch() {
     )
     .then(async (res) => {
       const data = res.data.result.data;
+
       total.value = res.data.result.total;
       rows.value = data.map((item: any, index: number) => ({
         profileId: item.profileId,
@@ -561,7 +585,19 @@ async function onSearch() {
         positionExecutive: item.posExecutiveName ?? "-",
         gender: item.gender ?? "-",
         status: item.relationship ?? "-",
-        education: item.degree ?? "-",
+        education:
+          item.Educations.length > 0
+            ? item.Educations.map((e: any) => e.degree)
+            : [],
+        educationLevel:
+          item.Educations.length > 0
+            ? item.Educations.map((e: any) => e.educationLevel)
+            : [],
+        field:
+          item.Educations.length > 0
+            ? item.Educations.map((e: any) => e.field)
+            : [],
+
         dateAppoint: item.dateAppoint ?? "-",
         age: item.age ?? "-",
         positionDate:
@@ -578,6 +614,7 @@ async function onSearch() {
           ) ?? "-",
         empType: employeeClass.value,
         dateRetireLaw: item.dateRetireLaw ?? "-",
+        positionArea: item.positionArea ?? "-",
       }));
     })
     .catch((e) => {
@@ -594,15 +631,24 @@ async function onSearch() {
 
 function exportToExcel() {
   const newData = rows.value.map((e: any) => {
-    const { profileId, empType, ...rest } = e;
+    const { profileId, empType, positionArea, positionExecutive, ...rest } = e;
     return {
       ...rest,
       dateAppoint: date2Thai(e.dateAppoint),
       dateRetireLaw: date2Thai(e.dateRetireLaw),
+      education: e.education.map((e: string) => `${e}`).join(", "),
+      educationLevel: e.educationLevel.map((e: string) => `${e}`).join(", "),
+      field: e.field.map((e: string) => `${e}`).join(", "),
     };
   });
 
-  const headers = columns.value?.map((item: any) => item.label) || []; // หัวคอลัมน์ภาษาไทย
+  const headers =
+    columns.value
+      ?.filter(
+        (x: any) =>
+          x.field !== "positionExecutive" && x.field !== "positionArea"
+      )
+      .map((item: any) => item.label) || []; // หัวคอลัมน์ภาษาไทย
   const worksheet = XLSX.utils.json_to_sheet(newData, {
     header: visibleColumns.value,
   });
@@ -635,6 +681,10 @@ function clearFilter() {
   gender.value = ""; //เพศ
   status.value = ""; //สถานภาพ
   education.value = ""; //วุฒิการศึกษา
+  field.value = "";
+  educationLevel.value = "";
+  positionArea.value = "";
+
   //ช่วงเวลาบรรจุ
   dateStart.value = null; //ตั้งแต่วันที่
   dateEnd.value = null; //ถึงวันที่
@@ -743,6 +793,25 @@ onMounted(async () => {
     });
 });
 
+function formatEducation(value: any) {
+  if (!Array.isArray(value) || value.length === 0) {
+    return "-";
+  }
+
+  // ตรวจสอบว่าทุกค่าว่างทั้งหมดหรือไม่
+  const allEmpty = value.every((e) => !e?.toString().trim());
+
+  if (allEmpty) {
+    return "-";
+  }
+
+  return value
+    .map((e, index) =>
+      e?.toString().trim() ? `- ${e}` : index > 0 ? "<br>" : ""
+    )
+    .join("<br>");
+}
+
 watch(
   () => storeMenu.permissions,
   () => {
@@ -774,32 +843,11 @@ watch(
                 map-options
                 option-label="name"
                 option-value="id"
-                @update:model-value="clearFilter(), getType()"
+                @update:model-value="clearFilter(), getType(), (rows = [])"
               >
               </q-select>
             </div>
-            <!-- <div class="col-lg-9 col-md-8 col-sm-8 col-xs-11">
+
-              <q-input
-                outlined
-                dense
-                :model-value="org"
-                autogrow
-                label="สังกัด"
-                @click="onOpenOrg"
-              >
-                <template v-if="org" v-slot:append>
-                  <q-icon
-                    name="cancel"
-                    @click.stop.prevent="
-                      (org = ''),
-                        (storeReport.formFilter.node = null),
-                        (storeReport.formFilter.nodeId = null)
-                    "
-                    class="cursor-pointer"
-                  />
-                </template>
-              </q-input>
-            </div> -->
             <q-space />
             <div>
               <q-btn
@@ -811,52 +859,7 @@ watch(
                 v-if="checkPermission($route)?.attrIsGet"
                 :disable="rows.length == 0"
                 @click="exportToExcel()"
-              >
+              />
-                <!-- <q-menu>
-                    <q-list style="min-width: 150px">
-                      <q-item
-                        clickable
-                        v-close-popup
-                        @click="
-                          genReportXLSX(
-                            detailReport,
-                            `${
-                              employeeClass == 'officer'
-                                ? 'รายงานสถิติข้อมูลข้าราชการ กทม. สามัญ'
-                                : 'รายงานสถิติข้อมูลลูกจ้างประจำ กทม.'
-                            }`,
-                            'pdf'
-                          )
-                        "
-                      >
-                        <q-item-section avatar
-                          ><q-icon color="red" name="mdi-file-pdf"
-                        /></q-item-section>
-                        <q-item-section>ไฟล์ .pdf</q-item-section>
-                      </q-item>
-                      <q-item
-                        clickable
-                        v-close-popup
-                        @click="
-                          genReportXLSX(
-                            detailReport,
-                            `${
-                              employeeClass == 'officer'
-                                ? 'รายงานสถิติข้อมูลข้าราชการ กทม. สามัญ'
-                                : 'รายงานสถิติข้อมูลลูกจ้างประจำ กทม.'
-                            }`,
-                            'xlsx'
-                          )
-                        "
-                      >
-                        <q-item-section avatar
-                          ><q-icon color="green" name="mdi-file-excel"
-                        /></q-item-section>
-                        <q-item-section>ไฟล์ .xlsx</q-item-section>
-                      </q-item>
-                    </q-list>
-                  </q-menu> -->
-              </q-btn>
             </div>
           </div>
         </q-card>
@@ -1238,6 +1241,25 @@ watch(
                       </q-select>
                     </div>
                     <div class="col-12"><q-separator /></div>
+                    <div class="col-12 q-px-sm">
+                      <q-input
+                        dense
+                        v-model="educationLevel"
+                        borderless
+                        label="ระดับการศึกษา"
+                        class="bg-white full-width"
+                      >
+                        <template v-if="educationLevel" v-slot:append>
+                          <q-icon
+                            name="cancel"
+                            @click.stop.prevent="educationLevel = ''"
+                            class="cursor-pointer"
+                            style="opacity: 0.6"
+                          />
+                        </template>
+                      </q-input>
+                    </div>
+                    <div class="col-12"><q-separator /></div>
                     <div class="col-12 q-px-sm">
                       <q-input
                         dense
@@ -1255,39 +1277,50 @@ watch(
                           />
                         </template>
                       </q-input>
-                      <!-- <q-select
+                    </div>
-                        label="วุฒิการศึกษา"
+
-                        :model-value="education == '' ? 'ทั้งหมด' : education"
+                    <div class="col-12"><q-separator /></div>
-                        :options="educationOp"
+                    <div class="col-12 q-px-sm">
-                        emit-value
+                      <q-input
                         dense
+                        v-model="field"
                         borderless
-                        map-options
+                        label="สาขา"
-                        option-label="name"
+                        class="bg-white full-width"
-                        option-value="name"
-                        fill-input
-                        use-input
-                        hide-selected
-                        bg-color="white"
-                        @filter="(inputValue:any,doneFn:Function) => filterOption(inputValue, doneFn,'education') "
-                        @update:model-value="(value:string)=>(education = value)"
                       >
-                        <template v-slot:no-option>
+                        <template v-if="field" v-slot:append>
-                          <q-item>
-                            <q-item-section class="text-grey">
-                              ไม่มีข้อมูล
-                            </q-item-section>
-                          </q-item>
-                        </template>
-                        <template v-if="education" v-slot:append>
                           <q-icon
                             name="cancel"
-                            @click.stop.prevent="education = ''"
+                            @click.stop.prevent="field = ''"
                             class="cursor-pointer"
                             style="opacity: 0.6"
                           />
                         </template>
-                      </q-select> -->
+                      </q-input>
+                    </div>
+                    <div class="col-12" v-if="employeeClass === 'officer'">
+                      <q-separator />
+                    </div>
+                    <div
+                      class="col-12 q-px-sm"
+                      v-if="employeeClass === 'officer'"
+                    >
+                      <q-input
+                        dense
+                        v-model="positionArea"
+                        borderless
+                        label=" ด้าน/สาขา"
+                        class="bg-white full-width"
+                      >
+                        <template v-if="positionArea" v-slot:append>
+                          <q-icon
+                            name="cancel"
+                            @click.stop.prevent="positionArea = ''"
+                            class="cursor-pointer"
+                            style="opacity: 0.6"
+                          />
+                        </template>
+                      </q-input>
                     </div>
                     <div class="col-12"><q-separator /></div>
                     <div class="col-12 q-pa-sm">
@@ -1677,6 +1710,16 @@ watch(
                         >
                           {{ col.value ? col.value : "-" }}
                         </div>
+                        <div
+                          v-else-if="
+                            ['education', 'educationLevel', 'field'].includes(
+                              col.name
+                            )
+                          "
+                        >
+                          <div v-html="formatEducation(col.value)"></div>
+                        </div>
+
                         <div v-else>
                           {{ col.value ? col.value : "-" }}
                         </div>