here Change Date picker to Range Picker
This commit is contained in:
parent
a851492595
commit
28f3b12385
|
|
@ -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>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue