order processing done

This commit is contained in:
ROSHAN GARG 2024-08-30 16:34:24 +05:30
parent 6580f5d854
commit 3bb5473ce4
3 changed files with 75 additions and 18 deletions

View File

@ -15,18 +15,36 @@ import {
import axios from 'axios' // Make sure you have axios installed import axios from 'axios' // Make sure you have axios installed
import { useNavigate, useParams } from 'react-router-dom' import { useNavigate, useParams } from 'react-router-dom'
import Axios from '../../axios' import Axios from '../../axios'
import { isAutheticated } from '../../auth'
const OrderDetails = () => { const OrderDetails = () => {
const [order, setOrder] = useState(null) const [order, setOrder] = useState(null)
const [loading, setLoading] = useState(true) const [loading, setLoading] = useState(true)
const [error, setError] = useState(null) const [error, setError] = useState(null)
const token = isAutheticated()
const navigate = useNavigate() const navigate = useNavigate()
const { id } = useParams() // Assuming order ID is passed as a route parameter const { id } = useParams() // Assuming order ID is passed as a route parameter
const [ownerDetails, setOwnerDetails] = useState()
const getData = async () => {
let res = await Axios.get(`/api/v1/user/details`, {
headers: {
Authorization: `Bearer ${token}`,
},
})
if (res.data.success) {
setOwnerDetails({ ...res.data.user })
}
}
console.log('order', order)
useEffect(() => { useEffect(() => {
const fetchOrderDetails = async () => { const fetchOrderDetails = async () => {
try { try {
const response = await Axios.get(`/api/get-single-placed-order-pd/${id}`) // Adjust API endpoint as needed const response = await Axios.get(`/api/get-single-placed-order-pd/${id}`, {
headers: {
Authorization: `Bearer ${token}`,
},
}) // Adjust API endpoint as needed
setOrder(response.data.singleOrder) setOrder(response.data.singleOrder)
console.log(response) console.log(response)
setLoading(false) setLoading(false)
@ -35,7 +53,7 @@ const OrderDetails = () => {
setLoading(false) setLoading(false)
} }
} }
getData()
fetchOrderDetails() fetchOrderDetails()
}, [id]) }, [id])
@ -96,6 +114,11 @@ const OrderDetails = () => {
Payment Mode: <strong>{paymentMode}</strong> Payment Mode: <strong>{paymentMode}</strong>
</Typography> </Typography>
</Grid> </Grid>
<Grid item sm={12} md={12} lg={12}>
<Typography variant="h5" sx={{ mb: '0.5rem' }}>
SBU: <strong>{ownerDetails?.SBU}</strong>
</Typography>
</Grid>
</Grid> </Grid>
</Box> </Box>
@ -113,6 +136,8 @@ const OrderDetails = () => {
<TableHead> <TableHead>
<TableRow> <TableRow>
<TableCell>Product</TableCell> <TableCell>Product</TableCell>
<TableCell>Category</TableCell>
<TableCell>Brand</TableCell>
<TableCell>SKU</TableCell> <TableCell>SKU</TableCell>
<TableCell>Quantity</TableCell> <TableCell>Quantity</TableCell>
<TableCell>Price</TableCell> <TableCell>Price</TableCell>
@ -122,7 +147,7 @@ const OrderDetails = () => {
</TableHead> </TableHead>
<TableBody> <TableBody>
{order.orderItem.map((row, index) => { {order.orderItem.map((row, index) => {
const gstAmount = (row.productId.price * row.productId.GST) / 100 const gstAmount = (row.price * row.GST) / 100
return ( return (
<TableRow <TableRow
key={index} key={index}
@ -131,32 +156,34 @@ const OrderDetails = () => {
<TableCell> <TableCell>
<Box sx={{ display: 'flex' }}> <Box sx={{ display: 'flex' }}>
<Box> <Box>
<Typography fontWeight={600}>{row.productId.name}</Typography> <Typography fontWeight={600}>{row.name}</Typography>
</Box> </Box>
</Box> </Box>
</TableCell> </TableCell>
<TableCell>{row.productId.SKU}</TableCell> <TableCell>{row.categoryName}</TableCell>
<TableCell>{row.brandName}</TableCell>
<TableCell>{row.SKU}</TableCell>
<TableCell>{row.quantity}</TableCell> <TableCell>{row.quantity}</TableCell>
<TableCell>{row.productId.price}</TableCell> <TableCell>{row.price}</TableCell>
<TableCell>{gstAmount}</TableCell> <TableCell>{gstAmount}</TableCell>
<TableCell>{row.productId.price * row.quantity}</TableCell> <TableCell>{row.price * row.quantity}</TableCell>
</TableRow> </TableRow>
) )
})} })}
<TableRow> <TableRow>
<TableCell colSpan={5} /> <TableCell colSpan={7} />
<TableCell> <TableCell>
Subtotal:<strong> {subtotal}</strong> Subtotal:<strong> {subtotal}</strong>
</TableCell> </TableCell>
</TableRow> </TableRow>
<TableRow> <TableRow>
<TableCell colSpan={5} /> <TableCell colSpan={7} />
<TableCell> <TableCell>
Total GST:<strong> {gstTotal} </strong> Total GST:<strong> {gstTotal} </strong>
</TableCell> </TableCell>
</TableRow> </TableRow>
<TableRow> <TableRow>
<TableCell colSpan={5} /> <TableCell colSpan={7} />
<TableCell> <TableCell>
Grand Total: <strong> {grandTotal}</strong> Grand Total: <strong> {grandTotal}</strong>
</TableCell> </TableCell>

View File

@ -11,13 +11,29 @@ import {
TableRow, TableRow,
Typography, Typography,
} from '@mui/material' } from '@mui/material'
import React from 'react' import React, { useEffect, useState } from 'react'
import { useSelector } from 'react-redux' import { useSelector } from 'react-redux'
import { selectCartSubtotal } from '../../../redux-store/CartStore/ducs' import { selectCartSubtotal } from '../../../redux-store/CartStore/ducs'
import { isAutheticated } from '../../../auth'
import Axios from '../../../axios'
const OrderConfirmation = ({ orderId, billTo, shipTo, paymentMode, cartItem }) => { const OrderConfirmation = ({ orderId, billTo, shipTo, paymentMode, cartItem }) => {
const subtotal = useSelector(selectCartSubtotal) const subtotal = useSelector(selectCartSubtotal)
const [ownerDetails, setOwnerDetails] = useState()
const token = isAutheticated()
const getData = async () => {
let res = await Axios.get(`/api/v1/user/details`, {
headers: {
Authorization: `Bearer ${token}`,
},
})
if (res.data.success) {
setOwnerDetails({ ...res.data.user })
}
}
useEffect(() => {
getData()
}, [])
// Calculate total GST for the entire cart // Calculate total GST for the entire cart
const totalGST = cartItem.reduce((acc, item) => { const totalGST = cartItem.reduce((acc, item) => {
// console.log(item) // console.log(item)
@ -49,6 +65,11 @@ const OrderConfirmation = ({ orderId, billTo, shipTo, paymentMode, cartItem }) =
Payment mode : <strong>{paymentMode}</strong> Payment mode : <strong>{paymentMode}</strong>
</Typography> </Typography>
</Grid> </Grid>
<Grid item sm={12} md={12} lg={12}>
<Typography variant="h5" sx={{ mb: '0.5rem' }}>
SBU: <strong>{ownerDetails?.SBU}</strong>
</Typography>
</Grid>
</Grid> </Grid>
</Box> </Box>
@ -65,6 +86,8 @@ const OrderConfirmation = ({ orderId, billTo, shipTo, paymentMode, cartItem }) =
<TableHead> <TableHead>
<TableRow> <TableRow>
<TableCell>Product</TableCell> <TableCell>Product</TableCell>
<TableCell>Category</TableCell>
<TableCell>Brand</TableCell>
<TableCell>SKU</TableCell> <TableCell>SKU</TableCell>
<TableCell>Quantity</TableCell> <TableCell>Quantity</TableCell>
<TableCell>Price</TableCell> <TableCell>Price</TableCell>
@ -93,6 +116,8 @@ const OrderConfirmation = ({ orderId, billTo, shipTo, paymentMode, cartItem }) =
</Box> </Box>
</Box> </Box>
</TableCell> </TableCell>
<TableCell>{row.category.categoryName}</TableCell>
<TableCell>{row.brand.brandName}</TableCell>
<TableCell>{row.SKU}</TableCell> <TableCell>{row.SKU}</TableCell>
<TableCell>{row.count}</TableCell> <TableCell>{row.count}</TableCell>
<TableCell>{row.price}</TableCell> <TableCell>{row.price}</TableCell>
@ -102,20 +127,20 @@ const OrderConfirmation = ({ orderId, billTo, shipTo, paymentMode, cartItem }) =
) )
})} })}
<TableRow> <TableRow>
<TableCell colSpan={5} /> <TableCell colSpan={7} />
<TableCell> <TableCell>
Subtotal:<strong> {subtotal}</strong> Subtotal:<strong> {subtotal}</strong>
</TableCell> </TableCell>
</TableRow> </TableRow>
<TableRow> <TableRow>
<TableCell colSpan={5} /> <TableCell colSpan={7} />
<TableCell> <TableCell>
Total GST:<strong> {totalGST} </strong> Total GST:<strong> {totalGST} </strong>
</TableCell> </TableCell>
</TableRow> </TableRow>
<TableRow> <TableRow>
<TableCell colSpan={5} /> <TableCell colSpan={7} />
<TableCell> <TableCell>
Grand Total: <strong> {subtotal + totalGST}</strong> Grand Total: <strong> {subtotal + totalGST}</strong>
</TableCell> </TableCell>

View File

@ -77,6 +77,7 @@ const ReviewOrder = ({
Swal.fire('Something went wrong', error.message, 'error') Swal.fire('Something went wrong', error.message, 'error')
} }
} }
console.log('cartitems', cartItem)
return ( return (
<Box> <Box>
<Box sx={{ my: '2rem', background: '#fff', padding: '1rem', borderRadius: '0.8rem' }}> <Box sx={{ my: '2rem', background: '#fff', padding: '1rem', borderRadius: '0.8rem' }}>
@ -114,6 +115,8 @@ const ReviewOrder = ({
<TableHead> <TableHead>
<TableRow> <TableRow>
<TableCell>Product</TableCell> <TableCell>Product</TableCell>
<TableCell>Category</TableCell>
<TableCell>Brand </TableCell>
<TableCell>SKU</TableCell> <TableCell>SKU</TableCell>
<TableCell>Quantity</TableCell> <TableCell>Quantity</TableCell>
<TableCell>Price</TableCell> <TableCell>Price</TableCell>
@ -142,6 +145,8 @@ const ReviewOrder = ({
</Box> </Box>
</Box> </Box>
</TableCell> </TableCell>
<TableCell>{row.category.categoryName}</TableCell>
<TableCell>{row.brand.brandName}</TableCell>
<TableCell>{row.SKU}</TableCell> <TableCell>{row.SKU}</TableCell>
<TableCell>{row.count}</TableCell> <TableCell>{row.count}</TableCell>
<TableCell>{row.price}</TableCell> <TableCell>{row.price}</TableCell>
@ -151,20 +156,20 @@ const ReviewOrder = ({
) )
})} })}
<TableRow> <TableRow>
<TableCell colSpan={5} /> <TableCell colSpan={7} />
<TableCell> <TableCell>
Subtotal:<strong> {subtotal}</strong> Subtotal:<strong> {subtotal}</strong>
</TableCell> </TableCell>
</TableRow> </TableRow>
<TableRow> <TableRow>
<TableCell colSpan={5} /> <TableCell colSpan={7} />
<TableCell> <TableCell>
Total GST:<strong> {totalGST} </strong> Total GST:<strong> {totalGST} </strong>
</TableCell> </TableCell>
</TableRow> </TableRow>
<TableRow> <TableRow>
<TableCell colSpan={5} /> <TableCell colSpan={7} />
<TableCell> <TableCell>
Grand Total: <strong> {subtotal + totalGST}</strong> Grand Total: <strong> {subtotal + totalGST}</strong>
</TableCell> </TableCell>