1037 lines
34 KiB
JavaScript
1037 lines
34 KiB
JavaScript
import React, { useEffect, useState, useRef } from 'react';
|
|
import { useDispatch } from 'react-redux';
|
|
import { Switch, Tooltip, Form, DatePicker } from 'antd';
|
|
import { BiSolidPrinter, BiUpArrowCircle } from 'react-icons/bi';
|
|
import Denomination from '../Denomination/Denomination';
|
|
import '../../../Styles/Reports/DateWiseReport/DateWiseReport.scss';
|
|
import '../../../Styles/Reports/ItemWiseReport/ItemWiseReport.scss';
|
|
import { changeBreadCrumb } from '../../../Features/AppPage/CenterPage';
|
|
import {
|
|
getDatewiseReport,
|
|
getPreferenceData,
|
|
PreferenceData,
|
|
UserDataBasedOnBranchId,
|
|
wholesalegetDatewiseReport,
|
|
} from '../../../Features/BookingScreen/BookingData/BookingData';
|
|
import { getSession, printDiv } from '../../../Services/WSOthers';
|
|
import DatewiseReportPdf from '../../paymentpdfPage/DateWiseReportPdf';
|
|
import { DropDowns } from '../../../Components/Forms/DropDown.jsx';
|
|
import { isMobile } from 'react-device-detect';
|
|
import { RadioGrpButton } from '../../../Components/Forms/RadioGroup.jsx';
|
|
import { IoSearch } from 'react-icons/io5';
|
|
import { ExtractDateFormate } from '../../../Services/Others.js';
|
|
import { useSelector } from 'react-redux';
|
|
import { ReportMobilePDFPrint } from '../../paymentpdfPage/ReportMobilePDFPrint.js';
|
|
import dayjs from 'dayjs';
|
|
const { RangePicker } = DatePicker;
|
|
|
|
const subDirectory = import.meta.env.BASE_URL;
|
|
|
|
const DateWiseReport = () => {
|
|
const [open, setOpen] = useState(false);
|
|
const formRef = useRef();
|
|
const dispatch = useDispatch();
|
|
const SettingDataSelector = useSelector(PreferenceData);
|
|
const [datewiseData, setDatewiseData] = useState();
|
|
const CompId = getSession('CompId');
|
|
const BranchId = getSession('BranchId');
|
|
const UserRole = getSession('UserType');
|
|
const AppId = getSession('AppId');
|
|
const AppType =
|
|
getSession('AppType')?.toLowerCase() == 'wholesale' ? true : false;
|
|
const [OrderFromDate, setOrderFromDate] = useState();
|
|
const [OrderToDate, setOrderToDate] = useState();
|
|
const sessionuserid = getSession('UserId')
|
|
const [UserId, setUserId] = useState(
|
|
UserRole != 'Employee' ? 0 : getSession('UserId')
|
|
);
|
|
const [userDropDown, setuserDropDown] = useState([]);
|
|
const [selectedUserData, setSelectedUserData] = useState(null);
|
|
const [dataSource, setdataSource] = useState([]);
|
|
const [page, setpage] = useState(1);
|
|
const [receiptText, setreceiptText] = useState(null);
|
|
const [WholeDataSource, setWholeDataSource] = useState([]);
|
|
const [Selecttype, setSelecttype] = useState('A');
|
|
const [TotalCashInHand, setTotalCashInHand] = useState([]);
|
|
const [allowDecimal, setAllowDecimal] = useState(false);
|
|
const [openDenomination, setOpenDenomination] = useState(false);
|
|
const [denominationData, setDenominationData] = useState({
|
|
Amounts: {},
|
|
OverAllTotal: 0,
|
|
});
|
|
const MobileA4Print = SettingDataSelector?.[0]?.SettingDtlDetails?.find(
|
|
(setting) =>
|
|
setting?.SettingIdName?.toLowerCase() === 'mobilea4' &&
|
|
setting?.SettingValue === 'Y'
|
|
);
|
|
console.log(MobileA4Print, SettingDataSelector, 'MobileA4PrintMobileA4Print');
|
|
|
|
useEffect(() => {
|
|
if (dataSource?.length > 0) {
|
|
mobileDateWisePrintFun(dataSource);
|
|
}
|
|
}, [dataSource]);
|
|
useEffect(() => {
|
|
if (WholeDataSource?.length > 0) {
|
|
mobileDateWisePrintFun(WholeDataSource);
|
|
}
|
|
}, [WholeDataSource]);
|
|
|
|
const reprintDate = (date) => {
|
|
const salesDate = new Date(date);
|
|
const formattedDate = salesDate.toLocaleDateString('en-GB', {
|
|
day: '2-digit',
|
|
month: '2-digit',
|
|
year: 'numeric',
|
|
});
|
|
return formattedDate;
|
|
};
|
|
|
|
const mobileDateWisePrintFun = async (data) => {
|
|
const Dataa = ['Cash', 'Upi', 'Card', 'Credit']
|
|
?.map((method) => {
|
|
const amountKey = `${method}Amount`;
|
|
const countKey = `${method}Count`;
|
|
let TableData = AppType ? WholeDataSource : dataSource;
|
|
const total = TableData?.reduce(
|
|
(acc, entry) => {
|
|
acc.amount += entry[amountKey] || 0;
|
|
acc.count += entry[countKey] || 0;
|
|
return acc;
|
|
},
|
|
{ amount: 0, count: 0 }
|
|
);
|
|
|
|
return {
|
|
PaymentMethod: method,
|
|
CountOfPaymentType: total.count,
|
|
NetAmount: total.amount,
|
|
};
|
|
})
|
|
?.filter((entry) => entry.NetAmount > 0);
|
|
|
|
let Tabledata = Dataa?.map((data, index) => {
|
|
const snoSpacing = Math.max(0, 3 - String(index + 1).length);
|
|
// Calculate dynamic spacing for Rate
|
|
const rateSpacing = Math.max(0, 9 - String(data?.NetAmount).length);
|
|
const QtySpacing = Math.max(
|
|
0,
|
|
3 - String(data?.CountOfPaymentType).length
|
|
);
|
|
|
|
// Generate formatted string with dynamic spacings
|
|
const formattedString =
|
|
' '.repeat(snoSpacing) +
|
|
parseInt(index + 1) +
|
|
' ' +
|
|
(data?.PaymentMethod + ' '.repeat(22)).substring(0, 22) +
|
|
' ' +
|
|
' '.repeat(QtySpacing) +
|
|
String(data?.CountOfPaymentType) +
|
|
' ' +
|
|
' '.repeat(rateSpacing) +
|
|
String(data?.NetAmount) +
|
|
' ' +
|
|
'\n';
|
|
|
|
return formattedString;
|
|
});
|
|
const OrderSpace = Math.max(
|
|
0,
|
|
6 - String(datewiseData?.[0]?.Orders).length
|
|
);
|
|
const Billamountspace = Math.max(
|
|
0,
|
|
6 -
|
|
String(
|
|
(AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseNetAmount
|
|
: datewiseData?.[0]?.TotalBillAmount
|
|
)?.toFixed(2)
|
|
).length
|
|
);
|
|
const Taxamountspace = Math.max(
|
|
0,
|
|
6 -
|
|
String(
|
|
(AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseTaxAmount
|
|
: datewiseData?.[0]?.TaxAmount
|
|
)?.toFixed(2)
|
|
).length
|
|
);
|
|
const Chargesamountspace = Math.max(
|
|
0,
|
|
6 - String(datewiseData?.[0]?.TotalExtraChargeAmount?.toFixed(2)).length
|
|
);
|
|
const Preorderamountspace = Math.max(
|
|
0,
|
|
6 - String(datewiseData?.[0]?.PreOrderNetAmount?.toFixed(2)).length
|
|
);
|
|
const Discountamountspace = Math.max(
|
|
0,
|
|
6 -
|
|
String(
|
|
(AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseTotalOverallDisc
|
|
: datewiseData?.[0]?.TotalOfferAmount
|
|
)?.toFixed(2)
|
|
).length
|
|
);
|
|
const Netamountspace = Math.max(
|
|
0,
|
|
6 -
|
|
String(
|
|
(AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseNetAmount
|
|
: datewiseData?.[0]?.TotalNetAmount
|
|
)?.toFixed(2)
|
|
).length
|
|
);
|
|
var data = datewiseData && datewiseData[0] ? datewiseData[0] : {};
|
|
var receiptTextdata =
|
|
"[C]<b><font size='big'>Datewise Sales</font></b>\n" +
|
|
'[L]<b>From Date :' +
|
|
reprintDate(OrderFromDate) +
|
|
'[R]<b> To Date :' +
|
|
reprintDate(OrderToDate) +
|
|
'</b>\n' +
|
|
'[C]------------------------------------------------\n' +
|
|
'[L]<b>S.No Payment Type Count Amount</b>[L]\n' +
|
|
'[C]------------------------------------------------\n' +
|
|
Tabledata.join('') +
|
|
'[C]<b>------------------------------------------------</b>\n' +
|
|
'[R]<b>Orders:' +
|
|
(data?.Orders || 0) +
|
|
' '.repeat(OrderSpace) +
|
|
'</b>\n' +
|
|
'[R]<b>Bill Amount:' +
|
|
parseFloat(
|
|
!AppType
|
|
? (data?.TotalBillAmount || 0) -
|
|
(data?.TotalExtraChargeAmount || 0) +
|
|
(data?.TotalOfferAmount || 0)
|
|
: data?.WholeSaleExpenseNetAmount || 0
|
|
).toFixed(2) +
|
|
' '.repeat(Billamountspace) +
|
|
'</b>\n';
|
|
|
|
// Tax
|
|
if ((AppType ? data?.WholeSaleExpenseTaxAmount : data?.TaxAmount) > 0) {
|
|
receiptTextdata +=
|
|
'[R]<b>Tax:' +
|
|
parseFloat(
|
|
AppType ? data?.WholeSaleExpenseTaxAmount : data?.TaxAmount
|
|
).toFixed(2) +
|
|
' '.repeat(Taxamountspace) +
|
|
'</b>\n';
|
|
}
|
|
|
|
// Charges
|
|
if ((data?.TotalExtraChargeAmount || 0) > 0) {
|
|
receiptTextdata +=
|
|
'[R]<b>Charges:' +
|
|
parseFloat(data?.TotalExtraChargeAmount).toFixed(2) +
|
|
' '.repeat(Chargesamountspace) +
|
|
'</b>\n';
|
|
}
|
|
|
|
// Preorder
|
|
if ((data?.PreOrderNetAmount || 0) > 0) {
|
|
receiptTextdata +=
|
|
'[R]<b>Preorder:' +
|
|
parseFloat(data?.PreOrderNetAmount).toFixed(2) +
|
|
' '.repeat(Preorderamountspace) +
|
|
'</b>\n';
|
|
}
|
|
|
|
// Discount
|
|
var discountAmount = AppType
|
|
? data?.WholeSaleExpenseTotalOverallDisc
|
|
: data?.TotalOfferAmount;
|
|
if ((discountAmount || 0) > 0) {
|
|
receiptTextdata +=
|
|
'[R]<b>Discount(-):' +
|
|
parseFloat(discountAmount).toFixed(2) +
|
|
' '.repeat(Discountamountspace) +
|
|
'</b>\n';
|
|
}
|
|
|
|
receiptTextdata +=
|
|
'[L]<b>------------------------------------------------</b>\n' +
|
|
'[R]<b>Net:' +
|
|
parseFloat(
|
|
Math.round(
|
|
AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseNetAmount || 0
|
|
: datewiseData?.[0]?.TotalNetAmount +
|
|
(datewiseData?.[0]?.PreOrderNetAmount || 0) || 0
|
|
)
|
|
).toFixed(2) +
|
|
' '.repeat(Netamountspace) +
|
|
'</b>\n';
|
|
|
|
setreceiptText(receiptTextdata);
|
|
};
|
|
const items = [
|
|
{
|
|
name: 'Home',
|
|
link: `${subDirectory}app-page/home`,
|
|
},
|
|
];
|
|
const style = `<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Podkova:wght@400..800&display=swap');
|
|
|
|
@media print {
|
|
body {
|
|
font-family:"Podkova", serif;
|
|
font-size: 13px; /* Adjust font size for print */
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
}
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
font-family:"Podkova", serif;
|
|
}
|
|
.imgDiv {
|
|
height: 50px;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
.Dates {
|
|
width: 93%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
alignItems: center;
|
|
margin-left: 15px;
|
|
}
|
|
.DatesStyle {
|
|
display: flex;
|
|
gap: 0.3rem;
|
|
}
|
|
|
|
.p {
|
|
font-size: 10px;
|
|
}
|
|
|
|
.totalAmount {
|
|
width: 95%;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
font-size: 15px;
|
|
margin-top: 5px;
|
|
}
|
|
.totaldetails {
|
|
width: 95%;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
font-size: 10px;
|
|
}
|
|
.Table,
|
|
.th,
|
|
.td {
|
|
border: 1px solid black;
|
|
border-collapse: collapse;
|
|
font-size: 10px;
|
|
}
|
|
.td {
|
|
padding: 4px
|
|
}
|
|
.th {
|
|
padding: 4px
|
|
}
|
|
|
|
.DateWiseSales {
|
|
display: flex;
|
|
justify-content: center;
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
}
|
|
.Table {
|
|
width: 95%;
|
|
}
|
|
.Pdf-Table-Div {
|
|
margin-left: 15px;
|
|
}
|
|
|
|
</style>`;
|
|
|
|
useEffect(() => {
|
|
getPreference();
|
|
dispatch(changeBreadCrumb({ items: items }));
|
|
fetchInitialData();
|
|
if (UserRole != 'Employee') {
|
|
userDropData();
|
|
}
|
|
}, []);
|
|
|
|
const getPreference = async () => {
|
|
const data = { AppId: AppId, CompId: CompId, BranchId: BranchId, UserId: sessionuserid };
|
|
const { data: res } = await dispatch(getPreferenceData(data)).unwrap();
|
|
const decimalSetting = res?.data?.[0]?.SettingDtlDetails?.find(
|
|
(setting) =>
|
|
setting?.SettingIdName?.toLowerCase() === 'decimal' &&
|
|
setting?.SettingValue === 'Y'
|
|
);
|
|
if (decimalSetting) {
|
|
setAllowDecimal(true);
|
|
}
|
|
};
|
|
|
|
const userDropData = async () => {
|
|
const gettinguserDropDown = await dispatch(
|
|
UserDataBasedOnBranchId(BranchId)
|
|
).unwrap();
|
|
if (gettinguserDropDown?.data?.statusCode === 1) {
|
|
let finaluserDropDown = gettinguserDropDown?.data?.data?.filter(
|
|
(value) => value.ActiveStatus === 'A'
|
|
);
|
|
finaluserDropDown.push({ UserId: 0, UserName: 'All User' });
|
|
// let admindtl = {"UserId":finaluserDropDown?.[0]?.AdminDetail?.[0]?.UserId,
|
|
// "UserName":finaluserDropDown?.[0]?.AdminDetail?.[0]?.UserName+' ('+"Admin"+')'};
|
|
// finaluserDropDown.push(admindtl);
|
|
|
|
setSelectedUserData(0);
|
|
formRef.current?.setFieldsValue({
|
|
UserId: 0,
|
|
});
|
|
|
|
setuserDropDown(finaluserDropDown);
|
|
}
|
|
};
|
|
|
|
const fetchInitialData = async () => {
|
|
let currentDate = new Date().toJSON().slice(0, 10);
|
|
formRef?.current?.setFieldsValue({
|
|
dateRange: [
|
|
dayjs(currentDate, 'YYYY-MM-DD'),
|
|
dayjs(currentDate, 'YYYY-MM-DD'),
|
|
],
|
|
});
|
|
setOrderFromDate(currentDate + 'T00:00:00');
|
|
setOrderToDate(currentDate + 'T23:59:59');
|
|
let data = {
|
|
CompId: CompId,
|
|
BranchId: BranchId,
|
|
AppId: AppId,
|
|
OrderFromDate: currentDate,
|
|
OrderToDate: currentDate,
|
|
UserId: UserRole != 'Employee' ? 0 : UserId,
|
|
filterType: Selecttype,
|
|
};
|
|
|
|
if (AppType) {
|
|
let response = await dispatch(wholesalegetDatewiseReport(data)).unwrap();
|
|
if (response?.data?.statusCode === 1) {
|
|
setDatewiseData(response?.data?.data);
|
|
// setdataSource(response?.data?.data?.[0]?.OrderDetails);
|
|
setWholeDataSource(
|
|
response?.data?.data?.[0]?.WholeSaleExpenseOrderDetails
|
|
);
|
|
} else {
|
|
setDatewiseData([]);
|
|
setdataSource([]);
|
|
}
|
|
} else {
|
|
let response = await dispatch(getDatewiseReport(data)).unwrap();
|
|
if (response?.data?.statusCode === 1) {
|
|
setDatewiseData(response?.data?.data);
|
|
setdataSource(response?.data?.data?.[0]?.OrderDetails);
|
|
setTotalCashInHand(response?.data?.data?.[0]?.OrderDetails);
|
|
} else {
|
|
setDatewiseData([]);
|
|
setdataSource([]);
|
|
}
|
|
}
|
|
};
|
|
|
|
function safeRound(amountStr) {
|
|
if (amountStr == null) return allowDecimal ? '0.00' : '0';
|
|
|
|
const cleaned = String(amountStr).replace(/[^0-9.-]+/g, '');
|
|
const num = Number(cleaned);
|
|
|
|
if (isNaN(num)) return allowDecimal ? '0.00' : '0';
|
|
|
|
return allowDecimal ? num.toFixed(2) : Math.round(num).toString();
|
|
}
|
|
|
|
function changeDateFormat(dateStr) {
|
|
if (!dateStr || typeof dateStr !== 'string') return '';
|
|
const dateParts = dateStr.split('-');
|
|
if (dateParts.length !== 3) return '';
|
|
return `${dateParts[2]}-${dateParts[1]}-${dateParts[0]}`;
|
|
}
|
|
|
|
// const columns = [
|
|
// {
|
|
// title: 'SI NO',
|
|
// dataIndex: 'SINO',
|
|
// key: 'SINO',
|
|
// align: 'center',
|
|
// render: (text, object, index) => (
|
|
// <a style={{ color: 'black' }}>{(page - 1) * 10 + index + 1}</a>
|
|
// ),
|
|
// },
|
|
// {
|
|
// title: 'Payment Type',
|
|
// dataIndex: 'PaymentMethod',
|
|
// key: 'PaymentMethod',
|
|
// },
|
|
// {
|
|
// title: 'Date',
|
|
// dataIndex: 'Date',
|
|
// key: 'Date',
|
|
// render: (text) => (
|
|
// <span style={{ color: 'black' }}>{changeDateFormat(text)}</span>
|
|
// ),
|
|
// },
|
|
// {
|
|
// title: 'Count',
|
|
// dataIndex: 'TotalOrders',
|
|
// key: 'TotalOrders',
|
|
// align: 'right',
|
|
// },
|
|
// {
|
|
// title: 'Amount Collected',
|
|
// dataIndex: 'BillAmount',
|
|
// key: 'BillAmount',
|
|
// align: 'right',
|
|
// render: (text) => <span>{safeRound(text)}</span>,
|
|
// },
|
|
// ];
|
|
|
|
const UserDropDownChange = async (e) => {
|
|
setUserId(e);
|
|
let mob = userDropDown?.filter((item) => item?.UserId === e);
|
|
formRef.current?.setFieldsValue({
|
|
UserId: e,
|
|
MobileNo: mob?.[0]?.MobileNo,
|
|
});
|
|
setSelectedUserData(e);
|
|
};
|
|
|
|
const OrderDateRangeFetch = (dates, dateStrings) => {
|
|
const [from, to] = dates || [];
|
|
const [fromStr, toStr] = dateStrings || [];
|
|
|
|
// Clear when picker cleared
|
|
if (!from || !fromStr) {
|
|
setOrderFromDate(undefined);
|
|
formRef.current?.setFieldsValue({ Fromdate: undefined });
|
|
} else {
|
|
const DateFrom = `${fromStr.split('-').reverse().join('-')}T00:00:00`;
|
|
// fromStr is in DD-MM-YYYY, convert to YYYY-MM-DD
|
|
setOrderFromDate(DateFrom);
|
|
formRef.current?.setFieldsValue({ Fromdate: DateFrom });
|
|
}
|
|
|
|
if (!to || !toStr) {
|
|
setOrderToDate(undefined);
|
|
formRef.current?.setFieldsValue({ Todate: undefined });
|
|
} else {
|
|
// set To as end of day for inclusive queries
|
|
const toIso = `${toStr.split('-').reverse().join('-')}T23:59:59`;
|
|
setOrderToDate(toIso);
|
|
formRef.current?.setFieldsValue({ Todate: toIso });
|
|
}
|
|
};
|
|
const Print = async () => {
|
|
let LogoImage = '';
|
|
let OrderId = '';
|
|
let UpiId = '';
|
|
let TokenData = '';
|
|
let FooterPrint = '';
|
|
if (isMobile) {
|
|
// if (MobileA4Print) {
|
|
// ReportMobilePDFPrint({
|
|
// printId: 'RePrint',
|
|
// printStyle: style,
|
|
// });
|
|
// } else {
|
|
var textEncoded = encodeURI(receiptText);
|
|
var TypeCheck = 'PrintReceipt';
|
|
var scheme = 'pozoprinter';
|
|
var packageName = 'com.example.pozoprinter';
|
|
|
|
window.location.href =
|
|
scheme +
|
|
'://' +
|
|
textEncoded +
|
|
'#Intent;scheme=' +
|
|
scheme +
|
|
';package=' +
|
|
packageName +
|
|
'ImgS' +
|
|
LogoImage +
|
|
'ImgE' +
|
|
TypeCheck +
|
|
'TokenS' +
|
|
TokenData +
|
|
'TokenE' +
|
|
'EstimateS' +
|
|
'' +
|
|
'EstimateE' +
|
|
'HasFooterTextS' +
|
|
FooterPrint +
|
|
'HasFooterTextE' +
|
|
';end;';
|
|
// }
|
|
} else {
|
|
await printDiv('RePrint', style);
|
|
}
|
|
};
|
|
|
|
const onFinish = async (values) => {
|
|
let data = {
|
|
CompId: CompId,
|
|
BranchId: BranchId,
|
|
AppId: AppId,
|
|
OrderFromDate: OrderFromDate?.split('T')?.[0],
|
|
OrderToDate: OrderToDate?.split('T')?.[0],
|
|
UserId: UserId,
|
|
filterType: Selecttype,
|
|
};
|
|
|
|
if (AppType) {
|
|
let response = await dispatch(wholesalegetDatewiseReport(data)).unwrap();
|
|
if (response?.data?.statusCode === 1) {
|
|
setDatewiseData(response?.data?.data);
|
|
setWholeDataSource(
|
|
response?.data?.data?.[0]?.WholeSaleExpenseOrderDetails
|
|
);
|
|
} else {
|
|
setDatewiseData([]);
|
|
setdataSource([]);
|
|
setWholeDataSource([]);
|
|
}
|
|
} else {
|
|
let response = await dispatch(getDatewiseReport(data)).unwrap();
|
|
if (response?.data?.statusCode === 1) {
|
|
setDatewiseData(response?.data?.data);
|
|
setdataSource(response?.data?.data?.[0]?.OrderDetails);
|
|
} else {
|
|
setDatewiseData([]);
|
|
setdataSource([]);
|
|
setWholeDataSource([]);
|
|
}
|
|
}
|
|
};
|
|
const TotalBill = AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseNetAmount
|
|
: datewiseData?.[0]?.TotalBillAmount;
|
|
|
|
const handleDenominationChange = (data) => {
|
|
setDenominationData(data);
|
|
};
|
|
|
|
const selectdataType = (e) => {
|
|
setSelecttype(e);
|
|
// formRef.current?.resetFields()
|
|
};
|
|
|
|
return (
|
|
<div className="DateWiseReport-container">
|
|
<div style={{ display: 'none' }}>
|
|
<DatewiseReportPdf
|
|
OrderFromDate={OrderFromDate?.split('T')?.[0]}
|
|
OrderToDate={OrderToDate?.split('T')?.[0]}
|
|
dataSource={AppType ? WholeDataSource : dataSource}
|
|
TotalBill={TotalBill}
|
|
datewiseData={datewiseData}
|
|
TotalOrders={
|
|
AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseCount
|
|
: datewiseData?.[0]?.Orders
|
|
}
|
|
TotalBillAmount={TotalBill}
|
|
TaxAmount={
|
|
AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseTaxAmount
|
|
: datewiseData?.[0]?.TaxAmount
|
|
}
|
|
TotalNetAmount={
|
|
AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseNetAmount
|
|
: datewiseData?.[0]?.TotalNetAmount
|
|
}
|
|
TotalPreOrderAmount={datewiseData?.[0]?.PreOrderNetAmount}
|
|
TotalCharges={datewiseData?.[0]?.TotalExtraChargeAmount}
|
|
TotalDiscount={datewiseData?.[0]?.TotalOfferAmount}
|
|
ReportName={''}
|
|
/>
|
|
</div>
|
|
<Form ref={formRef} onFinish={onFinish}>
|
|
<div
|
|
className="DateWiseReport-dateandheading"
|
|
style={{ display: 'flex' }}
|
|
>
|
|
<p className="DateWiseReport-heading">Daily Sales</p>
|
|
|
|
<div className="DateWiseReport-dateaAnd-buttons">
|
|
<div
|
|
className="DateWiseReport-Date-picker"
|
|
style={{ display: 'flex', flexDirection: 'row', rowGap: '1rem' }}
|
|
>
|
|
<div className="DateWiseReport-datepic">
|
|
<div className="DateWiseReport-DateFrom">
|
|
<Form.Item
|
|
name="dateRange"
|
|
initialValue={[dayjs(), dayjs()]} // ✅ Preselect today for both From and To
|
|
rules={[
|
|
{
|
|
required: true,
|
|
message: 'Please select From and To Dates',
|
|
},
|
|
]}
|
|
>
|
|
<RangePicker
|
|
format="DD-MM-YYYY"
|
|
allowClear
|
|
disabledDate={(current) => current && current > dayjs()} // Disable future dates
|
|
onChange={(dates, dateStrings) => {
|
|
OrderDateRangeFetch(dates, dateStrings);
|
|
}}
|
|
placeholder={['From Date', 'To Date']}
|
|
/>
|
|
</Form.Item>
|
|
</div>
|
|
<div className="datewise-userDropDown">
|
|
{UserRole != 'Employee' && (
|
|
<Form.Item
|
|
name="UserId"
|
|
rules={[
|
|
{
|
|
required: true,
|
|
message: 'Please Select User Name',
|
|
},
|
|
]}
|
|
>
|
|
<DropDowns
|
|
options={userDropDown?.map((option) => ({
|
|
value: option?.UserId,
|
|
label: option?.UserName,
|
|
}))}
|
|
label={<label>User Name</label>}
|
|
id="UserId"
|
|
field="UserId"
|
|
fieldState={true}
|
|
fieldApi={true}
|
|
className="field-DropDown-Emp"
|
|
onChangeFunction={(e) => UserDropDownChange(e)}
|
|
isOnchanges={selectedUserData ? true : false}
|
|
valueData={selectedUserData}
|
|
// defaultValue={LastSelectConfig}
|
|
/>
|
|
</Form.Item>
|
|
)}
|
|
</div>
|
|
<div>
|
|
<Form.Item name="Select">
|
|
<RadioGrpButton
|
|
content={[
|
|
{ value: 'A', label: 'All' },
|
|
{ value: 'I', label: 'Individual' },
|
|
]}
|
|
fieldState={true}
|
|
defaultSelect={Selecttype}
|
|
onSelectFuntion={(e) => selectdataType(e)}
|
|
onClickFunction={(e) => selectdataType(e)}
|
|
/>
|
|
</Form.Item>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="DateWiseReport-submit-prnt">
|
|
<div>
|
|
<Tooltip title="Submit to search">
|
|
<button
|
|
type="submit"
|
|
style={{
|
|
display: 'flex',
|
|
gap: '1rem',
|
|
alignItems: 'center',
|
|
fontFamily: 'Poppins, sans-serif',
|
|
}}
|
|
className="DateWiseReport-submit-btn"
|
|
>
|
|
SEARCH <IoSearch />
|
|
</button>
|
|
</Tooltip>
|
|
</div>
|
|
|
|
<div>
|
|
<Tooltip title="Print">
|
|
<BiSolidPrinter
|
|
className={
|
|
datewiseData?.[0]?.TotalNetAmount > 0
|
|
? 'DateWiseReport-printerIcon'
|
|
: 'DateWiseReport-printerIcon-disabled'
|
|
}
|
|
onClick={Print}
|
|
/>
|
|
</Tooltip>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="DateWiseReport-coontent-body">
|
|
<div
|
|
className={
|
|
openDenomination
|
|
? 'DateWiseReport-table-withDenom'
|
|
: 'DateWiseReport-table-withoutDenom'
|
|
}
|
|
>
|
|
<div className="DateWiseReport-table">
|
|
<table className="custom-table">
|
|
<thead>
|
|
<tr>
|
|
<th rowSpan="2" style={{ textAlign: 'center' }}>
|
|
S.No
|
|
</th>
|
|
{dataSource?.[0]?.Date && (
|
|
<th rowSpan="2" style={{ textAlign: 'center' }}>
|
|
Date
|
|
</th>
|
|
)}
|
|
<th colSpan="2" style={{ textAlign: 'center' }}>
|
|
Cash
|
|
</th>
|
|
<th colSpan="2" style={{ textAlign: 'center' }}>
|
|
UPI
|
|
</th>
|
|
<th colSpan="2" style={{ textAlign: 'center' }}>
|
|
Card
|
|
</th>
|
|
<th colSpan="2" style={{ textAlign: 'center' }}>
|
|
Credit
|
|
</th>
|
|
<th rowSpan="2" style={{ textAlign: 'center' }}>
|
|
Total
|
|
</th>
|
|
</tr>
|
|
<tr>
|
|
<th style={{ textAlign: 'center' }}>Count</th>
|
|
<th style={{ textAlign: 'center' }}>Amt</th>
|
|
<th style={{ textAlign: 'center' }}>Count</th>
|
|
<th style={{ textAlign: 'center' }}>Amt</th>
|
|
<th style={{ textAlign: 'center' }}>Count</th>
|
|
<th style={{ textAlign: 'center' }}>Amt</th>
|
|
<th style={{ textAlign: 'center' }}>Count</th>
|
|
<th style={{ textAlign: 'center' }}>Amt</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{(AppType ? WholeDataSource : dataSource)?.map((row, idx) => {
|
|
const {
|
|
Date,
|
|
CashCount = 0,
|
|
CashAmount = 0,
|
|
UpiCount = 0,
|
|
UpiAmount = 0,
|
|
CardCount = 0,
|
|
CardAmount = 0,
|
|
CreditCount = 0,
|
|
CreditAmount = 0,
|
|
} = row;
|
|
|
|
const date = Date ? ExtractDateFormate(Date) : '';
|
|
const totalAmt = [
|
|
CashAmount,
|
|
UpiAmount,
|
|
CardAmount,
|
|
CreditAmount,
|
|
].reduce((sum, val) => sum + Number(val), 0);
|
|
|
|
return (
|
|
<tr key={Date + idx}>
|
|
<td style={{ textAlign: 'center' }}>{idx + 1}</td>
|
|
{dataSource?.[0]?.Date && (
|
|
<td style={{ textAlign: 'center' }}>{date}</td>
|
|
)}
|
|
<td style={{ textAlign: 'right' }}>{CashCount ?? 0}</td>
|
|
<td style={{ textAlign: 'right' }}>
|
|
{safeRound(CashAmount)}
|
|
</td>
|
|
<td style={{ textAlign: 'right' }}>{UpiCount ?? 0}</td>
|
|
<td style={{ textAlign: 'right' }}>
|
|
{safeRound(UpiAmount)}
|
|
</td>
|
|
<td style={{ textAlign: 'right' }}>{CardCount ?? 0}</td>
|
|
<td style={{ textAlign: 'right' }}>
|
|
{safeRound(CardAmount)}
|
|
</td>
|
|
<td style={{ textAlign: 'right' }}>
|
|
{CreditCount ?? 0}
|
|
</td>
|
|
<td style={{ textAlign: 'right' }}>
|
|
{safeRound(CreditAmount)}
|
|
</td>
|
|
<td style={{ textAlign: 'right' }}>
|
|
{safeRound(totalAmt)}
|
|
</td>
|
|
</tr>
|
|
);
|
|
})}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
{/* <div className="DateWiseReport-mobile-screen-Denomination">
|
|
<p>Denomination:</p>
|
|
<Popover
|
|
// content={<a onClick={hide}>Close</a>}
|
|
content={<Denomination />}
|
|
trigger="click"
|
|
open={open}
|
|
onOpenChange={handleOpenChange}
|
|
>
|
|
<div className="DateWiseReport-popup-button">
|
|
<BiUpArrowCircle style={{ fontSize: "25px" }} />
|
|
</div>
|
|
</Popover>
|
|
</div>
|
|
*/}
|
|
|
|
<div className="DateWiseReport-Amount-Collected-container">
|
|
{/* <div className="DateWiseReport-toggle-container">
|
|
<p>Denomination</p> <Switch onChange={onChange} />
|
|
</div> */}
|
|
|
|
<div className="DateWiseReport-Amount-Collected-table">
|
|
<table className="DateWiseReport-Amount-Collected-table-div">
|
|
<thead>
|
|
<tr>
|
|
<th>Orders</th>
|
|
<th>
|
|
{!AppType
|
|
? datewiseData?.[0]?.Orders
|
|
: datewiseData?.[0]?.WholeSaleExpenseCount}
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Bill Amount</td>
|
|
<td>
|
|
{!AppType
|
|
? (datewiseData?.[0]?.TotalBillAmount || 0) -
|
|
(datewiseData?.[0]?.TotalExtraChargeAmount || 0) +
|
|
(datewiseData?.[0]?.TotalOfferAmount || 0)
|
|
: datewiseData?.[0]?.WholeSaleExpenseNetAmount}
|
|
</td>
|
|
</tr>
|
|
{!AppType
|
|
? datewiseData?.[0]?.TaxAmount > 0 && (
|
|
<tr>
|
|
<td>Tax</td>
|
|
<td>{datewiseData?.[0]?.TaxAmount}</td>
|
|
</tr>
|
|
)
|
|
: datewiseData?.[0]?.WholeSaleExpenseTaxAmount > 0 && (
|
|
<tr>
|
|
<td>Tax</td>
|
|
<td>
|
|
{datewiseData?.[0]?.WholeSaleExpenseTaxAmount}
|
|
</td>
|
|
</tr>
|
|
)}
|
|
{datewiseData?.[0]?.TotalExtraChargeAmount > 0 && (
|
|
<tr>
|
|
<td>Charges</td>
|
|
<td>{datewiseData?.[0]?.TotalExtraChargeAmount}</td>
|
|
</tr>
|
|
)}
|
|
{datewiseData?.[0]?.RefundAmount > 0 && (
|
|
<tr>
|
|
<td>Refund (-)</td>
|
|
<td>{datewiseData?.[0]?.RefundAmount}</td>
|
|
</tr>
|
|
)}
|
|
{datewiseData?.[0]?.PreOrderNetAmount > 0 && (
|
|
<tr>
|
|
<td>Preorder</td>
|
|
<td>{datewiseData?.[0]?.PreOrderNetAmount}</td>
|
|
</tr>
|
|
)}
|
|
{AppType
|
|
? datewiseData?.[0]?.WholeSaleExpenseTotalOverallDisc >
|
|
0 && (
|
|
<tr>
|
|
<td>Discount(-)</td>
|
|
<td>
|
|
{
|
|
datewiseData?.[0]
|
|
?.WholeSaleExpenseTotalOverallDisc
|
|
}
|
|
</td>
|
|
</tr>
|
|
)
|
|
: datewiseData?.[0]?.TotalOfferAmount > 0 && (
|
|
<tr>
|
|
<td>Discount(-)</td>
|
|
<td>{datewiseData?.[0]?.TotalOfferAmount}</td>
|
|
</tr>
|
|
)}
|
|
|
|
<p className="DateWiseReport-border-dashed"></p>
|
|
<tr>
|
|
<td className="DateWiseReport-netAmount">Net</td>
|
|
<td className="DateWiseReport-netAmount">
|
|
{AppType
|
|
? safeRound(
|
|
datewiseData?.[0]?.WholeSaleExpenseNetAmount
|
|
) || 0
|
|
: safeRound(
|
|
(datewiseData?.[0]?.TotalBillAmount || 0) +
|
|
(datewiseData?.[0]?.TaxAmount || 0) +
|
|
(datewiseData?.[0]?.PreOrderNetAmount || 0) -
|
|
(datewiseData?.[0]?.RefundAmount || 0)
|
|
) || 0}
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{openDenomination && (
|
|
<div className="DateWiseReport-denomination-container">
|
|
<div className="DateWiseReport-denomination">
|
|
<>
|
|
<Denomination onchange={handleDenominationChange} />
|
|
{TotalCashInHand[0]?.PaymentMethod === 'Cash' &&
|
|
TotalCashInHand[0]?.NetAmount <
|
|
parseInt(denominationData?.OverAllTotal) &&
|
|
parseInt(denominationData?.OverAllTotal) > 0 && (
|
|
<div
|
|
className="amountMissmatch"
|
|
style={{
|
|
color: '#ff0000',
|
|
fontSize: '20px',
|
|
fontWeight: '600',
|
|
width: '100%',
|
|
textAlign: 'right',
|
|
backgroundColor: 'rgb(232, 236, 241)',
|
|
}}
|
|
>
|
|
Amount is Mismatching
|
|
</div>
|
|
)}
|
|
</>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</Form>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default DateWiseReport;
|