diff --git a/src/modules/02_users/components/Users/DialogFormUser.vue b/src/modules/02_users/components/Users/DialogFormUser.vue
index e5e02a85..763a00d9 100644
--- a/src/modules/02_users/components/Users/DialogFormUser.vue
+++ b/src/modules/02_users/components/Users/DialogFormUser.vue
@@ -5,6 +5,7 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
+import { setAuthen, authenticated, tokenParsed } from "@/plugins/auth";
 
 import type { QTableProps } from "quasar";
 import type {
@@ -193,13 +194,13 @@ function fetchUserDetail(id: string) {
 function fetchlistRole() {
   http
     .get(config.API.managementRole)
-    .then((res) => {
-      roleOptions.value = res.data.filter(
-        (e: Roles) =>
-          e.name === "STAFF" ||
-          e.name === "SUPER_ADMIN" ||
-          e.name === "ADMIN" ||
-          e.name === "USER"
+    .then(async (res) => {
+      const checkToken: any = await tokenParsed();
+      const roleSuper = await checkToken.role.includes("SUPER_ADMIN");
+      roleOptions.value = res.data.filter((e: Roles) =>
+        roleSuper
+          ? ["STAFF", "SUPER_ADMIN", "ADMIN", "USER"].includes(e.name)
+          : ["STAFF", "USER"].includes(e.name)
       );
     })
     .catch((err) => {
diff --git a/src/modules/02_users/components/Users/DialogRoleUser.vue b/src/modules/02_users/components/Users/DialogRoleUser.vue
index 7741d049..7e9ed8d8 100644
--- a/src/modules/02_users/components/Users/DialogRoleUser.vue
+++ b/src/modules/02_users/components/Users/DialogRoleUser.vue
@@ -5,6 +5,7 @@ import { useQuasar } from "quasar";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
+import { setAuthen, authenticated, tokenParsed } from "@/plugins/auth";
 
 import type { QTableProps } from "quasar";
 import type { Roles } from "@/modules/02_users/interface/request/Main";
@@ -25,6 +26,7 @@ const {
 
 /**  props*/
 const modal = defineModel<boolean>("modal", { required: true });
+const roleSuper = defineModel<boolean>("roleSuper", { required: true });
 const userId = defineModel<string>("userId", { required: true });
 const roles = defineModel<any[]>("roles");
 const props = defineProps({
@@ -69,13 +71,12 @@ function fetchlistRole() {
     .get(config.API.managementRole)
     .then((res) => {
       const rolesIds = roles.value?.map((e) => e.id);
+      const item = roleSuper.value
+        ? ["USER", "ADMIN", "SUPER_ADMIN", "STAFF"]
+        : ["USER", "STAFF"];
+
       rows.value = res.data.filter(
-        (v: Roles) =>
-          !rolesIds?.includes(v.id) &&
-          (v.name == "USER" ||
-            v.name == "ADMIN" ||
-            v.name == "SUPER_ADMIN" ||
-            v.name == "STAFF")
+        (v: Roles) => !rolesIds?.includes(v.id) && item.includes(v.name)
       );
     })
     .catch((err) => {
diff --git a/src/modules/02_users/views/page01_ManagementRoleUser.vue b/src/modules/02_users/views/page01_ManagementRoleUser.vue
index eb35288a..0626c738 100644
--- a/src/modules/02_users/views/page01_ManagementRoleUser.vue
+++ b/src/modules/02_users/views/page01_ManagementRoleUser.vue
@@ -6,6 +6,7 @@ import { useRouter, useRoute } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
+import { setAuthen, authenticated, tokenParsed } from "@/plugins/auth";
 
 /** importType*/
 import type { QTableProps } from "quasar";
@@ -18,6 +19,7 @@ import DialogAddRoleUser from "@/modules/02_users/components/Users/DialogRoleUse
 const $q = useQuasar();
 const router = useRouter();
 const route = useRoute();
+const roleSuper = ref<boolean>(false);
 const { dialogRemove, messageError, showLoader, hideLoader, success } =
   useCounterMixin();
 
@@ -66,13 +68,11 @@ async function fetchListRoleUser() {
   http
     .get(config.API.managementUser + `/role/${userId.value}`)
     .then(async (res) => {
-      rows.value = await res.data.filter(
-        (e: Roles) =>
-          e.name === "STAFF" ||
-          e.name === "SUPER_ADMIN" ||
-          e.name === "ADMIN" ||
-          e.name === "USER"
-      );
+      const item = roleSuper.value
+        ? ["STAFF", "SUPER_ADMIN", "ADMIN", "USER"]
+        : ["STAFF", "USER"];
+
+      rows.value = await res.data.filter((e: Roles) => item.includes(e.name));
     })
     .catch((err) => {
       messageError($q, err);
@@ -118,8 +118,10 @@ function openDialog() {
  *
  * โหลดข้อมูลรายการสิทธิ์ที่มี
  */
-onMounted(() => {
-  fetchListRoleUser();
+onMounted(async () => {
+  const checkToken: any = await tokenParsed();
+  roleSuper.value = await checkToken.role.includes("SUPER_ADMIN");
+  await fetchListRoleUser();
 });
 </script>
 
@@ -209,6 +211,7 @@ onMounted(() => {
     v-model:modal="modalDialogAdd"
     :userId="userId"
     :roles="rows"
+    v-model:role-super="roleSuper"
   />
 </template>