refactor(permission): display positionIsSelected

src/modules/02_users/stores/permissions.ts

@@ -1,8 +1,45 @@
 import { defineStore } from "pinia";
 import { ref } from "vue";
+import type { NodeTree } from "../interface/response/Main";
 
 export const usePermissionsStore = defineStore("permissions", () => {
   const typeOrganizational = ref<string>("current");
+  const defaultOrganizationalNode = {
+    labelName: "หน่วยงานทั้งหมด",
+    orgCode: "",
+    orgLevel: 0,
+    orgName: "",
+    orgRevisionId: "",
+    orgRootName: "",
+    orgTreeCode: "",
+    orgTreeFax: "",
+    orgTreeId: "",
+    orgTreeName: "หน่วยงานทั้งหมด",
+    orgTreeOrder: 0,
+    orgTreePhoneEx: "",
+    orgTreePhoneIn: "",
+    orgTreeRank: "",
+    orgTreeRankSub: "",
+    orgTreeShortName: "",
+    responsibility: "",
+    totalPosition: 0,
+    totalPositionCurrentUse: 0,
+    totalPositionCurrentVacant: 0,
+    totalPositionNextUse: 0,
+    totalPositionNextVacant: 0,
+    totalRootPosition: 0,
+    totalRootPositionCurrentUse: 0,
+    totalRootPositionCurrentVacant: 0,
+    totalRootPositionNextUse: 0,
+    totalRootPositionNextVacant: 0,
+    children: [] as NodeTree[],
+    isOfficer: false,
+    orgRootDnaId: "",
+    orgChild1DnaId: "",
+    orgChild2DnaId: "",
+    orgChild3DnaId: "",
+    orgChild4DnaId: "",
+  };
 
   const activeId = ref<string>("");
   const draftId = ref<string>("");
@@ -10,5 +47,6 @@ export const usePermissionsStore = defineStore("permissions", () => {
     typeOrganizational,
     activeId,
     draftId,
+    defaultOrganizationalNode,
   };
 });

src/modules/02_users/views/03_permissionsView.vue

@@ -33,44 +33,7 @@ const { showLoader, hideLoader, messageError, success, dialogRemove } =
 
 /** Tree*/
 const filter = ref<string>(""); // ค้นหาข้อมูลโครงาสร้าง
-const nodes = ref<Array<NodeTree>>([
+const nodes = ref<Array<NodeTree>>([store.defaultOrganizationalNode]); // ข้อมูลโครงสร้าง
-  {
-    labelName: "หน่วยงานทั้งหมด",
-    orgCode: "",
-    orgLevel: 0,
-    orgName: "",
-    orgRevisionId: "",
-    orgRootName: "",
-    orgTreeCode: "",
-    orgTreeFax: "",
-    orgTreeId: "",
-    orgTreeName: "หน่วยงานทั้งหมด",
-    orgTreeOrder: 0,
-    orgTreePhoneEx: "",
-    orgTreePhoneIn: "",
-    orgTreeRank: "",
-    orgTreeRankSub: "",
-    orgTreeShortName: "",
-    responsibility: "",
-    totalPosition: 0,
-    totalPositionCurrentUse: 0,
-    totalPositionCurrentVacant: 0,
-    totalPositionNextUse: 0,
-    totalPositionNextVacant: 0,
-    totalRootPosition: 0,
-    totalRootPositionCurrentUse: 0,
-    totalRootPositionCurrentVacant: 0,
-    totalRootPositionNextUse: 0,
-    totalRootPositionNextVacant: 0,
-    children: [] as NodeTree[],
-    isOfficer: false,
-    orgRootDnaId: "",
-    orgChild1DnaId: "",
-    orgChild2DnaId: "",
-    orgChild3DnaId: "",
-    orgChild4DnaId: "",
-  },
-]); // ข้อมูลโครงสร้าง
 const lazy = ref(nodes);
 const expanded = ref<string[]>([]); // แสดงข้อมูลในโหนดที่เลือก
 const nodeId = ref<string>(""); // id โหนด
@@ -295,6 +258,8 @@ async function fetchDataTree(id: string) {
   const isSuperAdmin = tokenParsedData.value.includes("SUPER_ADMIN");
   if (!isSuperAdmin) {
     nodes.value = [];
+  } else {
+    nodes.value = [store.defaultOrganizationalNode];
   }
   showLoader();
   await http
@@ -626,7 +591,7 @@ onMounted(async () => {
 
                   <div>
                     <q-checkbox
-                      :disable="nodeId"
+                      :disable="nodeId ? false : true"
                       keep-color
                       v-model="reqMaster.isAll"
                       label="แสดงตำแหน่งทั้งหมด"
@@ -819,7 +784,6 @@ onMounted(async () => {
                           table-class="text-grey-9"
                           row-key="id"
                           dense
-                          hide-bottom
                           bordered
                           separator="vertical"
                           class="custom-header-table-expand"
@@ -847,6 +811,15 @@ onMounted(async () => {
                                 <div v-if="col.name == 'no'" class="text-body2">
                                   {{ props.rowIndex + 1 }}
                                 </div>
+
+                                <div v-else-if="col.name === 'positionName'">
+                                  {{ col.value ? col.value : "-" }}
+                                  <q-icon
+                                    v-if="props.row.positionIsSelected"
+                                    name="check"
+                                    color="primary"
+                                  />
+                                </div>
                                 <div
                                   v-else-if="col.name === 'posExecutiveName'"
                                   class="text-body2"

src/modules/02_users/views/05_responsIbilities.vue

@@ -309,7 +309,7 @@ async function fetchDataTree(id: string) {
 async function fetchDataTable(
   id: string | null,
   revisionId: string,
-  level: number
+  level: number,
 ) {
   showLoader();
   posMaster.value = [];
@@ -385,7 +385,7 @@ function onDelete(id: string) {
         await fetchDataTable(
           reqMaster.id,
           reqMaster.revisionId,
-          reqMaster.type
+          reqMaster.type,
         );
         success($q, "ลบข้อมูลสำเร็จ");
       })
@@ -433,7 +433,7 @@ watch(
   () => {
     reqMaster.page = 1;
     fetchDataTable(reqMaster.id, reqMaster.revisionId, reqMaster.type);
-  }
+  },
 );
 
 onMounted(async () => {
@@ -559,7 +559,7 @@ onMounted(async () => {
                   <div>
                     <q-checkbox
                       keep-color
-                      :disable="nodeId"
+                      :disable="nodeId ? false : true"
                       v-model="reqMaster.isAll"
                       label="แสดงตำแหน่งทั้งหมด"
                       color="primary"
@@ -580,7 +580,7 @@ onMounted(async () => {
                           fetchDataTable(
                             reqMaster.id,
                             reqMaster.revisionId,
-                            reqMaster.type
+                            reqMaster.type,
                           )
                       "
                     >
@@ -681,7 +681,7 @@ onMounted(async () => {
                           round
                           @click.prevent="
                             onOpenModalPersonal(
-                              props.row.profileIdCurrentHolder
+                              props.row.profileIdCurrentHolder,
                             )
                           "
                         >
@@ -786,6 +786,14 @@ onMounted(async () => {
                                 <div v-if="col.name == 'no'" class="text-body2">
                                   {{ props.rowIndex + 1 }}
                                 </div>
+                                <div v-else-if="col.name === 'positionName'">
+                                  {{ col.value ? col.value : "-" }}
+                                  <q-icon
+                                    v-if="props.row.positionIsSelected"
+                                    name="check"
+                                    color="primary"
+                                  />
+                                </div>
                                 <div
                                   v-else-if="col.name === 'posExecutiveName'"
                                   class="text-body2"
@@ -835,7 +843,7 @@ onMounted(async () => {
                       fetchDataTable(
                         reqMaster.id,
                         reqMaster.revisionId,
-                        reqMaster.type
+                        reqMaster.type,
                       )
                     "
                   ></q-pagination>