danak/danak-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

multiple role
deploy to danak / build_and_deploy (push) Has been cancelled
Details

Browse Source
This commit is contained in:
morteza-mortezai
2026-07-22 12:11:44 +03:30
parent a2d2234a28
commit f1173adc6d
4 changed files with 83 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/langs/fa.json
+1
View File
@@ -748,6 +748,7 @@
"group_add": "ساخت گروه", "group_add": "ساخت گروه",
"submit_group": "ثبت گروه", "submit_group": "ثبت گروه",
"error_count_users": "حداقل یک کاربر باید انتخاب شود", "error_count_users": "حداقل یک کاربر باید انتخاب شود",
"error_count_roles": "حداقل یک نقش باید انتخاب شود",
"list_user_group": "لیست گروه های کاربری", "list_user_group": "لیست گروه های کاربری",
"groups": "گروه ها", "groups": "گروه ها",
"group_name": "نام گروه", "group_name": "نام گروه",
src/pages/users/Create.tsx
+35 -19
View File
@@ -3,7 +3,7 @@ import { useTranslation } from 'react-i18next'
import Button from '../../components/Button' import Button from '../../components/Button'
import { TickCircle } from 'iconsax-react' import { TickCircle } from 'iconsax-react'
import Input from '../../components/Input' import Input from '../../components/Input'
import Select from '../../components/Select' import CheckBoxComponent from '../../components/CheckBoxComponent'
import UploadBoxDraggble from '../../components/UploadBoxDraggble' import UploadBoxDraggble from '../../components/UploadBoxDraggble'
import { useFormik } from 'formik' import { useFormik } from 'formik'
import { CreateUserType, RoleItemType } from './types/UserTypes' import { CreateUserType, RoleItemType } from './types/UserTypes'
@@ -45,7 +45,7 @@ const CreateUser: FC = () => {
repeatPassword: '', repeatPassword: '',
phone: '', phone: '',
profilePic: '', profilePic: '',
roleId: '' roleIds: []
}, },
validationSchema: Yup.object({ validationSchema: Yup.object({
email: Yup.string().email('Invalid email').required(t('errors.required')), email: Yup.string().email('Invalid email').required(t('errors.required')),
@@ -54,7 +54,7 @@ const CreateUser: FC = () => {
password: Yup.string().required(t('errors.required')), password: Yup.string().required(t('errors.required')),
repeatPassword: Yup.string().required(t('errors.required')), repeatPassword: Yup.string().required(t('errors.required')),
phone: Yup.string().required(t('errors.required')), phone: Yup.string().required(t('errors.required')),
roleId: Yup.string().required(t('errors.required')), roleIds: Yup.array().of(Yup.string()).min(1, t('user.error_count_roles')),
}), }),
onSubmit: async (values) => { onSubmit: async (values) => {
if (file) { if (file) {
@@ -76,6 +76,15 @@ const CreateUser: FC = () => {
} }
}) })
const handleRoleToggle = (roleId: string) => {
const currentRoleIds = formik.values.roleIds
if (currentRoleIds.includes(roleId)) {
formik.setFieldValue('roleIds', currentRoleIds.filter((id) => id !== roleId))
} else {
formik.setFieldValue('roleIds', [...currentRoleIds, roleId])
}
}
return ( return (
<div className='mt-4'> <div className='mt-4'>
<div className='flex justify-between items-center'> <div className='flex justify-between items-center'>
@@ -117,22 +126,29 @@ const CreateUser: FC = () => {
error_text={formik.touched.lastName && formik.errors.lastName ? formik.errors.lastName : ''} error_text={formik.touched.lastName && formik.errors.lastName ? formik.errors.lastName : ''}
/> />
</div> </div>
<div className='rowTwoInput mt-8'> <div className='mt-8'>
{/* <Input <div className='text-sm'>
label={t('user.title_job')} {t('user.role')}
/> */} </div>
<Select
label={t('user.role')} <div className='mt-5 text-sm flex flex-wrap gap-5'>
placeholder={t('select')} {
items={getRoles.data?.data?.roles?.map((item: RoleItemType) => { getRoles.data?.data?.roles?.map((item: RoleItemType) => (
return { <div key={item.id} className='flex flex-1 min-w-[23%] items-center'>
label: item.name, <CheckBoxComponent
value: item.id checked={formik.values.roleIds.includes(item.id)}
} onChange={() => handleRoleToggle(item.id)}
})} />
{...formik.getFieldProps('roleId')} <div className='mt-0.5'>{item.name}</div>
error_text={formik.touched.roleId && formik.errors.roleId ? formik.errors.roleId : ''} </div>
/> ))
}
</div>
{
formik.touched.roleIds && formik.errors.roleIds ?
<div className='text-xs text-red mt-2'>{formik.errors.roleIds}</div>
: null
}
</div> </div>
<div className='rowTwoInput mt-8'> <div className='rowTwoInput mt-8'>
src/pages/users/Update.tsx
+46 -21
View File
@@ -3,7 +3,7 @@ import { useTranslation } from 'react-i18next'
import Button from '../../components/Button' import Button from '../../components/Button'
import { TickCircle } from 'iconsax-react' import { TickCircle } from 'iconsax-react'
import Input from '../../components/Input' import Input from '../../components/Input'
import Select from '../../components/Select' import CheckBoxComponent from '../../components/CheckBoxComponent'
import UploadBoxDraggble from '../../components/UploadBoxDraggble' import UploadBoxDraggble from '../../components/UploadBoxDraggble'
import { useFormik } from 'formik' import { useFormik } from 'formik'
import { CreateUserType, RoleItemType } from './types/UserTypes' import { CreateUserType, RoleItemType } from './types/UserTypes'
@@ -46,14 +46,14 @@ const UpdateUser: FC = () => {
repeatPassword: '', repeatPassword: '',
phone: '', phone: '',
profilePic: '', profilePic: '',
roleId: '' roleIds: []
}, },
validationSchema: Yup.object({ validationSchema: Yup.object({
email: Yup.string().email('Invalid email').required(t('errors.required')), email: Yup.string().email('Invalid email').required(t('errors.required')),
firstName: Yup.string().required(t('errors.required')), firstName: Yup.string().required(t('errors.required')),
lastName: Yup.string().required(t('errors.required')), lastName: Yup.string().required(t('errors.required')),
phone: Yup.string().required(t('errors.required')), phone: Yup.string().required(t('errors.required')),
roleId: Yup.string().required(t('errors.required')), roleIds: Yup.array().of(Yup.string()).min(1, t('user.error_count_roles')),
}), }),
onSubmit: async (values) => { onSubmit: async (values) => {
if (values.password === '') { if (values.password === '') {
@@ -81,12 +81,30 @@ const UpdateUser: FC = () => {
useEffect(() => { useEffect(() => {
if (userDetail?.data) { if (userDetail?.data) {
formik.setValues(userDetail?.data?.admin) const admin = userDetail.data.admin
formik.setFieldValue('roleId', userDetail?.data?.admin?.roles?.[0]?.id) formik.setValues({
email: admin.email,
firstName: admin.firstName,
lastName: admin.lastName,
phone: admin.phone,
profilePic: admin.profilePic,
password: '',
repeatPassword: '',
roleIds: admin.roles.map((role) => role.id),
})
} }
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [userDetail]) }, [userDetail])
const handleRoleToggle = (roleId: string) => {
const currentRoleIds = formik.values.roleIds
if (currentRoleIds.includes(roleId)) {
formik.setFieldValue('roleIds', currentRoleIds.filter((id) => id !== roleId))
} else {
formik.setFieldValue('roleIds', [...currentRoleIds, roleId])
}
}
return ( return (
<div className='mt-4'> <div className='mt-4'>
<div className='flex justify-between items-center'> <div className='flex justify-between items-center'>
@@ -128,22 +146,29 @@ const UpdateUser: FC = () => {
error_text={formik.touched.lastName && formik.errors.lastName ? formik.errors.lastName : ''} error_text={formik.touched.lastName && formik.errors.lastName ? formik.errors.lastName : ''}
/> />
</div> </div>
<div className='rowTwoInput mt-8'> <div className='mt-8'>
{/* <Input <div className='text-sm'>
label={t('user.title_job')} {t('user.role')}
/> */} </div>
<Select
label={t('user.role')} <div className='mt-5 text-sm flex flex-wrap gap-5'>
placeholder={t('select')} {
items={getRoles.data?.data?.roles?.map((item: RoleItemType) => { getRoles.data?.data?.roles?.map((item: RoleItemType) => (
return { <div key={item.id} className='flex flex-1 min-w-[23%] items-center'>
label: item.name, <CheckBoxComponent
value: item.id checked={formik.values.roleIds.includes(item.id)}
} onChange={() => handleRoleToggle(item.id)}
})} />
{...formik.getFieldProps('roleId')} <div className='mt-0.5'>{item.name}</div>
error_text={formik.touched.roleId && formik.errors.roleId ? formik.errors.roleId : ''} </div>
/> ))
}
</div>
{
formik.touched.roleIds && formik.errors.roleIds ?
<div className='text-xs text-red mt-2'>{formik.errors.roleIds}</div>
: null
}
</div> </div>
<div className='rowTwoInput mt-8'> <div className='rowTwoInput mt-8'>
src/pages/users/types/UserTypes.ts
+1 -1
View File
@@ -42,7 +42,7 @@ export type CreateUserType = {
password?: string; password?: string;
repeatPassword?: string; repeatPassword?: string;
email: string; email: string;
roleId: string; roleIds: string[];
profilePic?: string; profilePic?: string;
}; };