diff --git a/src/Pages/CounterCategoryMapping/CounterCategoryMappingForm.jsx b/src/Pages/CounterCategoryMapping/CounterCategoryMappingForm.jsx index 779b371..da486e4 100644 --- a/src/Pages/CounterCategoryMapping/CounterCategoryMappingForm.jsx +++ b/src/Pages/CounterCategoryMapping/CounterCategoryMappingForm.jsx @@ -1,13 +1,10 @@ import { useRef, useState, useCallback, useEffect } from 'react'; import { useDispatch } from 'react-redux'; import { Messages } from '../../Components/Notifications/Messages'; -import { Form, Table, Space } from 'antd'; +import { Form, Table, Space, Input } from 'antd'; import FormHeader from '../PageComponents/FormHeader.jsx'; -import { InputField } from '../../Components/Forms/InputField.jsx'; -import { DropDowns } from '../../Components/Forms/DropDown.jsx'; import Buttons from '../../Components/Forms/Buttons.jsx'; import { - CloseCircleOutlined, ArrowRightOutlined, DeleteFilled, EditFilled, @@ -31,14 +28,15 @@ import { import { useAuth } from '../../AuthContext.jsx'; import '../../Styles/CounterCategoryMappingForm/CounterCategoryMapping.scss'; const subDirectory = import.meta.env.BASE_URL; +import FolderExploreCompoent from "./FolderExploreCompoent.jsx" const CounterCategoryMappingForm = () => { const { SadminuserAccess } = useAuth(); let SAAccessCommonMaster = SadminuserAccess?.find( (e) => e?.MenuName === 'Counter Category Mapping' ); - const formRef = useRef(null); + const memoizedData = useRef({}); const dispatch = useDispatch(); const CompId = getSession('CompId'); const BranchId = getSession('BranchId'); @@ -48,12 +46,6 @@ const CounterCategoryMappingForm = () => { const [messageType, setMessageType] = useState(null); const [messageData, setMessageData] = useState(null); const [CounterName, setCounterName] = useState(null); - const [Categorydata, setCategorydata] = useState([]); - const [SubCategorydata, setSubCategorydata] = useState([]); - const [SelectedCategory, setSelectedCategory] = useState(null); - const [SelectedSubCategory, setSelectedSubCategory] = useState(null); - const [CounterSelCategory, setCounterSelCategory] = useState([]); - const [CounterSelSubCategory, setCounterSelSubCategory] = useState([]); const [SelectedCatList, setSelectedCatList] = useState([]); const [CategoryDataModal, setCategoryDataModal] = useState(false); const [Editstate, setEditState] = useState(false); @@ -61,7 +53,10 @@ const CounterCategoryMappingForm = () => { const [CounterDetail, setCounterDetail] = useState([]); const [empData, setEmpData] = useState({}); const [addnewAccess, setaddnewAccess] = useState(true); + const [openModel, setOpenModel] = useState(false); + const [expandedRows, setExpandedRows] = useState([]); + console.log(CounterName, 'CounterName') const items = [ { name: 'Home', @@ -74,16 +69,21 @@ const CounterCategoryMappingForm = () => { }, ]; + useEffect(() => { dispatch(changeBreadCrumb({ items: items })); - }, []); - useEffect(() => { getCategorydetails(); getCounterTokenDatas(); - // if (UserType === "Employee") { - // fetchApi() - // } }, []); + useEffect(() => { + if (EditData) { + formRef?.current?.setFieldsValue({ + CounterName: EditData?.CounterName, + }); + } + }, [Editstate]); + + useEffect(() => { if (UserType === 'Employee') { fetchApi(); @@ -111,19 +111,121 @@ const CounterCategoryMappingForm = () => { let Category = await dispatch(getCategoryData(data)).unwrap(); if (Category?.data?.statusCode === 1) { if (Category?.data?.data?.length > 0) { - setCategorydata(Category?.data?.data); - } else { - setCategorydata([]); + const categoryList = Category.data.data; + const filteredCategories = categoryList?.map(e => ({ + ProdCat: e.ProdCat, + ProdCatName: e?.ProdCatName, + isCatExpend: false, + ProdSubCat: [] + })); + + setExpandedRows(filteredCategories); + } + else { + setExpandedRows([]) + } } else { - setCategorydata([]); + setExpandedRows([]) + } }; + + const handleFinish = async () => { + if (Editstate) { + let putData = { + AppId: AppId, + BranchId: BranchId, + CompId: CompId, + "CounterId": EditData?.CounterId, + "CounterName": CounterName, + "ActiveStatus": "A", + + CategoryDetails: (expandedRows || []) + .filter(cat => cat?.isCatExpend || cat?.CounterCatId) + .map(cat => { + + const selectedSubs = (cat?.ProdSubCat || []) + .filter(sub => sub?.isSubcatexpend || sub?.CounterSubCatId) + .map(sub => ({ + ProdSubCat: sub?.ProdSubCat, + CounterCatId: sub?.CounterCatId || null, + CounterSubCatId: sub?.CounterSubCatId || null, + ActiveStatus: sub?.isSubcatexpend ? "A" : "D" + })); + + return { + CounterId: EditData?.CounterId || null, + CounterCatId: cat?.CounterCatId, + ProdCat: cat?.ProdCat, + ActiveStatus: cat?.isCatExpend ? "A" : "D", + SubCategoryDetails: selectedSubs + }; + }), + "UpdatedBy": UserId + } + let PostCounterToken = await dispatch( + putCounterCategoryMap(putData) + ).unwrap(); + if (PostCounterToken?.data?.statusCode === 1) { + setEditData([]) + setEditState(false) + setMessageType('success'); + setMessageData(PostCounterToken?.data?.response); + setOpenModel(false) + ClearDatas() + formRef?.current?.resetFields(); + } else { + setMessageType('error'); + setMessageData(PostCounterToken?.data?.response); + } + } + else { + let postdata = { + AppId: AppId, + BranchId: BranchId, + CompId: CompId, + CounterName: "values?.CounterName", + ActiveStatus: 'A', + CategoryDetails: (expandedRows || []) + .filter(cat => cat?.isCatExpend) + .map(cat => { + + const selectedSubs = (cat?.ProdSubCat || []) + .filter(sub => sub?.isSubcatexpend) + .map(sub => ({ + ProdSubCat: sub?.ProdSubCat, + })); + + return { + ProdCat: cat?.ProdCat, + SubCategoryDetails: selectedSubs + }; + }) + , + CreatedBy: UserId, + }; + let PostCounterToken = await dispatch( + postCounterCategoryMap(postdata) + ).unwrap(); + if (PostCounterToken?.data?.statusCode === 1) { + setMessageType('success'); + setMessageData(PostCounterToken?.data?.response); + setOpenModel(false) + formRef?.current?.resetFields(); + } else { + setMessageType('error'); + setMessageData(PostCounterToken?.data?.response); + } + } + + } const getCounterTokenDatas = async () => { let data = { AppId: AppId, CompId: CompId, BranchId: BranchId, + UserId: UserId }; let Counterdatas = await dispatch(getCounterTokenData(data)).unwrap(); if (Counterdatas?.data?.statusCode === 1) { @@ -149,8 +251,7 @@ const CounterCategoryMappingForm = () => { ); setEmpData(datas?.[0]); }; - - const getSubCategorydetails = async (ProdCat) => { + const getSubCategorydetailsFromChild = async (ProdCat) => { let data = { AppId: AppId, CompId: CompId, @@ -163,283 +264,20 @@ const CounterCategoryMappingForm = () => { (item) => item.ProdSubCat !== null ); if (filterSubcategory?.length > 0) { - setSubCategorydata(filterSubcategory); + return filterSubcategory + } else { - setSubCategorydata([]); + return [] } - return filterSubcategory; + } else { - setSubCategorydata([]); + return [] } }; const onComplete = useCallback(() => { setMessageData(null); setMessageType(null); }, []); - const handleCategorydataChange = async (selectedcat) => { - setSubCategorydata([]); // Clear existing subcategories - setSelectedSubCategory(null); - let subcatdata = await getSubCategorydetails(selectedcat); // Fetch subcategories for the selected category - setSelectedCategory(selectedcat); - - let allSubcategoriesSelected = - subcatdata?.length > 0 - ? subcatdata.every((subcategory) => { - // Check in CounterSelCategory if subcategory is mapped - let foundInCounterSelCategory = CounterSelCategory?.some( - (item) => - item.ProdCat === selectedcat && - item.SubCategoryDetails?.some( - (sub) => - sub.ProdSubCat === subcategory.ProdSubCat && - sub.ActiveStatus === 'A' // Check if ProdSubCat matches without ActiveStatus - ) - ); - - // Check in CounterDetail if subcategory is mapped - let foundInCounterDetail = - CounterDetail.length > 0 && - CounterDetail?.some((counter) => - counter.CategoryDetails?.some( - (category) => - category.ProdCat === selectedcat && - category.SubCategoryDetails?.some( - (sub) => - sub.ProdSubCat === subcategory.ProdSubCat && - sub.ActiveStatus === 'A' // Check if ProdSubCat matches without ActiveStatus - ) - ) - ); - - return foundInCounterSelCategory || foundInCounterDetail; - }) - : false; - - let alreadyExists = - CounterSelCategory?.some( - (item) => - item.ProdCat === selectedcat && - item.ActiveStatus === 'A' && - item.SubCategoryDetails?.length === 0 - ) || - CounterDetail?.some((counter) => - counter.CategoryDetails?.some( - (category) => - category.ProdCat === selectedcat && - // && category.ActiveStatus === 'A' - category.SubCategoryDetails?.length === 0 - ) - ); - - // Check if the category is marked as 'D' (removed) - let isRemoved = CounterSelCategory?.some( - (item) => item.ProdCat === selectedcat && item.ActiveStatus === 'D' - ); - - // Proceed with logic based on checks - if (!allSubcategoriesSelected) { - if (!alreadyExists) { - let isAlreadySelected = CounterSelCategory?.some( - (item) => item.ProdCat === selectedcat - ); - - if (!isAlreadySelected) { - let selected = Categorydata?.find( - (item) => item.ProdCat === selectedcat - ); - setCounterSelCategory((prev) => [ - ...prev, - { - ProdCat: selected?.ProdCat, - ProdCatName: selected?.ProdCatName, - ActiveStatus: 'A', - SubCategoryDetails: [], - }, - ]); - } else { - setCounterSelCategory((prevCategories) => - prevCategories.map( - (item) => - item.ProdCat === selectedcat - ? { ...item, ActiveStatus: 'A' } // Update ActiveStatus to 'A' - : item // Keep the item unchanged - ) - ); - } - } else { - setMessageType('error'); - setMessageData('This category is already mapped'); - formRef.current.resetFields(['Category']); - setSelectedCategory(null); - setSubCategorydata([]); - setSelectedSubCategory(null); - } - } else { - setMessageType('error'); - setMessageData('This category is already mapped'); - formRef.current.resetFields(['Category']); - setSelectedCategory(null); - setSubCategorydata([]); - setSelectedSubCategory(null); - } - - formRef.current.resetFields(['Category']); - if (subcatdata?.length === 0) { - setSelectedCategory(null); - } - }; - - const handleSubCategorydataChange = async (selectedSubcat) => { - setSelectedSubCategory(selectedSubcat); - const isInCounterSelCategory = CounterSelCategory.some((category) => - category.SubCategoryDetails.some( - (sub) => sub.ProdSubCat === selectedSubcat && sub.ActiveStatus === 'A' - ) - ); - - // Check if subcategory exists in CounterDetail - const isInCounterDetail = CounterDetail.some((counter) => - counter.CategoryDetails.some((category) => - category.SubCategoryDetails.some( - (sub) => sub.ProdSubCat === selectedSubcat - ) - ) - ); - - if (isInCounterSelCategory || isInCounterDetail) { - setMessageType('error'); - setMessageData('This Subcategory is already mapped'); - formRef.current.resetFields(['SubCategory']); - } else { - setCounterSelCategory((prev) => { - let selected = SubCategorydata?.find( - (item) => item.ProdSubCat === selectedSubcat - ); - const existingCategoryIndex = prev.findIndex( - (cat) => cat.ProdCat === selected?.ProdCat - ); - - if (existingCategoryIndex !== -1) { - // If category exists, check for existing subcategory - const existingSubCategoryIndex = prev[ - existingCategoryIndex - ].SubCategoryDetails.findIndex( - (sub) => sub.ProdSubCat === selected?.ProdSubCat - ); - - if (existingSubCategoryIndex !== -1) { - // Subcategory exists, check its ActiveStatus - const existingSubCategory = - prev[existingCategoryIndex].SubCategoryDetails[ - existingSubCategoryIndex - ]; - - if (existingSubCategory.ActiveStatus === 'D') { - // If ActiveStatus is "D", update it to "A" - const updatedCategory = { - ...prev[existingCategoryIndex], - SubCategoryDetails: prev[ - existingCategoryIndex - ].SubCategoryDetails.map((sub, index) => - index === existingSubCategoryIndex - ? { ...sub, ActiveStatus: 'A' } - : sub - ), - }; - return [ - ...prev.slice(0, existingCategoryIndex), - updatedCategory, - ...prev.slice(existingCategoryIndex + 1), - ]; - } else { - return prev; - } - } else { - // Subcategory does not exist, add it - const updatedCategory = { - ...prev[existingCategoryIndex], - SubCategoryDetails: [ - ...prev[existingCategoryIndex].SubCategoryDetails, - { - ProdSubCat: selected?.ProdSubCat, - ProdSubCatName: selected?.ProdSubCatName, - ProdCat: selected?.ProdCat, - ActiveStatus: 'A', - }, - ], - }; - return [ - ...prev.slice(0, existingCategoryIndex), - updatedCategory, - ...prev.slice(existingCategoryIndex + 1), - ]; - } - } else { - // If category doesn't exist, add a new category with subcategory - return [ - ...prev, - { - ProdCat: selected?.ProdCat, - ProdCatName: selected?.ProdCatName, - ActiveStatus: 'A', - SubCategoryDetails: [ - { - ProdSubCat: selected?.ProdSubCat, - ProdSubCatName: selected?.ProdSubCatName, - ProdCat: selected?.ProdCat, - ActiveStatus: 'A', - }, - ], - }, - ]; - } - }); - } - - setSelectedSubCategory(null); - setSelectedCategory(null); - setSubCategorydata([]); - formRef.current.resetFields(['SubCategory', 'Category']); - }; - const handleRemoveCategory = async (cat) => { - // let remove = CounterSelCategory?.filter(item =>item.ProdCat !== cat.ProdCat) - // setCounterSelCategory(remove) - setCounterSelCategory((prevCategories) => - prevCategories.map( - (item) => - item.ProdCat === cat.ProdCat - ? { ...item, ActiveStatus: 'D', SubCategoryDetails: [] } // Update ActiveStatus to 'D' - : item // Keep the item unchanged - ) - ); - setSelectedSubCategory(null); - setSelectedCategory(null); - setSubCategorydata([]); - formRef.current.resetFields(['SubCategory', 'Category']); - }; - - const handleRemoveSubCategory = async (subcat) => { - setCounterSelCategory((prevCategories) => - prevCategories.map( - (category) => - category.ProdCat === subcat.ProdCat - ? { - ...category, - SubCategoryDetails: category.SubCategoryDetails.map( - (sub) => - sub.ProdSubCat === subcat.ProdSubCat - ? { ...sub, ActiveStatus: 'D' } // Update ActiveStatus to 'D' - : sub // Keep the subcategory unchanged - ), - } - : category // Keep the category unchanged - ) - ); - setSelectedSubCategory(null); - setSelectedCategory(null); - setSubCategorydata([]); - formRef.current.resetFields(['SubCategory', 'Category']); - }; const ViewCategorydetails = async (CategoryList) => { setSelectedCatList(CategoryList); setCategoryDataModal(true); @@ -449,20 +287,61 @@ const CounterCategoryMappingForm = () => { setCategoryDataModal(false); }; const editData = async (record, index) => { + + setCounterName(record?.CounterName) setEditState(true); + setOpenModel(true) setEditData(record); - let subcatdetail = record?.CategoryDetails?.flatMap( - (item) => item?.SubCategoryDetails + + formRef?.current?.setFieldsValue({ + CounterName: record?.CounterName, + }); + + const results = await Promise.all( + record?.CategoryDetails.map(cat => + getSubCategorydetailsFromChild(cat?.ProdCat) + ) ); - formRef.current?.setFieldsValue({ CounterName: record?.CounterName }); - formRef.current.resetFields(['Category']); - formRef.current.resetFields(['SubCategory']); - setCounterName(record?.CounterName); - setCounterSelCategory(record?.CategoryDetails); - // setCounterSelSubCategory(subcatdetail) - setSelectedCategory(null); - setSelectedSubCategory(null); - setSubCategorydata([]); + const subCategoryMap = {}; + record?.CategoryDetails.forEach((cat, i) => { + subCategoryMap[cat?.ProdCat] = results[i] || []; + }); + console.log(subCategoryMap, "subCategoryMap"); + + setExpandedRows(prev => + prev.map(e => { + const catDetail = record?.CategoryDetails?.find( + x => x?.ProdCat === e.ProdCat + ); + + if (!catDetail) return e; + + const subDetailMap = {}; + catDetail?.SubCategoryDetails?.forEach(s => { + subDetailMap[s?.ProdSubCat] = s; + }); + + return { + ...e, + isCatExpend: true, + CounterCatId: catDetail?.CounterCatId, + ActiveStatus: "A", + + // ✅ Attach subcategories + ProdSubCat: (subCategoryMap[e?.ProdCat] || []).map(sub => { + const subDetail = subDetailMap[sub?.ProdSubCat]; + + return { + ...sub, + CounterCatId: subDetail?.CounterCatId, + CounterSubCatId: subDetail?.CounterSubCatId, + isSubcatexpend: !!subDetail // true if exists + }; + }) + }; + }) + ); + }; const statusFormatter = async (record, index) => { let deletedata = { @@ -486,101 +365,12 @@ const CounterCategoryMappingForm = () => { } ClearDatas(); }; - const onFinish = async (values) => { - const subcatalreadyselected = - CounterDetail?.flatMap( - (counter) => - counter.CategoryDetails?.filter( - (category) => - category.ActiveStatus === 'A' && - category.SubCategoryDetails?.length > 0 - ).map((category) => category.ProdCat) // Extract ProdCat IDs - ) || []; - let removewithoutsubcat = CounterSelCategory.filter( - (category) => - !( - subcatalreadyselected.includes(category.ProdCat) && - category.SubCategoryDetails?.length === 0 && - category.ActiveStatus === 'A' - ) - ); - const filtereddeactivecat = removewithoutsubcat.filter( - (item) => !(!item.CounterId && item.ActiveStatus === 'D') - ); - const filtereddeactivesub = filtereddeactivecat - .map((item) => { - return { - ...item, - SubCategoryDetails: item.SubCategoryDetails.filter( - (sub) => sub.ActiveStatus !== 'D' - ), - }; - }) - .filter((item) => item !== null); - // if(CounterSelCategory.some(category => - // ( subcatalreadyselected.includes(category.ProdCat) && category.SubCategoryDetails?.length === 0 && category.ActiveStatus ==="A") - // )){ - // alert("Some Category is already mapped with subcategory so remove that category for mapping") - // } - - if (Editstate) { - let putdata = { - AppId: AppId, - BranchId: BranchId, - CompId: CompId, - CounterName: values?.CounterName, - CounterId: EditData?.CounterId, - ActiveStatus: 'A', - CategoryDetails: filtereddeactivesub, - UpdatedBy: UserId, - }; - - let PutCounterToken = await dispatch( - putCounterCategoryMap(putdata) - ).unwrap(); - if (PutCounterToken?.data?.statusCode === 1) { - setMessageType('success'); - setMessageData(PutCounterToken?.data?.response); - formRef?.current?.resetFields(); - } else { - setMessageType('error'); - setMessageData(PutCounterToken?.data?.response); - } - } else { - let postdata = { - AppId: AppId, - BranchId: BranchId, - CompId: CompId, - CounterName: values?.CounterName, - ActiveStatus: 'A', - CategoryDetails: filtereddeactivesub, - CreatedBy: UserId, - }; - - let PostCounterToken = await dispatch( - postCounterCategoryMap(postdata) - ).unwrap(); - if (PostCounterToken?.data?.statusCode === 1) { - setMessageType('success'); - setMessageData(PostCounterToken?.data?.response); - formRef?.current?.resetFields(); - } else { - setMessageType('error'); - setMessageData(PostCounterToken?.data?.response); - } - } - ClearDatas(); - }; const ClearDatas = async () => { + getCategorydetails(); getCounterTokenDatas(); formRef?.current?.resetFields(); - setSelectedCategory(null); - setSelectedSubCategory(null); - setSubCategorydata([]); setCounterName(null); - setCounterSelCategory([]); - setCounterSelSubCategory([]); setEditData([]); setEditState(false); }; @@ -629,9 +419,9 @@ const CounterCategoryMappingForm = () => { style={{ color: '#1292EE' }} onClick={() => empData?.UpdateAccess === 'Y' || - SAAccessCommonMaster?.UpdateAccess === 'Y' || - UserType == 'Admin' || - UserType == 'Super Admin' + SAAccessCommonMaster?.UpdateAccess === 'Y' || + UserType == 'Admin' || + UserType == 'Super Admin' ? editData(record, index) : '' } @@ -646,9 +436,9 @@ const CounterCategoryMappingForm = () => { }} onClick={() => empData?.DeleteAccess === 'Y' || - SAAccessCommonMaster?.DeleteAccess === 'Y' || - UserType == 'Admin' || - UserType == 'Super Admin' + SAAccessCommonMaster?.DeleteAccess === 'Y' || + UserType == 'Admin' || + UserType == 'Super Admin' ? statusFormatter(record, index) : '' } @@ -663,10 +453,10 @@ const CounterCategoryMappingForm = () => { }} onClick={() => empData?.DeleteAccess === 'Y' || - empData?.DeleteAccess === undefined || - SAAccessCommonMaster?.DeleteAccess === 'Y' || - UserType == 'Admin' || - UserType == 'Super Admin' + empData?.DeleteAccess === undefined || + SAAccessCommonMaster?.DeleteAccess === 'Y' || + UserType == 'Admin' || + UserType == 'Super Admin' ? statusFormatter(record, index) : '' } @@ -674,10 +464,112 @@ const CounterCategoryMappingForm = () => { ), }, ]; + const handleNewMapping = () => { + setOpenModel(true) + setEditState(false) + } + + const handleChangeinput = async ({ type, value, Cat, subcat }) => { + + if (type === "cat") { + + if (value) { + try { + let data; + if (memoizedData.current[Cat]) { + data = memoizedData.current[Cat]; + } else { + data = await getSubCategorydetailsFromChild(Cat); + memoizedData.current[Cat] = data; + } + + setExpandedRows(prev => { + const alreadyExists = prev.find(e => e.ProdCat === Cat); + + if (alreadyExists) { + return prev.map(e => + e.ProdCat === Cat + ? { + ...e, + isCatExpend: true, + ProdSubCat: data.map(sub => ({ + ...sub, + isSubcatexpend: true, + })), + } + : e + ); + } + + return [ + ...prev, + { + ProdCat: Cat, + isCatExpend: true, + ProdSubCat: data.map(sub => ({ + ...sub, + isSubcatexpend: false, + })), + }, + ]; + }); + + } catch (error) { + console.error("Subcategory fetch failed", error); + } + + } else { + setExpandedRows(prev => + prev.map(e => + e.ProdCat === Cat + ? { ...e, isCatExpend: false } + : e + ) + ); + } + + } + else if (type === "subcat") { + + setExpandedRows(prev => + prev.map(e => { + + if (e.ProdCat !== Cat) return e; + + const updatedSubs = e.ProdSubCat.map(sub => + sub.ProdSubCat === subcat + ? { ...sub, isSubcatexpend: value } + : sub + ); + + // 🔥 Check if ANY subcategory is still true + const isAnySubSelected = updatedSubs.some( + sub => sub.isSubcatexpend + ); + + return { + ...e, + isCatExpend: isAnySubSelected, // auto update category + ProdSubCat: updatedSubs + }; + }) + ); + } + }; return (
+
+ + } + handleSubmit={handleNewMapping} + disabled={addnewAccess} + /> +
{ onComplete={onComplete} /> -
+ {/*
@@ -770,35 +662,7 @@ const CounterCategoryMappingForm = () => { CounterSelSubCategory?.some( (subcat) => subcat.ActiveStatus === 'A' )) && ( - //
- // {CounterSelCategory?.length >0 && - // <> - //
Selected Category:
- //
{ - // CounterSelCategory?.map((item, index) => ( - //
- // {item?.ProdCatName} - // handleRemoveCategory(item)} /> - //
- // ))} - //
- // - // } - // {CounterSelSubCategory?.length >0 && - // <> - //
Selected Sub Category:
- //
{ - // CounterSelSubCategory?.map((item, index) => ( - //
- // {item?.ProdSubCatName} - // handleRemoveSubCategory(item)} /> - //
- // ))} - //
- // - // } - - //
+ @@ -900,13 +764,15 @@ const CounterCategoryMappingForm = () => { /> - + */} + + {CounterDetail?.length > 0 && (
)} @@ -965,21 +831,21 @@ const CounterCategoryMappingForm = () => { > {item?.SubCategoryDetails?.length > 0 ? item?.SubCategoryDetails?.map((subCategory) => ( -
- {subCategory?.ProdSubCatName} - {/* handleRemoveSubCategory(subCategory)} /> */} -
- )) +
+ {subCategory?.ProdSubCatName} + {/* handleRemoveSubCategory(subCategory)} /> */} +
+ )) : '-'} @@ -993,6 +859,75 @@ const CounterCategoryMappingForm = () => { } /> + { setOpenModel(false); ClearDatas() }} + handleSubmit={() => handleFinish()} + width={600} + footer={false} + > +
+ { + await validateSafeInput(value); + + if (value && value.length > 30) { + return Promise.reject( + 'Counter Name should not exceed 30 characters' + ); + } + + return Promise.resolve(); + }, + }, + ]} + > + setCounterName(e.target.value)} + style={{ marginBottom: "16px" }} + /> + + +
+ + + {expandedRows?.map((item) => ( + + ))} + +
+
+ } + + /> +
+ + + ); diff --git a/src/Pages/CounterCategoryMapping/FolderExploreCompoent.jsx b/src/Pages/CounterCategoryMapping/FolderExploreCompoent.jsx new file mode 100644 index 0000000..4738e58 --- /dev/null +++ b/src/Pages/CounterCategoryMapping/FolderExploreCompoent.jsx @@ -0,0 +1,47 @@ +import React from "react"; +import SubCategoryItem from "./SubCategoryItem"; +import "./FolderExploreComponent.scss" + +const FolderExploreComponent = ({ + data, + handleChangeinput, +}) => { + const { ProdCat, ProdCatName, isCatExpend, ProdSubCat } = data; + const subCategory = ProdSubCat || []; + return ( +
+ {/* Parent Checkbox */} +
+ + + {/* Children */} + {isCatExpend && + subCategory.map((sub) => ( + + ))} +
+
+ ); +}; + +export default FolderExploreComponent; diff --git a/src/Pages/CounterCategoryMapping/FolderExploreComponent.scss b/src/Pages/CounterCategoryMapping/FolderExploreComponent.scss new file mode 100644 index 0000000..40fb2fe --- /dev/null +++ b/src/Pages/CounterCategoryMapping/FolderExploreComponent.scss @@ -0,0 +1,4 @@ +.FolderExploremaster{ + display: flex; + flex-direction: column; +} \ No newline at end of file diff --git a/src/Pages/CounterCategoryMapping/SubCategoryItem.jsx b/src/Pages/CounterCategoryMapping/SubCategoryItem.jsx new file mode 100644 index 0000000..67f5213 --- /dev/null +++ b/src/Pages/CounterCategoryMapping/SubCategoryItem.jsx @@ -0,0 +1,27 @@ +import React from "react"; + +const SubCategoryItem = ({ catId, sub, selected, handleChangeinput }) => { + return ( +
+ + handleChangeinput({ type: "subcat", value: e.target.checked, Cat: catId, subcat: sub.ProdSubCat }) + } + /> + + {sub.ProdSubCatName} + +
+ ); +}; + +export default SubCategoryItem; diff --git a/src/Styles/CounterCategoryMappingForm/CounterCategoryMapping.scss b/src/Styles/CounterCategoryMappingForm/CounterCategoryMapping.scss index 630d877..5a3ad48 100644 --- a/src/Styles/CounterCategoryMappingForm/CounterCategoryMapping.scss +++ b/src/Styles/CounterCategoryMappingForm/CounterCategoryMapping.scss @@ -5,13 +5,34 @@ gap: 1rem; flex-wrap: wrap; margin-bottom: 12px; + .ant-form-item { margin-bottom: 0px; } } + .Counterformdata { display: flex; flex-wrap: wrap; - gap: 1rem; + gap: 1rem; } + +.addCatAmping { + height: 65vh; + overflow: auto; + scrollbar-width: thin; + + .ant-input { + padding: 3px 14px 6px 11px !important; + } +} + +.countermapBTN { + display: flex; + align-items: center; + justify-content: space-between; + gap: 1rem; + width: 100%; + margin-bottom: 10px; +} \ No newline at end of file