จัดการผู้ใช้งาน => เพิ่มเมนูสำหรับระงับการใช้งาน/เปิดใช้งาน

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

@@ -23,8 +23,14 @@ import { useCounterMixin } from "@/stores/mixin";
 /** use*/
 const $q = useQuasar();
 const router = useRouter();
-const { dialogRemove, messageError, showLoader, hideLoader, success } =
-  useCounterMixin();
+const {
+  dialogRemove,
+  messageError,
+  showLoader,
+  hideLoader,
+  success,
+  dialogConfirm,
+} = useCounterMixin();
 
 /** Table*/
 const rows = ref<Users[]>([]);
@@ -115,6 +121,18 @@ const itemMenu = ref<ItemsMenu[]>([
   //   color: "edit",
   //   type: "edit",
   // },
+  {
+    label: "ระงับการใช้งาน",
+    icon: "mdi-lock-outline",
+    color: "orange-10",
+    type: "close",
+  },
+  {
+    label: "เปิดใช้งาน",
+    icon: "mdi-lock-open-outline",
+    color: "primary",
+    type: "open",
+  },
   {
     label: "จัดการสิทธิ์",
     icon: "mdi-account-group",
@@ -141,7 +159,6 @@ function fetchListUsers() {
     )
     .then((res) => {
       const data = res.data.data;
-      console.log(data);
 
       total.value = res.data.total;
       maxPage.value = Math.ceil(total.value / pageSize.value);
@@ -155,8 +172,6 @@ function fetchListUsers() {
             e.name === "USER"
         ),
       }));
-
-      console.log(rows.value);
     })
     .catch((err) => {
       messageError($q, err);
@@ -180,6 +195,9 @@ function onClickAction(type: string, data: Users) {
     onDeleteUser(data.id);
   } else if (type === "managementRole") {
     data && router.push(`/users/roles/${data.id}`);
+  } else if (type === "open" || type === "close") {
+    const status = type === "open" ? true : false;
+    onLockUser(data.id, status);
   }
 }
 
@@ -211,11 +229,42 @@ function onDeleteUser(id: string) {
   });
 }
 
+/**
+ * function ระงับการใช้งาน
+ * @param id ผู้ใช้งาน
+ * @param type  เปิดใช้งาน,ระงับการใช้งาน
+ */
+function onLockUser(id: string, type: boolean) {
+  dialogConfirm(
+    $q,
+    () => {
+      showLoader();
+      http
+        .put(config.API.managementUser + `/${id}/enableStatus/${type}`)
+        .then((res) => {
+          console.log(res.data);
+          success($q, type ? "เปิดใช้งานสำเร็จ" : "ระงับการใช้งานสำเร็จ");
+          fetchListUsers();
+        })
+        .catch((err) => {
+          messageError($q, err);
+        })
+        .finally(() => {
+          hideLoader();
+        });
+    },
+    type ? "ยืนยันการเปิดใช้" : "ยืนยันการระงับใช้งาน",
+    type
+      ? "ต้องการยืนยันการเปิดใช้นี้หรือไม่ ?"
+      : "ต้องการยืนยันระงับการใช้งานนี้หรือไม่ ?"
+  );
+}
+
 /**
  * function อัปเดท paging
  * @param initialPagination ข้อมูล pagination
  */
-async function updatePagination(initialPagination: Pagination) {
+function updatePagination(initialPagination: Pagination) {
   currentPage.value = 1;
   pageSize.value = initialPagination.rowsPerPage;
 }
@@ -314,7 +363,9 @@ onMounted(() => {
                 <q-menu>
                   <q-list dense style="min-width: 200px">
                     <q-item
-                      v-for="(item, index) in itemMenu"
+                      v-for="(item, index) in props.row.enabled
+                        ? itemMenu.filter((e) => e.type !== 'open')
+                        : itemMenu.filter((e) => e.type !== 'close')"
                       :key="index"
                       clickable
                       v-close-popup