hamid zarghami
101 lines
3.9 KiB
TypeScript
101 lines
3.9 KiB
TypeScript
import { FC } from 'react'
|
||
import { useTranslation } from 'react-i18next'
|
||
import Button from '../../components/Button'
|
||
import { Add, Eye } from 'iconsax-react'
|
||
import Select from '../../components/Select'
|
||
import Input from '../../components/Input'
|
||
import Td from '../../components/Td'
|
||
import { Link } from 'react-router-dom'
|
||
import { Pages } from '../../config/Pages'
|
||
|
||
const UsersList: FC = () => {
|
||
|
||
const { t } = useTranslation('global')
|
||
|
||
return (
|
||
<div className='mt-4'>
|
||
<div className='flex w-full justify-between items-center'>
|
||
<div>
|
||
{t('user.users_list')}
|
||
</div>
|
||
<div>
|
||
<Button
|
||
className='px-5'
|
||
>
|
||
<div className='flex gap-2'>
|
||
<Add
|
||
className='size-5'
|
||
color='#fff'
|
||
/>
|
||
<div>{t('user.add_user')}</div>
|
||
</div>
|
||
</Button>
|
||
</div>
|
||
</div>
|
||
|
||
<div className='flex justify-between items-center mt-12'>
|
||
<div className='flex gap-4'>
|
||
<Select
|
||
className='w-36'
|
||
items={[
|
||
{ label: 'All', value: 'all' },
|
||
{ label: 'Active', value: 'active' },
|
||
{ label: 'Inactive', value: 'inactive' },
|
||
]}
|
||
placeholder={t('service.category')}
|
||
/>
|
||
</div>
|
||
<div>
|
||
<Input
|
||
variant='search'
|
||
placeholder={t('service.search')}
|
||
className='bg-white border border-border'
|
||
/>
|
||
</div>
|
||
</div>
|
||
|
||
<div className='relative overflow-x-auto rounded-3xl mt-9 w-full'>
|
||
<table className='w-full text-sm '>
|
||
<thead className='thead'>
|
||
<tr>
|
||
<Td text={t('user.name')} />
|
||
<Td text={t('user.title_job')} />
|
||
<Td text={t('user.email')} />
|
||
<Td text={t('user.role')} />
|
||
<Td text={t('detail')} />
|
||
<Td text={''} />
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr className='tr'>
|
||
<Td text='مهرداد مظفری' />
|
||
<Td text={'کارشناس فنی'} />
|
||
<Td text={'info@example.com'} />
|
||
<Td text={'سطح ۱'} />
|
||
<Td text={''}>
|
||
<Link to={Pages.ticket.detail + '1'}>
|
||
<Eye size={20} color='#8C90A3' />
|
||
</Link>
|
||
</Td>
|
||
<Td text={''} />
|
||
</tr>
|
||
<tr className='tr'>
|
||
<Td text='مهرداد مظفری' />
|
||
<Td text={'کارشناس فنی'} />
|
||
<Td text={'info@example.com'} />
|
||
<Td text={'سطح ۱'} />
|
||
<Td text={''}>
|
||
<Link to={Pages.ticket.detail + '1'}>
|
||
<Eye size={20} color='#8C90A3' />
|
||
</Link>
|
||
</Td>
|
||
<Td text={''} />
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default UsersList |