product status and send mail if change status

src/index.js

@@ -14,7 +14,7 @@ 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://api.smellika.com";
 
   axios.defaults.headers = {

src/views/Products/AddProduct.js

@@ -33,6 +33,7 @@ const AddProduct = () => {
   const [category, setCategoryName] = useState("");
   const [error, setError] = useState("");
   const [selectedTax, setselectedTax] = useState();
+  const [product_Status, setproduct_Status] = useState("");
   const [totalAmt, setTotalAmt] = useState(0);
   const [gst_amount, setGst_amount] = useState(0);
 
@@ -127,6 +128,7 @@ const AddProduct = () => {
       category === "" ||
       selectedTax === "" ||
       gst_amount === "" ||
+      product_Status === "" ||
       price === ""
     ) {
       swal({
@@ -147,6 +149,7 @@ const AddProduct = () => {
     formData.append("category", category);
     formData.append("total_amount", totalAmt);
     formData.append("gst_amount", gst_amount);
+    formData.append("product_Status", product_Status);
 
     formData.append("gst", selectedTax);
 
@@ -525,6 +528,23 @@ const AddProduct = () => {
                   // onChange={(e) => setPrice(e.target.value)}
                 />
               </div>
+
+              <div className=" mb-3">
+                <label htmlFor="title" className="form-label">
+                  Product Status *
+                </label>{" "}
+                <select
+                  className="form-control"
+                  name="product_Status"
+                  id="product_Status"
+                  value={product_Status}
+                  onChange={(e) => setproduct_Status(e.target.value)}
+                >
+                  <option value="">--Select--</option>
+                  <option value="Active">Active</option>
+                  <option value="Inactive">Inactive</option>
+                </select>
+              </div>
             </div>
           </div>
         </div>

src/views/Products/EditProduct.js

@@ -35,6 +35,8 @@ const EditProduct = () => {
   const [error, setError] = useState("");
   const [initTax, setInitTax] = useState();
   const [selectedTax, setselectedTax] = useState();
+  const [product_Status, setproduct_Status] = useState("");
+
   const [totalAmt, setTotalAmt] = useState(0);
   const [gst_amount, setGst_amount] = useState(0);
   const [newUpdatedImages, setNewUpdatedImages] = useState([]);
@@ -49,7 +51,6 @@ const EditProduct = () => {
         },
       })
       .then((res) => {
-        // console.log(res?.data?.product?.gst?._id);
         setName(res?.data?.product.name);
         setDescription(res.data.product.description);
         setProductImages(res.data.product.image);
@@ -59,6 +60,7 @@ const EditProduct = () => {
         setInitTax(res.data.product?.gst?._id);
         setTotalAmt(res.data.product?.total_amount);
         setGst_amount(res.data.product?.gst_amount);
+        setproduct_Status(res.data.product?.product_Status);
       })
       .catch((err) => {
         swal({
@@ -153,6 +155,7 @@ const EditProduct = () => {
       selectedTax === "" ||
       gst_amount === "" ||
       price === "" ||
+      product_Status === "" ||
       totalAmt === "" ||
       gst_amount === "" ||
       (productImages.length == 0 && newUpdatedImages.length == 0)
@@ -175,6 +178,7 @@ const EditProduct = () => {
     formData.append("category", category);
     formData.append("total_amount", totalAmt);
     formData.append("gst_amount", gst_amount);
+    formData.append("product_Status", product_Status);
 
     formData.append("gst", initTax === "" ? selectedTax : initTax);
 
@@ -583,6 +587,22 @@ const EditProduct = () => {
                   // onChange={(e) => setPrice(e.target.value)}
                 />
               </div>
+              <div className=" mb-3">
+                <label htmlFor="title" className="form-label">
+                  Product Status *
+                </label>{" "}
+                <select
+                  className="form-control"
+                  name="product_Status"
+                  id="product_Status"
+                  value={product_Status}
+                  onChange={(e) => setproduct_Status(e.target.value)}
+                >
+                  <option value="">--Select--</option>
+                  <option value="Active">Active</option>
+                  <option value="Inactive">Inactive</option>
+                </select>
+              </div>
             </div>
           </div>
         </div>

src/views/Products/ViewProduct.js

@@ -135,6 +135,10 @@ function ViewProduct() {
                         </tr>
                         {/* <tr><th>Product Time</th><td>{product?.time}</td></tr>
                                                 <tr><th>Location</th><td>{product?.location}</td></tr> */}
+                        <tr>
+                          <th>Product Status</th>
+                          <td>{product?.product_Status}</td>
+                        </tr>
                         <tr>
                           <th>Created On</th>
                           <td>

src/views/orders/CancelledOrders.js

@@ -155,7 +155,7 @@ function CancelledOrders() {
                                   )}
                                 </td>
                                 <td className="text-start">
-                                  <span className="badge text-bg-success text-white">
+                                  <span className="badge text-bg-danger text-white">
                                     {order?.orderStatus}
                                   </span>
                                 </td>

src/views/orders/DispatchedOrders.js

@@ -158,7 +158,7 @@ function DispatchedOrders() {
                                   )}
                                 </td>
                                 <td className="text-start">
-                                  <span className="badge text-bg-success text-white">
+                                  <span className="badge text-bg-info text-white">
                                     {order?.orderStatus}
                                   </span>
                                 </td>

src/views/orders/NewOrders.js

@@ -210,7 +210,7 @@ function NewOrders() {
                                   )}
                                 </td>
                                 <td className="text-start">
-                                  <span className="badge text-bg-success text-white">
+                                  <span className="badge text-bg-primary text-white">
                                     {order?.orderStatus}
                                   </span>
                                 </td>

src/views/orders/ProcessingOrders.js

@@ -159,7 +159,7 @@ function ProcessingOrders() {
                                   )}
                                 </td>
                                 <td className="text-start">
-                                  <span className="badge text-bg-success text-white">
+                                  <span className="badge text-bg-warning text-white">
                                     {order?.orderStatus}
                                   </span>
                                 </td>

src/views/orders/ViewOrders.js

@@ -171,6 +171,77 @@ function ViewOrders() {
         //   swal.close(); // Close the popup if canceled
         // }
       });
+    } else if (orderStatus === "cancelled") {
+      swal({
+        title: `Are you sure for ${orderStatus}?`,
+        icon: "warning",
+        content: {
+          element: "div",
+          attributes: {
+            innerHTML:
+              '<p>Reson for cancellation.?</p><input id="input1" placeholder="Enter Reason for Cancellation" className="swal2-input" style="margin:3px;height:40px;text-align:center;">',
+          },
+        },
+        buttons: {
+          Yes: { text: "Submit", value: true },
+
+          Cancel: { text: "Cancel", value: "cancel" },
+        },
+      }).then((result) => {
+        if (result === true) {
+          // You have the input values, you can use them in your API call
+          const ReasonforCancellation = document
+            .getElementById("input1")
+            .value.trim();
+
+          // Check if values are entered
+          if (ReasonforCancellation === "") {
+            swal({
+              title: "Warning",
+              text: "Please enter Reason for Cancellation",
+              icon: "warning",
+              button: "Ok",
+              dangerMode: true,
+            });
+          } else {
+            axios
+              .patch(
+                `/api/order/change/status/${id}`,
+                {
+                  status: orderStatus,
+                  ReasonforCancellation,
+                },
+                {
+                  headers: {
+                    "Access-Control-Allow-Origin": "*",
+                    Authorization: `Bearer ${token}`,
+                  },
+                }
+              )
+              .then((res) => {
+                console.log("status");
+                toast.success(
+                  `Order status change ${status} to ${orderStatus}`
+                );
+                // setSuccess((prev) => !prev);
+              })
+              .catch((err) => {
+                swal({
+                  title: "Warning",
+                  text: err.response.data.message
+                    ? err.response.data.message
+                    : "Something went wrong!",
+                  icon: "error",
+                  button: "Retry",
+                  dangerMode: true,
+                });
+              });
+          }
+        }
+        // else {
+        //   swal.close(); // Close the popup if canceled
+        // }
+      });
     } else if (orderStatus === "delivered") {
       swal({
         title: `Are you sure for ${orderStatus}?`,
@@ -451,9 +522,9 @@ function ViewOrders() {
                                           </div>
 
                                           <p className="m-0 mt-3 ms-3">
-                                            <stong> Total Price:</stong> ₹
+                                            <stong> Subtotal:</stong> ₹
                                             {productDetails?.quantity *
-                                              productDetails?.price}
+                                              productDetails?.total_Amount}
                                           </p>
                                         </div>
                                         <div className="col-sm-6">
@@ -461,6 +532,10 @@ function ViewOrders() {
                                             <stong> Price:</stong> ₹
                                             {productDetails?.price}
                                           </p>
+                                          <p className="m-0 mt-3">
+                                            <stong> GST:</stong> ₹
+                                            {productDetails?.gst_amount}
+                                          </p>
                                         </div>
                                       </div>
                                     </div>
@@ -629,9 +704,22 @@ function ViewOrders() {
                   <div className="card">
                     <div className="card-body">
                       <div className="mt-1">
-                        <h6 className="text-success">
+                        {orderDetails?.orderStatus !== "cancelled" ? (
-                          Order Status: {orderDetails?.orderStatus}
+                          <h5 className="text-success">
-                        </h6>
+                            Order Status: {orderDetails?.orderStatus}
+                          </h5>
+                        ) : (
+                          <>
+                            <h5 className="text-danger">
+                              Order Status: {orderDetails?.orderStatus}
+                            </h5>
+                            <p className="text-danger">
+                              {" "}
+                              Order Cancelled Reason:{" "}
+                              {orderDetails?.order_Cancelled_Reason}
+                            </p>
+                          </>
+                        )}
                         {/* order status change  */}{" "}
                         <div className="mb-2">
                           {" "}
@@ -712,7 +800,6 @@ function ViewOrders() {
                                                 <button className='btn-sm btn-primary' onClick={(e) => handleGetSingleFrenchisee(e)} >Add</button>
                                             </div> */}
                       </div>
-
                       {orderDetails?.shipingInfo !== null && (
                         <div className="">
                           <div className="row" style={{ fontSize: "14px" }}>
@@ -775,7 +862,39 @@ function ViewOrders() {
                           )}
                         </label>
                       </div>
-                      <div className="mt-1">
+                      <div className="">
+                        <label>
+                          <span className="fw-bold">Payment Mode : </span>
+                          {orderDetails?.paymentMode === "online" ? (
+                            <span className="fw-bold text-success">ONLINE</span>
+                          ) : (
+                            <span className="fw-bold text-primary">
+                              CASH ON DELIVERY
+                            </span>
+                          )}
+                        </label>
+                      </div>
+
+                      <div className="">
+                        <label>
+                          <span className="fw-bold"> Paid At: </span>
+
+                          {orderDetails?.paidAt
+                            ? new Date(orderDetails?.paidAt).toLocaleString(
+                                "en-IN",
+                                {
+                                  month: "short",
+                                  day: "numeric",
+                                  year: "numeric",
+                                  hour: "2-digit",
+                                  minute: "numeric",
+                                  hour12: true,
+                                }
+                              )
+                            : "----"}
+                        </label>
+                      </div>
+                      <div className="">
                         <label>
                           <span className="fw-bold"> Order Created By: </span>
                           {orderDetails?.user?.name}
@@ -783,15 +902,20 @@ function ViewOrders() {
                       </div>
                       <div className="mt-1">
                         <label>
-                          <span className="fw-bold">paypal_payment_id : </span>
+                          <span className="fw-bold">
-                          {orderDetails?.paypal_payment_id}
+                            Razorpay Payment ID :{" "}
+                          </span>
+                          {orderDetails?.razorpay_payment_id
+                            ? orderDetails?.razorpay_payment_id
+                            : "----"}
                         </label>
                       </div>
-
+                      <div className="">
-                      <div className="mt-1">
                         <label>
-                          <span className="fw-bold">paypal_payer_id : </span>
+                          <span className="fw-bold">Razorpay Order ID : </span>
-                          {orderDetails?.paypal_payer_id}
+                          {orderDetails?.razorpay_order_id
+                            ? orderDetails?.razorpay_order_id
+                            : "----"}
                         </label>
                       </div>
                     </div>