implementation on the dispatch and some change in the deliveries page
This commit is contained in:
@@ -97,6 +97,7 @@ import {
|
||||
import LoaderWithImage from 'components/nearle_components/LoaderWithImage';
|
||||
import { useNavigate } from 'react-router';
|
||||
import CSVExport from 'components/third-party/ReactTable';
|
||||
import Dispatch from '../dispatch/Dispatch';
|
||||
// import usePreventReload from 'hooks/usePreventReload';
|
||||
|
||||
const Orders = () => {
|
||||
@@ -134,6 +135,7 @@ const Orders = () => {
|
||||
const [speedDialOpen, setSpeedDialOpen] = useState(false);
|
||||
const [aiDialog, setAiDialog] = useState(false);
|
||||
const [normalAssignDialog, setNormalAssignDialog] = useState(false);
|
||||
const [dispatchPreviewData, setDispatchPreviewData] = useState(null);
|
||||
const [deliverylist, setDeliverylist] = useState([]);
|
||||
const [deliveryDetails, setDeliveryDetails] = useState([]);
|
||||
const [zoneData, setZoneData] = useState(null);
|
||||
@@ -413,6 +415,7 @@ const Orders = () => {
|
||||
setDeliveryDetails(data?.details);
|
||||
setZoneData(data?.zones);
|
||||
setMetaData(data?.meta);
|
||||
setDispatchPreviewData(data);
|
||||
setAiDialog(true);
|
||||
// navigate('/nearle/orders/optimisedpreview', {
|
||||
// state: {
|
||||
@@ -636,14 +639,14 @@ const Orders = () => {
|
||||
const errorMessage = fetchpercentageIsError
|
||||
? `Error fetching percentages: ${fetchpercentageError?.message}`
|
||||
: fetchorderscountIsError
|
||||
? `Error fetching orders Count: ${fetchorderscountError?.message}`
|
||||
: fetchOrdersIsError
|
||||
? `Error fetching orders : ${fetchOrdersError?.message}`
|
||||
: fetchtenantsIsError
|
||||
? `Error Fetching on Tenants:${fetchtenantsError?.message} `
|
||||
: fetchlocationsIsError
|
||||
? `Error Fetching on Tenants Locations:${fetchlocationsError?.message} `
|
||||
: null;
|
||||
? `Error fetching orders Count: ${fetchorderscountError?.message}`
|
||||
: fetchOrdersIsError
|
||||
? `Error fetching orders : ${fetchOrdersError?.message}`
|
||||
: fetchtenantsIsError
|
||||
? `Error Fetching on Tenants:${fetchtenantsError?.message} `
|
||||
: fetchlocationsIsError
|
||||
? `Error Fetching on Tenants Locations:${fetchlocationsError?.message} `
|
||||
: null;
|
||||
|
||||
useEffect(() => {
|
||||
if (errorMessage) {
|
||||
@@ -660,11 +663,11 @@ const Orders = () => {
|
||||
fetchtenantsIsLoading ||
|
||||
fetchlocationsIsLoading ||
|
||||
createloader) && (
|
||||
<>
|
||||
<Loader />
|
||||
<CircularLoader />
|
||||
</>
|
||||
)}
|
||||
<>
|
||||
<Loader />
|
||||
<CircularLoader />
|
||||
</>
|
||||
)}
|
||||
{
|
||||
<Backdrop
|
||||
sx={{
|
||||
@@ -1426,12 +1429,12 @@ const Orders = () => {
|
||||
row.orderstatus === 'confirmed' ||
|
||||
row.orderstatus === 'delivered' ||
|
||||
row.orderstatus === 'accepted'
|
||||
? 'success'
|
||||
: row.orderstatus === 'cancelled'
|
||||
? 'error'
|
||||
: row.orderstatus === 'processing'
|
||||
? 'primary'
|
||||
: 'primary'
|
||||
? 'success'
|
||||
: row.orderstatus === 'cancelled'
|
||||
? 'error'
|
||||
: row.orderstatus === 'processing'
|
||||
? 'primary'
|
||||
: 'primary'
|
||||
}
|
||||
size="small"
|
||||
variant="light"
|
||||
@@ -2087,7 +2090,12 @@ const Orders = () => {
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
{/* ============================================= || AI optimisation Assign Orders | ============================================= */}
|
||||
<Dialog open={aiDialog} fullScreen TransitionComponent={PopupTransition}>
|
||||
<Dialog
|
||||
open={aiDialog}
|
||||
fullScreen
|
||||
TransitionComponent={PopupTransition}
|
||||
PaperProps={{ sx: { display: 'flex', flexDirection: 'column', overflow: 'hidden' } }}
|
||||
>
|
||||
{
|
||||
<Backdrop
|
||||
sx={{
|
||||
@@ -2220,226 +2228,8 @@ const Orders = () => {
|
||||
</Grid>
|
||||
</Stack>
|
||||
</DialogTitle>
|
||||
<DialogContent>
|
||||
<MainCard content={false}>
|
||||
{zoneData?.map((zone, index) => {
|
||||
const orders = zone?.riders?.flatMap((rider) => rider.orders);
|
||||
|
||||
return (
|
||||
<Accordion
|
||||
key={index}
|
||||
// expanded={true}
|
||||
>
|
||||
<AccordionSummary>
|
||||
<Stack direction="row" alignItems="center" spacing={2} sx={{ m: 2 }}>
|
||||
<Typography variant="h5" fontWeight={1000}>
|
||||
Zone {index + 1} :
|
||||
</Typography>
|
||||
<Chip label={zone.zone_name} color="primary" variant="light" size="small" sx={{ minWidth: 100 }} />
|
||||
<Tooltip title={`Orders`} placement="top">
|
||||
<Badge badgeContent={zone.total_orders} color="secondary">
|
||||
<DashboardOutlined style={{ fontSize: 20 }} />
|
||||
</Badge>
|
||||
</Tooltip>
|
||||
<Tooltip title={`Riders`} placement="top">
|
||||
<Badge color="secondary" badgeContent={zone.active_riders_count}>
|
||||
<DirectionsBikeOutlinedIcon style={{ fontSize: 20 }} />
|
||||
</Badge>
|
||||
</Tooltip>
|
||||
</Stack>
|
||||
</AccordionSummary>
|
||||
<AccordionDetails>
|
||||
<TableContainer sx={{ p: 0, m: 0 }}>
|
||||
<Table stickyHeader>
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
<TableCell>#</TableCell>
|
||||
{/* <TableCell>Tenant</TableCell> */}
|
||||
<TableCell>Order Location</TableCell>
|
||||
<TableCell>Pickup</TableCell>
|
||||
<TableCell>Delivery</TableCell>
|
||||
<TableCell>Notes</TableCell>
|
||||
<TableCell>Rider</TableCell>
|
||||
<TableCell align="center">Type</TableCell>
|
||||
<TableCell align="center">Profit</TableCell>
|
||||
<TableCell align="center">Charges</TableCell>
|
||||
<TableCell align="center">KMS</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
|
||||
<TableBody>
|
||||
{orders.map((val, i) => (
|
||||
<Fragment key={i}>
|
||||
<TableRow sx={{}}>
|
||||
<TableCell>
|
||||
<Typography> {i + 1}</Typography>
|
||||
</TableCell>
|
||||
{/* <TableCell>
|
||||
<Tooltip title={val.tenantaddress}>
|
||||
<Typography variant="body1" noWrap>
|
||||
{val.tenantname}
|
||||
</Typography>
|
||||
<Typography noWrap sx={{ fontSize: '11px' }}>
|
||||
{val.tenantsuburb}
|
||||
<br />
|
||||
</Typography>
|
||||
|
||||
<Typography noWrap variant="body2">
|
||||
{val.applocation}
|
||||
</Typography>
|
||||
</Tooltip>
|
||||
</TableCell> */}
|
||||
<TableCell align="left">
|
||||
<Tooltip title={val.locationaddress} placement="top">
|
||||
<Typography variant="body1" noWrap>
|
||||
{`${val.locationname}-(${val.locationsuburb})`}
|
||||
</Typography>
|
||||
</Tooltip>
|
||||
<Tooltip title="Order Id">
|
||||
<Typography variant="body2" noWrap>
|
||||
{val.orderid}
|
||||
</Typography>
|
||||
</Tooltip>
|
||||
<Stack display={'flex'} flexDirection={'row'} gap={3} sx={{ cursor: 'pointer' }}>
|
||||
<Tooltip title="Pickup Time">
|
||||
<Typography noWrap sx={{ fontSize: '12px' }}>
|
||||
{dayjs(val.pickupslot).format('DD/MM/YYYY')}
|
||||
</Typography>
|
||||
<Chip
|
||||
size="small"
|
||||
label={dayjs(val.pickupslot).format('hh:mm A')}
|
||||
variant="light"
|
||||
sx={{
|
||||
color: '#0a803b',
|
||||
bgcolor: '#c3f3c7'
|
||||
}}
|
||||
/>
|
||||
</Tooltip>
|
||||
<ArrowRightAltOutlined />
|
||||
<Tooltip title="Estimated Delivery time">
|
||||
<Typography noWrap sx={{ fontSize: '12px' }}>
|
||||
{dayjs(val.expecteddeliverytime).format('DD/MM/YYYY')}
|
||||
</Typography>
|
||||
<Chip
|
||||
size="small"
|
||||
label={dayjs(val.expecteddeliverytime).format('hh:mm A')}
|
||||
variant="light"
|
||||
sx={{
|
||||
color: '#DD2C00',
|
||||
background: '#FBE9E7'
|
||||
}}
|
||||
/>
|
||||
</Tooltip>
|
||||
</Stack>
|
||||
</TableCell>
|
||||
<TableCell align="left">
|
||||
<Stack direction={'row'} spacing={1}>
|
||||
<Stack direction="column">
|
||||
<Typography variant="caption">{val.pickupcustomer}</Typography>
|
||||
<Typography variant="caption">{val.pickupcontactno}</Typography>
|
||||
<Tooltip title={val.pickupaddress}>
|
||||
<Typography sx={{ cursor: 'pointer' }} variant="caption">
|
||||
{val.pickupsuburb || val.pickupaddress.slice(0, 20)}
|
||||
</Typography>
|
||||
</Tooltip>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</TableCell>
|
||||
<TableCell align="left">
|
||||
<Stack direction={'row'} spacing={1}>
|
||||
<Stack direction="column">
|
||||
<Typography variant="caption">{val.deliverycustomer}</Typography>
|
||||
<Typography variant="caption">{val.deliverycontactno}</Typography>
|
||||
<Tooltip title={val.deliveryaddress}>
|
||||
<Typography sx={{ cursor: 'pointer' }} variant="caption">
|
||||
{val.deliverysuburb || val.deliveryaddress.slice(0, 20)}
|
||||
</Typography>
|
||||
</Tooltip>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</TableCell>
|
||||
<TableCell align="left">
|
||||
<Typography variant="caption" sx={{ whiteSpace: 'nowrap' }}>
|
||||
{val.ordernotes}
|
||||
</Typography>
|
||||
</TableCell>
|
||||
|
||||
<TableCell align="left">
|
||||
<Typography variant="caption" sx={{ whiteSpace: 'nowrap' }}>
|
||||
{val.rider}
|
||||
</Typography>
|
||||
<br />
|
||||
<Typography variant="caption">ID : {val.userid}</Typography>
|
||||
</TableCell>
|
||||
|
||||
<TableCell align="center">
|
||||
<Chip
|
||||
size="small"
|
||||
label={val.ordertype}
|
||||
icon={
|
||||
val.ordertype === 'Economy' ? (
|
||||
<EnergySavingsLeafIcon />
|
||||
) : val.ordertype === 'Risky' ? (
|
||||
<WarningIcon />
|
||||
) : (
|
||||
<BoltIcon />
|
||||
)
|
||||
}
|
||||
color={val.ordertype === 'Economy' ? 'success' : val.ordertype === 'Risky' ? 'error' : 'primary'}
|
||||
variant="light"
|
||||
/>
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
<Chip
|
||||
size="small"
|
||||
label={`₹ ${parseFloat(val?.profit).toFixed(2)}`}
|
||||
variant="light"
|
||||
sx={{
|
||||
color: '#009688',
|
||||
bgcolor: '#b2dfdb'
|
||||
}}
|
||||
/>
|
||||
</TableCell>
|
||||
|
||||
<TableCell align="center">
|
||||
<Stack display={'flex'} flexDirection={'column'} gap={1} sx={{ cursor: 'pointer' }}>
|
||||
<Tooltip title="Charges" placement="top">
|
||||
<Chip
|
||||
size="small"
|
||||
label={`₹ ${val.deliverycharge.toFixed(2)} `}
|
||||
variant="light"
|
||||
sx={{
|
||||
color: '#0074e7',
|
||||
bgcolor: '#cce3fa'
|
||||
}}
|
||||
/>
|
||||
</Tooltip>
|
||||
{/* <Tooltip title="Amount" placement="left">
|
||||
<Chip size="small" label={`₹ ${val.deliveryamt.toFixed(2)} `} color="success" variant="light" />
|
||||
</Tooltip> */}
|
||||
</Stack>
|
||||
</TableCell>
|
||||
<TableCell align="center">
|
||||
<Stack display={'flex'} flexDirection={'column'} gap={1} sx={{ cursor: 'pointer' }}>
|
||||
<Tooltip title="KMS" placement="top">
|
||||
<Chip size="small" label={`${val.kms} km`} color="error" variant="light" />
|
||||
</Tooltip>
|
||||
<Tooltip title="Cumulative Kms" placement="right">
|
||||
<Chip size="small" label={`${val.cumulativekms} km`} color="success" variant="light" />
|
||||
</Tooltip>
|
||||
</Stack>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</Fragment>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</TableContainer>
|
||||
</AccordionDetails>
|
||||
</Accordion>
|
||||
);
|
||||
})}
|
||||
</MainCard>
|
||||
<DialogContent sx={{ p: 0, display: 'flex', flexDirection: 'column', overflow: 'hidden', flex: 1 }}>
|
||||
{dispatchPreviewData && <Dispatch data={dispatchPreviewData} embedded />}
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Stack display={'flex'} flexDirection={'row'} gap={2} alignItems={'center'} justifyContent={'end'} sx={{ p: 2 }}>
|
||||
|
||||
Reference in New Issue
Block a user