admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BOD-23 Added labor pages tab + finalized time ticket tab + created allocation calculations

Browse Source
This commit is contained in:
Patrick Fic
2020-04-15 15:39:05 -07:00
parent 325a82ac86
commit 8e12320c19
20 changed files with 724 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

217
bodyshop_translations.babel
View File

@@ -1,4 +1,4 @@
<babeledit_project version="1.2" be_version="2.6.1"> <babeledit_project be_version="2.6.1" version="1.2">
<!-- <!--
BabelEdit project file BabelEdit project file
@@ -8567,6 +8567,48 @@
</translation> </translation>
</translations> </translations>
</concept_node> </concept_node>
<concept_node>
<name>hrs_claimed</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>hrs_total</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node> <concept_node>
<name>job</name> <name>job</name>
<definition_loaded>false</definition_loaded> <definition_loaded>false</definition_loaded>
@@ -8588,6 +8630,27 @@
</translation> </translation>
</translations> </translations>
</concept_node> </concept_node>
<concept_node>
<name>laborallocations</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node> <concept_node>
<name>lines</name> <name>lines</name>
<definition_loaded>false</definition_loaded> <definition_loaded>false</definition_loaded>
@@ -10866,9 +10929,119 @@
<folder_node> <folder_node>
<name>timetickets</name> <name>timetickets</name>
<children> <children>
<folder_node>
<name>actions</name>
<children>
<concept_node>
<name>enter</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
</children>
</folder_node>
<folder_node> <folder_node>
<name>fields</name> <name>fields</name>
<children> <children>
<concept_node>
<name>actualhrs</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>ciecacode</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>cost_center</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>date</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node> <concept_node>
<name>employee</name> <name>employee</name>
<definition_loaded>false</definition_loaded> <definition_loaded>false</definition_loaded>
@@ -10890,6 +11063,48 @@
</translation> </translation>
</translations> </translations>
</concept_node> </concept_node>
<concept_node>
<name>productivehrs</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>ro_number</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>es-MX</language>
<approved>false</approved>
</translation>
<translation>
<language>fr-CA</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
</children> </children>
</folder_node> </folder_node>
<folder_node> <folder_node>

11
client/src/components/employee-search-select/employee-search-select.component.jsx
View File

