lml-main/packages/core-ui/dist/jobs/components/forms/jobs-search-form.js

This is now a mono repository published into many standalone packages.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const moment = require("moment");
const react_redux_1 = require("react-redux");
const selectors_1 = require("../../../frequencies/selectors");
const constants_1 = require("../../../jobs/constants");
const cosmo_redux_api_1 = require("@lml/cosmo-redux-api");
const cosmoui_1 = require("cosmoui");
const ts_utils_1 = require("@lml/ts-utils");
class JobsSearchFormComponent extends cosmoui_1.StylableComponent {
    constructor() {
        super(...arguments);
        this.STATUSES = [
            { label: 'Live', value: 'live' },
            { label: 'Allocated', value: 'allocated' },
            { label: 'Accepted', value: 'accepted' },
            { label: 'In progress', value: 'progress' },
            { label: 'Completed', value: 'completed' },
        ];
        this.handleSubmit = (data) => {
            const labels = this.props.frequencies;
            if (labels.length === 0) {
                this.props.notificationWarning('Please select a frequency before searching for jobs');
                return;
            }
            const params = {
                statuses: [data.status.value.value],
                labels,
                start: moment(data.startDate.value).toISOString(),
                end: moment(data.endDate.value).toISOString(),
                lastKeys: {},
                order: 'asc',
            };
            this.props.fetchJobsByStatus(constants_1.JOB_STATUS_SEARCH_KEY, params, 'jobs,jobStatuses');
        };
        this.resetForm = () => this.props.resetForm(constants_1.JOBS_SEARCH_FORM_KEY);
        this.formStyles = () => ({ width: '100%' });
        this.separatorStyles = () => ({
            marginRight: this.margin(200),
            marginLeft: this.margin(200),
            marginBottom: this.margin(200),
        });
        this.selectStyles = () => ({
            backgroundColor: 'transparent',
            width: 150,
            marginLeft: this.margin(500),
        });
    }
    render() {
        const startDate = moment.utc().subtract(1, 'w').format(ts_utils_1.INPUT_DATE_FORMAT);
        const endDate = moment.utc().format(ts_utils_1.INPUT_DATE_FORMAT);
        return (React.createElement(cosmoui_1.Form, { name: constants_1.JOBS_SEARCH_FORM_KEY, onSubmit: this.handleSubmit },
            React.createElement(cosmoui_1.Row, { justify: "space-between", align: "flex-start", fullWidth: true },
                React.createElement(cosmoui_1.Row, null,
                    React.createElement(cosmoui_1.DateTimeInput, { value: startDate, name: constants_1.SEARCH_JOB_START_DATE_INPUT_KEY }),
                    React.createElement(cosmoui_1.Icon, { icon: "Forward", size: 18, style: this.separatorStyles() }),
                    React.createElement(cosmoui_1.DateTimeInput, { value: endDate, name: constants_1.SEARCH_JOB_END_DATE_INPUT_KEY }),
                    React.createElement(cosmoui_1.Select, { style: this.selectStyles(), name: "status", options: this.STATUSES, value: this.STATUSES[0] })),
                React.createElement(cosmoui_1.Row, null,
                    React.createElement(cosmoui_1.Button, { id: "find-jobs-search-button", primary: true, type: "submit" }, "Search")))));
    }
}
const mapStateToProps = (state, ownProps) => ({
    frequencies: selectors_1.getSelectedFrequencyIds(state),
});
const mapDispatchToProps = {
    resetForm: cosmoui_1.resetForm,
    fetchJobsByStatus: cosmo_redux_api_1.fetchJobsByStatus,
    notificationWarning: cosmoui_1.notificationWarning,
};
exports.JobsSearchForm = react_redux_1.connect(mapStateToProps, mapDispatchToProps)(JobsSearchFormComponent);
//# sourceMappingURL=jobs-search-form.js.map