fix

src/features/admin/users/components/UsersFilters.vue

@@ -7,12 +7,12 @@
         </template>
       </TextField>
       <SelectField
-        v-model="form.roleId"
-        name="roleId"
+        v-model="form.role"
+        name="role"
         label="نقش کاربر"
-        :options="roleOptions"
+        :options="ROLES"
         option-label="label"
-        option-value="id"
+        option-value="value"
       />
       <TextField
         v-model="form.nationalCode"
@@ -66,18 +66,17 @@
 </template>
 
 <script setup>
-import { ROLE_LABELS } from '@/enums'
+import { ROLES } from '@/enums'
 import { computed, ref, watch } from 'vue'
 import SvgIcon from '@/components/icons/SvgIcon.vue'
 import TextField from '@/components/form/TextField.vue'
 import CircleButton from '@/components/CircleButton.vue'
 import SelectField from '@/components/form/SelectField.vue'
-import { useAdminRolesListQuery } from '@/services/query/admin-users'
 
 const props = defineProps({
   modelValue: {
     type: Object,
-    default: () => ({ name: '', nationalCode: '', phoneNumber: '', roleId: '' }),
+    default: () => ({ name: '', nationalCode: '', phoneNumber: '', role: '' }),
   },
 })
 
@@ -92,11 +91,6 @@ watch(
   { deep: true }
 )
 
-const { data: roles = ref([]) } = useAdminRolesListQuery()
-const roleOptions = computed(() =>
-  (roles.value ?? []).map((r) => ({ ...r, label: ROLE_LABELS[r.name] || r.name }))
-)
-
 const hasFilters = computed(() =>
   Object.values(form.value).some((v) => v !== '' && v !== null && v !== undefined)
 )
@@ -107,7 +101,7 @@ const onSubmit = () => {
 }
 
 const onReset = () => {
-  form.value = { name: '', nationalCode: '', phoneNumber: '', roleId: '' }
+  form.value = { name: '', nationalCode: '', phoneNumber: '', role: '' }
   emit('update:modelValue', { ...form.value })
   emit('reset')
 }

src/features/admin/users/components/UsersTable.vue

@@ -66,11 +66,11 @@
 </template>
 
 <script setup>
+import { ROLES } from '@/enums'
 import { computed, ref } from 'vue'
 import { useQueryClient } from '@tanstack/vue-query'
 import SvgIcon from '@/components/icons/SvgIcon.vue'
 import BaseButton from '@/components/BaseButton.vue'
-import { CHANGEABLE_ROLES, ROLE_LABELS } from '@/enums'
 import DropdownMenu from '@/components/DropdownMenu.vue'
 import { adminUsersKeys, useUpdateAdminUserRoleMutation } from '@/services/query/admin-users'
 
@@ -99,7 +99,8 @@ const roleName = (user) => {
 
 const roleLabel = (user) => {
   const name = roleName(user)
-  return name ? ROLE_LABELS[name] || name : ''
+  if (!name) return ''
+  return ROLES.find((r) => r.value === name)?.label || name
 }
 
 const menuOpen = ref(false)
@@ -146,11 +147,11 @@ const onChangeRole = (targetRoleName) => {
 
 const roleMenuItems = computed(() => {
   const current = activeUser.value ? roleName(activeUser.value) : null
-  return CHANGEABLE_ROLES.filter((r) => r !== current).map((r) => ({
-    key: `role-${r}`,
-    label: `تغییر به ${ROLE_LABELS[r]}`,
+  return ROLES.filter((r) => r.changeable && r.value !== current).map((r) => ({
+    key: `role-${r.value}`,
+    label: `تغییر به ${r.label}`,
     icon: 'arrows-clockwise',
-    onClick: () => onChangeRole(r),
+    onClick: () => onChangeRole(r.value),
   }))
 })
 

src/features/admin/users/pages/UsersListPage.vue

@@ -73,7 +73,7 @@ const router = useRouter()
 const queryClient = useQueryClient()
 const { openModal, isModal } = useModal()
 
-const filters = ref({ name: '', nationalCode: '', phoneNumber: '', roleId: '' })
+const filters = ref({ name: '', nationalCode: '', phoneNumber: '', role: '' })
 const { pagination, setPage, reset: resetPagination } = usePagination({ page: 1, perPage: 10 })
 
 const { data, isLoading } = useAdminUsersListQuery(filters, pagination, {