From 2e77ce572346bb8101cb4d78940797ee2ccf7656 Mon Sep 17 00:00:00 2001 From: aravinthraj98 Date: Thu, 8 Jul 2021 00:01:03 +0530 Subject: [PATCH 01/10] Fixed bug --- .../ViewScreenComponents/ProductView.js | 171 +++++++++--------- .../ViewScreenComponents/SingleProductView.js | 137 +++++++------- .../ViewScreenComponents/SubCategoryView.js | 27 ++- 3 files changed, 170 insertions(+), 165 deletions(-) diff --git a/src/components/ViewScreenComponents/ProductView.js b/src/components/ViewScreenComponents/ProductView.js index 8f0b16a..1f1dd3a 100644 --- a/src/components/ViewScreenComponents/ProductView.js +++ b/src/components/ViewScreenComponents/ProductView.js @@ -1,16 +1,16 @@ -import { useState } from "react"; -import { useEffect } from "react"; -import { AiFillDelete, AiFillInfoCircle } from "react-icons/ai"; +import { useState } from 'react'; +import { useEffect } from 'react'; +import { AiFillDelete, AiFillInfoCircle } from 'react-icons/ai'; -import { Link } from "react-router-dom"; +import { Link } from 'react-router-dom'; import { CategoryData, getAllSubCategory, getSubCategoryDetail, OfferData, -} from "../../services/AdminServices"; -import { ApiPostService } from "../../services/ApiServices"; -import { ColorOne, ColorTwo } from "../../styles/color"; +} from '../../services/AdminServices'; +import { ApiPostService } from '../../services/ApiServices'; +import { ColorOne, ColorTwo } from '../../styles/color'; import { Card, CenterAlign, @@ -20,10 +20,10 @@ import { Title, // Input, // Submitbutton, -} from "../../styles/styled"; -import Nodata from "../Nodata"; -import SingleProductView from "./SingleProductView"; -import Loader from "../Loader"; +} from '../../styles/styled'; +import Nodata from '../Nodata'; +import SingleProductView from './SingleProductView'; +import Loader from '../Loader'; function ProductView() { let initialLoader = { product: false, page: false }; @@ -32,9 +32,9 @@ function ProductView() { const [subCategoryDetail, setSubCategoryDetail] = useState([]); const [loader, setLoader] = useState(initialLoader); const [offerList, setOfferList] = useState([]); - const [offerId, Addtooffer] = useState(""); - const [chooseOffer, setChooseOffer] = useState(""); - const [isListProduct, setIsListProduct] = useState(""); + const [offerId, Addtooffer] = useState(''); + const [chooseOffer, setChooseOffer] = useState(''); + const [isListProduct, setIsListProduct] = useState(''); useEffect(() => { getData(); @@ -73,7 +73,7 @@ function ProductView() { getDetail(subCat[0].name); } async function handleRadio(e) { - if (e.target.name === "chooseOffer") { + if (e.target.name === 'chooseOffer') { setChooseOffer(e.target.value); return; } @@ -84,34 +84,34 @@ function ProductView() { subCategory: cat, page: 1, }; - let res = await ApiPostService("Products", data); + let res = await ApiPostService('Products', data); if (res && res.length > 0) { console.log(res); setProductDetail(res); } else { - alert("no products found"); + alert('no products found'); } } async function handleAddOffer(e) { Addtooffer(e.target.value); - if (chooseOffer === "") { - alert("no offer chosen"); - Addtooffer(""); + if (chooseOffer === '') { + alert('no offer chosen'); + Addtooffer(''); return; } let data = { product: e.target.value, offerName: chooseOffer, }; - let res = await ApiPostService("offerProduct", data); + let res = await ApiPostService('offerProduct', data); if (res !== true) { - alert("some error"); + alert('some error'); } if (res === true) { - alert("success"); + alert('success'); } - Addtooffer(""); + Addtooffer(''); } // function handleImageClick(index) { // console.log(index); @@ -125,21 +125,21 @@ function ProductView() { ) : ( 500 ? "100%" : "auto"} + className='col-md-2 col-sm-12 fixed-top sticky-top p-2' + id='productSide-Nav' + height={window.innerWidth > 500 ? '100%' : 'auto'} style={{ backgroundColor: ColorTwo }} > - + BACK TO HOME - + {subCategoryDetail.map((value, index) => (
0 && productDetail[0].subCategory === value.name } />
))} - - Add to offer + + Add to offer
{offerList.map((value, index) => ( - + @@ -194,22 +194,22 @@ function ProductView() { {loader.product ? ( - + ) : ( <> {productDetail.length === 0 && } {isListProduct.length > 0 && ( -
+
@@ -218,38 +218,38 @@ function ProductView() { {productDetail.map((value, index) => ( - +
handleImageClick(index)} style={{ - minHeight: "50px", - backgroundColor: "white", - maxHeight: "50px", + minHeight: '50px', + backgroundColor: 'white', + maxHeight: '50px', }} >

{value.name} @@ -257,59 +257,62 @@ function ProductView() {

- +
setIsListProduct(value.id)} - style={{ marginTop: "2%", maxHeight: "130px" }} + width='90%' + height='150px' + onClick={() => { + if (isListProduct.length > 0) + setIsListProduct(value.id); + }} + style={{ marginTop: '2%', maxHeight: '130px' }} // alternate="no image" />

- + Edit
diff --git a/src/components/ViewScreenComponents/SingleProductView.js b/src/components/ViewScreenComponents/SingleProductView.js index ec9ce66..12936b6 100644 --- a/src/components/ViewScreenComponents/SingleProductView.js +++ b/src/components/ViewScreenComponents/SingleProductView.js @@ -1,5 +1,5 @@ -import { useState, useEffect } from "react"; -import { ApiGetService } from "../../services/ApiServices"; +import { useState, useEffect } from 'react'; +import { ApiGetService } from '../../services/ApiServices'; import { ContainerColumn, ContainerRow, @@ -11,9 +11,9 @@ import { LightColor, ErrorText, SuccessText, -} from "../../styles/styled"; -import { ColorOne } from "../../styles/color"; -import Loader from "../Loader"; +} from '../../styles/styled'; +import { ColorOne } from '../../styles/color'; +import Loader from '../Loader'; const SingleProductView = ({ id }) => { const [product, setProduct] = useState(null); @@ -23,36 +23,43 @@ const SingleProductView = ({ id }) => { const [currentType, setCurrentType] = useState(null); useEffect(() => { - if (id !== null || id !== undefined) getProduct(id); - }, []); + if (id !== null || id !== undefined) { + setProduct(null); + setImages([]); + setVarient([]); + setCurrentVarient(null); + setCurrentType(null); + getProduct(id); + } + }, [id]); // Need to handle corner cases async function getProduct(id) { - let res = await ApiGetService("getSingleProduct", id); + let res = await ApiGetService('getSingleProduct', id); console.log(res); setProduct(res); - setImages(res.varients[0].images); - setVarient(res.varients); let tmp = Object.keys(res.type); console.log(tmp); - if (tmp.length === 0 || tmp[0] === "null") { + if (tmp.length === 0 || tmp[0] === 'null') { if (res.varients.length === 0) { - setVarient(res); //current varient to be checked - } - setCurrentVarient(res.varients[0]); + setVarient([res]); //current varient to be checked + setCurrentVarient(res); + } else setCurrentVarient(res.varients[0]); return; } + setVarient(res.varients); tmp = tmp[0]; - let value = res.type[tmp].length > 0 ? res.type[tmp][0] : ""; + let value = res.type[tmp].length > 0 ? res.type[tmp][0] : ''; setCurrentType({ key: tmp, value: value }); for (let i = 0; i < res.varients.length; i++) { if ( - res.varients[i]["varientType"][0].value === tmp && + res.varients[i]['varientType'][0].value === tmp && (res.typeKey.length === 1 || - res.varients[i]["varientType"][1].value === res.type[tmp][0]) + res.varients[i]['varientType'][1].value === res.type[tmp][0]) ) { setCurrentVarient(res.varients[i]); //images to be set here + setImages(res.varients[i].images); } } } @@ -60,15 +67,15 @@ const SingleProductView = ({ id }) => { window.scrollTo({ top: 10, - behavior: "smooth", + behavior: 'smooth', }); let key; let value; console.log(e.target.value); console.log(product.type[e.target.value]); - if (e.target.id === "0") { + if (e.target.id === '0') { key = e.target.value; - value = product.type[e.target.value][0] || ""; + value = product.type[e.target.value][0] || ''; setCurrentType({ key: key, value: value, @@ -84,9 +91,9 @@ const SingleProductView = ({ id }) => { } for (let i = 0; i < varient.length; i++) { if ( - varient[i]["varientType"][0].value === key && + varient[i]['varientType'][0].value === key && (product.typeKey.length === 1 || - varient[i]["varientType"][1].value === value) + varient[i]['varientType'][1].value === value) ) { setImages(varient[i].images); setCurrentVarient(varient[i]); @@ -96,76 +103,76 @@ const SingleProductView = ({ id }) => { } return ( - + {product === null || currentVarient === null ? ( ) : ( - - + +
- {" "} - - {currentType && currentType.key + " " + currentType.value} + {' '} + + {currentType && currentType.key + ' ' + currentType.value} -
+
{images.map((image, index) => (
- ... + ...
))}
- Previous + Previous - Next + Next
- - + <Card nohover style={{ paddingBottom: '10px' }}> + <Title style={{ backgroundColor: ColorOne, color: 'white' }}> {product.name} - {" "} + {' '}
originalPrice: @@ -236,8 +243,8 @@ const SingleProductView = ({ id }) => {
VARIENTS @@ -245,12 +252,12 @@ const SingleProductView = ({ id }) => { Object.keys(product.type).map((value, index) => { if ( product.typeKey.length > 0 && - product.typeKey[0].toLowerCase() === "colour" + product.typeKey[0].toLowerCase() === 'colour' ) return ( ); @@ -282,7 +289,7 @@ const SingleProductView = ({ id }) => { //

{typeValue}

{ return ( - {value === "null" ? "No varients" : value} + {value === 'null' ? 'No varients' : value} {
- + diff --git a/src/components/ViewScreenComponents/SubCategoryView.js b/src/components/ViewScreenComponents/SubCategoryView.js index 3e3f193..37f6338 100644 --- a/src/components/ViewScreenComponents/SubCategoryView.js +++ b/src/components/ViewScreenComponents/SubCategoryView.js @@ -40,10 +40,8 @@ function SubCatagoryView({ categoryName, handleSubPage }) { setLoader(true); setCategory(categoryName); getSubCategory(categoryName); - - }, [categoryName]); - + const updateFilteredData = (filterData) => { if (filterData.length === 0) { setFilteredData(subCategoryDetail); @@ -54,30 +52,27 @@ function SubCatagoryView({ categoryName, handleSubPage }) { setFilteredData(filterData); setErrorMsg(''); }; - const handleDelete=async(e)=>{ - if(!window.confirm(`Are you sure you want to delete ${e.target.value}`)) return; + const handleDelete = async (e) => { + if (!window.confirm(`Are you sure you want to delete ${e.target.value}`)) + return; setLoader(true); - let res = await ApiDeleteService("subCategory",e.target.value); - if(res===true){ + let res = await ApiDeleteService('subCategory', e.target.value); + if (res === true) { await getAllSubCategory(category); getSubCategory(category); - } - else{ - alert("some error occured"); - + } else { + alert('some error occured'); } setLoader(false); - - - } + }; const getSubCategory = async (name) => { setLoader(true); - let subCat = getSubCategoryDetail(name); // available already + let subCat = await getSubCategoryDetail(name); // available already if (subCat === null || subCat === undefined) { await getAllSubCategory(name); // fetch from api - subCat = getSubCategoryDetail(name); + subCat = getSubCategoryDetail(name);//need to check this again } setSubCategoryDetail(subCat); From 1ad65d0415ac50b913b12ed462c7b3d5c29b30ba Mon Sep 17 00:00:00 2001 From: aravinthraj98 Date: Fri, 9 Jul 2021 00:28:03 +0530 Subject: [PATCH 02/10] edited Varient --- .../ProductEditComponents/ProductDetail.js | 281 ++++++++++---- .../ProductEditComponents/VarientDetail.js | 355 ++++++++++-------- .../ViewScreenComponents/ProductView.js | 5 +- src/screens/ProductEditScreen.js | 11 +- src/services/ApiServices.js | 26 +- 5 files changed, 435 insertions(+), 243 deletions(-) diff --git a/src/components/ProductEditComponents/ProductDetail.js b/src/components/ProductEditComponents/ProductDetail.js index a4755cd..e276219 100644 --- a/src/components/ProductEditComponents/ProductDetail.js +++ b/src/components/ProductEditComponents/ProductDetail.js @@ -1,32 +1,47 @@ import { useEffect } from 'react'; import { useState } from 'react'; -import { CategoryData, SupplierData } from '../../services/AdminServices'; +import { + CategoryData, + getAllCategory, + getSubCategoryDetail, + SupplierData, +} from '../../services/AdminServices'; +import { ApiGetService } from '../../services/ApiServices'; import { Card, CenterAlign, - ContainerColumn, ContainerRow, Input, - Submitbutton, } from '../../styles/styled'; -function ProductDetail({ data }) { +function ProductDetail({ res }) { const [detail, setDetail] = useState(null); const [supplierData, setSupplierData] = useState([]); const [catagoryData, setCatagoryData] = useState([]); + const [subCategoryDetail, setSubCategoryDetail] = useState([]); useEffect(() => { - setDetail(data); - let supplier = SupplierData(); + if (res !== null) getProductDetail(res); + }, [res]); + async function getProductDetail(res) { + console.log(res); + let category = await CategoryData(); + setCatagoryData(category); + let supplier = await SupplierData(); setSupplierData(supplier); + let subCategory = await getSubCategoryDetail(res.category); + setSubCategoryDetail(subCategory); + setDetail(res); + console.log('fetxhed'); + } - let catagory = CategoryData(); - console.log(catagory); - setCatagoryData(catagory); - }, []); - function handleChange(e) { + async function handleChange(e) { setDetail({ ...detail, [e.target.name]: e.target.value }); + if (e.target.name === 'category') { + let subCategory = await getSubCategoryDetail(e.target.value); + setSubCategoryDetail(subCategory); + } } function handleSubmit() { console.log(detail); @@ -35,71 +50,185 @@ function ProductDetail({ data }) { return ( <> - - - - product Name - - - - Description -