193 lines
4.3 KiB
TypeScript
193 lines
4.3 KiB
TypeScript
import { deleteTracking, getListTracking } from "@/api/Admin"
|
|
import { DataTablePagination } from "@/components/DataTable/DataTable"
|
|
import { Xdelete } from "@/rtk/helpers/CRUD"
|
|
import { get } from "@/rtk/helpers/apiService"
|
|
import { Box, Button, Dialog, Group, Text } from "@mantine/core"
|
|
import { IconTrash } from "@tabler/icons-react"
|
|
import moment from "moment"
|
|
import { useEffect, useState } from "react"
|
|
import classes from './Tracking.module.css'
|
|
const Tracking = () => {
|
|
const [listTracking, setListTracking] = useState({
|
|
data: []
|
|
})
|
|
const [action, setAction] = useState('')
|
|
const [item, setItem] = useState({id: 0})
|
|
const [activeBtn, setActiveBtn] = useState(false)
|
|
const columns = [
|
|
{
|
|
name: 'id',
|
|
size: '5%',
|
|
header: 'ID',
|
|
},
|
|
{
|
|
name: 'name',
|
|
size: '30%',
|
|
header: 'Name',
|
|
},
|
|
{
|
|
name: 'time_string',
|
|
size: '20%',
|
|
header: 'Time',
|
|
},
|
|
{
|
|
name: 'status',
|
|
size: '20%',
|
|
header: 'Status',
|
|
},
|
|
{
|
|
name: 'created_at',
|
|
size: '15%',
|
|
header: 'Created At',
|
|
render: (row: any) => {
|
|
return moment(row.updated_at).format('YYYY/MM/DD - HH:mm:ss')
|
|
},
|
|
},
|
|
{
|
|
name: '#',
|
|
size: '10%',
|
|
header: 'Action',
|
|
render: (row: any) => {
|
|
return (
|
|
<Box
|
|
className={classes.optionIcon}
|
|
>
|
|
<IconTrash
|
|
className={classes.deleteIcon}
|
|
onClick={() => {
|
|
setAction('delete')
|
|
setItem(row)
|
|
}}
|
|
width={20}
|
|
height={20}
|
|
/>
|
|
</Box>
|
|
)
|
|
},
|
|
},
|
|
]
|
|
|
|
const filterInfo = [
|
|
{
|
|
key: 'name',
|
|
name: 'Name',
|
|
type: 'text',
|
|
},
|
|
{
|
|
key: 'status',
|
|
name: 'Status',
|
|
type: 'text',
|
|
},
|
|
{
|
|
key: 'time_string',
|
|
name: 'Time',
|
|
type: 'text',
|
|
},
|
|
]
|
|
|
|
const getAllTracking = async () =>{
|
|
try {
|
|
const searchParams = new URLSearchParams(window.location.search)
|
|
const params = {}
|
|
|
|
for (const [key, value] of searchParams.entries()) {
|
|
if (key === 'page' && value === '') {
|
|
Object.assign(params, { [`${key}`]: 1 })
|
|
} else {
|
|
Object.assign(params, { [`${key}`]: value })
|
|
}
|
|
}
|
|
|
|
const res = await get(getListTracking, params)
|
|
if(res.status){
|
|
setListTracking(res)
|
|
}
|
|
} catch (error) {
|
|
console.log(error)
|
|
}
|
|
}
|
|
|
|
const handleDelete = async (id: number) => {
|
|
try {
|
|
await Xdelete(deleteTracking, { id: id }, getAllTracking)
|
|
} catch (error) {
|
|
console.log(error)
|
|
}
|
|
}
|
|
|
|
useEffect(()=>{
|
|
setInterval(()=>{
|
|
getAllTracking()
|
|
}, 7000)
|
|
}, [])
|
|
return (
|
|
<div>
|
|
<div className={classes.title}>
|
|
<h3>
|
|
<Text>Admin/</Text>
|
|
Tracking
|
|
</h3>
|
|
{/* <Button
|
|
m={5}
|
|
onClick={() => {
|
|
setAction('add')
|
|
form.reset()
|
|
}}
|
|
> */}
|
|
{/* Add discount */}
|
|
{/* </Button> */}
|
|
</div>
|
|
<Box p={20}>
|
|
{
|
|
listTracking.data.length>0 && <DataTablePagination
|
|
filterInfo={filterInfo}
|
|
data={listTracking}
|
|
columns={columns}
|
|
searchInput
|
|
size=""
|
|
/>
|
|
}
|
|
</Box>
|
|
|
|
<Dialog
|
|
className={classes.dialog}
|
|
opened={action === 'delete'}
|
|
withCloseButton
|
|
onClose={() => setAction('')}
|
|
size="lg"
|
|
radius="md"
|
|
position={{ top: 30, right: 10 }}
|
|
>
|
|
<Text className={classes.dialogText} size="sm" mb="xs" fw={500}>
|
|
Do you want to delete this discount?
|
|
<Group justify="center" m={10}>
|
|
<Button
|
|
disabled={activeBtn}
|
|
fw={700}
|
|
size="xs"
|
|
variant="light"
|
|
onClick={async () => {
|
|
setActiveBtn(true)
|
|
await handleDelete(item.id)
|
|
setActiveBtn(false)
|
|
setAction('')
|
|
}}
|
|
>
|
|
Yes
|
|
</Button>
|
|
<Button
|
|
fw={700}
|
|
size="xs"
|
|
variant="light"
|
|
onClick={() => setAction('')}
|
|
>
|
|
Cancel
|
|
</Button>
|
|
</Group>
|
|
</Text>
|
|
</Dialog>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Tracking |