จัดการบทบาทและสิทธิ์ => API

src/modules/02_users/components/Permissions/DialogAdd.vue

@@ -1,12 +1,15 @@
 <script setup lang="ts">
-import { ref } from "vue";
+import { ref, watch } from "vue";
 import { useQuasar } from "quasar";
+import http from "@/plugins/http";
+import config from "@/app.config";
 
 /** importComponents*/
 import DialogHeader from "@/components/DialogHeader.vue";
 
 /** importType*/
 import type { QTableProps } from "quasar";
+import type { Roles } from "@/modules/02_users/interface/response/Main";
 import type { FilterReqMaster } from "@/modules/02_users/interface/request/Main";
 
 /** importStore*/
@@ -34,42 +37,61 @@ const props = defineProps({
   },
 });
 
-const rows = ref<any[]>([{ name: "ชื่อ", description: "คำอธิบาย" }]);
+const rows = ref<Roles[]>([]);
 const columns = ref<QTableProps["columns"]>([
   {
-    name: "name",
+    name: "roleName",
     align: "left",
     label: "ชื่อ",
     sortable: true,
-    field: "name",
+    field: "roleName",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
   {
-    name: "description",
+    name: "roleDescription",
     align: "left",
     label: "คำอธิบาย",
     sortable: true,
-    field: "description",
+    field: "roleDescription",
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
 ]);
-const visibleColumns = ref<string[]>(["name", "description"]);
+const visibleColumns = ref<string[]>(["roleName", "roleDescription"]);
 
 const keyword = ref<string>("");
-const selected = ref<any[]>([]);
+const selected = ref<Roles[]>([]);
 
 function closeDialog() {
   modal.value = false;
   selected.value = [];
 }
 
+function fetchListRoles() {
+  showLoader();
+  http
+    .get(config.API.managementAuth + `/list`)
+    .then((res) => {
+      const data = res.data.result;
+      rows.value = data;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
 function onSubmit() {
   if (selected.value.length === 0) {
     dialogMessageNotify($q, "กรุณาเลือกสิทธิ์อย่างน้อง 1 สิทธิ์");
   } else {
     dialogConfirm($q, () => {
+      const arrayId = selected.value.map((e: Roles) => e.id);
+      console.log(arrayId);
+
       showLoader();
       closeDialog();
       props.fetchDataTable(
@@ -81,6 +103,13 @@ function onSubmit() {
     });
   }
 }
+
+watch(
+  () => modal.value,
+  () => {
+    modal.value && fetchListRoles();
+  }
+);
 </script>
 
 <template>

src/modules/02_users/interface/index/Main.ts

@@ -10,4 +10,46 @@ interface ItemsMenu {
   type: string;
 }
 
-export type { Pagination, ItemsMenu };
+interface DataOption {
+  id: string;
+  name: string;
+}
+
+interface SystemList {
+  attrIsCreate: boolean;
+  attrIsDelete: boolean;
+  attrIsGet: boolean;
+  attrIsList: boolean;
+  attrIsUpdate: boolean;
+  attrOwnership: string;
+  attrPrivilege: string;
+  id: string;
+  order: 1;
+  parentId: string | null;
+  selected: boolean;
+  sysDescription: string;
+  sysName: string;
+  children?: SystemList[];
+}
+
+interface DataSystem {
+  attrIsCreate: boolean;
+  attrIsDelete: boolean;
+  attrIsGet: boolean;
+  attrIsList: boolean;
+  attrIsUpdate: boolean;
+  attrOwnership: string;
+  attrPrivilege: string;
+  authRoleId: string;
+  authSysId: string;
+  createdAt: string;
+  createdFullName: string;
+  createdUserId: string;
+  id: string;
+  lastUpdateFullName: string;
+  lastUpdateUserId: string;
+  lastUpdatedAt: string;
+  parentNode: string;
+}
+
+export type { Pagination, ItemsMenu, DataOption, SystemList, DataSystem };

src/modules/02_users/interface/response/Main.ts

@@ -99,4 +99,13 @@ interface Position {
   positionName: string;
 }
 
-export type { Users, Roles, NodeTree, PosMaster, Position };
+interface SysList {
+  id: string;
+  order: number;
+  parentId: string;
+  sysDescription: string;
+  sysName: string;
+  children: SysList[];
+}
+
+export type { Users, Roles, NodeTree, PosMaster, Position, SysList };

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

@@ -84,7 +84,7 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
     field: (row) => {
-      const names = row.roles.map((role: Roles) => role.name);
+      const names = row.roles.map((role: Roles) => role.roleName);
       return names.join(", ");
     },
   },