pending page done

src/index.js

@@ -15,9 +15,9 @@ import { cibGmail } from "@coreui/icons";
 import { createRoot } from "react-dom/client";
 
 const setupAxios = () => {
-  // axios.defaults.baseURL = "http://localhost:5000";
+  axios.defaults.baseURL = "http://localhost:5000";
   // axios.defaults.baseURL = "https://cheminova-api-2.onrender.com";
-  axios.defaults.baseURL = "https://api.cnapp.co.in";
+  // axios.defaults.baseURL = "https://api.cnapp.co.in";
 
   axios.defaults.headers = {
     "Cache-Control": "no-cache,no-store",

src/views/orders/ViewOrders.js

@@ -27,6 +27,7 @@ import { isAutheticated } from "src/auth";
 import Swal from "sweetalert2";
 import OrderDetailsDialog from "./partialOrderModal";
 import InvoiceTable from "./invoiceTable";
+import PendingOrderTable from "./pendingOrderTable";
 
 const ViewOrders = () => {
   const [order, setOrder] = useState(null); // State to store order details
@@ -297,12 +298,12 @@ const ViewOrders = () => {
       <Grid container spacing={2}>
         <Grid item md={8} xl={8} lg={8}>
           <Box sx={{ padding: 2, background: "#fff" }}>
-            {onvoicesData.length > 0 && (
+            {order.invoices?.length > 0 && (
               <>
                 <Typography variant="h4" gutterBottom>
                   Invoices
                 </Typography>
-                <InvoiceTable invoices={onvoicesData} />
+                <InvoiceTable invoices={order.invoices} />
               </>
             )}
             <Typography variant="h4" my={3} gutterBottom>
@@ -361,6 +362,15 @@ const ViewOrders = () => {
                 </TableContainer>
               </Grid>
             </Grid>
+            {order.invoices?.length > 0 && (
+              <>
+                {" "}
+                <Typography variant="h4" my={3} gutterBottom>
+                  Order Itmes to processed
+                </Typography>
+                <PendingOrderTable order={order} />
+              </>
+            )}
 
             <Grid container spacing={2}>
               <Grid item sm={6} md={6} xl={6}>
@@ -387,7 +397,7 @@ const ViewOrders = () => {
                   </Typography>
                 </Box>
               </Grid>
-              <Grid item sm={6} md={6} xl={6}>
+              {/* <Grid item sm={6} md={6} xl={6}>
                 <TableContainer
                   component={Paper}
                   sx={{ maxWidth: 600, margin: "auto", mt: 4 }}
@@ -428,14 +438,14 @@ const ViewOrders = () => {
                               "-"
                             )}
 
-                            {/* {row.date} */}
+                          
                           </TableCell>
                         </TableRow>
                       ))}
                     </TableBody>
                   </Table>
                 </TableContainer>
-              </Grid>
+              </Grid> */}
             </Grid>
           </Box>
         </Grid>

src/views/orders/invoiceTable.js

@@ -43,7 +43,7 @@ const InvoiceTable = ({ invoices }) => {
                 <TableCell>
                   {invoice.items.map((item) => (
                     <div key={item.productId}>
-                      {item.name} ({item.SKU}) x {item.processquantity}
+                      {item.name} ({item.SKU}) x <b>{item.processquantity}</b>
                     </div>
                   ))}
                 </TableCell>

src/views/orders/partialOrderModal.js

@@ -22,7 +22,7 @@ const OrderDetailsDialog = ({ open, onClose, order, onSubmit }) => {
   const [availability, setAvailability] = useState(
     order?.orderItem.map((item) => ({
       ...item, // Keep all original properties from orderItem
-      processquantity: item.quantity, // Add availability field with default value equal to quantity
+      processquantity: item.remainingQuantity, // Add availability field with default value equal to quantity
     }))
   );
 
@@ -31,7 +31,7 @@ const OrderDetailsDialog = ({ open, onClose, order, onSubmit }) => {
     const updatedAvailability = [...availability];
     const newValue = Math.max(
       0,
-      Math.min(value, updatedAvailability[index].quantity)
+      Math.min(value, updatedAvailability[index].remainingQuantity)
     ); // Ensure value is between 0 and available quantity
     updatedAvailability[index].processquantity = newValue;
     setAvailability(updatedAvailability);
@@ -65,9 +65,9 @@ const OrderDetailsDialog = ({ open, onClose, order, onSubmit }) => {
                 </TableHead>
                 <TableBody>
                   {order?.orderItem.map((item, index) => {
-                    const subtotal = item.price * item.quantity;
+                    const subtotal = item.price * item.remainingQuantity;
                     const gstAmount =
-                      ((item.GST * item.price) / 100) * item.quantity;
+                      ((item.GST * item.price) / 100) * item.remainingQuantity;
                     const totalWithGST = subtotal + gstAmount;
 
                     return (
@@ -83,7 +83,9 @@ const OrderDetailsDialog = ({ open, onClose, order, onSubmit }) => {
                           </Typography>
                         </TableCell>
                         <TableCell align="right">₹{item.price}</TableCell>
-                        <TableCell align="right">{item.quantity}</TableCell>
+                        <TableCell align="right">
+                          {item.remainingQuantity}
+                        </TableCell>
                         <TableCell align="right">
                           <TextField
                             sx={{ minWidth: "100px" }}
@@ -97,7 +99,7 @@ const OrderDetailsDialog = ({ open, onClose, order, onSubmit }) => {
                             }
                             inputProps={{
                               min: 0,
-                              max: item.quantity,
+                              max: item.remainingQuantity,
                             }}
                             style={{ width: "60px", textAlign: "center" }}
                           />

src/views/orders/pendingOrderTable.js

@@ -0,0 +1,81 @@
+import {
+  Box,
+  Grid,
+  TableContainer,
+  Paper,
+  Table,
+  TableHead,
+  TableRow,
+  TableCell,
+  TableBody,
+  Typography,
+} from "@mui/material";
+import React from "react";
+
+const PendingOrderTable = ({ order }) => {
+  return (
+    <Box>
+      <Grid container spacing={2}>
+        <Grid item xs={12}>
+          <TableContainer component={Paper}>
+            <Table>
+              <TableHead>
+                <TableRow>
+                  <TableCell>Product</TableCell>
+                  <TableCell align="right">Price (₹)</TableCell>
+                  <TableCell align="right">Quantity</TableCell>
+                  <TableCell align="right">Subtotal (₹)</TableCell>
+                  <TableCell align="right">GST (%)</TableCell>
+                  <TableCell align="right">GST Amount (₹)</TableCell>
+                  <TableCell align="right">Total with GST (₹)</TableCell>
+                </TableRow>
+              </TableHead>
+              <TableBody>
+                {order?.orderItem.map((item, index) => {
+                  // Check if remainingQuantity is greater than 0
+                  if (item.remainingQuantity > 0) {
+                    const subtotal = item.price * item.remainingQuantity;
+                    const gstAmount =
+                      ((item.GST * item.price) / 100) * item.remainingQuantity;
+                    const totalWithGST = subtotal + gstAmount;
+
+                    return (
+                      <TableRow key={index}>
+                        <TableCell>
+                          <img
+                            src={item.productId.image}
+                            alt={item.productId.name}
+                            style={{
+                              width: 50,
+                              height: 50,
+                              marginRight: 10,
+                            }}
+                          />
+                          <Typography variant="subtitle1">
+                            {item.productId.name}
+                          </Typography>
+                        </TableCell>
+                        <TableCell align="right">₹{item.price}</TableCell>
+                        <TableCell align="right">
+                          {item.remainingQuantity}
+                        </TableCell>
+                        <TableCell align="right">₹{subtotal}</TableCell>
+                        <TableCell align="right">{item.GST}%</TableCell>
+                        <TableCell align="right">₹{gstAmount}</TableCell>
+                        <TableCell align="right">₹{totalWithGST}</TableCell>
+                      </TableRow>
+                    );
+                  }
+                  // Return null if remainingQuantity is 0
+                  return null;
+                })}
+              </TableBody>
+            </Table>
+          </TableContainer>
+        </Grid>
+      </Grid>
+    </Box>
+  );
+};
+
+export default PendingOrderTable;