added sorting in product receipt name
This commit is contained in:
unknown
parent
bc8dafa167
commit
0d6b950a99
|
|
@ -0,0 +1,427 @@
|
||||||
|
import { DefaultModal } from "../../../../Components/Modal/DefaultModal"
|
||||||
|
import { extractLastNumberOrderId } from "../../../../Services/Others"
|
||||||
|
import '../../../../Styles/BookingScreen/Template/BSLayout2/BSLayout2.scss';
|
||||||
|
|
||||||
|
const SalesDetailsModal = ({ isModalOpen = false,
|
||||||
|
setIsModalOpen = () => { },
|
||||||
|
currentData = [],
|
||||||
|
currentPage,
|
||||||
|
totalPages,
|
||||||
|
setCurrentPage = () => { },
|
||||||
|
startIndex
|
||||||
|
}) => {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<DefaultModal
|
||||||
|
open={isModalOpen}
|
||||||
|
title="Sales Details"
|
||||||
|
handleCancel={() => setIsModalOpen(false)}
|
||||||
|
handleSubmit={() => setIsModalOpen(false)}
|
||||||
|
width={700}
|
||||||
|
footer={false}
|
||||||
|
>
|
||||||
|
<div style={{ overflowX: 'auto' }}>
|
||||||
|
<table
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
borderCollapse: 'collapse',
|
||||||
|
fontFamily: "'Segoe UI', Roboto, sans-serif",
|
||||||
|
fontSize: '14px',
|
||||||
|
borderRadius: '8px',
|
||||||
|
overflow: 'hidden',
|
||||||
|
boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
|
||||||
|
}}
|
||||||
|
className='SCTableInPageSales'
|
||||||
|
>
|
||||||
|
<thead>
|
||||||
|
<tr style={{ backgroundColor: '#2c88ee', color: '#fff' }}>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
||||||
|
S.No
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
||||||
|
Order ID
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
||||||
|
Customer
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
||||||
|
Mobile
|
||||||
|
</th>
|
||||||
|
{/* <th style={{ border: "1px solid #ddd", padding: "10px" }}>Booked By</th> */}
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
||||||
|
Payment Type
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '10px', backgroundColor: '#055ec0' }}>
|
||||||
|
Amount (₹)
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
|
||||||
|
<tbody>
|
||||||
|
{currentData?.length > 0 ? (
|
||||||
|
currentData?.map((item, index) => (
|
||||||
|
<tr
|
||||||
|
key={item.OrderId}
|
||||||
|
style={{
|
||||||
|
backgroundColor: index % 2 === 0 ? '#f7faff' : '#e9f1ff',
|
||||||
|
textAlign: 'center',
|
||||||
|
transition: 'background 0.3s',
|
||||||
|
}}
|
||||||
|
onMouseEnter={(e) =>
|
||||||
|
(e.currentTarget.style.backgroundColor = '#d6e4ff')
|
||||||
|
}
|
||||||
|
onMouseLeave={(e) =>
|
||||||
|
(e.currentTarget.style.backgroundColor =
|
||||||
|
index % 2 === 0 ? '#f7faff' : '#e9f1ff')
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
{startIndex + index + 1}
|
||||||
|
</td>
|
||||||
|
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
{extractLastNumberOrderId(item.OrderId)}
|
||||||
|
</td>
|
||||||
|
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
{item.CustName || '—'}
|
||||||
|
</td>
|
||||||
|
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
{item.CustMobile || '—'}
|
||||||
|
</td>
|
||||||
|
{/* <td style={{ border: "1px solid #ddd", padding: "8px" }}>
|
||||||
|
{item.BookedBy || "—"}
|
||||||
|
</td> */}
|
||||||
|
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
{item.PaymentTypeName || '—'}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
padding: '8px',
|
||||||
|
fontWeight: '600',
|
||||||
|
color: '#2e7d32',
|
||||||
|
backgroundColor: '#eaf6ea',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
₹{item.Amount?.toLocaleString()}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
))
|
||||||
|
) : (
|
||||||
|
<tr>
|
||||||
|
<td
|
||||||
|
colSpan="7"
|
||||||
|
style={{
|
||||||
|
textAlign: 'center',
|
||||||
|
padding: '12px',
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
color: '#888',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
No booking data available
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
)}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
{/* Pagination */}
|
||||||
|
{totalPages > 1 && (
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
marginTop: '12px',
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'center',
|
||||||
|
alignItems: 'center',
|
||||||
|
gap: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{currentPage == 1 ? (
|
||||||
|
''
|
||||||
|
) : (
|
||||||
|
<button
|
||||||
|
onClick={() => setCurrentPage((p) => Math.max(p - 1, 1))}
|
||||||
|
disabled={currentPage === 1}
|
||||||
|
style={{
|
||||||
|
padding: '5px 10px',
|
||||||
|
backgroundColor: '#003366',
|
||||||
|
color: '#fff',
|
||||||
|
border: 'none',
|
||||||
|
borderRadius: '4px',
|
||||||
|
cursor: currentPage === 1 ? 'not-allowed' : 'pointer',
|
||||||
|
opacity: currentPage === 1 ? 0.5 : 1,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Prev
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<span style={{ fontWeight: '600' }}>
|
||||||
|
Page {currentPage} of {totalPages}
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<button
|
||||||
|
onClick={() =>
|
||||||
|
setCurrentPage((p) => Math.min(p + 1, totalPages))
|
||||||
|
}
|
||||||
|
disabled={currentPage === totalPages}
|
||||||
|
style={{
|
||||||
|
padding: '5px 10px',
|
||||||
|
backgroundColor: '#003366',
|
||||||
|
color: '#fff',
|
||||||
|
border: 'none',
|
||||||
|
borderRadius: '4px',
|
||||||
|
cursor:
|
||||||
|
currentPage === totalPages ? 'not-allowed' : 'pointer',
|
||||||
|
opacity: currentPage === totalPages ? 0.5 : 1,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Next
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</DefaultModal>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const SalesNetAmountModal = ({
|
||||||
|
isNetAmtModalOpen = false,
|
||||||
|
setIsNetAmtModalOpen = () => { },
|
||||||
|
orderDetails = []
|
||||||
|
}) => {
|
||||||
|
return (
|
||||||
|
<DefaultModal
|
||||||
|
open={isNetAmtModalOpen}
|
||||||
|
title="Sales Net Amount"
|
||||||
|
handleCancel={() => setIsNetAmtModalOpen(false)}
|
||||||
|
handleSubmit={() => setIsNetAmtModalOpen(false)}
|
||||||
|
width={800}
|
||||||
|
footer={false}
|
||||||
|
>
|
||||||
|
<div style={{ overflowX: 'auto' }}>
|
||||||
|
<table
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
borderCollapse: 'collapse',
|
||||||
|
textAlign: 'center',
|
||||||
|
fontFamily: "'Segoe UI', Roboto, sans-serif",
|
||||||
|
fontSize: '14px',
|
||||||
|
borderRadius: '8px',
|
||||||
|
overflow: 'hidden',
|
||||||
|
boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
|
||||||
|
}}
|
||||||
|
className='SCTableInPageSales'
|
||||||
|
>
|
||||||
|
<thead>
|
||||||
|
<tr style={{ backgroundColor: '#2c88ee', color: '#fff' }}>
|
||||||
|
<th
|
||||||
|
colSpan="2"
|
||||||
|
style={{ border: '1px solid #ddd', padding: '10px' }}
|
||||||
|
>
|
||||||
|
Cash
|
||||||
|
</th>
|
||||||
|
<th
|
||||||
|
colSpan="2"
|
||||||
|
style={{ border: '1px solid #ddd', padding: '10px' }}
|
||||||
|
>
|
||||||
|
UPI
|
||||||
|
</th>
|
||||||
|
<th
|
||||||
|
colSpan="2"
|
||||||
|
style={{ border: '1px solid #ddd', padding: '10px' }}
|
||||||
|
>
|
||||||
|
Card
|
||||||
|
</th>
|
||||||
|
<th
|
||||||
|
colSpan="2"
|
||||||
|
style={{ border: '1px solid #ddd', padding: '10px' }}
|
||||||
|
>
|
||||||
|
Credit
|
||||||
|
</th>
|
||||||
|
<th
|
||||||
|
colSpan="2"
|
||||||
|
style={{ border: '1px solid #ddd', padding: '10px' }}
|
||||||
|
>
|
||||||
|
Business UPI
|
||||||
|
</th>
|
||||||
|
<th
|
||||||
|
rowSpan="2"
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
padding: '10px',
|
||||||
|
backgroundColor: '#055ec0',
|
||||||
|
color: '#fff',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Total
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
<tr style={{ backgroundColor: '#2c88ee', color: '#fff' }}>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Count
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Amt
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Count
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Amt
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Count
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Amt
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Count
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Amt
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Count
|
||||||
|
</th>
|
||||||
|
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
||||||
|
Amt
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
|
||||||
|
<tbody>
|
||||||
|
{orderDetails?.map((item, index) => {
|
||||||
|
const total =
|
||||||
|
(item.CashAmount || 0) +
|
||||||
|
(item.UpiAmount || 0) +
|
||||||
|
(item.CardAmount || 0) +
|
||||||
|
(item.CreditAmount || 0);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<tr
|
||||||
|
key={index}
|
||||||
|
style={{
|
||||||
|
backgroundColor: index % 2 === 0 ? '#f7faff' : '#ffffff',
|
||||||
|
transition: 'background 0.3s',
|
||||||
|
}}
|
||||||
|
onMouseEnter={(e) =>
|
||||||
|
(e.currentTarget.style.backgroundColor = '#e6f2ff')
|
||||||
|
}
|
||||||
|
onMouseLeave={(e) =>
|
||||||
|
(e.currentTarget.style.backgroundColor =
|
||||||
|
index % 2 === 0 ? '#f7faff' : '#ffffff')
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.CashCount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.CashAmount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.UpiCount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.UpiAmount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.CardCount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.CardAmount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.CreditCount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.CreditAmount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.BusinessUpiCount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
fontWeight: '700',
|
||||||
|
padding: '8px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.BusinessUpiAmount}
|
||||||
|
</td>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
border: '1px solid #ddd',
|
||||||
|
padding: '8px',
|
||||||
|
fontWeight: '700',
|
||||||
|
backgroundColor: '#eaf6ea',
|
||||||
|
color: '#2e7d32',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{total}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</DefaultModal>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export { SalesDetailsModal, SalesNetAmountModal };
|
||||||
|
|
@ -56,6 +56,7 @@ const ShortcutKeyHelper = lazy(
|
||||||
);
|
);
|
||||||
// Scss
|
// Scss
|
||||||
import './SalesCountComponent.scss';
|
import './SalesCountComponent.scss';
|
||||||
|
import { SalesDetailsModal, SalesNetAmountModal } from '../Components/UtillComponents/SalesDetailsNetAmountModal.jsx';
|
||||||
|
|
||||||
const SalesCountComponent = React.memo(
|
const SalesCountComponent = React.memo(
|
||||||
({ DineInAccess, GlobalsalesDetailData }) => {
|
({ DineInAccess, GlobalsalesDetailData }) => {
|
||||||
|
|
@ -664,422 +665,22 @@ const SalesCountComponent = React.memo(
|
||||||
</p>
|
</p>
|
||||||
{Customisebillno && <CustomisedInvoiceChange />}
|
{Customisebillno && <CustomisedInvoiceChange />}
|
||||||
{/* Modal with table for multiple bookings */}
|
{/* Modal with table for multiple bookings */}
|
||||||
<DefaultModal
|
<SalesDetailsModal
|
||||||
open={isModalOpen}
|
isModalOpen={isModalOpen}
|
||||||
title="Sales Details"
|
setIsModalOpen={setIsModalOpen}
|
||||||
handleCancel={() => setIsModalOpen(false)}
|
currentData={currentData}
|
||||||
handleSubmit={() => setIsModalOpen(false)}
|
currentPage={currentPage}
|
||||||
width={700}
|
totalPages={totalPages}
|
||||||
footer={false}
|
setCurrentPage={setCurrentPage}
|
||||||
>
|
startIndex={startIndex}
|
||||||
<div style={{ overflowX: 'auto' }}>
|
/>
|
||||||
<table
|
|
||||||
style={{
|
|
||||||
width: '100%',
|
|
||||||
borderCollapse: 'collapse',
|
|
||||||
fontFamily: "'Segoe UI', Roboto, sans-serif",
|
|
||||||
fontSize: '14px',
|
|
||||||
borderRadius: '8px',
|
|
||||||
overflow: 'hidden',
|
|
||||||
boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<thead>
|
|
||||||
<tr style={{ backgroundColor: '#003366', color: '#fff' }}>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
S.No
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Order ID
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Customer
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Mobile
|
|
||||||
</th>
|
|
||||||
{/* <th style={{ border: "1px solid #ddd", padding: "10px" }}>Booked By</th> */}
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Payment Type
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Amount (₹)
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
|
|
||||||
<tbody>
|
|
||||||
{currentData?.length > 0 ? (
|
|
||||||
currentData?.map((item, index) => (
|
|
||||||
<tr
|
|
||||||
key={item.OrderId}
|
|
||||||
style={{
|
|
||||||
backgroundColor:
|
|
||||||
index % 2 === 0 ? '#f7faff' : '#e9f1ff',
|
|
||||||
textAlign: 'center',
|
|
||||||
transition: 'background 0.3s',
|
|
||||||
}}
|
|
||||||
onMouseEnter={(e) =>
|
|
||||||
(e.currentTarget.style.backgroundColor = '#d6e4ff')
|
|
||||||
}
|
|
||||||
onMouseLeave={(e) =>
|
|
||||||
(e.currentTarget.style.backgroundColor =
|
|
||||||
index % 2 === 0 ? '#f7faff' : '#e9f1ff')
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<td
|
|
||||||
style={{ border: '1px solid #ddd', padding: '8px' }}
|
|
||||||
>
|
|
||||||
{startIndex + index + 1}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{ border: '1px solid #ddd', padding: '8px' }}
|
|
||||||
>
|
|
||||||
{extractLastNumberOrderId(item.OrderId)}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{ border: '1px solid #ddd', padding: '8px' }}
|
|
||||||
>
|
|
||||||
{item.CustName || '—'}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{ border: '1px solid #ddd', padding: '8px' }}
|
|
||||||
>
|
|
||||||
{item.CustMobile || '—'}
|
|
||||||
</td>
|
|
||||||
{/* <td style={{ border: "1px solid #ddd", padding: "8px" }}>
|
|
||||||
{item.BookedBy || "—"}
|
|
||||||
</td> */}
|
|
||||||
<td
|
|
||||||
style={{ border: '1px solid #ddd', padding: '8px' }}
|
|
||||||
>
|
|
||||||
{item.PaymentTypeName || '—'}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
padding: '8px',
|
|
||||||
fontWeight: '600',
|
|
||||||
color: '#2e7d32',
|
|
||||||
backgroundColor: '#eaf6ea',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
₹{item.Amount?.toLocaleString()}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
))
|
|
||||||
) : (
|
|
||||||
<tr>
|
|
||||||
<td
|
|
||||||
colSpan="7"
|
|
||||||
style={{
|
|
||||||
textAlign: 'center',
|
|
||||||
padding: '12px',
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
color: '#888',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
No booking data available
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
)}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
{/* Pagination */}
|
|
||||||
{totalPages > 1 && (
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
marginTop: '12px',
|
|
||||||
display: 'flex',
|
|
||||||
justifyContent: 'center',
|
|
||||||
alignItems: 'center',
|
|
||||||
gap: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{currentPage == 1 ? (
|
|
||||||
''
|
|
||||||
) : (
|
|
||||||
<button
|
|
||||||
onClick={() =>
|
|
||||||
setCurrentPage((p) => Math.max(p - 1, 1))
|
|
||||||
}
|
|
||||||
disabled={currentPage === 1}
|
|
||||||
style={{
|
|
||||||
padding: '5px 10px',
|
|
||||||
backgroundColor: '#003366',
|
|
||||||
color: '#fff',
|
|
||||||
border: 'none',
|
|
||||||
borderRadius: '4px',
|
|
||||||
cursor: currentPage === 1 ? 'not-allowed' : 'pointer',
|
|
||||||
opacity: currentPage === 1 ? 0.5 : 1,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Prev
|
|
||||||
</button>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<span style={{ fontWeight: '600' }}>
|
|
||||||
Page {currentPage} of {totalPages}
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<button
|
|
||||||
onClick={() =>
|
|
||||||
setCurrentPage((p) => Math.min(p + 1, totalPages))
|
|
||||||
}
|
|
||||||
disabled={currentPage === totalPages}
|
|
||||||
style={{
|
|
||||||
padding: '5px 10px',
|
|
||||||
backgroundColor: '#003366',
|
|
||||||
color: '#fff',
|
|
||||||
border: 'none',
|
|
||||||
borderRadius: '4px',
|
|
||||||
cursor:
|
|
||||||
currentPage === totalPages
|
|
||||||
? 'not-allowed'
|
|
||||||
: 'pointer',
|
|
||||||
opacity: currentPage === totalPages ? 0.5 : 1,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Next
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</DefaultModal>
|
|
||||||
|
|
||||||
{/* Modal with table for multiple Net Amt */}
|
{/* Modal with table for multiple Net Amt */}
|
||||||
<DefaultModal
|
<SalesNetAmountModal
|
||||||
open={isNetAmtModalOpen}
|
isNetAmtModalOpen={isNetAmtModalOpen}
|
||||||
title="Sales Net Amount"
|
setIsNetAmtModalOpen={setIsNetAmtModalOpen}
|
||||||
handleCancel={() => setIsNetAmtModalOpen(false)}
|
orderDetails={orderDetails}
|
||||||
handleSubmit={() => setIsNetAmtModalOpen(false)}
|
/>
|
||||||
width={800}
|
|
||||||
footer={false}
|
|
||||||
>
|
|
||||||
<div style={{ overflowX: 'auto' }}>
|
|
||||||
<table
|
|
||||||
style={{
|
|
||||||
width: '100%',
|
|
||||||
borderCollapse: 'collapse',
|
|
||||||
textAlign: 'center',
|
|
||||||
fontFamily: "'Segoe UI', Roboto, sans-serif",
|
|
||||||
fontSize: '14px',
|
|
||||||
borderRadius: '8px',
|
|
||||||
overflow: 'hidden',
|
|
||||||
boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<thead>
|
|
||||||
<tr style={{ backgroundColor: '#003366', color: '#fff' }}>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
Cash
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
UPI
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
Card
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
Credit
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
Business UPI
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
rowSpan="2"
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
padding: '10px',
|
|
||||||
backgroundColor: '#002244',
|
|
||||||
color: '#fff',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Total
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
<tr style={{ backgroundColor: '#004080', color: '#fff' }}>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
|
|
||||||
<tbody>
|
|
||||||
{orderDetails?.map((item, index) => {
|
|
||||||
const total =
|
|
||||||
(item.CashAmount || 0) +
|
|
||||||
(item.UpiAmount || 0) +
|
|
||||||
(item.CardAmount || 0) +
|
|
||||||
(item.CreditAmount || 0);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<tr
|
|
||||||
key={index}
|
|
||||||
style={{
|
|
||||||
backgroundColor:
|
|
||||||
index % 2 === 0 ? '#f7faff' : '#ffffff',
|
|
||||||
transition: 'background 0.3s',
|
|
||||||
}}
|
|
||||||
onMouseEnter={(e) =>
|
|
||||||
(e.currentTarget.style.backgroundColor = '#e6f2ff')
|
|
||||||
}
|
|
||||||
onMouseLeave={(e) =>
|
|
||||||
(e.currentTarget.style.backgroundColor =
|
|
||||||
index % 2 === 0 ? '#f7faff' : '#ffffff')
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CashCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CashAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.UpiCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.UpiAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CardCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CardAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CreditCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CreditAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.BusinessUpiCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.BusinessUpiAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
padding: '8px',
|
|
||||||
fontWeight: '700',
|
|
||||||
backgroundColor: '#eaf6ea',
|
|
||||||
color: '#2e7d32',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{total}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</DefaultModal>
|
|
||||||
<Tooltip title="Receive Stock">
|
<Tooltip title="Receive Stock">
|
||||||
{TableData?.length > 0 && AutoReceiveStock && (
|
{TableData?.length > 0 && AutoReceiveStock && (
|
||||||
<button
|
<button
|
||||||
|
|
|
||||||
|
|
@ -87,6 +87,7 @@ const AllSalesPageSettings = lazy(
|
||||||
import '../../../Styles/BookingScreen/Template/BSLayout2/BSLayout2.scss';
|
import '../../../Styles/BookingScreen/Template/BSLayout2/BSLayout2.scss';
|
||||||
import useWhyDidYouUpdate from '../../../Services/findrerender.js';
|
import useWhyDidYouUpdate from '../../../Services/findrerender.js';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { SalesDetailsModal, SalesNetAmountModal } from '../Components/UtillComponents/SalesDetailsNetAmountModal.jsx';
|
||||||
|
|
||||||
const SalesCountForStandard = React.memo(() => {
|
const SalesCountForStandard = React.memo(() => {
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
|
|
@ -862,408 +863,23 @@ const SalesCountForStandard = React.memo(() => {
|
||||||
|
|
||||||
{/* Modal with table for multiple bookings */}
|
{/* Modal with table for multiple bookings */}
|
||||||
|
|
||||||
<DefaultModal
|
<SalesDetailsModal
|
||||||
open={isModalOpen}
|
isModalOpen={isModalOpen}
|
||||||
title="Sales Details"
|
setIsModalOpen={setIsModalOpen}
|
||||||
handleCancel={() => setIsModalOpen(false)}
|
currentData={currentData}
|
||||||
handleSubmit={() => setIsModalOpen(false)}
|
currentPage={currentPage}
|
||||||
width={700}
|
totalPages={totalPages}
|
||||||
footer={false}
|
setCurrentPage={setCurrentPage}
|
||||||
>
|
startIndex={startIndex}
|
||||||
<div style={{ overflowX: 'auto' }}>
|
/>
|
||||||
<table
|
|
||||||
style={{
|
|
||||||
width: '100%',
|
|
||||||
borderCollapse: 'collapse',
|
|
||||||
fontFamily: "'Segoe UI', Roboto, sans-serif",
|
|
||||||
fontSize: '14px',
|
|
||||||
borderRadius: '8px',
|
|
||||||
overflow: 'hidden',
|
|
||||||
boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<thead>
|
|
||||||
<tr style={{ backgroundColor: '#003366', color: '#fff' }}>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
S.No
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Order ID
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Customer
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Mobile
|
|
||||||
</th>
|
|
||||||
{/* <th style={{ border: "1px solid #ddd", padding: "10px" }}>Booked By</th> */}
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Payment Type
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '10px' }}>
|
|
||||||
Amount (₹)
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
|
|
||||||
<tbody>
|
|
||||||
{currentData?.length > 0 ? (
|
|
||||||
currentData?.map((item, index) => (
|
|
||||||
<tr
|
|
||||||
key={item.OrderId}
|
|
||||||
style={{
|
|
||||||
backgroundColor: index % 2 === 0 ? '#f7faff' : '#e9f1ff',
|
|
||||||
textAlign: 'center',
|
|
||||||
transition: 'background 0.3s',
|
|
||||||
}}
|
|
||||||
onMouseEnter={(e) =>
|
|
||||||
(e.currentTarget.style.backgroundColor = '#d6e4ff')
|
|
||||||
}
|
|
||||||
onMouseLeave={(e) =>
|
|
||||||
(e.currentTarget.style.backgroundColor =
|
|
||||||
index % 2 === 0 ? '#f7faff' : '#e9f1ff')
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
{startIndex + index + 1}
|
|
||||||
</td>
|
|
||||||
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
{extractLastNumberOrderId(item.OrderId)}
|
|
||||||
</td>
|
|
||||||
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
{item.CustName || '—'}
|
|
||||||
</td>
|
|
||||||
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
{item.CustMobile || '—'}
|
|
||||||
</td>
|
|
||||||
{/* <td style={{ border: "1px solid #ddd", padding: "8px" }}>
|
|
||||||
{item.BookedBy || "—"}
|
|
||||||
</td> */}
|
|
||||||
<td style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
{item.PaymentTypeName || '—'}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
padding: '8px',
|
|
||||||
fontWeight: '600',
|
|
||||||
color: '#2e7d32',
|
|
||||||
backgroundColor: '#eaf6ea',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
₹{item.Amount?.toLocaleString()}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
))
|
|
||||||
) : (
|
|
||||||
<tr>
|
|
||||||
<td
|
|
||||||
colSpan="7"
|
|
||||||
style={{
|
|
||||||
textAlign: 'center',
|
|
||||||
padding: '12px',
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
color: '#888',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
No booking data available
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
)}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
|
|
||||||
{/* Pagination */}
|
|
||||||
{totalPages > 1 && (
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
marginTop: '12px',
|
|
||||||
display: 'flex',
|
|
||||||
justifyContent: 'center',
|
|
||||||
alignItems: 'center',
|
|
||||||
gap: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{currentPage == 1 ? (
|
|
||||||
''
|
|
||||||
) : (
|
|
||||||
<button
|
|
||||||
onClick={() => setCurrentPage((p) => Math.max(p - 1, 1))}
|
|
||||||
disabled={currentPage === 1}
|
|
||||||
style={{
|
|
||||||
padding: '5px 10px',
|
|
||||||
backgroundColor: '#003366',
|
|
||||||
color: '#fff',
|
|
||||||
border: 'none',
|
|
||||||
borderRadius: '4px',
|
|
||||||
cursor: currentPage === 1 ? 'not-allowed' : 'pointer',
|
|
||||||
opacity: currentPage === 1 ? 0.5 : 1,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Prev
|
|
||||||
</button>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<span style={{ fontWeight: '600' }}>
|
|
||||||
Page {currentPage} of {totalPages}
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<button
|
|
||||||
onClick={() =>
|
|
||||||
setCurrentPage((p) => Math.min(p + 1, totalPages))
|
|
||||||
}
|
|
||||||
disabled={currentPage === totalPages}
|
|
||||||
style={{
|
|
||||||
padding: '5px 10px',
|
|
||||||
backgroundColor: '#003366',
|
|
||||||
color: '#fff',
|
|
||||||
border: 'none',
|
|
||||||
borderRadius: '4px',
|
|
||||||
cursor:
|
|
||||||
currentPage === totalPages ? 'not-allowed' : 'pointer',
|
|
||||||
opacity: currentPage === totalPages ? 0.5 : 1,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Next
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</DefaultModal>
|
|
||||||
|
|
||||||
{/* Modal with table for multiple Net Amt */}
|
{/* Modal with table for multiple Net Amt */}
|
||||||
|
|
||||||
<DefaultModal
|
<SalesNetAmountModal
|
||||||
open={isNetAmtModalOpen}
|
isNetAmtModalOpen={isNetAmtModalOpen}
|
||||||
title="Sales Net Amount"
|
setIsNetAmtModalOpen={setIsNetAmtModalOpen}
|
||||||
handleCancel={() => setIsNetAmtModalOpen(false)}
|
orderDetails={orderDetails}
|
||||||
handleSubmit={() => setIsNetAmtModalOpen(false)}
|
/>
|
||||||
width={800}
|
|
||||||
footer={false}
|
|
||||||
>
|
|
||||||
<div style={{ overflowX: 'auto' }}>
|
|
||||||
<table
|
|
||||||
style={{
|
|
||||||
width: '100%',
|
|
||||||
borderCollapse: 'collapse',
|
|
||||||
textAlign: 'center',
|
|
||||||
fontFamily: "'Segoe UI', Roboto, sans-serif",
|
|
||||||
fontSize: '14px',
|
|
||||||
borderRadius: '8px',
|
|
||||||
overflow: 'hidden',
|
|
||||||
boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
|
|
||||||
}}
|
|
||||||
className='SCTableInPageSales'
|
|
||||||
>
|
|
||||||
<thead>
|
|
||||||
<tr style={{ backgroundColor: '#2c88ee', color: '#fff' }}>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
Cash
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
UPI
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
Card
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
Credit
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
colSpan="2"
|
|
||||||
style={{ border: '1px solid #ddd', padding: '10px' }}
|
|
||||||
>
|
|
||||||
Business UPI
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
rowSpan="2"
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
padding: '10px',
|
|
||||||
backgroundColor: '#055ec0',
|
|
||||||
color: '#fff',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Total
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
<tr style={{ backgroundColor: '#2c88ee', color: '#fff' }}>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Count
|
|
||||||
</th>
|
|
||||||
<th style={{ border: '1px solid #ddd', padding: '8px' }}>
|
|
||||||
Amt
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
|
|
||||||
<tbody>
|
|
||||||
{orderDetails?.map((item, index) => {
|
|
||||||
const total =
|
|
||||||
(item.CashAmount || 0) +
|
|
||||||
(item.UpiAmount || 0) +
|
|
||||||
(item.CardAmount || 0) +
|
|
||||||
(item.CreditAmount || 0);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<tr
|
|
||||||
key={index}
|
|
||||||
style={{
|
|
||||||
backgroundColor: index % 2 === 0 ? '#f7faff' : '#ffffff',
|
|
||||||
transition: 'background 0.3s',
|
|
||||||
}}
|
|
||||||
onMouseEnter={(e) =>
|
|
||||||
(e.currentTarget.style.backgroundColor = '#e6f2ff')
|
|
||||||
}
|
|
||||||
onMouseLeave={(e) =>
|
|
||||||
(e.currentTarget.style.backgroundColor =
|
|
||||||
index % 2 === 0 ? '#f7faff' : '#ffffff')
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CashCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CashAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.UpiCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.UpiAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CardCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CardAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CreditCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.CreditAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.BusinessUpiCount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
fontWeight: '700',
|
|
||||||
padding: '8px',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{item.BusinessUpiAmount}
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
style={{
|
|
||||||
border: '1px solid #ddd',
|
|
||||||
padding: '8px',
|
|
||||||
fontWeight: '700',
|
|
||||||
backgroundColor: '#eaf6ea',
|
|
||||||
color: '#2e7d32',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{total}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</DefaultModal>
|
|
||||||
|
|
||||||
<ReceivedStocksModal
|
<ReceivedStocksModal
|
||||||
open={isReceivedModelOpen}
|
open={isReceivedModelOpen}
|
||||||
|
|
|
||||||
|
|
@ -51,6 +51,7 @@ const AddAllProductsButton = ({
|
||||||
MRP: ProductData1.MRP,
|
MRP: ProductData1.MRP,
|
||||||
ProdName: ProductData1.ProdName,
|
ProdName: ProductData1.ProdName,
|
||||||
UomName: ProductData1.UomName,
|
UomName: ProductData1.UomName,
|
||||||
|
Size: ProductData1.Size,
|
||||||
SellPrice: ProductData1.SellPrice,
|
SellPrice: ProductData1.SellPrice,
|
||||||
StockAvailable: ProductData1.StockAvailable,
|
StockAvailable: ProductData1.StockAvailable,
|
||||||
OnePcsAvailable: ProductData1.OnePcsAvailable,
|
OnePcsAvailable: ProductData1.OnePcsAvailable,
|
||||||
|
|
|
||||||
|
|
@ -12,6 +12,8 @@ import {
|
||||||
ArrowRightOutlined,
|
ArrowRightOutlined,
|
||||||
PlusCircleOutlined,
|
PlusCircleOutlined,
|
||||||
SearchOutlined,
|
SearchOutlined,
|
||||||
|
SortAscendingOutlined,
|
||||||
|
SortDescendingOutlined,
|
||||||
} from '@ant-design/icons';
|
} from '@ant-design/icons';
|
||||||
import {
|
import {
|
||||||
Form,
|
Form,
|
||||||
|
|
@ -230,6 +232,7 @@ const StockForm = ({ formType }) => {
|
||||||
const [SelectedPurchaseType, setSelectedPurchaseType] = useState(null);
|
const [SelectedPurchaseType, setSelectedPurchaseType] = useState(null);
|
||||||
const [SelectedPurcTaxType, setSelectedPurcTaxType] = useState(null);
|
const [SelectedPurcTaxType, setSelectedPurcTaxType] = useState(null);
|
||||||
const [PurchaseData, setPurchaseData] = useState([]);
|
const [PurchaseData, setPurchaseData] = useState([]);
|
||||||
|
console.log(PurchaseData, "PurchaseData")
|
||||||
const [additionalInfoModal, setAdditionalInfoModal] = useState(false);
|
const [additionalInfoModal, setAdditionalInfoModal] = useState(false);
|
||||||
const [selectedRowIndex, setSelectedRowIndex] = useState(null);
|
const [selectedRowIndex, setSelectedRowIndex] = useState(null);
|
||||||
const [selectedRowRecord, setSelectedRowRecord] = useState({});
|
const [selectedRowRecord, setSelectedRowRecord] = useState({});
|
||||||
|
|
@ -280,6 +283,7 @@ const StockForm = ({ formType }) => {
|
||||||
const [searchValue, setSearchValue] = useState('');
|
const [searchValue, setSearchValue] = useState('');
|
||||||
const isSearching = Boolean(searchValue?.trim());
|
const isSearching = Boolean(searchValue?.trim());
|
||||||
const [showAllSuppliers, setShowAllSuppliers] = useState(false);
|
const [showAllSuppliers, setShowAllSuppliers] = useState(false);
|
||||||
|
const [nameSortOrder, setNameSortOrder] = useState(null);
|
||||||
|
|
||||||
const SelInvoiceAmount = useMemo(() => {
|
const SelInvoiceAmount = useMemo(() => {
|
||||||
const total = PurchaseData?.reduce(
|
const total = PurchaseData?.reduce(
|
||||||
|
|
@ -1137,6 +1141,7 @@ const StockForm = ({ formType }) => {
|
||||||
extractedItem,
|
extractedItem,
|
||||||
existingProducts
|
existingProducts
|
||||||
) => {
|
) => {
|
||||||
|
|
||||||
setProductSearchText('');
|
setProductSearchText('');
|
||||||
setSelectedProductName(option?.label ? option?.label : '');
|
setSelectedProductName(option?.label ? option?.label : '');
|
||||||
formRef?.current?.resetFields(['VarProdId']);
|
formRef?.current?.resetFields(['VarProdId']);
|
||||||
|
|
@ -1172,6 +1177,7 @@ const StockForm = ({ formType }) => {
|
||||||
MRP: ProductData1?.MRP,
|
MRP: ProductData1?.MRP,
|
||||||
ProdName: ProductData1?.ProdName,
|
ProdName: ProductData1?.ProdName,
|
||||||
UomName: ProductData1?.UomName,
|
UomName: ProductData1?.UomName,
|
||||||
|
Size: ProductData1?.Size,
|
||||||
SellPrice: ProductData1?.SellPrice,
|
SellPrice: ProductData1?.SellPrice,
|
||||||
StockAvailable: ProductData1?.StockAvailable,
|
StockAvailable: ProductData1?.StockAvailable,
|
||||||
OnePcsAvailable: ProductData1?.OnePcsAvailable,
|
OnePcsAvailable: ProductData1?.OnePcsAvailable,
|
||||||
|
|
@ -1253,6 +1259,7 @@ const StockForm = ({ formType }) => {
|
||||||
ProdName: product.ProdName,
|
ProdName: product.ProdName,
|
||||||
ProdVariantName: product.ProdVariantName,
|
ProdVariantName: product.ProdVariantName,
|
||||||
UomName: product.UomName,
|
UomName: product.UomName,
|
||||||
|
Size: product.Size,
|
||||||
MRP: product.MRP,
|
MRP: product.MRP,
|
||||||
SellPrice: product.SellPrice,
|
SellPrice: product.SellPrice,
|
||||||
OnePcsPrice: product.OnePcsPrice,
|
OnePcsPrice: product.OnePcsPrice,
|
||||||
|
|
@ -1547,6 +1554,23 @@ const StockForm = ({ formType }) => {
|
||||||
[`${key}${localId}`]: value,
|
[`${key}${localId}`]: value,
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const handleNameSort = () => {
|
||||||
|
const newOrder = nameSortOrder === 'asc' ? 'desc' : 'asc';
|
||||||
|
|
||||||
|
const sorted = [...PurchaseData].sort((a, b) => {
|
||||||
|
const nameA = a.ProdName?.trim() || '';
|
||||||
|
const nameB = b.ProdName?.trim() || '';
|
||||||
|
|
||||||
|
return newOrder === 'asc'
|
||||||
|
? nameA.localeCompare(nameB)
|
||||||
|
: nameB.localeCompare(nameA);
|
||||||
|
});
|
||||||
|
|
||||||
|
setPurchaseData(sorted);
|
||||||
|
setNameSortOrder(newOrder);
|
||||||
|
};
|
||||||
|
|
||||||
const columns = useMemo(() => {
|
const columns = useMemo(() => {
|
||||||
const baseColumns = [
|
const baseColumns = [
|
||||||
{
|
{
|
||||||
|
|
@ -1559,7 +1583,33 @@ const StockForm = ({ formType }) => {
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Name',
|
title: (
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
gap: '4px',
|
||||||
|
justifyContent: 'space-between'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Name
|
||||||
|
<Tooltip
|
||||||
|
title={nameSortOrder === 'asc' ? 'Sort Descending' : 'Sort Ascending'}
|
||||||
|
>
|
||||||
|
{nameSortOrder === 'asc' ? (
|
||||||
|
<SortAscendingOutlined
|
||||||
|
style={{ cursor: 'pointer', fontSize: '14px' }}
|
||||||
|
onClick={handleNameSort}
|
||||||
|
/>
|
||||||
|
) : (
|
||||||
|
<SortDescendingOutlined
|
||||||
|
style={{ cursor: 'pointer', fontSize: '14px' }}
|
||||||
|
onClick={handleNameSort}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</Tooltip>
|
||||||
|
</div>
|
||||||
|
),
|
||||||
dataIndex: 'ProdName',
|
dataIndex: 'ProdName',
|
||||||
key: 'ProdName',
|
key: 'ProdName',
|
||||||
align: 'left',
|
align: 'left',
|
||||||
|
|
@ -1584,6 +1634,9 @@ const StockForm = ({ formType }) => {
|
||||||
key: 'UOMName',
|
key: 'UOMName',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 100,
|
width: 100,
|
||||||
|
render: (text, record, index) => (
|
||||||
|
<a style={{ color: 'black' }}>{record?.Size + ' ' + record?.UomName}</a>
|
||||||
|
),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Qty',
|
title: 'Qty',
|
||||||
|
|
@ -2144,7 +2197,7 @@ const StockForm = ({ formType }) => {
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
return baseColumns;
|
return baseColumns;
|
||||||
}, [editingKey, editingQty, selectedAdditionalColumn]);
|
}, [editingKey, editingQty, selectedAdditionalColumn, PurchaseData]);
|
||||||
|
|
||||||
const statusFormatters = (record) => {
|
const statusFormatters = (record) => {
|
||||||
const localId = record?.localId;
|
const localId = record?.localId;
|
||||||
|
|
@ -2674,7 +2727,7 @@ const StockForm = ({ formType }) => {
|
||||||
// ===============================
|
// ===============================
|
||||||
if (invalidRowNumbers.length > 0) {
|
if (invalidRowNumbers.length > 0) {
|
||||||
Modal.confirm({
|
Modal.confirm({
|
||||||
title: '⚠️ Incomplete Product Rows',
|
title: 'Incomplete Product Rows',
|
||||||
width: 520,
|
width: 520,
|
||||||
centered: true,
|
centered: true,
|
||||||
content: (
|
content: (
|
||||||
|
|
@ -2891,6 +2944,7 @@ const StockForm = ({ formType }) => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleInvoiceSelect = async (value) => {
|
const handleInvoiceSelect = async (value) => {
|
||||||
|
|
||||||
if (value === selectedInvoice) return;
|
if (value === selectedInvoice) return;
|
||||||
|
|
||||||
const invoiceParts = value?.split('-');
|
const invoiceParts = value?.split('-');
|
||||||
|
|
@ -2955,6 +3009,7 @@ const StockForm = ({ formType }) => {
|
||||||
MRP: orderedProduct?.MRP,
|
MRP: orderedProduct?.MRP,
|
||||||
ProdName: orderedProduct?.ProdName,
|
ProdName: orderedProduct?.ProdName,
|
||||||
UomName: orderedProduct?.UomName,
|
UomName: orderedProduct?.UomName,
|
||||||
|
Size: orderedProduct?.Size,
|
||||||
SellPrice: orderedProduct?.SellPrice,
|
SellPrice: orderedProduct?.SellPrice,
|
||||||
StockAvailable: orderedProduct?.StockAvailable,
|
StockAvailable: orderedProduct?.StockAvailable,
|
||||||
OnePcsAvailable: orderedProduct?.OnePcsAvailable,
|
OnePcsAvailable: orderedProduct?.OnePcsAvailable,
|
||||||
|
|
|
||||||
|
|
@ -502,7 +502,7 @@ const StockInhand = () => {
|
||||||
<th>Sl.No</th>
|
<th>Sl.No</th>
|
||||||
<th>Name</th>
|
<th>Name</th>
|
||||||
<th>Variant</th>
|
<th>Variant</th>
|
||||||
<th>Qty</th>
|
<th>Balance Qty</th>
|
||||||
<th>Batch</th>
|
<th>Batch</th>
|
||||||
<th>Barcode</th>
|
<th>Barcode</th>
|
||||||
<th>IMEI 1</th>
|
<th>IMEI 1</th>
|
||||||
|
|
|
||||||
|
|
@ -159,6 +159,7 @@
|
||||||
color: var(--SELECTED_COLOR);
|
color: var(--SELECTED_COLOR);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.BSBillingNav-icon-table-inner {
|
.BSBillingNav-icon-table-inner {
|
||||||
height: 35px;
|
height: 35px;
|
||||||
width: 23px;
|
width: 23px;
|
||||||
|
|
@ -295,7 +296,7 @@
|
||||||
font-size: 25px;
|
font-size: 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.BSC1Payment-Tablediv .ant-table-wrapper .ant-table-thead > tr > th {
|
.BSC1Payment-Tablediv .ant-table-wrapper .ant-table-thead>tr>th {
|
||||||
color: rgb(255, 255, 255) !important;
|
color: rgb(255, 255, 255) !important;
|
||||||
font-weight: 600 !important;
|
font-weight: 600 !important;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
|
@ -378,6 +379,8 @@
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
font-family: 'Poppins', sans-serif;
|
||||||
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.EstPopupContent {
|
.EstPopupContent {
|
||||||
|
|
@ -400,8 +403,10 @@
|
||||||
.barcode-container {
|
.barcode-container {
|
||||||
width: 90vw;
|
width: 90vw;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center; /* Center horizontally */
|
justify-content: center;
|
||||||
align-items: center; /* Center vertically */
|
/* Center horizontally */
|
||||||
|
align-items: center;
|
||||||
|
/* Center vertically */
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
height: 200px;
|
height: 200px;
|
||||||
background-color: #f9f9f9;
|
background-color: #f9f9f9;
|
||||||
|
|
@ -411,14 +416,18 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: background-color 0.3s ease;
|
transition: background-color 0.3s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.barcode-icon1 {
|
.barcode-icon1 {
|
||||||
// width: 90vw;
|
// width: 90vw;
|
||||||
font-size: 100px; /* size of the icon */
|
font-size: 100px;
|
||||||
color: #52c41a; /* blue color */
|
/* size of the icon */
|
||||||
|
color: #52c41a;
|
||||||
|
/* blue color */
|
||||||
transition:
|
transition:
|
||||||
transform 0.2s ease,
|
transform 0.2s ease,
|
||||||
color 0.2s ease;
|
color 0.2s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
////
|
////
|
||||||
.search-container-code {
|
.search-container-code {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue