here Change Date picker to Range Picker

This commit is contained in:
Srinath 2026-03-16 15:06:54 +05:30
parent a851492595
commit 28f3b12385
1 changed files with 31 additions and 42 deletions

View File

@ -27,6 +27,7 @@ import { WaiterNames } from '../../../Features/Reports/Reports';
import { Messages } from '../../../Components/Notifications/Messages'; import { Messages } from '../../../Components/Notifications/Messages';
import FormHeader from '../../PageComponents/FormHeader'; import FormHeader from '../../PageComponents/FormHeader';
import { changeBreadCrumb } from '../../../Features/AppPage/CenterPage'; import { changeBreadCrumb } from '../../../Features/AppPage/CenterPage';
const { RangePicker } = DatePicker;
const subDirectory = import.meta.env.BASE_URL; const subDirectory = import.meta.env.BASE_URL;
const { Option } = Select; const { Option } = Select;
@ -229,11 +230,9 @@ const TipAmountSettlementList = () => {
}; };
useEffect(() => { useEffect(() => {
// Set today's date for fromDate and toDate in the form
const today = dayjs(); const today = dayjs();
form.setFieldsValue({ form.setFieldsValue({
fromDate: today, dateRange: [today, today],
toDate: today,
}); });
dispatch(changeBreadCrumb({ items: items })); dispatch(changeBreadCrumb({ items: items }));
fetchData(); fetchData();
@ -287,9 +286,9 @@ const TipAmountSettlementList = () => {
if (values.Employee && values.Employee !== 'all') { if (values.Employee && values.Employee !== 'all') {
filtered = filtered.filter((item) => item.Employee === values.Employee); filtered = filtered.filter((item) => item.Employee === values.Employee);
} }
if (values.fromDate && values.toDate) { if (values.dateRange && values.dateRange.length === 2) {
const from = dayjs(values.fromDate).startOf('day'); const from = dayjs(values.dateRange[0]).startOf('day');
const to = dayjs(values.toDate).endOf('day'); const to = dayjs(values.dateRange[1]).endOf('day');
filtered = filtered.filter((item) => { filtered = filtered.filter((item) => {
const itemDate = dayjs(item.Date, 'DD/MM/YYYY'); const itemDate = dayjs(item.Date, 'DD/MM/YYYY');
return itemDate.isSameOrAfter(from) && itemDate.isSameOrBefore(to); return itemDate.isSameOrAfter(from) && itemDate.isSameOrBefore(to);
@ -307,7 +306,14 @@ const TipAmountSettlementList = () => {
}; };
const onFinish = async (values) => { const onFinish = async (values) => {
const { Employee, fromDate, toDate, ...restValues } = values; const { Employee, dateRange, ...restValues } = values;
let fromDate = null;
let toDate = null;
if (dateRange && dateRange.length === 2) {
fromDate = dateRange[0];
toDate = dateRange[1];
}
const data = { const data = {
CompId, CompId,
BranchId, BranchId,
@ -320,18 +326,19 @@ const TipAmountSettlementList = () => {
: {}), : {}),
}; };
let response; let response;
Employee !== 'all' if (Employee !== 'all') {
? (response = await dispatch(getTipAmountSettlementList(data)).unwrap()) response = await dispatch(getTipAmountSettlementList(data)).unwrap();
: (response = await dispatch( } else {
getAllTipAmountSettlementList(data) response = await dispatch(getAllTipAmountSettlementList(data)).unwrap();
).unwrap()); }
if (response?.data?.statusCode === 1) { if (response?.data?.statusCode === 1) {
setTableData(response?.data?.data?.[0]?.WaiterDetails); setTableData(response?.data?.data?.[0]?.WaiterDetails);
const StatusValue = form.getFieldValue('status') === 'toBe' ? 'N' : 'Y'; const StatusValue = form.getFieldValue('status') === 'toBe' ? 'N' : 'Y';
const employees = response?.data?.data?.[0]?.WaiterDetails ?? []; const employees = response?.data?.data?.[0]?.WaiterDetails ?? [];
const data = const hasData =
employees?.some( employees?.some(
(E) => (E) =>
(StatusValue == 'N' && (StatusValue == 'N' &&
@ -340,11 +347,10 @@ const TipAmountSettlementList = () => {
E?.TipsDetails?.some((e) => e?.IsSettled == 'Y')) E?.TipsDetails?.some((e) => e?.IsSettled == 'Y'))
) ?? false; ) ?? false;
if (data) { if (hasData) {
setMessageType('success'); setMessageType('success');
setMessageData(response?.data?.response); setMessageData(response?.data?.response);
} } else {
if (!data) {
setMessageType('error'); setMessageType('error');
setMessageData('No data Found'); setMessageData('No data Found');
} }
@ -490,36 +496,19 @@ const TipAmountSettlementList = () => {
</Select> </Select>
</Form.Item> </Form.Item>
</Col> </Col>
<Col> <Col>
<Form.Item <Form.Item
name="fromDate" name="dateRange"
label="From Date" label="Date Range"
style={{ marginBottom: '8px' }} style={{ marginBottom: '8px' }}
rules={[{ message: 'Please select from date' }]} rules={[{ type: 'array', required: true, message: 'Please select date range' }]}
> >
<DatePicker <RangePicker
format="DD/MM/YYYY" format="DD-MM-YYYY"
style={{ width: 140 }} allowClear
disabledDate={(current) => disabledDate={(current) => current && current > dayjs()}
current && current > dayjs().endOf('day') placeholder={["From Date", "To Date"]}
} style={{ width: 280 }}
/>
</Form.Item>
</Col>
<Col>
<Form.Item
name="toDate"
label="To Date"
style={{ marginBottom: '8px' }}
rules={[{ message: 'Please select to date' }]}
>
<DatePicker
format="DD/MM/YYYY"
style={{ width: 140 }}
disabledDate={(current) =>
current && current > dayjs().endOf('day')
}
/> />
</Form.Item> </Form.Item>
</Col> </Col>