Added Paginatioon
This commit is contained in:
parent
eff8119813
commit
e057f8a78a
|
|
@ -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>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue