hamid zarghami
86 lines
2.9 KiB
TypeScript
86 lines
2.9 KiB
TypeScript
import { type FC, useState } from 'react'
|
||
// import { useTranslation } from 'react-i18next'
|
||
import { Link } from 'react-router-dom'
|
||
import { Paths } from '../../config/Paths'
|
||
import Button from '../../components/Button'
|
||
import { Add } from 'iconsax-react'
|
||
import { useGetLearning } from './hooks/useLearningData'
|
||
import { type LearningItemType } from './hooks/useLearningData'
|
||
import Table from '../../components/Table'
|
||
import { type ColumnType } from '../../components/types/TableTypes'
|
||
const LearningList: FC = () => {
|
||
const [page, setPage] = useState<number>(1)
|
||
const getLearning = useGetLearning(page)
|
||
|
||
// تعریف ستونهای جدول
|
||
const columns: ColumnType<LearningItemType>[] = [
|
||
{
|
||
title: '',
|
||
key: 'coverUrl',
|
||
width: '100px',
|
||
render: (item: LearningItemType) => (
|
||
<img src={item.coverUrl} className='w-20 h-12 object-cover rounded' alt={item.title} />
|
||
)
|
||
},
|
||
{
|
||
title: 'عنوان',
|
||
key: 'title',
|
||
render: (item: LearningItemType) => (
|
||
<span className='font-medium'>{item.title}</span>
|
||
)
|
||
},
|
||
{
|
||
title: 'دستهبندی',
|
||
key: 'category',
|
||
render: (item: LearningItemType) => (
|
||
<span>{item.category?.name}</span>
|
||
)
|
||
},
|
||
{
|
||
title: 'مدت زمان ویدیو',
|
||
key: 'videoDuration',
|
||
render: (item: LearningItemType) => (
|
||
<span className='text-gray-600'>{item.videoDuration}</span>
|
||
)
|
||
}
|
||
]
|
||
|
||
return (
|
||
<div className='mt-4'>
|
||
<div className='flex w-full justify-between items-center'>
|
||
<div>
|
||
لیست آموزشها
|
||
</div>
|
||
<div>
|
||
<Link to={Paths.learning.create}>
|
||
<Button
|
||
className='px-5'
|
||
>
|
||
<div className='flex gap-2'>
|
||
<Add
|
||
className='size-5'
|
||
color='black'
|
||
/>
|
||
<div>ثبت آموزش</div>
|
||
</div>
|
||
</Button>
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
|
||
<Table<LearningItemType>
|
||
columns={columns}
|
||
data={getLearning.data?.data?.learnings}
|
||
isLoading={getLearning.isPending}
|
||
pagination={{
|
||
currentPage: page,
|
||
totalPages: getLearning.data?.data?.pager?.totalPages || 1,
|
||
onPageChange: setPage
|
||
}}
|
||
noDataMessage="هیچ آموزشی یافت نشد"
|
||
/>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default LearningList |