Added Paginatioon

This commit is contained in:
Srinath 2026-02-11 15:52:17 +05:30
parent eff8119813
commit e057f8a78a
1 changed files with 19 additions and 4 deletions

View File

@ -13,6 +13,7 @@ import {
getSupplaierIdBasedProducts getSupplaierIdBasedProducts
} from '../../Features/SupplierProductMapping/SupplierProductMapping.js'; } from '../../Features/SupplierProductMapping/SupplierProductMapping.js';
import { getsupplierBasedOnCmpId, getsupplierBasedOnCmpIdBrId } from '../../Features/SupplierMaster/SupplierMaster.js'; import { getsupplierBasedOnCmpId, getsupplierBasedOnCmpIdBrId } from '../../Features/SupplierMaster/SupplierMaster.js';
import "../../Pages/SupplierProductMapping/SupplierProductMapping.scss"
const SupplierProductMappingForm = ({ const SupplierProductMappingForm = ({
isModalOpen = false, isModalOpen = false,
@ -36,6 +37,8 @@ const SupplierProductMappingForm = ({
const [modalSelectedProduct, setModalSelectedProduct] = useState(null); const [modalSelectedProduct, setModalSelectedProduct] = useState(null);
const [tabledata, setTabledata] = useState([]); const [tabledata, setTabledata] = useState([]);
const [filteredTableData, setFilteredTableData] = useState([]); const [filteredTableData, setFilteredTableData] = useState([]);
const [currentPage, setCurrentPage] = useState(1);
const [pageSize, setPageSize] = useState(8);
const details = { const details = {
name: "tamil", name: "tamil",
address: { address: {
@ -199,7 +202,9 @@ const SupplierProductMappingForm = ({
key: "ProdId", key: "ProdId",
align: "center", align: "center",
width: "80px", width: "80px",
render: (text, object, index) => <span>{index + 1}</span>, render: (text, object, index) => (
<span>{(currentPage - 1) * pageSize + index + 1}</span>
),
}, },
{ {
title: "Product Name", title: "Product Name",
@ -274,7 +279,7 @@ const SupplierProductMappingForm = ({
isOnchanges={false} isOnchanges={false}
alphabetfilter="Yes" alphabetfilter="Yes"
/> />
<button style={{ padding: '10px 10px', margin: '0px 15px', borderRadius: '6px',fontFamily:'poppins', background: '#901D77', color: 'white', border: 'none', cursor: 'pointer' }} <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> onClick={allProductMap}>Add All</button>
<div style={{ position: "absolute", left: "16rem", top: "1px" }}> <div style={{ position: "absolute", left: "16rem", top: "1px" }}>
@ -293,12 +298,22 @@ const SupplierProductMappingForm = ({
)} )}
</div> </div>
<div className="modal-table" style={{ marginTop: "1rem" }}> <div className="ProductMappingTable" style={{ marginTop: "1rem" }}>
<Tables <Tables
columns={tableColumns} columns={tableColumns}
data={modelTableData} data={modelTableData}
dataSource={modelTableData} dataSource={modelTableData}
pagination={false} pagination={{
current: currentPage,
pageSize: pageSize,
total: modelTableData.length,
showSizeChanger: false,
onChange: (page, size) => {
setCurrentPage(page);
setPageSize(size);
},
}}
ownPagination={true}
rowKey="ProdId" rowKey="ProdId"
/> />
</div> </div>