Merge remote-tracking branch 'origin/rome/release/2024-01-26' into rome/test-beta
# Conflicts: # .circleci/config.yml # client/package-lock.json # client/src/components/header/header.component.jsx # client/src/components/jobs-admin-change-status/jobs-admin-change.status.component.jsx # client/src/components/jobs-admin-delete-intake/jobs-admin-delete-intake.component.jsx # client/src/components/jobs-admin-mark-reexport/jobs-admin-mark-reexport.component.jsx # client/src/components/jobs-admin-unvoid/jobs-admin-unvoid.component.jsx # client/src/components/production-list-detail/production-list-detail.component.jsx # client/src/components/report-center-modal/report-center-modal.component.jsx # client/src/pages/jobs-admin/jobs-admin.page.jsx # client/src/pages/jobs-detail/jobs-detail.page.component.jsx # client/src/utils/TemplateConstants.js # client/yarn.lock # package-lock.json # server.js
This commit is contained in:
Dave Richer
246
client/src/components/job-lifecycle/job-lifecycle.component.jsx
Normal file
246
client/src/components/job-lifecycle/job-lifecycle.component.jsx
Normal file
@@ -0,0 +1,246 @@
|
||||
import React, {useCallback, useEffect, useState} from 'react';
|
||||
import moment from "moment";
|
||||
import axios from 'axios';
|
||||
import {Badge, Card, Space, Table, Tag} from 'antd';
|
||||
import {gql, useQuery} from "@apollo/client";
|
||||
import {DateTimeFormatterFunction} from "../../utils/DateFormatter";
|
||||
import {isEmpty} from "lodash";
|
||||
import {useTranslation} from "react-i18next";
|
||||
|
||||
require('./job-lifecycle.styles.scss');
|
||||
|
||||
// show text on bar if text can fit
|
||||
export function JobLifecycleComponent({job, statuses, ...rest}) {
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [lifecycleData, setLifecycleData] = useState(null);
|
||||
const {t} = useTranslation(); // Used for tracking external state changes.
|
||||
|
||||
const {data} = useQuery(gql`
|
||||
query get_job_test($id: uuid!){
|
||||
jobs_by_pk(id:$id){
|
||||
id
|
||||
status
|
||||
}
|
||||
}
|
||||
`, {
|
||||
variables: {
|
||||
id: job.id
|
||||
},
|
||||
fetchPolicy: 'cache-only'
|
||||
});
|
||||
|
||||
/**
|
||||
* Gets the lifecycle data for the job.
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
const getLifecycleData = useCallback(async () => {
|
||||
if (job && job.id && statuses && statuses.statuses) {
|
||||
try {
|
||||
setLoading(true);
|
||||
const response = await axios.post("/job/lifecycle", {
|
||||
jobids: job.id,
|
||||
statuses: statuses.statuses
|
||||
});
|
||||
const data = response.data.transition[job.id];
|
||||
setLifecycleData(data);
|
||||
} catch (err) {
|
||||
console.error(`${t('job_lifecycle.errors.fetch')}: ${err.message}`);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}
|
||||
}, [job, statuses, t]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!data) return;
|
||||
setTimeout(() => {
|
||||
getLifecycleData().catch(err => console.error(`${t('job_lifecycle.errors.fetch')}: ${err.message}`));
|
||||
}, 500);
|
||||
}, [data, getLifecycleData, t]);
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: t('job_lifecycle.columns.value'),
|
||||
dataIndex: 'value',
|
||||
key: 'value',
|
||||
},
|
||||
{
|
||||
title: t('job_lifecycle.columns.start'),
|
||||
dataIndex: 'start',
|
||||
key: 'start',
|
||||
render: (text) => DateTimeFormatterFunction(text),
|
||||
sorter: (a, b) => moment(a.start).unix() - moment(b.start).unix(),
|
||||
},
|
||||
{
|
||||
title: t('job_lifecycle.columns.relative_start'),
|
||||
dataIndex: 'start_readable',
|
||||
key: 'start_readable',
|
||||
},
|
||||
{
|
||||
title: t('job_lifecycle.columns.end'),
|
||||
dataIndex: 'end',
|
||||
key: 'end',
|
||||
sorter: (a, b) => {
|
||||
if (isEmpty(a.end) || isEmpty(b.end)) {
|
||||
if (isEmpty(a.end) && isEmpty(b.end)) {
|
||||
return 0;
|
||||
}
|
||||
return isEmpty(a.end) ? 1 : -1;
|
||||
}
|
||||
return moment(a.end).unix() - moment(b.end).unix();
|
||||
},
|
||||
render: (text) => isEmpty(text) ? t('job_lifecycle.content.not_available') : DateTimeFormatterFunction(text)
|
||||
},
|
||||
{
|
||||
title: t('job_lifecycle.columns.relative_end'),
|
||||
dataIndex: 'end_readable',
|
||||
key: 'end_readable',
|
||||
},
|
||||
{
|
||||
title: t('job_lifecycle.columns.duration'),
|
||||
dataIndex: 'duration_readable',
|
||||
key: 'duration_readable',
|
||||
sorter: (a, b) => a.duration - b.duration,
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<Card loading={loading} title={t('job_lifecycle.content.title')}>
|
||||
{!loading ? (
|
||||
lifecycleData && lifecycleData.lifecycle && lifecycleData.durations ? (
|
||||
<Space direction='vertical' style={{width: '100%'}}>
|
||||
<Card
|
||||
type='inner'
|
||||
title={(
|
||||
<Space direction='horizontal' size='small'>
|
||||
<Badge status='processing' count={lifecycleData.durations.totalStatuses}/>
|
||||
{t('job_lifecycle.content.title_durations')}
|
||||
</Space>
|
||||
|
||||
)}
|
||||
style={{width: '100%'}}
|
||||
>
|
||||
<div id="bar-container" style={{
|
||||
display: 'flex',
|
||||
width: '100%',
|
||||
height: '100px',
|
||||
textAlign: 'center',
|
||||
borderRadius: '5px',
|
||||
borderWidth: '5px',
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#f0f2f5',
|
||||
margin: 0,
|
||||
padding: 0
|
||||
}}>
|
||||
{lifecycleData.durations.summations.map((key, index, array) => {
|
||||
const isFirst = index === 0;
|
||||
const isLast = index === array.length - 1;
|
||||
return (
|
||||
<div key={key.status} style={{
|
||||
overflow: 'hidden',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
margin: 0,
|
||||
padding: 0,
|
||||
|
||||
borderTop: '1px solid #f0f2f5',
|
||||
borderBottom: '1px solid #f0f2f5',
|
||||
borderLeft: isFirst ? '1px solid #f0f2f5' : undefined,
|
||||
borderRight: isLast ? '1px solid #f0f2f5' : undefined,
|
||||
|
||||
backgroundColor: key.color,
|
||||
width: `${key.percentage}%`
|
||||
}}
|
||||
aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
|
||||
title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
|
||||
>
|
||||
|
||||
{key.percentage > 15 ?
|
||||
<>
|
||||
<div>{key.roundedPercentage}</div>
|
||||
<div style={{
|
||||
backgroundColor: '#f0f2f5',
|
||||
borderRadius: '5px',
|
||||
paddingRight: '2px',
|
||||
paddingLeft: '2px',
|
||||
fontSize: '0.8rem',
|
||||
}}>
|
||||
{key.status}
|
||||
</div>
|
||||
</>
|
||||
: null}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<Card type='inner' title={t('job_lifecycle.content.legend_title')}
|
||||
style={{marginTop: '10px'}}>
|
||||
<div>
|
||||
{lifecycleData.durations.summations.map((key) => (
|
||||
<Tag color={key.color} style={{width: '13vh', padding: '4px', margin: '4px'}}>
|
||||
<div
|
||||
aria-label={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
|
||||
title={`${key.status} | ${key.roundedPercentage} | ${key.humanReadable}`}
|
||||
style={{
|
||||
backgroundColor: '#f0f2f5',
|
||||
color: '#000',
|
||||
padding: '4px',
|
||||
textAlign: 'center'
|
||||
}}>
|
||||
{key.status} ({key.roundedPercentage})
|
||||
</div>
|
||||
</Tag>
|
||||
))}
|
||||
</div>
|
||||
</Card>
|
||||
{(lifecycleData?.durations?.humanReadableTotal) ||
|
||||
(lifecycleData.lifecycle[0] && lifecycleData.lifecycle[0].value && lifecycleData?.durations?.totalCurrentStatusDuration?.humanReadable) ?
|
||||
<Card style={{marginTop: '10px'}}>
|
||||
<ul>
|
||||
{lifecycleData.durations && lifecycleData.durations.humanReadableTotal &&
|
||||
<li>
|
||||
<span
|
||||
style={{fontWeight: 'bold'}}>{t('job_lifecycle.content.previous_status_accumulated_time')}:</span> {lifecycleData.durations.humanReadableTotal}
|
||||
</li>
|
||||
}
|
||||
{lifecycleData.lifecycle[0] && lifecycleData.lifecycle[0].value && lifecycleData?.durations?.totalCurrentStatusDuration?.humanReadable &&
|
||||
<li>
|
||||
<span
|
||||
style={{fontWeight: 'bold'}}>{t('job_lifecycle.content.current_status_accumulated_time')} ({lifecycleData.lifecycle[0].value}):</span> {lifecycleData.durations.totalCurrentStatusDuration.humanReadable}
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
</Card>
|
||||
: null}
|
||||
</Card>
|
||||
<Card type='inner' title={(
|
||||
<>
|
||||
<Space direction="horizontal" size="small">
|
||||
<Badge status='processing' count={lifecycleData.lifecycle.length}/>
|
||||
{t('job_lifecycle.content.title_transitions')}
|
||||
</Space>
|
||||
</>
|
||||
)}>
|
||||
<Table style={{
|
||||
overflow: 'auto',
|
||||
width: '100%',
|
||||
}} columns={columns} dataSource={lifecycleData.lifecycle}/>
|
||||
</Card>
|
||||
</Space>
|
||||
) : (
|
||||
<Card type='inner' style={{textAlign: 'center'}}>
|
||||
{t('job_lifecycle.content.data_unavailable')}
|
||||
</Card>
|
||||
)
|
||||
) : (
|
||||
<Card type='inner' title={t('job_lifecycle.content.title_loading')}>
|
||||
{t('job_lifecycle.content.loading')}
|
||||
</Card>
|
||||
)}
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
export default JobLifecycleComponent;
|
||||
@@ -51,12 +51,14 @@ export function JobsAdminStatus({insertAuditTrail, bodyshop, job}) {
|
||||
}
|
||||
|
||||
return (
|
||||
<Dropdown menu={statusMenu} trigger={["click"]} key="changestatus">
|
||||
<Button shape="round">
|
||||
<span>{job.status}</span>
|
||||
<>
|
||||
<Dropdown menu={statusMenu} trigger={["click"]} key="changestatus">
|
||||
<Button shape="round">
|
||||
<span>{job.status}</span>
|
||||
|
||||
<DownCircleFilled/>
|
||||
</Button>
|
||||
</Dropdown>
|
||||
<DownCircleFilled/>
|
||||
</Button>
|
||||
</Dropdown>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,34 +1,18 @@
|
||||
import {gql, useMutation} from "@apollo/client";
|
||||
import {Button, notification} from "antd";
|
||||
import React, {useState} from "react";
|
||||
import {useTranslation} from "react-i18next";
|
||||
import { useMutation } from "@apollo/client";
|
||||
import { Button, Space, notification } from "antd";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import {
|
||||
DELETE_DELIVERY_CHECKLIST,
|
||||
DELETE_INTAKE_CHECKLIST,
|
||||
} from "../../graphql/jobs.queries";
|
||||
|
||||
export default function JobAdminDeleteIntake({job}) {
|
||||
const {t} = useTranslation();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [deleteIntake] = useMutation(gql`
|
||||
mutation DELETE_INTAKE($jobId: uuid!) {
|
||||
update_jobs_by_pk(
|
||||
pk_columns: { id: $jobId }
|
||||
_set: { intakechecklist: null }
|
||||
) {
|
||||
id
|
||||
intakechecklist
|
||||
}
|
||||
}
|
||||
`);
|
||||
export default function JobAdminDeleteIntake({ job }) {
|
||||
const { t } = useTranslation();
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const [DELETE_DELIVERY] = useMutation(gql`
|
||||
mutation DELETE_DELIVERY($jobId: uuid!) {
|
||||
update_jobs_by_pk(
|
||||
pk_columns: { id: $jobId }
|
||||
_set: { deliverchecklist: null }
|
||||
) {
|
||||
id
|
||||
deliverchecklist
|
||||
}
|
||||
}
|
||||
`);
|
||||
const [deleteIntake] = useMutation(DELETE_INTAKE_CHECKLIST);
|
||||
const [deleteDelivery] = useMutation(DELETE_DELIVERY_CHECKLIST);
|
||||
|
||||
const handleDelete = async (values) => {
|
||||
setLoading(true);
|
||||
@@ -48,11 +32,11 @@ export default function JobAdminDeleteIntake({job}) {
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
const handleDeleteDelivery = async (values) => {
|
||||
setLoading(true);
|
||||
const result = await DELETE_DELIVERY({
|
||||
variables: {jobId: job.id},
|
||||
});
|
||||
const handleDeleteDelivery = async (values) => {
|
||||
setLoading(true);
|
||||
const result = await deleteDelivery({
|
||||
variables: { jobId: job.id },
|
||||
});
|
||||
|
||||
if (!!!result.errors) {
|
||||
notification["success"]({message: t("jobs.successes.save")});
|
||||
@@ -66,14 +50,24 @@ export default function JobAdminDeleteIntake({job}) {
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button loading={loading} onClick={handleDelete}>
|
||||
{t("jobs.labels.deleteintake")}
|
||||
</Button>
|
||||
<Button loading={loading} onClick={handleDeleteDelivery}>
|
||||
{t("jobs.labels.deletedelivery")}
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
return (
|
||||
<>
|
||||
<Space wrap>
|
||||
<Button
|
||||
loading={loading}
|
||||
onClick={handleDelete}
|
||||
disabled={!job.intakechecklist}
|
||||
>
|
||||
{t("jobs.labels.deleteintake")}
|
||||
</Button>
|
||||
<Button
|
||||
loading={loading}
|
||||
onClick={handleDeleteDelivery}
|
||||
disabled={!job.deliverychecklist}
|
||||
>
|
||||
{t("jobs.labels.deletedelivery")}
|
||||
</Button>
|
||||
</Space>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,14 +1,22 @@
|
||||
import {gql, useMutation} from "@apollo/client";
|
||||
import {Button, notification} from "antd";
|
||||
import React, {useState} from "react";
|
||||
import {useTranslation} from "react-i18next";
|
||||
import { useMutation } from "@apollo/client";
|
||||
import { Button, Space, notification } from "antd";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
import dayjs from "../../utils/day";
|
||||
import {connect} from "react-redux";
|
||||
import {createStructuredSelector} from "reselect";
|
||||
import {INSERT_EXPORT_LOG} from "../../graphql/accounting.queries";
|
||||
import {insertAuditTrail} from "../../redux/application/application.actions";
|
||||
import {selectBodyshop, selectCurrentUser,} from "../../redux/user/user.selectors";
|
||||
import moment from "moment";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
|
||||
import {
|
||||
MARK_JOB_AS_EXPORTED,
|
||||
MARK_JOB_AS_UNINVOICED,
|
||||
MARK_JOB_FOR_REEXPORT,
|
||||
} from "../../graphql/jobs.queries";
|
||||
import { insertAuditTrail } from "../../redux/application/application.actions";
|
||||
import {
|
||||
selectBodyshop,
|
||||
selectCurrentUser,
|
||||
} from "../../redux/user/user.selectors";
|
||||
import AuditTrailMapping from "../../utils/AuditTrailMappings";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
@@ -25,67 +33,27 @@ export default connect(
|
||||
)(JobAdminMarkReexport);
|
||||
|
||||
export function JobAdminMarkReexport({
|
||||
insertAuditTrail,
|
||||
bodyshop,
|
||||
currentUser,
|
||||
job,
|
||||
}) {
|
||||
const {t} = useTranslation();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
|
||||
const [markJobForReexport] = useMutation(gql`
|
||||
mutation MARK_JOB_FOR_REEXPORT($jobId: uuid!) {
|
||||
update_jobs_by_pk(
|
||||
pk_columns: { id: $jobId }
|
||||
_set: { date_exported: null
|
||||
status: "${bodyshop.md_ro_statuses.default_invoiced}"
|
||||
}
|
||||
) {
|
||||
id
|
||||
date_exported
|
||||
status
|
||||
date_invoiced
|
||||
}
|
||||
}
|
||||
`);
|
||||
insertAuditTrail,
|
||||
bodyshop,
|
||||
currentUser,
|
||||
job,
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
|
||||
|
||||
const [markJobExported] = useMutation(gql`
|
||||
mutation MARK_JOB_AS_EXPORTED($jobId: uuid!, $date_exported: timestamptz!) {
|
||||
update_jobs_by_pk(
|
||||
pk_columns: { id: $jobId }
|
||||
_set: { date_exported: $date_exported
|
||||
status: "${bodyshop.md_ro_statuses.default_exported}"
|
||||
}
|
||||
) {
|
||||
id
|
||||
date_exported
|
||||
date_invoiced
|
||||
status
|
||||
}
|
||||
}
|
||||
`);
|
||||
const [markJobUninvoiced] = useMutation(gql`
|
||||
mutation MARK_JOB_AS_UNINVOICED($jobId: uuid!, ) {
|
||||
update_jobs_by_pk(
|
||||
pk_columns: { id: $jobId }
|
||||
_set: { date_exported: null
|
||||
date_invoiced: null
|
||||
status: "${bodyshop.md_ro_statuses.default_delivered}"
|
||||
}
|
||||
) {
|
||||
id
|
||||
date_exported
|
||||
date_invoiced
|
||||
status
|
||||
}
|
||||
}
|
||||
`);
|
||||
const [markJobForReexport] = useMutation(MARK_JOB_FOR_REEXPORT);
|
||||
const [markJobExported] = useMutation(MARK_JOB_AS_EXPORTED);
|
||||
const [markJobUninvoiced] = useMutation(MARK_JOB_AS_UNINVOICED);
|
||||
|
||||
const handleMarkForExport = async () => {
|
||||
setLoading(true);
|
||||
const result = await markJobForReexport({
|
||||
variables: {jobId: job.id},
|
||||
});
|
||||
const handleMarkForExport = async () => {
|
||||
setLoading(true);
|
||||
const result = await markJobForReexport({
|
||||
variables: {
|
||||
jobId: job.id,
|
||||
default_invoiced: bodyshop.md_ro_statuses.default_invoiced,
|
||||
},
|
||||
});
|
||||
|
||||
if (!result.errors) {
|
||||
notification["success"]({message: t("jobs.successes.save")});
|
||||
@@ -103,11 +71,15 @@ export function JobAdminMarkReexport({
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
const handleMarkExported = async () => {
|
||||
setLoading(true);
|
||||
const result = await markJobExported({
|
||||
variables: {jobId: job.id, date_exported: dayjs()},
|
||||
});
|
||||
const handleMarkExported = async () => {
|
||||
setLoading(true);
|
||||
const result = await markJobExported({
|
||||
variables: {
|
||||
jobId: job.id,
|
||||
date_exported: moment(),
|
||||
default_exported: bodyshop.md_ro_statuses.default_exported,
|
||||
},
|
||||
});
|
||||
|
||||
await insertExportLog({
|
||||
variables: {
|
||||
@@ -139,11 +111,14 @@ export function JobAdminMarkReexport({
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
const handleUninvoice = async () => {
|
||||
setLoading(true);
|
||||
const result = await markJobUninvoiced({
|
||||
variables: {jobId: job.id},
|
||||
});
|
||||
const handleUninvoice = async () => {
|
||||
setLoading(true);
|
||||
const result = await markJobUninvoiced({
|
||||
variables: {
|
||||
jobId: job.id,
|
||||
default_delivered: bodyshop.md_ro_statuses.default_delivered,
|
||||
},
|
||||
});
|
||||
|
||||
if (!result.errors) {
|
||||
notification["success"]({message: t("jobs.successes.save")});
|
||||
@@ -161,29 +136,31 @@ export function JobAdminMarkReexport({
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={!job.date_exported}
|
||||
onClick={handleMarkForExport}
|
||||
>
|
||||
{t("jobs.labels.markforreexport")}
|
||||
</Button>
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={job.date_exported}
|
||||
onClick={handleMarkExported}
|
||||
>
|
||||
{t("jobs.actions.markasexported")}
|
||||
</Button>
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={!job.date_invoiced || job.date_exported}
|
||||
onClick={handleUninvoice}
|
||||
>
|
||||
{t("jobs.actions.uninvoice")}
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
return (
|
||||
<>
|
||||
<Space wrap>
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={!job.date_exported}
|
||||
onClick={handleMarkForExport}
|
||||
>
|
||||
{t("jobs.labels.markforreexport")}
|
||||
</Button>
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={job.date_exported}
|
||||
onClick={handleMarkExported}
|
||||
>
|
||||
{t("jobs.actions.markasexported")}
|
||||
</Button>
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={!job.date_invoiced || job.date_exported}
|
||||
onClick={handleUninvoice}
|
||||
>
|
||||
{t("jobs.actions.uninvoice")}
|
||||
</Button>
|
||||
</Space>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,65 @@
|
||||
import { useMutation } from "@apollo/client";
|
||||
import { Switch, notification } from "antd";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { connect } from "react-redux";
|
||||
import { createStructuredSelector } from "reselect";
|
||||
import { UPDATE_REMOVE_FROM_AR } from "../../graphql/jobs.queries";
|
||||
import { insertAuditTrail } from "../../redux/application/application.actions";
|
||||
import AuditTrailMapping from "../../utils/AuditTrailMappings";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({});
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
insertAuditTrail: ({ jobid, operation }) =>
|
||||
dispatch(insertAuditTrail({ jobid, operation })),
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(JobsAdminRemoveAR);
|
||||
|
||||
export function JobsAdminRemoveAR({ insertAuditTrail, job }) {
|
||||
const { t } = useTranslation();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [switchValue, setSwitchValue] = useState(job.remove_from_ar);
|
||||
|
||||
const [mutationUpdateRemoveFromAR] = useMutation(UPDATE_REMOVE_FROM_AR);
|
||||
|
||||
const handleChange = async (value) => {
|
||||
setLoading(true);
|
||||
const result = await mutationUpdateRemoveFromAR({
|
||||
variables: { jobId: job.id, remove_from_ar: value },
|
||||
});
|
||||
|
||||
if (!result.errors) {
|
||||
notification["success"]({ message: t("jobs.successes.save") });
|
||||
insertAuditTrail({
|
||||
jobid: job.id,
|
||||
operation: AuditTrailMapping.admin_job_remove_from_ar(value),
|
||||
});
|
||||
setSwitchValue(value);
|
||||
} else {
|
||||
notification["error"]({
|
||||
message: t("jobs.errors.saving", {
|
||||
error: JSON.stringify(result.errors),
|
||||
}),
|
||||
});
|
||||
}
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div style={{ display: "flex", alignItems: "center" }}>
|
||||
<div style={{ marginRight: "10px" }}>
|
||||
{t("jobs.labels.remove_from_ar")}:
|
||||
</div>
|
||||
<div>
|
||||
<Switch
|
||||
checked={switchValue}
|
||||
loading={loading}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -4,111 +4,65 @@ import React, {useState} from "react";
|
||||
import {useTranslation} from "react-i18next";
|
||||
import {connect} from "react-redux";
|
||||
import {createStructuredSelector} from "reselect";
|
||||
import { UNVOID_JOB } from "../../graphql/jobs.queries";
|
||||
import {insertAuditTrail} from "../../redux/application/application.actions";
|
||||
import {selectBodyshop, selectCurrentUser,} from "../../redux/user/user.selectors";
|
||||
import AuditTrailMapping from "../../utils/AuditTrailMappings";
|
||||
|
||||
const mapStateToProps = createStructuredSelector({
|
||||
bodyshop: selectBodyshop,
|
||||
currentUser: selectCurrentUser,
|
||||
bodyshop: selectBodyshop,
|
||||
currentUser: selectCurrentUser,
|
||||
});
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
insertAuditTrail: ({jobid, operation}) =>
|
||||
dispatch(insertAuditTrail({jobid, operation})),
|
||||
insertAuditTrail: ({ jobid, operation }) =>
|
||||
dispatch(insertAuditTrail({ jobid, operation })),
|
||||
});
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(JobsAdminUnvoid);
|
||||
|
||||
export function JobsAdminUnvoid({
|
||||
insertAuditTrail,
|
||||
bodyshop,
|
||||
job,
|
||||
currentUser,
|
||||
}) {
|
||||
const {t} = useTranslation();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [updateJob] = useMutation(gql`
|
||||
mutation UNVOID_JOB($jobId: uuid!) {
|
||||
update_jobs_by_pk(pk_columns: {id: $jobId}, _set: {voided: false, status: "${
|
||||
bodyshop.md_ro_statuses.default_imported
|
||||
}", date_void: null}) {
|
||||
id
|
||||
date_void
|
||||
voided
|
||||
status
|
||||
}
|
||||
insert_notes(objects: {jobid: $jobId, audit: true, created_by: "${
|
||||
currentUser.email
|
||||
}", text: "${t("jobs.labels.unvoidnote")}"}) {
|
||||
returning {
|
||||
id
|
||||
}
|
||||
}
|
||||
}
|
||||
insertAuditTrail,
|
||||
bodyshop,
|
||||
job,
|
||||
currentUser,
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [mutationUnvoidJob] = useMutation(UNVOID_JOB);
|
||||
|
||||
`);
|
||||
const handleUpdate = async (values) => {
|
||||
setLoading(true);
|
||||
const result = await mutationUnvoidJob({
|
||||
variables: {
|
||||
jobId: job.id,
|
||||
default_imported: bodyshop.md_ro_statuses.default_imported,
|
||||
currentUserEmail: currentUser.email,
|
||||
text: t("jobs.labels.unvoidnote"),
|
||||
},
|
||||
});
|
||||
|
||||
// const result = await voidJob({
|
||||
// variables: {
|
||||
// jobId: job.id,
|
||||
// job: {
|
||||
// status: bodyshop.md_ro_statuses.default_void,
|
||||
// voided: true,
|
||||
// },
|
||||
// note: [
|
||||
// {
|
||||
// jobid: job.id,
|
||||
// created_by: currentUser.email,
|
||||
// audit: true,
|
||||
// text: t("jobs.labels.voidnote", {
|
||||
// date: dayjs().format("MM/DD/yyy"),
|
||||
// time: dayjs().format("hh:mm a"),
|
||||
// }),
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// });
|
||||
if (!result.errors) {
|
||||
notification["success"]({ message: t("jobs.successes.save") });
|
||||
|
||||
// if (!!!result.errors) {
|
||||
// notification["success"]({
|
||||
// message: t("jobs.successes.voided"),
|
||||
// });
|
||||
// //go back to jobs list.
|
||||
// history.push(`/manage/`);
|
||||
// } else {
|
||||
// notification["error"]({
|
||||
// message: t("jobs.errors.voiding", {
|
||||
// error: JSON.stringify(result.errors),
|
||||
// }),
|
||||
// });
|
||||
// }
|
||||
insertAuditTrail({
|
||||
jobid: job.id,
|
||||
operation: AuditTrailMapping.admin_jobunvoid(),
|
||||
});
|
||||
} else {
|
||||
notification["error"]({
|
||||
message: t("jobs.errors.saving", {
|
||||
error: JSON.stringify(result.errors),
|
||||
}),
|
||||
});
|
||||
}
|
||||
setLoading(false);
|
||||
//Get the owner details, populate it all back into the job.
|
||||
};
|
||||
|
||||
const handleUpdate = async (values) => {
|
||||
setLoading(true);
|
||||
const result = await updateJob({
|
||||
variables: {jobId: job.id},
|
||||
});
|
||||
|
||||
if (!result.errors) {
|
||||
notification["success"]({message: t("jobs.successes.save")});
|
||||
|
||||
insertAuditTrail({
|
||||
jobid: job.id,
|
||||
operation: AuditTrailMapping.admin_jobunvoid(),
|
||||
});
|
||||
} else {
|
||||
notification["error"]({
|
||||
message: t("jobs.errors.saving", {
|
||||
error: JSON.stringify(result.errors),
|
||||
}),
|
||||
});
|
||||
}
|
||||
setLoading(false);
|
||||
//Get the owner details, populate it all back into the job.
|
||||
};
|
||||
|
||||
return (
|
||||
<Button loading={loading} disabled={!job.voided} onClick={handleUpdate}>
|
||||
{t("jobs.actions.unvoid")}
|
||||
</Button>
|
||||
);
|
||||
return (
|
||||
<>
|
||||
<Button loading={loading} disabled={!job.voided} onClick={handleUpdate}>
|
||||
{t("jobs.actions.unvoid")}
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -65,128 +65,132 @@ export function ProductionListDetail({
|
||||
nextFetchPolicy: "network-only",
|
||||
});
|
||||
|
||||
return (
|
||||
<Drawer
|
||||
title={
|
||||
<PageHeader
|
||||
title={theJob.ro_number}
|
||||
extra={
|
||||
<Space wrap>
|
||||
{!technician ? (
|
||||
<ProductionRemoveButton jobId={theJob.id}/>
|
||||
) : null}
|
||||
<Button
|
||||
onClick={() => {
|
||||
setPrintCenterContext({
|
||||
actions: {refetch: refetch},
|
||||
context: {
|
||||
id: theJob.id,
|
||||
job: theJob,
|
||||
type: "job",
|
||||
},
|
||||
});
|
||||
}}
|
||||
>
|
||||
<PrinterFilled/>
|
||||
{t("jobs.actions.printCenter")}
|
||||
</Button>
|
||||
{!technician ? (
|
||||
<ScoreboardAddButton job={data ? data.jobs_by_pk : {}}/>
|
||||
) : null}
|
||||
</Space>
|
||||
}
|
||||
/>
|
||||
}
|
||||
placement="right"
|
||||
width={"50%"}
|
||||
onClose={handleClose}
|
||||
open={selected}
|
||||
>
|
||||
{loading && <LoadingSkeleton/>}
|
||||
{error && <AlertComponent error={JSON.stringify(error)}/>}
|
||||
{!loading && data && (
|
||||
<div>
|
||||
<Space direction="vertical">
|
||||
<CardTemplate
|
||||
title={t("jobs.labels.employeeassignments")}
|
||||
loading={loading}
|
||||
>
|
||||
<JobEmployeeAssignments job={data.jobs_by_pk} refetch={refetch}/>
|
||||
</CardTemplate>
|
||||
<Descriptions bordered column={1}>
|
||||
<Descriptions.Item label={t("jobs.fields.ro_number")}>
|
||||
{theJob.ro_number || ""}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.alt_transport")}>
|
||||
<Space>
|
||||
{data.jobs_by_pk.alt_transport || ""}
|
||||
<JobAtChange job={data.jobs_by_pk}/>
|
||||
</Space>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.clm_no")}>
|
||||
{theJob.clm_no || ""}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.ins_co_nm")}>
|
||||
{theJob.ins_co_nm || ""}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.owner")}>
|
||||
<Space>
|
||||
<OwnerNameDisplay ownerObject={theJob}/>
|
||||
{!technician ? (
|
||||
<>
|
||||
<StartChatButton
|
||||
phone={data.jobs_by_pk.ownr_ph1}
|
||||
jobid={data.jobs_by_pk.id}
|
||||
/>
|
||||
<StartChatButton
|
||||
phone={data.jobs_by_pk.ownr_ph2}
|
||||
jobid={data.jobs_by_pk.id}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<PhoneNumberFormatter>
|
||||
{data.jobs_by_pk.ownr_ph1}
|
||||
</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>
|
||||
{data.jobs_by_pk.ownr_ph2}
|
||||
</PhoneNumberFormatter>
|
||||
</>
|
||||
)}
|
||||
</Space>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.vehicle")}>
|
||||
{`${theJob.v_model_yr || ""} ${theJob.v_color || ""} ${
|
||||
theJob.v_make_desc || ""
|
||||
} ${theJob.v_model_desc || ""}`}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.clm_total")}>
|
||||
<CurrencyFormatter>{theJob.clm_total}</CurrencyFormatter>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.actual_in")}>
|
||||
<DateFormatter>{theJob.actual_in}</DateFormatter>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.scheduled_completion")}>
|
||||
<DateFormatter>{theJob.scheduled_completion}</DateFormatter>
|
||||
</Descriptions.Item>
|
||||
</Descriptions>
|
||||
<JobDetailCardsPartsComponent
|
||||
loading={loading}
|
||||
data={data ? data.jobs_by_pk : null}
|
||||
/>
|
||||
<JobDetailCardsNotesComponent
|
||||
loading={loading}
|
||||
data={data ? data.jobs_by_pk : null}
|
||||
/>
|
||||
{!bodyshop.uselocalmediaserver && (
|
||||
<JobDetailCardsDocumentsComponent
|
||||
loading={loading}
|
||||
data={data ? data.jobs_by_pk : null}
|
||||
/>
|
||||
)}
|
||||
</Space>
|
||||
</div>
|
||||
)}
|
||||
</Drawer>
|
||||
);
|
||||
return (
|
||||
<Drawer
|
||||
title={
|
||||
<PageHeader
|
||||
title={theJob.ro_number}
|
||||
extra={
|
||||
<Space wrap>
|
||||
{!technician ? (
|
||||
<ProductionRemoveButton jobId={theJob.id} />
|
||||
) : null}
|
||||
<Button
|
||||
onClick={() => {
|
||||
setPrintCenterContext({
|
||||
actions: { refetch: refetch },
|
||||
context: {
|
||||
id: theJob.id,
|
||||
job: theJob,
|
||||
type: "job",
|
||||
},
|
||||
});
|
||||
}}
|
||||
>
|
||||
<PrinterFilled />
|
||||
{t("jobs.actions.printCenter")}
|
||||
</Button>
|
||||
{!technician ? (
|
||||
<ScoreboardAddButton job={data ? data.jobs_by_pk : {}} />
|
||||
) : null}
|
||||
</Space>
|
||||
}
|
||||
/>
|
||||
}
|
||||
placement="right"
|
||||
width={"50%"}
|
||||
onClose={handleClose}
|
||||
open={selected}
|
||||
>
|
||||
{loading && <LoadingSkeleton />}
|
||||
{error && <AlertComponent error={JSON.stringify(error)} />}
|
||||
{!loading && data && (
|
||||
<div>
|
||||
<CardTemplate
|
||||
title={t("jobs.labels.employeeassignments")}
|
||||
loading={loading}
|
||||
>
|
||||
<JobEmployeeAssignments job={data.jobs_by_pk} refetch={refetch} />
|
||||
</CardTemplate>
|
||||
<div style={{ height: "8px" }} />
|
||||
<Descriptions bordered column={1}>
|
||||
<Descriptions.Item label={t("jobs.fields.ro_number")}>
|
||||
{theJob.ro_number || ""}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.alt_transport")}>
|
||||
<Space>
|
||||
{data.jobs_by_pk.alt_transport || ""}
|
||||
<JobAtChange job={data.jobs_by_pk} />
|
||||
</Space>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.clm_no")}>
|
||||
{theJob.clm_no || ""}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.ins_co_nm")}>
|
||||
{theJob.ins_co_nm || ""}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.owner")}>
|
||||
<Space>
|
||||
<OwnerNameDisplay ownerObject={theJob} />
|
||||
{!technician ? (
|
||||
<>
|
||||
<StartChatButton
|
||||
phone={data.jobs_by_pk.ownr_ph1}
|
||||
jobid={data.jobs_by_pk.id}
|
||||
/>
|
||||
<StartChatButton
|
||||
phone={data.jobs_by_pk.ownr_ph2}
|
||||
jobid={data.jobs_by_pk.id}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<PhoneNumberFormatter>
|
||||
{data.jobs_by_pk.ownr_ph1}
|
||||
</PhoneNumberFormatter>
|
||||
<PhoneNumberFormatter>
|
||||
{data.jobs_by_pk.ownr_ph2}
|
||||
</PhoneNumberFormatter>
|
||||
</>
|
||||
)}
|
||||
</Space>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.vehicle")}>
|
||||
{`${theJob.v_model_yr || ""} ${theJob.v_color || ""} ${
|
||||
theJob.v_make_desc || ""
|
||||
} ${theJob.v_model_desc || ""}`}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.clm_total")}>
|
||||
<CurrencyFormatter>{theJob.clm_total}</CurrencyFormatter>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.actual_in")}>
|
||||
<DateFormatter>{theJob.actual_in}</DateFormatter>
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label={t("jobs.fields.scheduled_completion")}>
|
||||
<DateFormatter>{theJob.scheduled_completion}</DateFormatter>
|
||||
</Descriptions.Item>
|
||||
</Descriptions>
|
||||
<div style={{ height: "8px" }} />
|
||||
<JobDetailCardsPartsComponent
|
||||
loading={loading}
|
||||
data={data ? data.jobs_by_pk : null}
|
||||
/>
|
||||
<div style={{ height: "8px" }} />
|
||||
<JobDetailCardsNotesComponent
|
||||
loading={loading}
|
||||
data={data ? data.jobs_by_pk : null}
|
||||
/>
|
||||
{!bodyshop.uselocalmediaserver && (
|
||||
<>
|
||||
<div style={{ height: "8px" }} />
|
||||
<JobDetailCardsDocumentsComponent
|
||||
loading={loading}
|
||||
data={data ? data.jobs_by_pk : null}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</Drawer>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -86,9 +86,9 @@ export function ReportCenterModalComponent({reportCenterModal, bodyshop}) {
|
||||
|
||||
const handleFinish = async (values) => {
|
||||
setLoading(true);
|
||||
const start = values.dates[0];
|
||||
const end = values.dates[1];
|
||||
const {id} = values;
|
||||
const start = values.dates ? values.dates[0] : null;
|
||||
const end = values.dates ? values.dates[1] : null;
|
||||
const { id } = values;
|
||||
|
||||
await GenerateDocument(
|
||||
{
|
||||
@@ -257,20 +257,30 @@ export function ReportCenterModalComponent({reportCenterModal, bodyshop}) {
|
||||
else return null;
|
||||
}}
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="dates"
|
||||
label={t("reportcenter.labels.dates")}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
//message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker.RangePicker
|
||||
format="MM/DD/YYYY"
|
||||
presets={DatePIckerRanges}
|
||||
/>
|
||||
<Form.Item style={{ margin: 0, padding: 0 }} dependencies={["key"]}>
|
||||
{() => {
|
||||
const key = form.getFieldValue("key");
|
||||
const datedisable = Templates[key] && Templates[key].datedisable;
|
||||
if (datedisable !== true) {
|
||||
return (
|
||||
<Form.Item
|
||||
name="dates"
|
||||
label={t("reportcenter.labels.dates")}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
//message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker.RangePicker
|
||||
format="MM/DD/YYYY"
|
||||
ranges={DatePIckerRanges}
|
||||
/>
|
||||
</Form.Item>
|
||||
);
|
||||
} else return null;
|
||||
}}
|
||||
</Form.Item>
|
||||
<Form.Item style={{margin: 0, padding: 0}} dependencies={["key"]}>
|
||||
{() => {
|
||||
@@ -306,18 +316,18 @@ export function ReportCenterModalComponent({reportCenterModal, bodyshop}) {
|
||||
}}
|
||||
</Form.Item>
|
||||
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
marginTop: "1rem",
|
||||
}}
|
||||
>
|
||||
<Button onClick={() => form.submit()} style={{}} loading={loading}>
|
||||
{t("reportcenter.actions.generate")}
|
||||
</Button>
|
||||
</div>
|
||||
</Form>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
marginTop: "1rem",
|
||||
}}
|
||||
>
|
||||
<Button onClick={() => form.submit()} style={{}} loading={loading}>
|
||||
{t("reportcenter.actions.generate")}
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
</Form>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user