กำหนดสิทธิ์จัดการโครงสร้าง

src/modules/02_users/views/roleOrganization.vue

@@ -28,7 +28,12 @@ const nodeTree = ref<DataTree[]>([]); // ข้อมูลรายการโ
 const expanded = ref<Array<string>>([]); // เปิดรายการโครงสร้าง
 const orgId = ref<string>(""); // id หน่วยงานที่เลือก
 
-async function fatchOrgg() {
+/**
+ * ฟังก์ชันดึงข้อมูลโครงสร้าง
+ *
+ * เก็บข้อมูลโครงสร้างไว้ใน nodeTree
+ */
+async function fatchOrg() {
   showLoader();
   await http
     .get(config.API.permissionOrg)
@@ -44,23 +49,34 @@ async function fatchOrgg() {
     });
 }
 
+/**
+ * ฟังก์ชันเลือกหน่วยงาน
+ * @param id หน่วยงานที่เลือก
+ *
+ * กำหนดค่าของ qureyBody ให้เป็นค่า defult และกำหนดค่าของ  qureyBody.id  เป็นหน่วยงานที่เลือก
+ * และดึงข้อมูลรายชื่อคนที่มีสิทธิ์จัดการโครงสร้างในหน่วยงานที่เลือก
+ */
 function selectedOrg(id: string) {
   orgId.value = id;
   qureyBody.id = id;
+  qureyBody.searchKeyword = "";
+  qureyBody.searchField = "fullName";
+  qureyBody.page = 1;
+  qureyBody.pageSize = 10;
   fetchListPerson(true);
 }
 
 /******* รายชื่อคนที่มีสิทธิ์จัดการโครงสร้าง *******/
 const qureyBody = reactive<QueryProfile>({
-  searchKeyword: "",
-  searchField: "fullName",
-  page: 1,
-  pageSize: 10,
-  id: null,
+  searchKeyword: "", // คำค้นหา
+  searchField: "fullName", // field ที่ต้องการค้นหา
+  page: 1, // หน้า
+  pageSize: 10, // จำนวนที่ต้องการ
+  id: null, // หน่วยงานที่เลือก
 });
-const rows = ref<DataProfile[]>([]);
-const total = ref<number>(0);
-const maxPage = ref<number>(0);
+const rows = ref<DataProfile[]>([]); // ข้อมูลรายชื่อคนที่มีสิทธิ์จัดการโครงสร้าง
+const total = ref<number>(0); // จำนวนข้อมูลทั้งหมด
+const maxPage = ref<number>(0); // จำนวนหน้า
 const columns = ref<QTableProps["columns"]>([
   {
     name: "fullName",
@@ -112,9 +128,14 @@ const columns = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
 ]);
+const modalAdd = ref<boolean>(false); // modal เพิ่มข้อมูลรายชื่อ
 
-const modalAdd = ref<boolean>(false);
-
+/**
+ * ฟังก์ชันดึงข้อมูลรายชื่อคนที่มีสิทธิ์จัดการโครงสร้าง
+ * @param newPage โหลดหน้าแรก ถ้าเป็บ true  โหลดหน้าแรก false ให้โหลดหน้าปัจจุบัน
+ *
+ * เก็บมูลรายชื่อคนที่มีสิทธิ์จัดการโครงสร้างไว่ใน rows.value
+ */
 async function fetchListPerson(newPage: boolean = false) {
   qureyBody.page = newPage ? 1 : qureyBody.page;
   showLoader();
@@ -122,8 +143,8 @@ async function fetchListPerson(newPage: boolean = false) {
     .post(config.API.permissionOrgProfile, qureyBody)
     .then(async (res) => {
       const data = await res.data.result;
-      maxPage.value = Math.ceil(data.total / qureyBody.pageSize);
-      total.value = data.total;
+      maxPage.value = Math.ceil(data.total / qureyBody.pageSize); // คำนวนหาจำนวนหน้า
+      total.value = data.total; // จำนวนรายชื่อคนที่มีสิทธิ์จัดการโครงสร้าง
       rows.value = data.data;
     })
     .catch((err) => {
@@ -134,19 +155,27 @@ async function fetchListPerson(newPage: boolean = false) {
     });
 }
 
+/**
+ * ฟังก์ชันยืนยันการลบรายชื่อคนที่มีสิทธิ์จัดการโครงสร้าง
+ * @param id รายชื่อคนที่มีสิทธิ์จัดการโครงสร้าง
+ *
+ * ลบเสร็จจะโหลดข้อมูลรายชื่อคนที่มีสิทธิ์จัดการโครงสร้าง
+ */
 function onDeletePerson(id: string) {
   dialogRemove($q, async () => {
     showLoader();
     await http
       .delete(config.API.permissionOrg + `/${id}`)
       .then(async () => {
+        // ถ้า maxPage.value ไม่เท่ากับ 1 ให้ โหลดข้อมูลรายชื่อคนที่มีสิทธิ์จัดการโครงสร้างหน้าปัจจุบัน
         if (maxPage.value !== 1) {
+          // ถ้ามีแค่หนึ่งแถวในหน้าปัจจุบัน ให้ลด page ลง 1
           if (rows.value.length === 1) {
             qureyBody.page = qureyBody.page - 1;
           }
-          await fetchListPerson(false);
+          await fetchListPerson(false); // โหลดข้อมูลจากหน้าปัจจุบันโดยไม่รีเซ็ต
         } else {
-          await fetchListPerson(true);
+          await fetchListPerson(true); // โหลดข้อมูลหน้าแรก
         }
         success($q, "ลบข้อมูสำเร็จ");
       })
@@ -167,6 +196,11 @@ function updatePagination(newPagination: Pagination) {
   qureyBody.pageSize = newPagination.rowsPerPage;
 }
 
+/**
+ * ดูการเปลี่ยนแปลงของ pageSize ใน queryBody
+ *
+ * เมื่อ pageSize มีการเปลี่ยนแปลงให้โหลดข้อมูลหน้าแรก
+ */
 watch(
   () => qureyBody.pageSize,
   () => {
@@ -180,8 +214,8 @@ watch(
  */
 onMounted(async () => {
   await Promise.all([
-    fatchOrgg(), // ดึงข้อมูลโครงสร้าง
-    fetchListPerson(),
+    fatchOrg(), // ดึงข้อมูลโครงสร้าง
+    fetchListPerson(), // ดึงข้อมูลรายชื่อคนที่มีสิทธิ์จัดการโครงสร้าง
   ]);
 });
 </script>