รายงาน

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/21_report/views/02_reportRegistry.vue

@@ -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);
@@ -128,6 +131,8 @@ const visibleColumnsBase = ref<string[]>([
   "gender",
   "status",
   "education",
+  "educationLevel",
+  "field",
   "dateAppoint",
   "dateRetireLaw",
   "age",
@@ -247,6 +252,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 +274,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",
@@ -336,10 +364,6 @@ const rangeTerm = ref<RangeAge>({
 });
 const isLoadStructureTree = ref<boolean>(true);
 
-function onOpenOrg() {
-  modalOrg.value = true;
-}
-
 /**
  * ฟังก์ชั่นค้นหาข้อมูลของ Option Filter
  * @param val คำที่ค้นหา
@@ -491,29 +515,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 +528,13 @@ async function onSearch() {
     gender: gender.value,
     status: status.value,
     education: education.value.trim(),
+    educationLevel: educationLevel.value.trim(),
+    field: field.value.trim(),
+    positionArea: education.value.trim(),
     ageMin: rangeAge.value.min,
     ageMax: rangeAge.value.max,
     dateStart: dateStart.value ?? null,
     dateEnd: dateEnd.value ?? null,
-
     isProbation: isProbation.value,
     isRetire: isRetire.value,
     retireType: retireType.value,
@@ -546,6 +555,22 @@ async function onSearch() {
     )
     .then(async (res) => {
       const data = res.data.result.data;
+      const Educations = [
+        {
+          field: "",
+          degree: "วิทยาศาสตร์บัณฑิต",
+          isHigh: null,
+          isEducation: 1,
+          educationLevel: "",
+        },
+        {
+          field: "",
+          degree: "วิทยาศาสตร์บัณฑิต2",
+          isHigh: null,
+          isEducation: 1,
+          educationLevel: "ปริญญาตรี",
+        },
+      ];
       total.value = res.data.result.total;
       rows.value = data.map((item: any, index: number) => ({
         profileId: item.profileId,
@@ -561,7 +586,12 @@ async function onSearch() {
         positionExecutive: item.posExecutiveName ?? "-",
         gender: item.gender ?? "-",
         status: item.relationship ?? "-",
-        education: item.degree ?? "-",
+        education:
+          Educations.length > 0 ? Educations.map((e) => e.degree) : "-",
+        educationLevel:
+          Educations.length > 0 ? Educations.map((e) => e.educationLevel) : "-",
+        field: Educations.length > 0 ? Educations.map((e) => e.field) : "-",
+
         dateAppoint: item.dateAppoint ?? "-",
         age: item.age ?? "-",
         positionDate:
@@ -599,6 +629,9 @@ function exportToExcel() {
       ...rest,
       dateAppoint: date2Thai(e.dateAppoint),
       dateRetireLaw: date2Thai(e.dateRetireLaw),
+      education: e.education.map((e: string) => `${e}`).join(", "),
+      educationLevel: e.education.map((e: string) => `${e}`).join(", "),
+      feild: e.education.map((e: string) => `${e}`).join(", "),
     };
   });
 
@@ -635,6 +668,10 @@ function clearFilter() {
   gender.value = ""; //เพศ
   status.value = ""; //สถานภาพ
   education.value = ""; //วุฒิการศึกษา
+  field.value = "";
+  educationLevel.value = "";
+  positionArea.value = "";
+
   //ช่วงเวลาบรรจุ
   dateStart.value = null; //ตั้งแต่วันที่
   dateEnd.value = null; //ถึงวันที่
@@ -743,6 +780,14 @@ onMounted(async () => {
     });
 });
 
+function formatEducation(value: any) {
+  return Array.isArray(value) && value.length > 0
+    ? value
+        .map((e, index) => (e ? `- ${e}` : index > 0 ? "<br>" : ""))
+        .join("<br>")
+    : "-";
+}
+
 watch(
   () => storeMenu.permissions,
   () => {
@@ -774,7 +819,7 @@ watch(
                 map-options
                 option-label="name"
                 option-value="id"
-                @update:model-value="clearFilter(), getType()"
+                @update:model-value="clearFilter(), getType(), (rows = [])"
               >
               </q-select>
             </div>
@@ -1238,6 +1283,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 +1319,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 +1752,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>