{
+ const childRef = useRef();
const [visible, setVisible] = useState(false)
-
+ const [cat,setCat] = useState("Electronics")
const toggleVisible = () => {
const scrolled = document.documentElement.scrollTop;
if (scrolled > 100){
@@ -24,9 +25,14 @@ const Category = () => {
});
};
window.addEventListener('scroll', toggleVisible);
+ const sendCategory = (index) => {
+ childRef.current.fetchCategory(index)
+ console.log("set",index)
+ };
+
return (
-
-
+
+
diff --git a/src/services/api/loaded-services.js b/src/services/api/loaded-services.js
index d4e95b4..bd70648 100644
--- a/src/services/api/loaded-services.js
+++ b/src/services/api/loaded-services.js
@@ -1,8 +1,10 @@
+import { retriveDetails } from "../storage/details";
import { ApiGetService, ApiPostService } from "./api-services";
let categories = [];
let subcategories = [];
let home = [];
+let product=[];
// Gets all the (get) requests
async function getApi() {
@@ -10,6 +12,10 @@ async function getApi() {
getHome();
}
+async function postApi(value) {
+ postProduct(value);
+}
+
async function getCategory() {
categories = await ApiGetService(process.env.REACT_APP_CATEGORY_GET_URL);
subcategories=await ApiGetService(process.env.REACT_APP_SUBCATEGORY_GET_URL);
@@ -21,39 +27,44 @@ async function getHome() {
// Handles post requests
-// async function postApi(value) {
-// let element;
-// if (value === "subcategories"){
-// console.log("POST")
-// for (let index = 0; index < categories.length; index++) {
-// element = categories[index];
-// let result = await ApiPostService(
-// process.env.REACT_APP_SUBCATEGORY_POST_URL,
-// {category : element.name}
-// );
-// result.data.forEach(item => {
-// console.log("item",item);
-// subcategories.push(item);
-// });
-// }
-// }
-// }
+async function postProduct(value,opt) {
+ let element=[];
+ let custId = retriveDetails()
+ console.log("fvd",custId)
+ if (value === "product"){
+ if(custId === null){
+ let productDetails = await ApiPostService(process.env.REACT_APP_PRODUCT_POST_GENERAL_URL,{'category':opt,'page':1})
+ product = productDetails.data
+ return product
+ // console.log("pro",product)
+ }
+ else{
+ let productDetails = await ApiPostService(process.env.REACT_APP_PRODUCT_POST_URL,{'customer':custId.id,'category':opt,'page':1})
+ product = productDetails.data
+ console.log("pro",product)
+ return product
+ }
+ }
+ return [];
+ }
// Fetches data as per need
-async function fetchResult(item) {
+async function fetchResult(item,opt=null) {
switch (item) {
case "categories":
if (categories.length === 0) await getCategory();
return categories;
case "subcategories":
- if (subcategories.length === 0) await getApi();
+ if (subcategories.length === 0) await getCategory();
return subcategories;
case "home":
- if (home.length === 0) await getHome("home");
+ if (home.length === 0) await getHome();
return home;
-
+
+ case "product":
+ return await postProduct("product",opt);
// case "profile":
// return profile;
@@ -62,4 +73,4 @@ async function fetchResult(item) {
}
}
-export { getApi, fetchResult };
\ No newline at end of file
+export { getApi, postApi, fetchResult };
\ No newline at end of file
diff --git a/src/styles/pages/category-styles.js b/src/styles/pages/category-styles.js
index 94dd17c..f411bd1 100644
--- a/src/styles/pages/category-styles.js
+++ b/src/styles/pages/category-styles.js
@@ -3,9 +3,8 @@ import { Lora, Slab } from "../themes/font-styles";
import {Carousel} from "react-bootstrap";
export const Productpage = styled.div`
- margin-top: 7em;
@media(min-width:0px) and (max-width:568px){
- margin-top: 5em;
+ margin-top: 3em;
}
`;
@@ -67,12 +66,20 @@ export const Links = styled.a`
font-weight: 500;
display: block;
width: 100%;
+ cursor: pointer;
border-left: 3px solid transparent;
:hover{
color: purple!important;
}
`;
+export const ActiveClass = styled.li`
+ &.active>a{
+ color: purple !important;
+ font-weight: 600;
+ }
+`;
+
export const TogglePrice = styled.button`
border: none;
font-size: 20px;
@@ -307,6 +314,11 @@ export const CardProductName = styled.a`
font-size :20px;
display:block;
text-transform:uppercase;
+ display: -webkit-box;
+ max-width: 200px;
+ -webkit-line-clamp: 2;
+ -webkit-box-orient: vertical;
+ overflow: hidden;
transition:0.3s;
margin-bottom :2px;
cursor: pointer;
@@ -324,6 +336,11 @@ export const CardProductDescription = styled.p`
line-height :22px;
margin-bottom:18px;
color:gray;
+ display: -webkit-box;
+ max-width: 200px;
+ -webkit-line-clamp: 3;
+ -webkit-box-orient: vertical;
+ overflow: hidden;
`;
export const CardProductBottomDetails = styled.div`