lml-main/packages/core-ui/dist/couriers/components/details/courier-job.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 cx = require("classnames");
const lodash_1 = require("lodash");
const react_redux_1 = require("react-redux");
const cosmo_redux_api_1 = require("@lml/cosmo-redux-api");
const actions_1 = require("../../../jobs/actions");
const selectors_1 = require("../../../jobs/selectors");
const modals_1 = require("../../../allocation/actions/modals");
const cosmoui_1 = require("cosmoui");
const timeslot_1 = require("../../../jobs/components/timeslot");
const constants_1 = require("../../../jobs/constants");
const selectors_2 = require("../../../allocation/selectors");
const styles = require('./courier-jobs.scss');
class CourierJobComponent extends React.Component {
    constructor() {
        super(...arguments);
        this.renderDeallocateButton = () => {
            const { jobByStatus } = this.props;
            if (!selectors_2.canDeallocateJob(jobByStatus))
                return null;
            return (React.createElement(cosmoui_1.Row, { className: styles.action, onClick: this.showDeallocationModal },
                ' ',
                React.createElement(cosmoui_1.Icon, { id: `courier-detail-deallocate-${jobByStatus.refId}`, icon: "Unallocate", fill: "red", size: 16 })));
        };
        this.collectText = (stop) => {
            const postcode = lodash_1.get(stop, 'location.address.postcode', '');
            const company = lodash_1.get(stop, 'metadata.company', '');
            return React.createElement("span", { style: { color: cosmoui_1.gray[500] } },
                "| ",
                postcode);
        };
        this.addressText = (stop) => {
            const postcode = lodash_1.get(stop, 'location.address.postcode', '');
            const streets = lodash_1.get(stop, 'location.address.streets', []).join(', ');
            return React.createElement("span", { style: { color: cosmoui_1.gray[500] } },
                "| ",
                postcode);
        };
        this.showDeallocationModal = () => this.props.showDeallocationModal(this.props.job);
        this.showJobDetails = () => this.props.showJobDetails(this.props.job.refId);
    }
    render() {
        // console.log('RENDER COURIER JOB', this.props)
        const { job, jobByStatus } = this.props;
        if (!job)
            return null;
        const unallocateClass = jobByStatus.status === constants_1.JOB_STATUS.ALLOCATED
            ? styles.unallocate
            : styles.hide;
        const collection = selectors_1.getCollectionStop(job);
        const delivery = selectors_1.getDeliveryStop(job);
        return (React.createElement(cosmoui_1.Row, { className: styles.jobItem, align: "flex-start", fullWidth: true },
            React.createElement(cosmoui_1.Column, { className: styles.jobNumber, id: `courier-details-job-${job.jobNumber}`, onClick: this.showJobDetails },
                React.createElement(cosmoui_1.Text, { size: "sm", className: cx(styles.jobNumberText, styles.ellipsis) }, job.jobNumber)),
            React.createElement(cosmoui_1.Column, { className: styles.customerName },
                React.createElement(cosmoui_1.Text, { size: "sm", className: styles.ellipsis }, lodash_1.get(job, 'customer.name'))),
            React.createElement(cosmoui_1.Column, { className: styles.collectFrom },
                React.createElement(cosmoui_1.Row, { align: "flex-start" },
                    React.createElement("span", { className: styles.truncated },
                        React.createElement("span", { className: styles.time },
                            React.createElement(timeslot_1.JobStopTimeSlot, { refId: job.refId, stop: collection }))))),
            React.createElement(cosmoui_1.Column, { className: styles.nextStop },
                React.createElement(cosmoui_1.Row, { align: "flex-start" },
                    React.createElement("span", { className: styles.truncated },
                        React.createElement("span", { className: styles.time },
                            React.createElement(timeslot_1.JobStopTimeSlot, { refId: job.refId, stop: delivery }))))),
            React.createElement(cosmoui_1.Column, { className: styles.status }, jobByStatus.status),
            React.createElement(cosmoui_1.Column, { className: unallocateClass }, this.renderDeallocateButton())));
    }
}
exports.CourierJobComponent = CourierJobComponent;
const mapStateToProps = (state, ownProps) => ({
    job: cosmo_redux_api_1.getJobById(state, ownProps.jobByStatus.refId),
});
const mapActionsToProps = {
    showJobDetails: actions_1.showJobDetails,
    showDeallocationModal: modals_1.showDeallocationModal,
};
exports.CourierJob = react_redux_1.connect(mapStateToProps, mapActionsToProps)(CourierJobComponent);
//# sourceMappingURL=courier-job.js.map