100 lines
3.6 KiB
TypeScript
100 lines
3.6 KiB
TypeScript
import Button from '@/components/Button'
|
||
import { Paths } from '@/config/Paths'
|
||
import { AddSquare, Edit } from 'iconsax-react'
|
||
import { type FC } from 'react'
|
||
import { Link, useParams } from 'react-router-dom'
|
||
import { useDeleteAttribute, useGetAttributes } from '../hooks/useProductData'
|
||
import Table from '@/components/Table'
|
||
import TrashWithConfrim from '@/components/TrashWithConfrim'
|
||
import { toast } from 'react-toastify'
|
||
import { extractErrorMessage } from '@/config/func'
|
||
|
||
const AttributeList: FC = () => {
|
||
|
||
const { id } = useParams()
|
||
const { mutate: deleteAttribute, isPending } = useDeleteAttribute()
|
||
const { data, refetch } = useGetAttributes(Number(id))
|
||
|
||
const handleDelete = (id: number) => {
|
||
deleteAttribute(id, {
|
||
onSuccess: () => {
|
||
refetch()
|
||
},
|
||
onError: (error) => {
|
||
toast.error(extractErrorMessage(error))
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
return (
|
||
<div className='mt-5'>
|
||
<div className='flex justify-between items-center'>
|
||
<h1 className='text-lg font-light'>ویژگی ها</h1>
|
||
|
||
<Link
|
||
to={Paths.product.attribute.create + id}
|
||
>
|
||
<Button
|
||
className='w-fit px-6'
|
||
>
|
||
<div className='flex gap-1.5'>
|
||
<AddSquare size={18} color='black' />
|
||
<div className='text-[13px] font-light'>ویژگی جدید</div>
|
||
</div>
|
||
</Button>
|
||
</Link>
|
||
</div>
|
||
|
||
<div className='mt-8'>
|
||
<Table
|
||
columns={[
|
||
{
|
||
key: 'name',
|
||
title: 'نام'
|
||
},
|
||
{
|
||
key: 'type',
|
||
title: 'نوع'
|
||
},
|
||
{
|
||
key: 'isRequired',
|
||
title: 'احباری',
|
||
render: (item) => {
|
||
return (
|
||
<div>{item.isRequired ? 'اجباری' : 'اختیاری'}</div>
|
||
)
|
||
}
|
||
},
|
||
{
|
||
key: 'actions',
|
||
title: '',
|
||
render: (item) => {
|
||
return (
|
||
<div className='flex gap-2 items-center'>
|
||
<Link to={Paths.product.attribute.update + item.id}>
|
||
<Edit
|
||
color='#0037FF'
|
||
size={20}
|
||
/>
|
||
</Link>
|
||
|
||
<TrashWithConfrim
|
||
isloading={isPending}
|
||
colorIcon='red'
|
||
onDelete={() => handleDelete(item.id)}
|
||
/>
|
||
</div>
|
||
)
|
||
}
|
||
}
|
||
]}
|
||
data={data?.data}
|
||
/>
|
||
</div>
|
||
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default AttributeList |