113 lines
2.6 KiB
TypeScript
113 lines
2.6 KiB
TypeScript
import { useTranslation } from "react-i18next";
|
|
import { useDeleteOrder } from "../../api/order";
|
|
import Actions from "../../Components/Ui/tables/Actions";
|
|
import { useNavigate } from "react-router-dom";
|
|
import { FaCheck, FaTimes, FaClock, FaBan } from 'react-icons/fa';
|
|
|
|
const useTableColumns = () => {
|
|
const [t] = useTranslation();
|
|
const navigate = useNavigate()
|
|
const deleteMutation = useDeleteOrder()
|
|
const language = localStorage.getItem("language") ?? "en"
|
|
|
|
|
|
let column = [
|
|
{
|
|
name: t("order_code"),
|
|
sortable: false,
|
|
center:true,
|
|
selector:(row:any) => row?.id,
|
|
},
|
|
{
|
|
name: t("name"),
|
|
sortable: false,
|
|
center:true,
|
|
selector:(row:any) => row?.user?.name,
|
|
|
|
},
|
|
{
|
|
name: t("email"),
|
|
sortable: false,
|
|
center:true,
|
|
selector:(row:any) => row?.user?.email,
|
|
|
|
},
|
|
|
|
{
|
|
name: t("status"),
|
|
center: true,
|
|
width:"250",
|
|
cell: (row: any) => {
|
|
let status = row?.state;
|
|
let icon;
|
|
|
|
// Assigning an icon component based on the status
|
|
switch (status) {
|
|
case 'pending_approve':
|
|
icon = <FaClock />;
|
|
break;
|
|
case 'approved':
|
|
icon = <FaCheck />;
|
|
break;
|
|
case 'rejected':
|
|
icon = <FaTimes />;
|
|
break;
|
|
case 'pending_cancellation':
|
|
icon = <FaBan />;
|
|
break;
|
|
default:
|
|
icon = null;
|
|
}
|
|
|
|
// Rendering the status with its corresponding icon
|
|
return (
|
|
<div className="orderStatus">
|
|
{icon} {status}
|
|
</div>
|
|
);
|
|
}
|
|
},
|
|
{
|
|
name: t("total"),
|
|
center: true,
|
|
cell:(row:any)=>{
|
|
|
|
return (row?.total)
|
|
}
|
|
},
|
|
{
|
|
name: "#",
|
|
center: true,
|
|
cell: (row:any) =>
|
|
<span style={{display:"flex" , alignItems:"center" , justifyContent:"space-around" , width:"100px" }} >
|
|
|
|
<Actions
|
|
showDelete={false}
|
|
objectToEdit={row}
|
|
onDelete={() => deleteMutation.mutate({order_id:row.id })}
|
|
showEdit={true}
|
|
onView={()=>navigate(`/order/view/${row?.id}` , {replace:true})}
|
|
onEdit={()=>navigate(`/order/${row?.id}` , {replace:true})}
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
]
|
|
|
|
|
|
|
|
|
|
|
|
return column
|
|
|
|
};
|
|
|
|
export default useTableColumns;
|