diff --git a/frontend/src/AgroRentAI/Cart.jsx b/frontend/src/AgroRentAI/Cart.jsx new file mode 100644 index 00000000..c8c6398d --- /dev/null +++ b/frontend/src/AgroRentAI/Cart.jsx @@ -0,0 +1,230 @@ +import React, { useState, useEffect } from 'react'; +import { useNavigate } from 'react-router-dom'; +import { X, ShoppingBag } from 'lucide-react'; +import axios from 'axios'; +import './index.css'; +import { OrderSummary, PromoCodeInput } from '../AgroShopAI/components/CartComponents'; + +const RentCartPage = () => { + const [discountCode, setDiscountCode] = useState(''); + const [discount, setDiscount] = useState(0); + const [shippingCost, setShippingCost] = useState(10); // Example flat shipping cost + const [taxRate, setTaxRate] = useState(0.08); // Example tax rate of 8% + const [savedItems, setSavedItems] = useState([]); + const navigate = useNavigate(); + + const cartItems = [ + { + id: 1, + name: "Tractor", + description: "High-power tractor suitable for plowing and heavy-duty farm work.", + price: 200, + image: "https://example.com/images/tractor.jpg", + rating: 4.5, + category: ["Machinery", "Farming Equipment"], + available: true, + deliveryEstimate: "2-4 days", + }, + { + id: 2, + name: "Rotary Tiller", + description: "Efficient tiller for preparing the soil for planting, suitable for medium-sized farms.", + price: 75, + image: "https://example.com/images/rotary-tiller.jpg", + rating: 4.3, + category: ["Machinery", "Soil Preparation"], + available: false, + deliveryEstimate: "N/A", + }, + { + name: "Seed Planter", + description: "Automatic seed planter for precise and efficient planting.", + price: 90, + image: "https://example.com/images/seed-planter.jpg", + rating: 4.2, + category: ["Machinery", "Planting"], + }, + + ]; + + const recommendedItems = [ + { + name: "Fertilizer Spreader", + description: "Compact spreader for distributing fertilizer evenly across large areas.", + price: 50, + image: "https://example.com/images/fertilizer-spreader.jpg", + }, + { + name: "Water Pump", + description: "Durable water pump suitable for irrigation purposes.", + price: 65, + image: "https://example.com/images/water-pump.jpg", + }, + ]; + + const calculateSubtotal = () => cartItems.reduce((total, item) => total + item.price, 0); + const calculateTax = () => calculateSubtotal() * taxRate; + const calculateTotal = () => calculateSubtotal() - discount + calculateTax() + shippingCost; + + const handleApplyDiscountCode = () => { + if (discountCode === 'SAVE10') { + setDiscount(calculateSubtotal() * 0.1); + } else { + alert('Invalid discount code'); + } + }; + + const handleCheckout = () => { + navigate('/checkout'); + }; + + return ( +
+

Your Cart

+ +
+ {/* Cart Items */} +
+ {cartItems.length === 0 ? ( +
+ +

Your cart is empty.

+ +
+ ) : ( + cartItems.map((item) => ( +
+ {item.name} +
+

{item.name}

+

Price: ₹{item.price}

+

+ {item.available ? 'In Stock' : 'Out of Stock'} +

+

+ Delivery Estimate: {item.available ? item.deliveryEstimate : 'N/A'} +

+
+
+ + +
+
+ )) + )} +
+ + {/* Order Summary */} +
+

Order Summary

+ +
+ Subtotal + ₹{calculateSubtotal().toFixed(2)} +
+ +
+ Discount + -₹{discount.toFixed(2)} +
+ +
+ Shipping + ₹{shippingCost} +
+ +
+ Tax + ₹{calculateTax().toFixed(2)} +
+ +
+ Total + ₹{calculateTotal().toFixed(2)} +
+ + + +
+ +
+ setDiscountCode(e.target.value)} + className="border border-gray-300 p-2 flex-1 min-w-0 rounded-md mr-2" + /> + +
+
+
+
+ + {/* Saved for Later */} + {savedItems.length > 0 && ( +
+

Saved for Later

+ {savedItems.map((item) => ( +
+ {item.name} +
+

{item.name}

+

Price: ₹{item.price}

+
+ +
+ ))} +
+ )} + + {/* Recommended Products */} +
+

Recommended for You

+
+ {recommendedItems.map((item, index) => ( +
+ {item.name} +
+

{item.name}

+

Price: ₹{item.price}

+
+
+ ))} +
+
+
+ ); +}; + +export default RentCartPage; diff --git a/frontend/src/MainContent.jsx b/frontend/src/MainContent.jsx index 7603cab2..3aa879e7 100644 --- a/frontend/src/MainContent.jsx +++ b/frontend/src/MainContent.jsx @@ -51,6 +51,7 @@ import HeroSectionRent from './AgroRentAI/HeroSectionRent'; import NavigateProducts from './AgroRentAI/NavigateProducts'; import RentUserDashboard from './AgroRentAI/RentUserDashboard'; import RentCheckoutPage from './AgroRentAI/RentCheckoutPage'; +import RentCartPage from './AgroRentAI/Cart'; import RentProductDetails from './AgroRentAI/RentProductDetails'; @@ -162,6 +163,7 @@ const MainContent = () => { } /> } /> } /> + } /> } />