Files
imexrps/src/components/molecules/reporting-dates/reporting-dates.molecule.jsx

64 lines
2.0 KiB
JavaScript

import { Button, DatePicker, Form } from "antd";
import React from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { queryReportingData } from "../../../redux/reporting/reporting.actions";
import moment from "moment";
const mapStateToProps = createStructuredSelector({
//currentUser: selectCurrentUser
});
const mapDispatchToProps = (dispatch) => ({
queryReportingData: (dates) => dispatch(queryReportingData(dates)),
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(ReportingDatesMolecule);
export function ReportingDatesMolecule({ queryReportingData }) {
const [form] = Form.useForm();
const handleFinish = (values) => {
queryReportingData({
startDate: values.dateRange[0],
endDate: values.dateRange[1],
});
};
return (
<Form form={form} onFinish={handleFinish}>
<div style={{ display: "flex" }}>
<Form.Item
label="Close Date Between"
name="dateRange"
rules={[{ type: "array", required: true }]}
>
<DatePicker.RangePicker
ranges={{
Today: [moment(), moment()],
"Last 7 days": [moment().subtract(7, "days"), moment()],
"Next 7 days": [moment(), moment().add(7, "days")],
"Next 14 days": [moment(), moment().add(14, "days")],
"Last Month": [
moment().startOf("month").subtract(1, "month"),
moment().startOf("month").subtract(1, "month").endOf("month"),
],
"This Month": [
moment().startOf("month"),
moment().endOf("month"),
],
"Next Month": [
moment().startOf("month").add(1, "month"),
moment().startOf("month").add(1, "month").endOf("month"),
],
}}
/>
</Form.Item>
<Button type="primary" htmlType="submit">
Run Search
</Button>
</div>
</Form>
);
}