fixing filter register & show rang

src/modules/04_registryPerson/components/TableView.vue

@@ -399,9 +399,13 @@ watch(
               class="text-weight-medium q-mt-sm"
             >
               {{
-                `${props.row.prefix ? props.row.prefix : ""}${
+                `${
-                  props.row.firstName
+                  props.row.rank
-                } ${props.row.lastName}`
+                    ? props.row.rank
+                    : props.row.prefix
+                    ? props.row.prefix
+                    : ""
+                }${props.row.firstName} ${props.row.lastName}`
               }}
             </div>
             <div
@@ -414,9 +418,13 @@ watch(
             >
               <q-tooltip>รายละเอียด</q-tooltip>
               {{
-                `${props.row.prefix ? props.row.prefix : ""}${
+                `${
-                  props.row.firstName
+                  props.row.rank
-                } ${props.row.lastName}`
+                    ? props.row.rank
+                    : props.row.prefix
+                    ? props.row.prefix
+                    : ""
+                }${props.row.firstName} ${props.row.lastName}`
               }}
               <q-icon name="mdi-open-in-new" size="xs"></q-icon>
             </div>

src/modules/04_registryPerson/components/detail/PersonalInformation/01_Profile.vue

@@ -485,7 +485,7 @@ onMounted(() => {
             {{
               `${
                 informaData.rank ? informaData.rank : informaData.prefix ?? ""
-              } ${informaData.firstName} ${informaData.lastName}`
+              }${informaData.firstName} ${informaData.lastName}`
             }}
           </div>
           <div class="q-py-xs">

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

@@ -10,6 +10,8 @@ interface FormFilter {
   isShowRetire: boolean | null;
   isProbation: boolean | null;
   isAll?: boolean;
+  nodeId?: string | null;
+  node?: string | null;
 }
 
 interface FormAddPerson {

src/modules/04_registryPerson/store.ts

@@ -62,6 +62,8 @@ export const useRegistryNewDataStore = defineStore("registryNew", () => {
     isShowRetire: false,
     isProbation: false,
     isAll: true,
+    nodeId: null,
+    node: null,
   });
 
   const labelOption = reactive({
@@ -72,11 +74,6 @@ export const useRegistryNewDataStore = defineStore("registryNew", () => {
     node: "เลือกหน่วยงาน",
   });
 
-  const nodeData = reactive<any>({
-    nodeId: null,
-    node: null,
-  });
-
   return {
     fetchType,
     fetchLevel,
@@ -89,6 +86,5 @@ export const useRegistryNewDataStore = defineStore("registryNew", () => {
     mode,
     formFilter,
     labelOption,
-    nodeData,
   };
 });

src/modules/04_registryPerson/views/detailView.vue

@@ -792,7 +792,7 @@ onMounted(async () => {
                       formDetail.rank
                         ? formDetail.rank
                         : formDetail.prefix ?? ""
-                    } ${formDetail.firstName} ${formDetail.lastName}`
+                    }${formDetail.firstName} ${formDetail.lastName}`
                   }}
                 </h2>
               </div>

src/modules/04_registryPerson/views/list.vue

@@ -44,21 +44,22 @@ const nodeData = reactive<any>({
   page: 1,
   pageSize: 10,
   round: "",
-  nodeId: null,
-  node: null,
   name: "เลือกหน่วยงาน/ส่วนราชการ",
   keyword: "",
+  nodeId: null,
+  node: null,
 });
-const conditionTotal = computed(() => {
-  let num: string = "";
-  if (store.formFilter.isProbation && store.formFilter.isShowRetire) {
-    num = "(2)";
-  } else if (store.formFilter.isProbation || store.formFilter.isShowRetire) {
-    num = "(1)";
-  } else "";
 
-  return num;
+// const conditionTotal = computed(() => {
-});
+//   let num: string = "";
+//   if (store.formFilter.isProbation && store.formFilter.isShowRetire) {
+//     num = "(2)";
+//   } else if (store.formFilter.isProbation || store.formFilter.isShowRetire) {
+//     num = "(1)";
+//   } else "";
+
+//   return num;
+// });
 
 /**
  * function เรียกข้อมูลตำแหน่งประเภท
@@ -143,12 +144,15 @@ function fetchDataPerson() {
     queryParams.type = empType.value;
   }
 
-  if (store.nodeData.node !== null && store.nodeData.nodeId !== null) {
+  if (store.formFilter.node !== null && store.formFilter.nodeId !== null) {
-    queryParams.node = store.nodeData.node;
+    queryParams.node = store.formFilter.node;
-    queryParams.nodeId = store.nodeData.nodeId;
+    queryParams.nodeId = store.formFilter.nodeId;
+  }
+
+  if (store.formFilter.nodeId) {
+    queryParams.isAll = store.formFilter.isAll;
   }
 
-  queryParams.isAll = store.formFilter.isAll;
   http
     .get(
       config.API.registryNew(empType.value !== "officer" ? "-employee" : ""),
@@ -267,7 +271,7 @@ async function selectType() {
       store.labelOption.posLevel != "ทั้งหมด" ||
       store.formFilter.isShowRetire ||
       store.formFilter.isProbation ||
-      store.nodeData.nodeId != null
+      store.formFilter.nodeId != null
     ) {
       store.formFilter.page = 1;
       fetchDataPerson();
@@ -316,6 +320,8 @@ function clearSelect(t: string) {
   } else if (t === "org") {
     nodeData.node = null;
     nodeData.nodeId = null;
+    store.formFilter.node = null;
+    store.formFilter.nodeId = null;
     store.labelOption.node =
       empType.value === "officer"
         ? "เลือกหน่วยงาน/ส่วนราชการ"
@@ -332,8 +338,8 @@ async function fetchTree(id: string) {
     .then((res) => {
       const data = res.data.result;
       node.value = data;
-      store.nodeData.node = nodeData.node;
+      store.formFilter.node = nodeData.node;
-      store.nodeData.nodeId = nodeData.nodeId;
+      store.formFilter.nodeId = nodeData.nodeId;
     })
     .catch((err) => {
       messageError($q, err);
@@ -358,8 +364,8 @@ function fetchActive() {
 }
 
 function sendNode() {
-  nodeData.node = store.nodeData.node;
+  nodeData.node = store.formFilter.node;
-  nodeData.nodeId = store.nodeData.nodeId;
+  nodeData.nodeId = store.formFilter.nodeId;
   store.labelOption.node = nodeData.name;
   selectNode.value = false;
   fetchDataPerson();
@@ -376,15 +382,15 @@ watch(
 
 function updateSelectedTreeMain(data: any) {
   if (nodeData.node === data.orgLevel && nodeData.nodeId === data.orgTreeId) {
-    store.nodeData.node = null;
+    store.formFilter.node = null;
-    store.nodeData.nodeId = null;
+    store.formFilter.nodeId = null;
     nodeData.name =
       empType.value === "officer"
         ? "เลือกหน่วยงาน/ส่วนราชการ"
         : "เลือกหน่วยงาน";
   } else {
-    store.nodeData.node = data.orgLevel;
+    store.formFilter.node = data.orgLevel;
-    store.nodeData.nodeId = data.orgTreeId;
+    store.formFilter.nodeId = data.orgTreeId;
     nodeData.name = data.orgName;
   }
 }
@@ -466,12 +472,8 @@ onMounted(async () => {
           </div> -->
 
           <div
-            :class="
-              !isShowBtnFilter
-                ? 'row q-mt-sm q-gutter-sm justify-center'
-                : 'row q-gutter-sm justify-center'
-            "
             v-if="isShowFilter"
+            class="row q-mt-sm q-gutter-sm justify-center"
           >
             <q-btn-dropdown
               flat
@@ -603,7 +605,7 @@ onMounted(async () => {
             />
 
             <q-toggle
-              v-if="empType !== 'officer'"
+              v-if="empType !== 'officer' && store.formFilter.nodeId"
               v-model="store.formFilter.isAll"
               color="primary"
               label="แสดงตำแหน่งทั้งหมด"
@@ -646,7 +648,7 @@ onMounted(async () => {
           </div>
 
           <div
-            v-if="empType === 'officer'"
+            v-if="empType === 'officer' && store.formFilter.nodeId"
             class="row q-gutter-sm justify-center"
           >
             <q-toggle
@@ -731,7 +733,7 @@ onMounted(async () => {
                 <q-item
                   clickable
                   @click.stop="updateSelectedTreeMain(prop.node)"
-                  :active="store.nodeData.nodeId === prop.node.orgTreeId"
+                  :active="store.formFilter.nodeId === prop.node.orgTreeId"
                   active-class="my-list-link text-primary text-weight-medium"
                   class="row col-12 items-center text-dark q-py-xs q-pl-sm rounded-borders my-list"
                 >