From eacaf0f867bfe879895635b42d07bd5019842ab8 Mon Sep 17 00:00:00 2001
From: Srinath <msrinath6109@gmail.com>
Date: Thu, 29 Jan 2026 18:43:19 +0530
Subject: [PATCH] Add Supplier Product Mapping model Add button  , All Product
 Maping in the table

---
 .../SuplierProductMappingForm.jsx             | 61 +++++++++++--------
 1 file changed, 36 insertions(+), 25 deletions(-)

diff --git a/src/Pages/SupplierProductMapping/SuplierProductMappingForm.jsx b/src/Pages/SupplierProductMapping/SuplierProductMappingForm.jsx
index f92913a..c651c95 100644
--- a/src/Pages/SupplierProductMapping/SuplierProductMappingForm.jsx
+++ b/src/Pages/SupplierProductMapping/SuplierProductMappingForm.jsx
@@ -14,17 +14,17 @@ import {
 } from '../../Features/SupplierProductMapping/SupplierProductMapping.js';
 import { getsupplierBasedOnCmpId, getsupplierBasedOnCmpIdBrId } from '../../Features/SupplierMaster/SupplierMaster.js';
 
-const SupplierProductMappingForm = ({ 
-    isModalOpen = false, 
+const SupplierProductMappingForm = ({
+    isModalOpen = false,
     setIsModalOpen,
-    CompId, 
-    BranchId, 
+    CompId,
+    BranchId,
     AppId,
     setMessage,
     onMappingAdded
 }) => {
     const dispatch = useDispatch();
-    
+
     // State variables
     const [supplierOptions, setSupplierOptions] = useState([]);
     const [productOptions, setProductOptions] = useState([]);
@@ -36,18 +36,18 @@ const SupplierProductMappingForm = ({
     const [modalSelectedProduct, setModalSelectedProduct] = useState(null);
     const [tabledata, setTabledata] = useState([]);
     const [filteredTableData, setFilteredTableData] = useState([]);
-const details = {
-    name :"tamil",
-    address : {
-        city : "hosur"
+    const details = {
+        name: "tamil",
+        address: {
+            city: "hosur"
+        }
     }
-}
-const {address : {city}} = details
+    const { address: { city } } = details
 
     // Fetch suppliers function
     const fetchSypplaiers = async () => {
         try {
-            const response = await dispatch(getsupplierBasedOnCmpIdBrId({cmpId : CompId,BranchId,AppId}))?.unwrap();
+            const response = await dispatch(getsupplierBasedOnCmpIdBrId({ cmpId: CompId, BranchId, AppId }))?.unwrap();
             if (response?.data?.statusCode === 1) {
                 const filteredData = response?.data?.data?.filter(filter => filter.ActiveStatus === 'A');
                 setSupplierOptions(filteredData);
@@ -155,7 +155,7 @@ const {address : {city}} = details
             setMessage({ type: "error", data: "Please select a supplier" });
             return;
         }
-        
+
         if (modelTableData.length === 0) {
             setMessage({ type: "error", data: "Please add at least one product" });
             return;
@@ -220,6 +220,14 @@ const {address : {city}} = details
         }
     ];
 
+    const allProductMap = () => {
+        const allProducts = productOptions;
+        const newTableData = [...modelTableData, ...allProducts];
+        setModelTableData(newTableData);
+        setProductOptions([]);
+        setMessage({ type: "success", data: "All Products Added Successfully" });
+    }
+
     return (
         <DefaultModal
             open={isModalOpen}
@@ -236,9 +244,9 @@ const {address : {city}} = details
                     <div style={{ display: "flex", alignItems: "center", gap: "0.5rem", position: "relative" }}>
                         <DropDowns
                             label={<label className='required'>Supplier Name</label>}
-                            options={supplierOptions?.map(item => ({ 
-                                value: item.SuppId, 
-                                label: item.SuppName ?? item.SuppMobile ?? "No Name" 
+                            options={supplierOptions?.map(item => ({
+                                value: item.SuppId,
+                                label: item.SuppName ?? item.SuppMobile ?? "No Name"
                             }))}
                             valueData={modalSelectedSupplier}
                             onChangeFunction={handleModelSuplaierOnChange}
@@ -247,18 +255,18 @@ const {address : {city}} = details
                         />
                         <AddSupplierModal onSupplierAdded={fetchSypplaiers} message={setMessage} />
                     </div>
-                    
+
                     {modalSelectedSupplier && (
                         <div style={{ display: "flex", alignItems: "center", gap: "0.5rem", position: "relative" }}>
                             <DropDowns
                                 key={`product-dropdown-${dropdownKey}`}
                                 label={<label className='required'>Product Name</label>}
-                               options={productOptions.map(item => {
+                                options={productOptions.map(item => {
                                     const size = (item.Size === null ? "" : " (" + item.Size + " " + (item.UomName === null ? "" : item.UomName) + ") ")
                                     const brand = item.BrandName === null ? "" : item.BrandName
-                                    return { 
-                                    value: item.ProdId, 
-                                    label: item.ProdName + size + brand
+                                    return {
+                                        value: item.ProdId,
+                                        label: item.ProdName + size + brand
                                     }
                                 })}
                                 valueData={modalSelectedProduct}
@@ -266,16 +274,19 @@ const {address : {city}} = details
                                 isOnchanges={false}
                                 alphabetfilter="Yes"
                             />
+                            <button style={{ padding: '10px 10px', margin: '0px 15px', borderRadius: '6px',fontFamily:'poppins', background: '#901D77', color: 'white', border: 'none', cursor: 'pointer' }}
+                                onClick={allProductMap}>Add All</button>
+
                             <div style={{ position: "absolute", left: "16rem", top: "1px" }}>
                                 <Tooltip title={"Add Product"} placement={"top"}>
-                                    <PlusCircleOutlined 
+                                    <PlusCircleOutlined
                                         onClick={addProductOnClick}
                                         style={{ cursor: "pointer", fontSize: "16px" }}
                                     />
                                 </Tooltip>
-                                <FeaturesFunctionalities 
-                                    handleQuickAddCancel={onProductAdded} 
-                                    QuickAdd={addProduct} 
+                                <FeaturesFunctionalities
+                                    handleQuickAddCancel={onProductAdded}
+                                    QuickAdd={addProduct}
                                 />
                             </div>
                         </div>