-
+
{/* Static Dashboard greeting */}
-
+ {/* Dynamic content based on the selected tab */} -
+
+
Welcome to{" "} {user.result.title}. {user.result.firstName} {user.result.middleName} {user.result.lastName} -
-
+ Welcome to{" "} {user.result.title}. {user.result.firstName} {user.result.middleName} {user.result.lastName} -
-
+ {/* Dynamic content based on the selected tab */} -
+
diff --git a/ef-ui/src/components/PropertyMysqlView.jsx b/ef-ui/src/components/PropertyMysqlView.jsx
index 074f42b..8b519c7 100644
--- a/ef-ui/src/components/PropertyMysqlView.jsx
+++ b/ef-ui/src/components/PropertyMysqlView.jsx
@@ -36,6 +36,7 @@ const PropertyMysqlView = () => {
<>
{renderTabContent()}
+
{loading ? (
Loading...
// Loader
diff --git a/ef-ui/src/components/UserProperties.jsx b/ef-ui/src/components/UserProperties.jsx
index da5a3eb..90e4375 100644
--- a/ef-ui/src/components/UserProperties.jsx
+++ b/ef-ui/src/components/UserProperties.jsx
@@ -2,13 +2,12 @@ import { useEffect, useState } from "react";
import { useSelector, useDispatch } from "react-redux";
import { fetchUserProperties } from "../redux/features/propertySlice";
import { NavLink } from "react-router-dom";
+import propertydummy from "../img/propertydummy.jpg";
const UserProperties = () => {
const dispatch = useDispatch();
const { user } = useSelector((state) => ({ ...state.auth }));
- const { userProperties, totalPages } = useSelector(
- (state) => state.property
- );
+ const { userProperties, totalPages } = useSelector((state) => state.property);
const [page, setPage] = useState(1);
const limit = 5; // Number of properties per page
@@ -16,56 +15,146 @@ const UserProperties = () => {
// Fetch user properties when "Active Properties" tab is selected
useEffect(() => {
dispatch(fetchUserProperties({ userId: user.result.userId, page, limit }));
- },[dispatch, user?.result?.userId, page]);
+ }, [dispatch, user?.result?.userId, page]);
- // Pagination handler
- const handlePageChange = (newPage) => {
- setPage(newPage);
- };
+ // Pagination handler
+ const handlePageChange = (newPage) => {
+ setPage(newPage);
+ };
return (
<>
- {userProperties.length > 0 ? (
- <>
- -
- {userProperties.map((property) => (
-
-
-
- {property.title} - {"....."} - + {userProperties.length > 0 ? ( + <> +-
+ {userProperties.map((property) => (
+
-
+ ++++++++
+
+++ {" "} +
+ ++ {property.title} + {"....."} + ++ 100% cotton + + Light weight + + + Best finish ++
+ ++ Unique design + + For men + + + Casual ++
+ ++ There are many variations of passages of +
+
+
++ {/*+++$14.99
+ $20.99 +Free shipping
*/} ++++ + -- Edit - {"....."} - - - ))} - ++ + +
+ ))}
+
- + {/* Pagination Controls */} ++ + ) : ( ++ - {/* Show page numbers */} - {Array.from({ length: totalPages }, (_, index) => index + 1).map( - (pageNumber) => - pageNumber === page || // Current page - pageNumber === 1 || // First page - pageNumber === totalPages || // Last page - (pageNumber >= page - 1 && pageNumber <= page + 1) // Pages near current page - ? ( + {/* Show page numbers */} + {Array.from({ length: totalPages }, (_, index) => index + 1).map( + (pageNumber) => + pageNumber === page || // Current page + pageNumber === 1 || // First page + pageNumber === totalPages || // Last page + (pageNumber >= page - 1 && pageNumber <= page + 1) ? ( // Pages near current page - ) - : pageNumber === 2 || pageNumber === totalPages - 1 // Add "..." between non-adjacent pages - ? ... - : null - )} + ) : pageNumber === 2 || pageNumber === totalPages - 1 ? ( // Add "..." between non-adjacent pages + ... + ) : null + )} - -- - ) : ( -No active properties found.
- )} - + +No active properties found.
+ )} + ); }; diff --git a/ef-ui/src/dashboard.css b/ef-ui/src/dashboard.css index 0eb1262..ff38201 100644 --- a/ef-ui/src/dashboard.css +++ b/ef-ui/src/dashboard.css @@ -1,11 +1,57 @@ + + .btn.active { - background-color: #fda417; /* Highlight color for the active tab */ - color: #fff; /* Text color for the active tab */ + background-color: #fda417; + /* Highlight color for the active tab */ + color: #fff; + /* Text color for the active tab */ border: 1px solid #fda417; - } - - - +} + +body { + background: #eee +} + +.ratings i { + font-size: 16px; + color: red +} + +.strike-text { + color: red; + text-decoration: line-through +} + +.product-image { + width: 100% +} + +.dot { + height: 7px; + width: 7px; + margin-left: 6px; + margin-right: 6px; + margin-top: 3px; + background-color: #fda417; + border-radius: 50%; + display: inline-block +} + +.spec-1 { + color: #938787; + font-size: 15px +} + +h5 { + font-weight: 400 +} + +.para { + font-size: 16px +} + + + /* -
+