From d3f689bd3c5b223c92b11b56a439a536cda10139 Mon Sep 17 00:00:00 2001 From: KarimAldeen Date: Sat, 30 Mar 2024 12:56:10 +0300 Subject: [PATCH] #53 --- .../Products/View/Addfn/AddNewVariation.ts | 43 ++++++++++--------- src/Pages/Products/View/EditPage.tsx | 36 +++++++++------- .../View/FormikTab/Field/Atteibute.tsx | 20 +++++---- src/Styles/Layout/Layout.scss | 9 ++++ 4 files changed, 62 insertions(+), 46 deletions(-) diff --git a/src/Pages/Products/View/Addfn/AddNewVariation.ts b/src/Pages/Products/View/Addfn/AddNewVariation.ts index 4c7a6df..fcb73cb 100644 --- a/src/Pages/Products/View/Addfn/AddNewVariation.ts +++ b/src/Pages/Products/View/Addfn/AddNewVariation.ts @@ -25,30 +25,30 @@ export function AddNewVariation(Varibletaps: any[], data: any, AddVariation: any // [StringimagesArray] // ]; + const filteredAttributes = varible.attribute?.filter(Boolean); // Filter out undefined values - - const mappedAttributes = varible.attribute?.map((item: any) => { - return item?.map((subitem: any) => ({ - attribute_value_id: subitem?.value, - attribute_id: subitem?.id - })); + const mappedAttributes = filteredAttributes?.map((item: any) => { + return { + attribute_value_id: item?.value, + attribute_id: item?.id + } }); console.log(mappedAttributes, "mappedAttributes"); // Flatten the array of arrays - const flattenedAttributes = mappedAttributes?.filter(Boolean)?.flat(); + // const flattenedAttributes = mappedAttributes?.filter(Boolean)?.flat(); - const arrayOfObjects = flattenedAttributes?.map((subArray: any, index: any) => { - console.log(subArray, "subArray"); - console.log(index, "index"); + // const arrayOfObjects = flattenedAttributes?.map((subArray: any, index: any) => { + // console.log(subArray, "subArray"); + // console.log(index, "index"); - return { - ...subArray, - }; - }); + // return { + // ...subArray, + // }; + // }); - console.log(arrayOfObjects, "arrayOfObjects"); + // console.log(arrayOfObjects, "arrayOfObjects"); const Newproduct = { @@ -63,10 +63,6 @@ export function AddNewVariation(Varibletaps: any[], data: any, AddVariation: any de: varible?.description_de }, // quantity: varible?.quantity, - ...images, - ...main_photo, - // ...copied_assets, - info: jsonString, price: varible?.price, // product_attributes: varible?.attribute?.map((item: any, index: any) => { @@ -74,8 +70,13 @@ export function AddNewVariation(Varibletaps: any[], data: any, AddVariation: any // return { attribute_value_id: subitem?.value, attribute_id: subitem?.id } // }) // }), - product_attributes:arrayOfObjects, - base_product_id: baseProductId + product_attributes:mappedAttributes, + base_product_id: baseProductId, + ...images, + ...main_photo, + // ...copied_assets, + + }; console.log(Newproduct); AddVariation(Newproduct); diff --git a/src/Pages/Products/View/EditPage.tsx b/src/Pages/Products/View/EditPage.tsx index 9fd4117..9dd46de 100644 --- a/src/Pages/Products/View/EditPage.tsx +++ b/src/Pages/Products/View/EditPage.tsx @@ -252,26 +252,30 @@ const ViewProduct = () => { - const mappedAttributes = varible.attribute?.map((item: any) => { - return item?.map((subitem: any) => ({ - attribute_value_id: subitem?.value, - attribute_id: subitem?.id - })); -}); + + const filteredAttributes = varible.attribute?.filter(Boolean); // Filter out undefined values + console.log(filteredAttributes,"filteredAttributes"); + + const mappedAttributes = filteredAttributes?.map((item: any) => { + return { + attribute_value_id: item?.value, + attribute_id: item?.id + } + }); console.log(mappedAttributes, "mappedAttributes"); -// Flatten the array of arrays -const flattenedAttributes = mappedAttributes?.filter(Boolean)?.flat(); +// // Flatten the array of arrays +// const flattenedAttributes = mappedAttributes?.filter(Boolean)?.flat(); -const arrayOfObjects = flattenedAttributes?.map((subArray: any, index: any) => { - console.log(subArray, "subArray"); - console.log(index, "index"); +// const arrayOfObjects = flattenedAttributes?.map((subArray: any, index: any) => { +// console.log(subArray, "subArray"); +// console.log(index, "index"); - return { - ...subArray, - }; -}); +// return { +// ...subArray, +// }; +// }); @@ -291,6 +295,7 @@ const arrayOfObjects = flattenedAttributes?.map((subArray: any, index: any) => { info: jsonString, price: varible?.price, base_product_id: id, + product_attributes: mappedAttributes, ...images, ...main_photo, @@ -299,7 +304,6 @@ const arrayOfObjects = flattenedAttributes?.map((subArray: any, index: any) => { - product_attributes: arrayOfObjects, } diff --git a/src/Pages/Products/View/FormikTab/Field/Atteibute.tsx b/src/Pages/Products/View/FormikTab/Field/Atteibute.tsx index 5d085fe..57483f6 100644 --- a/src/Pages/Products/View/FormikTab/Field/Atteibute.tsx +++ b/src/Pages/Products/View/FormikTab/Field/Atteibute.tsx @@ -12,13 +12,15 @@ const Attribute = ({ tabKey }: any) => { - const handleAttributeChange = (value: any, option: any) => { - // console.log(option[0],"option"); - - setFieldValue(`variable[${tabKey}].attribute[${option[0].id}]`, option); - + const handleAttributeChange = ( value: any, option: any) => { + if (option) { + console.log(option, "option"); + setFieldValue(`variable[${tabKey}].attribute[${option.id}]`, option); + } else { + console.error("Option is undefined"); + } }; - + return ( attributeData?.data?.map((item: any) => { @@ -33,7 +35,7 @@ const Attribute = ({ tabKey }: any) => { label, value: value.attribute_id, // Change value to attribute_id id: value.id, // Include id in the option - })); + })) as any; if (options.length === 0) { return <>; // Don't render anything if options are empty @@ -54,9 +56,9 @@ const Attribute = ({ tabKey }: any) => { className={`w-100`} - defaultValue={values?.variable?.[tabKey]?.attribute?.[options?.[0]?.id]} + defaultValue={values?.variable?.[tabKey]?.attribute?.[options[0]?.id] ?? ""} allowClear - mode={"multiple" } + // mode={"multiple" } onChange={handleAttributeChange} diff --git a/src/Styles/Layout/Layout.scss b/src/Styles/Layout/Layout.scss index c7f30d2..3db18bd 100644 --- a/src/Styles/Layout/Layout.scss +++ b/src/Styles/Layout/Layout.scss @@ -500,6 +500,8 @@ padding: 10px 40px; + + @media screen and (max-width: 600px) { @@ -514,7 +516,14 @@ padding: 10px 40px; margin-left: 60px; transform: translateY(-30px); } + @media screen and (max-width: 1000px) { +.AddNewTabText{ + transform: translateY(-50px); + + + } +} /* Dynamic form complex */ #dynamic_form_complex{