@@ -5,7 +5,13 @@ import CurrencyFormatter from "../../utils/CurrencyFormatter";
const { Option } = Select; const { Option } = Select;
//To be used as a form element only. //To be used as a form element only.
const EmployeeSearchSelect = ({ value, onChange, options, onSelect }) => { const EmployeeSearchSelect = ({
value,
onChange,
options,
onSelect,
onBlur,
}) => {
const [option, setOption] = useState(value); const [option, setOption] = useState(value);
const { t } = useTranslation(); const { t } = useTranslation();
useEffect(() => { useEffect(() => {
@@ -24,6 +30,7 @@ const EmployeeSearchSelect = ({ value, onChange, options, onSelect }) => {
onChange={setOption} onChange={setOption}
optionFilterProp="search" optionFilterProp="search"
onSelect={onSelect} onSelect={onSelect}
onBlur={onBlur}
> >
{options {options
? options.map((o) => ( ? options.map((o) => (
@@ -39,7 +46,7 @@ const EmployeeSearchSelect = ({ value, onChange, options, onSelect }) => {
<Tag color="red"> <Tag color="red">
<CurrencyFormatter>{o.base_rate}</CurrencyFormatter> <CurrencyFormatter>{o.base_rate}</CurrencyFormatter>
</Tag> </Tag>
<Tag color="red"> <Tag color="green">
{o.flat_rate {o.flat_rate
? t("timetickets.labels.flat_rate") ? t("timetickets.labels.flat_rate")
: t("timetickets.labels.straight_time")} : t("timetickets.labels.straight_time")}

2
client/src/components/job-detail-cards/job-detail-cards.component.jsx
View File

@@ -78,7 +78,7 @@ export function JobDetailCards({
? `${t("jobs.fields.ro_number")} ${data.jobs_by_pk.ro_number}` ? `${t("jobs.fields.ro_number")} ${data.jobs_by_pk.ro_number}`
: `${t("jobs.fields.est_number")} ${ : `${t("jobs.fields.est_number")} ${
data.jobs_by_pk.est_number data.jobs_by_pk.est_number
}`}{" "} }`}
</Link> </Link>
) )
} }

6
client/src/components/job-detail-cards/job-detail-cards.vehicle.component.jsx
View File

@@ -13,9 +13,9 @@ export default function JobDetailCardsVehicleComponent({ loading, data }) {
> >
{data ? ( {data ? (
<span> <span>
{data.vehicle?.v_model_yr || t("general.labels.na")}{" "} {` ${data.vehicle?.v_model_yr || t("general.labels.na")} ${
{data.vehicle?.v_make_desc || t("general.labels.na")}{" "} data.vehicle?.v_make_desc || t("general.labels.na")
{data.vehicle?.v_model_desc || t("general.labels.na")} } ${data.vehicle?.v_model_desc || t("general.labels.na")}`}
</span> </span>
) : null} ) : null}
</CardTemplate> </CardTemplate>

30
client/src/components/jobs-detail-labor/jobs-detail-labor.component.jsx Normal file
View File

@@ -0,0 +1,30 @@
import React from "react";
import LaborAllocationsTableComponent from "../labor-allocations-table/labor-allocations-table.component";
import TimeTicketEnterButton from "../time-ticket-enter-button/time-ticket-enter-button.component";
import TimeTicketList from "../time-ticket-list/time-ticket-list.component";
import { useTranslation } from "react-i18next";
export default function JobsDetailLaborContainer({
jobId,
joblines,
timetickets,
refetch,
loading,
}) {
const { t } = useTranslation();
return (
<div>
<TimeTicketEnterButton actions={{ refetch }} context={{ jobid: jobId }}>
{t("timetickets.actions.enter")}
</TimeTicketEnterButton>
<LaborAllocationsTableComponent
joblines={joblines}
timetickets={timetickets}
/>
<TimeTicketList
loading={loading}
timetickets={timetickets}
refetch={refetch}
/>
</div>
);
}

49
client/src/components/jobs-detail-labor/jobs-detail-labor.container.jsx
View File

@@ -1,45 +1,24 @@
import React from "react";
import { Button } from "antd";
import { connect } from "react-redux";
import { setModalContext } from "../../redux/modals/modals.actions";
import AlertComponent from "../alert/alert.component";
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
import { useQuery } from "@apollo/react-hooks"; import { useQuery } from "@apollo/react-hooks";
import { QUERY_TICKETS_BY_JOBID } from "../../graphql/timetickets.queries"; import React from "react";
import { GET_LINE_TICKET_BY_PK } from "../../graphql/jobs-lines.queries";
import AlertComponent from "../alert/alert.component";
import JobsDetailLaborComponent from "./jobs-detail-labor.component";
const mapDispatchToProps = (dispatch) => ({ export default function JobsDetailLaborContainer({ jobId }) {
setTimeTicketContext: (context) => const { loading, error, data, refetch } = useQuery(GET_LINE_TICKET_BY_PK, {
dispatch(setModalContext({ context: context, modal: "timeTicket" })), variables: { id: jobId },
});
export function JobsDetailLaborContainer({ jobId, setTimeTicketContext }) {
const { loading, error, data, refetch } = useQuery(QUERY_TICKETS_BY_JOBID, {
variables: { jobid: jobId },
skip: !!!jobId, skip: !!!jobId,
}); });
if (loading) return <LoadingSpinner />;
if (error) return <AlertComponent message={error.message} type="error" />; if (error) return <AlertComponent message={error.message} type="error" />;
return ( return (
<div> <JobsDetailLaborComponent
{jobId} loading={loading}
<Button jobId={jobId}
onClick={() => { timetickets={data ? data.timetickets : []}
setTimeTicketContext({ joblines={data ? data.joblines : []}
actions: { refetch }, refetch={refetch}
context: { />
jobId,
},
});
}}
>
TEST - Open Time Ticket Modal
</Button>
{JSON.stringify(data)}
</div>
); );
} }
export default connect(null, mapDispatchToProps)(JobsDetailLaborContainer);

54
client/src/components/labor-allocations-table/labor-allocations-table.component.jsx Normal file
View File

@@ -0,0 +1,54 @@
import React, { useState, useEffect } from "react";
import { Typography, Row, Col } from "antd";
import { useTranslation } from "react-i18next";
import { CalculateAllocationsTotals } from "./labor-allocations-table.utility";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
});
export function LaborAllocationsTable({ joblines, timetickets, bodyshop }) {
const { t } = useTranslation();
const [totals, setTotals] = useState([]);
useEffect(() => {
if (!!joblines && !!timetickets && !!bodyshop);
setTotals(
CalculateAllocationsTotals(
bodyshop.md_responsibility_centers,
joblines,
timetickets
)
);
}, [joblines, timetickets, bodyshop]);
return (
<div>
<Typography.Title level={3}>
{t("jobs.labels.laborallocations")}
</Typography.Title>
<Row>
<Col span={12}>
<strong>{t("timetickets.fields.cost_center")}</strong>
</Col>
<Col span={6}>
<strong>{t("jobs.labels.hrs_total")}</strong>
</Col>
<Col span={6}>
<strong>{t("jobs.labels.hrs_claimed")}</strong>
</Col>
</Row>
{totals.map((t, idx) => (
<Row key={idx}>
<Col span={12}>{t.cost_center}</Col>
<Col span={6}>{t.total}</Col>
<Col span={6}>{t.claimed}</Col>
</Row>
))}
</div>
);
}
export default connect(mapStateToProps, null)(LaborAllocationsTable);

29
client/src/components/labor-allocations-table/labor-allocations-table.utility.js Normal file
View File

@@ -0,0 +1,29 @@
export const CalculateAllocationsTotals = (
responsibilitycenters,
joblines,
timetickets
) => {
const jobCodes = joblines
.map((item) => item.mod_lbr_ty)
.filter((value, index, self) => self.indexOf(value) === index && !!value);
const ticketCodes = timetickets
.map((item) => item.cieca_code)
.filter((value, index, self) => self.indexOf(value) === index && !!value);
const allCodes = [...jobCodes, ...ticketCodes];
const r = allCodes.reduce((acc, value) => {
acc.push({
opcode: value,
cost_center: responsibilitycenters.defaults[value],
total: joblines.reduce((acc2, val2) => {
return val2.mod_lbr_ty === value ? acc2 + val2.mod_lb_hrs : acc2;
}, 0),
claimed: timetickets.reduce((acc3, val3) => {
return val3.ciecacode === value ? acc3 + val3.productivehrs : acc3;
}, 0),
});
return acc;
}, []);
return r;
};

2
client/src/components/shop-info/shop-info.responsibilitycenters.component.jsx
View File

@@ -262,7 +262,7 @@ export default function ShopInfoResponsibilityCenterComponent({ form }) {
<Select.Option key={idx}>{item}</Select.Option> <Select.Option key={idx}>{item}</Select.Option>
))} ))}
</Select> </Select>
</Form.Item>{" "} </Form.Item>
<Form.Item <Form.Item
label={t("bodyshop.fields.responsibilitycenters.las")} label={t("bodyshop.fields.responsibilitycenters.las")}
rules={[ rules={[

30
client/src/components/time-ticket-enter-button/time-ticket-enter-button.component.jsx Normal file
View File

@@ -0,0 +1,30 @@
import { Button } from "antd";
import React from "react";
import { connect } from "react-redux";
import { setModalContext } from "../../redux/modals/modals.actions";
const mapDispatchToProps = (dispatch) => ({
setTimeTicketContext: (context) =>
dispatch(setModalContext({ context: context, modal: "timeTicket" })),
});
export function TimeTicketEnterButton({
actions,
context,
setTimeTicketContext,
children,
}) {
return (
<Button
onClick={() => {
setTimeTicketContext({
actions,
context,
});
}}
>
{children}
</Button>
);
}
export default connect(null, mapDispatchToProps)(TimeTicketEnterButton);

94
client/src/components/time-ticket-list/time-ticket-list.component.jsx Normal file
View File

@@ -0,0 +1,94 @@
import { Table } from "antd";
import React, { useState } from "react";
import { useTranslation } from "react-i18next";
import { Link } from "react-router-dom";
import { alphaSort } from "../../utils/sorters";
import { DateFormatter } from "../../utils/DateFormatter";
import TimeTicketEnterButton from "../time-ticket-enter-button/time-ticket-enter-button.component";
export default function TimeTicketList({ loading, timetickets, refetch }) {
const [state, setState] = useState({
sortedInfo: {},
filteredInfo: { text: "" },
});
const { t } = useTranslation();
const columns = [
{
title: t("timetickets.fields.date"),
dataIndex: "date",
key: "date",
sorter: (a, b) => (a.date = b.date),
sortOrder:
state.sortedInfo.columnKey === "date" && state.sortedInfo.order,
render: (text, record) => <DateFormatter>{record.date}</DateFormatter>,
},
{
title: t("timetickets.fields.employee"),
dataIndex: "employee",
key: "employee",
sorter: (a, b) => alphaSort(a.employee.last_name, b.employee.last_name),
sortOrder: state.sortedInfo.columnKey === "vin" && state.sortedInfo.order,
render: (text, record) => (
<Link
to={`/manage/employees/${record.employee.id}`}
>{`${record.employee.first_name} ${record.employee.last_name}`}</Link>
),
},
{
title: t("timetickets.fields.cost_center"),
dataIndex: "cost_center",
key: "cost_center",
sorter: (a, b) => alphaSort(a.cost_center, b.cost_center),
sortOrder:
state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
},
{
title: t("timetickets.fields.productivehrs"),
dataIndex: "productivehrs",
key: "productivehrs",
sorter: (a, b) => a.productivehrs - b.productivehrs,
sortOrder:
state.sortedInfo.columnKey === "productivehrs" &&
state.sortedInfo.order,
},
{
title: t("timetickets.fields.actualhrs"),
dataIndex: "actualhrs",
key: "actualhrs",
sorter: (a, b) => a.actualhrs - b.actualhrs,
sortOrder:
state.sortedInfo.columnKey === "actualhrs" && state.sortedInfo.order,
},
{
title: t("general.labels.actions"),
dataIndex: "actions",
key: "actions",
render: (text, record) => (
<TimeTicketEnterButton
actions={{ refetch }}
context={{ id: record.id, timeticket: record }}
>
{t("general.actions.edit")}
</TimeTicketEnterButton>
),
},
];
const handleTableChange = (pagination, filters, sorter) => {
setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
};
return (
<Table
loading={loading}
size="small"
pagination={{ position: "top" }}
columns={columns.map((item) => ({ ...item }))}
rowKey="id"
dataSource={timetickets}
onChange={handleTableChange}
/>
);
}

91
client/src/components/time-ticket-modal/time-ticket-modal.component.jsx
View File

@@ -1,15 +1,16 @@
import { DatePicker, Form, Input, Switch } from "antd"; import { DatePicker, Form, InputNumber, Input, Select } from "antd";
import React from "react"; import React from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
import JobSearchSelect from "../job-search-select/job-search-select.component";
import EmployeeSearchSelect from "../employee-search-select/employee-search-select.component"; import EmployeeSearchSelect from "../employee-search-select/employee-search-select.component";
import JobSearchSelect from "../job-search-select/job-search-select.component";
import LaborAllocationsTable from "../labor-allocations-table/labor-allocations-table.component";
export default function TimeTicketModalComponent({ export default function TimeTicketModalComponent({
form, form,
roAutoCompleteOptions, roAutoCompleteOptions,
employeeAutoCompleteOptions, employeeAutoCompleteOptions,
loadJobLines, loadLineTicketData,
lineTicketData,
responsibilityCenters, responsibilityCenters,
}) { }) {
const { t } = useTranslation(); const { t } = useTranslation();
@@ -19,7 +20,7 @@ export default function TimeTicketModalComponent({
<div style={{ display: "flex" }}> <div style={{ display: "flex" }}>
<Form.Item <Form.Item
name="jobid" name="jobid"
label={t("invoices.fields.ro_number")} label={t("timetickets.fields.ro_number")}
rules={[ rules={[
{ {
required: true, required: true,
@@ -31,7 +32,7 @@ export default function TimeTicketModalComponent({
options={roAutoCompleteOptions} options={roAutoCompleteOptions}
onBlur={() => { onBlur={() => {
if (form.getFieldValue("jobid") !== null) { if (form.getFieldValue("jobid") !== null) {
loadJobLines({ loadLineTicketData({
variables: { id: form.getFieldValue("jobid") }, variables: { id: form.getFieldValue("jobid") },
}); });
} }
@@ -51,21 +52,10 @@ export default function TimeTicketModalComponent({
<EmployeeSearchSelect options={employeeAutoCompleteOptions} /> <EmployeeSearchSelect options={employeeAutoCompleteOptions} />
</Form.Item> </Form.Item>
</div> </div>
<div style={{ display: "flex" }}> <div style={{ display: "flex" }}>
<Form.Item <Form.Item
label={t("invoices.fields.invoice_number")} label={t("timetickets.fields.date")}
name="invoice_number"
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("invoices.fields.date")}
name="date" name="date"
rules={[ rules={[
{ {
@@ -77,15 +67,8 @@ export default function TimeTicketModalComponent({
<DatePicker /> <DatePicker />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
label={t("invoices.fields.is_credit_memo")} label={t("timetickets.fields.productivehrs")}
name="is_credit_memo" name="productivehrs"
valuePropName="checked"
>
<Switch />
</Form.Item>
<Form.Item
label={t("invoices.fields.total")}
name="total"
rules={[ rules={[
{ {
required: true, required: true,
@@ -93,7 +76,52 @@ export default function TimeTicketModalComponent({
}, },
]} ]}
> >
<CurrencyInput /> <InputNumber />
</Form.Item>
<Form.Item
label={t("timetickets.fields.actualhrs")}
name="actualhrs"
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}
>
<InputNumber />
</Form.Item>
<Form.Item
name="cost_center"
label={t("timetickets.fields.cost_center")}
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}
>
<Select
style={{ width: "150px" }}
onChange={() => {
console.log("Changed.");
}}
>
{responsibilityCenters.costs.map((item) => (
<Select.Option key={item}>{item}</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
name="ciecacode"
label={t("timetickets.fields.ciecacode")}
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}
>
<Input disabled />
</Form.Item> </Form.Item>
</div> </div>
@@ -104,6 +132,11 @@ export default function TimeTicketModalComponent({
> >
Get Them Values Get Them Values
</button> </button>
<LaborAllocationsTable
joblines={lineTicketData.joblines}
timetickets={lineTicketData.timetickets}
/>
</div> </div>
); );
} }

155
client/src/components/time-ticket-modal/time-ticket-modal.container.jsx
View File

@@ -1,17 +1,22 @@
import { useLazyQuery, useMutation, useQuery } from "@apollo/react-hooks"; import { useLazyQuery, useMutation, useQuery } from "@apollo/react-hooks";
import { Form, Modal, notification, Button } from "antd"; import { Button, Form, Modal, notification } from "antd";
import React, { useState, useEffect } from "react"; import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { createStructuredSelector } from "reselect"; import { createStructuredSelector } from "reselect";
import { INSERT_NEW_INVOICE } from "../../graphql/invoices.queries"; import { QUERY_EMPLOYEES } from "../../graphql/employees.queries";
import { GET_LINE_TICKET_BY_PK } from "../../graphql/jobs-lines.queries";
import { ACTIVE_JOBS_FOR_AUTOCOMPLETE } from "../../graphql/jobs.queries"; import { ACTIVE_JOBS_FOR_AUTOCOMPLETE } from "../../graphql/jobs.queries";
import {
INSERT_NEW_TIME_TICKET,
UPDATE_TIME_TICKET,
} from "../../graphql/timetickets.queries";
import { toggleModalVisible } from "../../redux/modals/modals.actions"; import { toggleModalVisible } from "../../redux/modals/modals.actions";
import { selectTimeTicket } from "../../redux/modals/modals.selectors"; import { selectTimeTicket } from "../../redux/modals/modals.selectors";
import { selectBodyshop } from "../../redux/user/user.selectors"; import { selectBodyshop } from "../../redux/user/user.selectors";
import TimeTicketModalComponent from "./time-ticket-modal.component"; import TimeTicketModalComponent from "./time-ticket-modal.component";
import { QUERY_EMPLOYEES } from "../../graphql/employees.queries"; import moment from "moment";
import { GET_JOB_LINES_BY_PK_MINIMAL } from "../../graphql/jobs-lines.queries";
const mapStateToProps = createStructuredSelector({ const mapStateToProps = createStructuredSelector({
timeTicketModal: selectTimeTicket, timeTicketModal: selectTimeTicket,
bodyshop: selectBodyshop, bodyshop: selectBodyshop,
@@ -20,7 +25,7 @@ const mapDispatchToProps = (dispatch) => ({
toggleModalVisible: () => dispatch(toggleModalVisible("timeTicket")), toggleModalVisible: () => dispatch(toggleModalVisible("timeTicket")),
}); });
function TimeTicketModalContainer({ export function TimeTicketModalContainer({
timeTicketModal, timeTicketModal,
toggleModalVisible, toggleModalVisible,
bodyshop, bodyshop,
@@ -28,52 +33,60 @@ function TimeTicketModalContainer({
const [form] = Form.useForm(); const [form] = Form.useForm();
const { t } = useTranslation(); const { t } = useTranslation();
const [enterAgain, setEnterAgain] = useState(false); const [enterAgain, setEnterAgain] = useState(false);
// const [insertInvoice] = useMutation(INSERT_NEW_INVOICE); const [insertTicket] = useMutation(INSERT_NEW_TIME_TICKET);
const [updateTicket] = useMutation(UPDATE_TIME_TICKET);
const { data: RoAutoCompleteData } = useQuery(ACTIVE_JOBS_FOR_AUTOCOMPLETE, { const { data: RoAutoCompleteData } = useQuery(ACTIVE_JOBS_FOR_AUTOCOMPLETE, {
variables: { statuses: bodyshop.md_ro_statuses.open_statuses || ["Open"] }, variables: { statuses: bodyshop.md_ro_statuses.open_statuses || ["Open"] },
skip: !timeTicketModal.visible, skip: !timeTicketModal.visible,
}); });
const { data: EmployeeAutoCompleteData } = useQuery(QUERY_EMPLOYEES, { const { data: EmployeeAutoCompleteData } = useQuery(QUERY_EMPLOYEES, {
skip: !timeTicketModal.visible, skip: !timeTicketModal.visible,
}); });
const [loadLineTicketData, { data: lineTicketData }] = useLazyQuery(
const [loadJobLines, { data: jobLinesData }] = useLazyQuery( GET_LINE_TICKET_BY_PK
GET_JOB_LINES_BY_PK_MINIMAL
); );
const handleFinish = (values) => { const handleFinish = (values) => {
// insertInvoice({ if (timeTicketModal.context.id) {
// variables: { updateTicket({
// invoice: [ variables: {
// Object.assign({}, values, { timeticketId: timeTicketModal.context.id,
// invoicelines: { data: values.invoicelines }, timeticket: values,
// }), },
// ], })
// }, .then(handleMutationSuccess)
// }) .catch(handleMutationError);
// .then((r) => { } else {
// notification["success"]({ insertTicket({
// message: t("invoices.successes.created"), variables: {
// }); timeTicketInput: [values],
// if (timeTicketModal.actions.refetch) },
// timeTicketModal.actions.refetch(); })
// if (enterAgain) { .then(handleMutationSuccess)
// form.resetFields(); .catch(handleMutationError);
// } else { }
// toggleModalVisible(); };
// }
// setEnterAgain(false); const handleMutationSuccess = (response) => {
// }) notification["success"]({
// .catch((error) => { message: t("timetickets.successes.created"),
// setEnterAgain(false); });
// notification["error"]({ if (timeTicketModal.actions.refetch) timeTicketModal.actions.refetch();
// message: t("invoices.errors.creating", { if (enterAgain) {
// message: JSON.stringify(error), form.resetFields();
// }), } else {
// }); toggleModalVisible();
// }); }
setEnterAgain(false);
};
const handleMutationError = (error) => {
setEnterAgain(false);
notification["error"]({
message: t("timetickets.errors.creating", {
message: JSON.stringify(error),
}),
});
}; };
const handleCancel = () => { const handleCancel = () => {
@@ -84,6 +97,39 @@ function TimeTicketModalContainer({
if (enterAgain) form.submit(); if (enterAgain) form.submit();
}, [enterAgain, form]); }, [enterAgain, form]);
useEffect(() => {
if (timeTicketModal.visible) form.resetFields();
}, [timeTicketModal.visible, form]);
const handleFieldsChange = (changedFields, allFields) => {
if (!!changedFields.employeeid && !!EmployeeAutoCompleteData) {
const emps = EmployeeAutoCompleteData.employees.filter(
(e) => e.id === changedFields.employeeid
);
form.setFieldsValue({
cost_center: emps.length > 0 ? emps[0].cost_center : "",
ciecacode: Object.keys(
bodyshop.md_responsibility_centers.defaults
).find(
(key) =>
bodyshop.md_responsibility_centers.defaults[key] ===
emps[0].cost_center
),
});
}
if (!!changedFields.cost_center && !!EmployeeAutoCompleteData) {
form.setFieldsValue({
ciecacode: Object.keys(
bodyshop.md_responsibility_centers.defaults
).find(
(key) =>
bodyshop.md_responsibility_centers.defaults[key] ===
changedFields.cost_center
),
});
}
};
return ( return (
<Modal <Modal
title={ title={
@@ -96,6 +142,7 @@ function TimeTicketModalContainer({
okText={t("general.actions.save")} okText={t("general.actions.save")}
onOk={() => form.submit()} onOk={() => form.submit()}
onCancel={handleCancel} onCancel={handleCancel}
forceRender
afterClose={() => form.resetFields()} afterClose={() => form.resetFields()}
footer={ footer={
<span> <span>
@@ -121,13 +168,17 @@ function TimeTicketModalContainer({
onFinish={handleFinish} onFinish={handleFinish}
autoComplete={"off"} autoComplete={"off"}
form={form} form={form}
onFinishFailed={() => { initialValues={
setEnterAgain(false); timeTicketModal.context.timeticket
console.log("Finish failed"); ? {
}} ...timeTicketModal.context.timeticket,
initialValues={{ date: timeTicketModal.context.timeticket.date
jobid: timeTicketModal.context.jobId || null, ? moment(timeTicketModal.context.date)
}} : null,
}
: { jobid: timeTicketModal.context.jobId || null }
}
onValuesChange={handleFieldsChange}
> >
<TimeTicketModalComponent <TimeTicketModalComponent
form={form} form={form}
@@ -136,10 +187,12 @@ function TimeTicketModalContainer({
EmployeeAutoCompleteData && EmployeeAutoCompleteData.employees EmployeeAutoCompleteData && EmployeeAutoCompleteData.employees
} }
responsibilityCenters={bodyshop.md_responsibility_centers || null} responsibilityCenters={bodyshop.md_responsibility_centers || null}
loadJobLines={loadJobLines} loadLineTicketData={loadLineTicketData}
lineTicketData={
lineTicketData ? lineTicketData : { joblines: [], timetickets: [] }
}
/> />
</Form> </Form>
{JSON.stringify(jobLinesData)}
</Modal> </Modal>
); );
} }

4
client/src/emails/components/header/header.component.jsx
View File

@@ -5,7 +5,7 @@ export default function Header({ bodyshop }) {
<table> <table>
<tr> <tr>
<td> <td>
<img alt='' src={bodyshop.logo_img_path} /> <img alt="" src={bodyshop.logo_img_path} />
</td> </td>
<td> <td>
<div> <div>
@@ -13,7 +13,7 @@ export default function Header({ bodyshop }) {
</div> </div>
<div>{`${bodyshop.address1} ${bodyshop.address2} ${bodyshop.city} ${bodyshop.state} ${bodyshop.zip_post}`}</div> <div>{`${bodyshop.address1} ${bodyshop.address2} ${bodyshop.city} ${bodyshop.state} ${bodyshop.zip_post}`}</div>
<div> <div>
<a href={`mailto:${bodyshop.email}`}>{bodyshop.email}</a>{" "} <a href={`mailto:${bodyshop.email}`}>{bodyshop.email}</a>
{` | ${bodyshop.ph1}`} {` | ${bodyshop.ph1}`}
</div> </div>
</td> </td>

2
client/src/emails/templates/appointment-confirmation/appointment-confirmation.template.jsx
View File

@@ -33,7 +33,7 @@ export default function AppointmentConfirmationEmail({ data }) {
<strong>Appointment Reminder</strong> <strong>Appointment Reminder</strong>
<p> Dear {`${appointment.job.ownr_fn} ${appointment.job.ownr_ln}`},</p> <p> Dear {`${appointment.job.ownr_fn} ${appointment.job.ownr_ln}`},</p>
<p> <p>
You have an appointment at {data.bodyshops[0].shopname} on{" "} You have an appointment at {data.bodyshops[0].shopname} on
<DateTimeFormatter>{appointment.start}</DateTimeFormatter>. <DateTimeFormatter>{appointment.start}</DateTimeFormatter>.
</p> </p>
<p>Thank you from the team at {data.bodyshops[0].shopname}</p> <p>Thank you from the team at {data.bodyshops[0].shopname}</p>

22
client/src/graphql/jobs-lines.queries.js
View File

@@ -45,9 +45,9 @@ export const GET_JOB_LINES_BY_PK = gql`
} }
`; `;
export const GET_JOB_LINES_BY_PK_MINIMAL = gql` export const GET_LINE_TICKET_BY_PK = gql`
query GET_JOB_LINES_BY_PK_MINIMAL($id: uuid!) { query GET_LINE_TICKET_BY_PK($id: uuid!) {
joblines(where: { jobid: { _eq: $id } }, order_by: { unq_seq: asc }) { joblines(where: { jobid: { _eq: $id } }) {
id id
line_desc line_desc
part_type part_type
@@ -62,6 +62,22 @@ export const GET_JOB_LINES_BY_PK_MINIMAL = gql`
lbr_amt lbr_amt
op_code_desc op_code_desc
} }
timetickets(where: { jobid: { _eq: $id } }) {
actualhrs
ciecacode
cost_center
date
id
jobid
employeeid
employee {
id
first_name
last_name
employee_number
}
productivehrs
}
} }
`; `;

16
client/src/graphql/timetickets.queries.js
View File

@@ -30,3 +30,19 @@ export const INSERT_NEW_TIME_TICKET = gql`
} }
} }
`; `;
export const UPDATE_TIME_TICKET = gql`
mutation UPDATE_TIME_TICKET(
$timeticketId: uuid!
$timeticket: timetickets_set_input!
) {
update_timetickets(
where: { id: { _eq: $timeticketId } }
_set: $timeticket
) {
returning {
id
}
}
}
`;

14
client/src/translations/en_us/common.json
View File

@@ -548,7 +548,10 @@
"creating_new_job": "Creating new job...", "creating_new_job": "Creating new job...",
"documents": "Documents", "documents": "Documents",
"existing_jobs": "Existing Jobs", "existing_jobs": "Existing Jobs",
"hrs_claimed": "Hours Claimed",
"hrs_total": "Hours Total",
"job": "Job Details", "job": "Job Details",
"laborallocations": "Labor Allocations",
"lines": "Estimate Lines", "lines": "Estimate Lines",
"notes": "Notes", "notes": "Notes",
"override_header": "Override estimate header on import?", "override_header": "Override estimate header on import?",
@@ -713,8 +716,17 @@
} }
}, },
"timetickets": { "timetickets": {
"actions": {
"enter": "Enter New Time Ticket"
},
"fields": { "fields": {
"employee": "Employee" "actualhrs": "Actual Hours",
"ciecacode": "CIECA Code",
"cost_center": "Cost Center",
"date": "Ticket Date",
"employee": "Employee",
"productivehrs": "Productive Hours",
"ro_number": "Job to Post Against"
}, },
"labels": { "labels": {
"edit": "Edit Time Ticket", "edit": "Edit Time Ticket",

14
client/src/translations/es/common.json
View File

@@ -548,7 +548,10 @@
"creating_new_job": "Creando nuevo trabajo ...", "creating_new_job": "Creando nuevo trabajo ...",
"documents": "documentos", "documents": "documentos",
"existing_jobs": "Empleos existentes", "existing_jobs": "Empleos existentes",
"hrs_claimed": "",
"hrs_total": "",
"job": "", "job": "",
"laborallocations": "",
"lines": "Líneas estimadas", "lines": "Líneas estimadas",
"notes": "Notas", "notes": "Notas",
"override_header": "¿Anular encabezado estimado al importar?", "override_header": "¿Anular encabezado estimado al importar?",
@@ -713,8 +716,17 @@
} }
}, },
"timetickets": { "timetickets": {
"actions": {
"enter": ""
},
"fields": { "fields": {
"employee": "" "actualhrs": "",
"ciecacode": "",
"cost_center": "",
"date": "",
"employee": "",
"productivehrs": "",
"ro_number": ""
}, },
"labels": { "labels": {
"edit": "", "edit": "",

14
client/src/translations/fr/common.json
View File

@@ -548,7 +548,10 @@
"creating_new_job": "Création d'un nouvel emploi ...", "creating_new_job": "Création d'un nouvel emploi ...",
"documents": "Les documents", "documents": "Les documents",
"existing_jobs": "Emplois existants", "existing_jobs": "Emplois existants",
"hrs_claimed": "",
"hrs_total": "",
"job": "", "job": "",
"laborallocations": "",
"lines": "Estimer les lignes", "lines": "Estimer les lignes",
"notes": "Remarques", "notes": "Remarques",
"override_header": "Remplacer l'en-tête d'estimation à l'importation?", "override_header": "Remplacer l'en-tête d'estimation à l'importation?",
@@ -713,8 +716,17 @@
} }
}, },
"timetickets": { "timetickets": {
"actions": {
"enter": ""
},
"fields": { "fields": {
"employee": "" "actualhrs": "",
"ciecacode": "",
"cost_center": "",
"date": "",
"employee": "",
"productivehrs": "",
"ro_number": ""
}, },
"labels": { "labels": {
"edit": "", "edit": "",