|
|
|
@ -9,9 +9,14 @@ import { |
|
|
|
|
Label, |
|
|
|
|
List, |
|
|
|
|
Loader, |
|
|
|
|
Message |
|
|
|
|
Message, |
|
|
|
|
TextArea, |
|
|
|
|
Form |
|
|
|
|
} from "semantic-ui-react"; |
|
|
|
|
import { setClearPShiftState } from "../../../actions/pShift/reducer.actions"; |
|
|
|
|
import { |
|
|
|
|
setClearPShiftState, |
|
|
|
|
setFormShiftChart |
|
|
|
|
} from "../../../actions/pShift/reducer.actions"; |
|
|
|
|
import { |
|
|
|
|
getPShiftRequest, |
|
|
|
|
updatePShiftRequest |
|
|
|
@ -38,12 +43,43 @@ class ProviderShift extends Component { |
|
|
|
|
}; |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
handleCheckInPShift = () => { |
|
|
|
|
const { pShiftRequestSuccess } = this.props; |
|
|
|
|
this.props.dispatch( |
|
|
|
|
updatePShiftRequest({ |
|
|
|
|
uuid: pShiftRequestSuccess.uuid, |
|
|
|
|
approved: true, |
|
|
|
|
action: "checkin", |
|
|
|
|
chart: null, |
|
|
|
|
single: true |
|
|
|
|
}) |
|
|
|
|
); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
handleChangeChart = event => { |
|
|
|
|
this.props.dispatch(setFormShiftChart(event.target.value)); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
handleCheckOutPShift = () => { |
|
|
|
|
const { pShiftRequestSuccess, chart } = this.props; |
|
|
|
|
this.props.dispatch( |
|
|
|
|
updatePShiftRequest({ |
|
|
|
|
uuid: pShiftRequestSuccess.uuid, |
|
|
|
|
approved: true, |
|
|
|
|
action: "checkout", |
|
|
|
|
chart, |
|
|
|
|
single: true |
|
|
|
|
}) |
|
|
|
|
); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
render() { |
|
|
|
|
const { |
|
|
|
|
isSendingPShiftRequest, |
|
|
|
|
pShiftRequestError, |
|
|
|
|
pShiftRequestSuccess, |
|
|
|
|
selfUser |
|
|
|
|
selfUser, |
|
|
|
|
chart |
|
|
|
|
} = this.props; |
|
|
|
|
|
|
|
|
|
if (!selfUser.provider) { |
|
|
|
@ -54,8 +90,12 @@ class ProviderShift extends Component { |
|
|
|
|
isSendingPShiftRequest={isSendingPShiftRequest} |
|
|
|
|
pShiftRequestError={pShiftRequestError} |
|
|
|
|
shift={pShiftRequestSuccess} |
|
|
|
|
chart={chart} |
|
|
|
|
user={selfUser} |
|
|
|
|
handleChangePShiftApproval={this.handleChangePShiftApproval} |
|
|
|
|
handleChangeChart={this.handleChangeChart} |
|
|
|
|
handleCheckInPShift={this.handleCheckInPShift} |
|
|
|
|
handleCheckOutPShift={this.handleCheckOutPShift} |
|
|
|
|
/> |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
@ -65,13 +105,19 @@ const ProviderShiftFormView = ({ |
|
|
|
|
isSendingPShiftRequest, |
|
|
|
|
pShiftRequestError, |
|
|
|
|
shift, |
|
|
|
|
chart, |
|
|
|
|
user, |
|
|
|
|
handleChangePShiftApproval |
|
|
|
|
handleChangeChart, |
|
|
|
|
handleChangePShiftApproval, |
|
|
|
|
handleCheckInPShift, |
|
|
|
|
handleCheckOutPShift |
|
|
|
|
}) => { |
|
|
|
|
const employer = getEmployerFromPrice(shift.price, user) || {}; |
|
|
|
|
const client = employer.client || {}; |
|
|
|
|
const workType = getWorkTypeFromPrice(shift.price, user) || {}; |
|
|
|
|
const price = getPriceFromPrice(shift.price, user) || {}; |
|
|
|
|
const checkedIn = !!shift.actual_start && utc(shift.actual_start, ISO_8601); |
|
|
|
|
const checkedOut = !!shift.actual_end && utc(shift.actual_end, ISO_8601); |
|
|
|
|
const min = duration( |
|
|
|
|
utc(shift.set_end, ISO_8601) - utc(shift.set_start, ISO_8601), |
|
|
|
|
"milliseconds" |
|
|
|
@ -88,7 +134,11 @@ const ProviderShiftFormView = ({ |
|
|
|
|
<Container> |
|
|
|
|
<Header>Shift Details</Header> |
|
|
|
|
<Loader active={isSendingPShiftRequest} /> |
|
|
|
|
<Label color={approved ? "green" : rejected ? "red" : "grey"} tag size="small"> |
|
|
|
|
<Label |
|
|
|
|
color={approved ? "green" : rejected ? "red" : "grey"} |
|
|
|
|
tag |
|
|
|
|
size="small" |
|
|
|
|
> |
|
|
|
|
{approved && "Approved"} |
|
|
|
|
{pending && "Approval Pending"} |
|
|
|
|
{rejected && "Rejected"} |
|
|
|
@ -123,25 +173,61 @@ const ProviderShiftFormView = ({ |
|
|
|
|
<p>{shift.description}</p> |
|
|
|
|
</Message> |
|
|
|
|
)} |
|
|
|
|
<Button.Group> |
|
|
|
|
{!approved && ( |
|
|
|
|
<Button |
|
|
|
|
color="green" |
|
|
|
|
onClick={handleChangePShiftApproval(shift.uuid, true)} |
|
|
|
|
> |
|
|
|
|
Approve |
|
|
|
|
</Button> |
|
|
|
|
{!checkedIn && ( |
|
|
|
|
<Button.Group> |
|
|
|
|
{!approved && ( |
|
|
|
|
<Button |
|
|
|
|
color="green" |
|
|
|
|
onClick={handleChangePShiftApproval(shift.uuid, true)} |
|
|
|
|
> |
|
|
|
|
Approve |
|
|
|
|
</Button> |
|
|
|
|
)} |
|
|
|
|
{!rejected && ( |
|
|
|
|
<Button |
|
|
|
|
color="red" |
|
|
|
|
onClick={handleChangePShiftApproval(shift.uuid, false)} |
|
|
|
|
> |
|
|
|
|
Reject |
|
|
|
|
</Button> |
|
|
|
|
)} |
|
|
|
|
</Button.Group> |
|
|
|
|
)} |
|
|
|
|
<List bulleted> |
|
|
|
|
{!checkedIn && <List.Item>Pending Check In</List.Item>}{" "} |
|
|
|
|
{checkedIn && ( |
|
|
|
|
<List.Item> |
|
|
|
|
<strong>Checked In At:</strong>{" "} |
|
|
|
|
{checkedIn.local(false).format("dddd, MMMM Do YYYY, h:mm a Z")} |
|
|
|
|
</List.Item> |
|
|
|
|
)} |
|
|
|
|
{checkedOut && ( |
|
|
|
|
<List.Item> |
|
|
|
|
<strong>Checked Out At:</strong>{" "} |
|
|
|
|
{checkedOut.local(false).format("dddd, MMMM Do YYYY, h:mm a Z")} |
|
|
|
|
</List.Item> |
|
|
|
|
)} |
|
|
|
|
{!rejected && ( |
|
|
|
|
<Button |
|
|
|
|
color="red" |
|
|
|
|
onClick={handleChangePShiftApproval(shift.uuid, false)} |
|
|
|
|
> |
|
|
|
|
Reject |
|
|
|
|
</Button> |
|
|
|
|
</List> |
|
|
|
|
{shift.chart && ( |
|
|
|
|
<Message> |
|
|
|
|
<Message.Header>Chart</Message.Header> |
|
|
|
|
{shift.chart} |
|
|
|
|
</Message> |
|
|
|
|
)} |
|
|
|
|
{!checkedIn && <Button onClick={handleCheckInPShift}>Check In</Button>} |
|
|
|
|
{checkedIn && |
|
|
|
|
!checkedOut && ( |
|
|
|
|
<Form onSubmit={handleCheckOutPShift}> |
|
|
|
|
<label>Chart</label> |
|
|
|
|
<TextArea |
|
|
|
|
value={chart} |
|
|
|
|
onChange={handleChangeChart} |
|
|
|
|
placeholder="Chart" |
|
|
|
|
/> |
|
|
|
|
<Button>Check Out</Button> |
|
|
|
|
</Form> |
|
|
|
|
)} |
|
|
|
|
</Button.Group> |
|
|
|
|
<Error error={pShiftRequestError}/> |
|
|
|
|
<Error error={pShiftRequestError} /> |
|
|
|
|
</Container> |
|
|
|
|
); |
|
|
|
|
}; |
|
|
|
|