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

Admin vehicle/owner reassociation IO-157

Browse Source
This commit is contained in:
Patrick Fic
2021-01-19 09:34:43 -08:00
parent 56cb193460
commit 5a1eb37544
18 changed files with 655 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
client/src/components/jobs-admin-owner-reassociate/jobs-admin-owner-reassociate.component.jsx Normal file
View File

@@ -0,0 +1,64 @@
import { useMutation } from "@apollo/react-hooks";
import { Button, Form, notification } from "antd";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { UPDATE_JOB } from "../../graphql/jobs.queries";
import OwnerSearchSelect from "../owner-search-select/owner-search-select.component";
export default function JobAdminOwnerReassociate({ job }) {
const { t } = useTranslation();
const [loading, setLoading] = useState(false);
const [form] = Form.useForm();
const [updateJob] = useMutation(UPDATE_JOB);
const handleFinish = async (values) => {
console.log(values);
setLoading(true);
const result = await updateJob({
variables: { jobId: job.id, job: { ownerid: values.ownerid } },
});
if (!!!result.errors) {
notification["success"]({ message: t("jobs.successes.save") });
} 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.
};
useEffect(() => {
//form.resetFields();
}, [form, job]);
return (
<div>
<div>{t("jobs.labels.ownerassociation")}</div>
<Form
onFinish={handleFinish}
autoComplete={"off"}
form={form}
initialValues={{ ownerid: job.ownerid }}
>
<Form.Item
name="ownerid"
label={t("jobs.fields.owner")}
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}
>
<OwnerSearchSelect />
</Form.Item>
</Form>
<div>{t("jobs.labels.associationwarning")}</div>
<Button loading={loading} onClick={() => form.submit()}>
{t("general.actions.save")}
</Button>
</div>
);
}

64
client/src/components/jobs-admin-vehicle-reassociate/jobs-admin-vehicle-reassociate.component.jsx Normal file
View File

@@ -0,0 +1,64 @@
import { useMutation } from "@apollo/react-hooks";
import { Button, Form, notification } from "antd";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { UPDATE_JOB } from "../../graphql/jobs.queries";
import VehicleSearchSelect from "../vehicle-search-select/vehicle-search-select.component";
export default function JobAdminOwnerReassociate({ job }) {
const { t } = useTranslation();
const [loading, setLoading] = useState(false);
const [form] = Form.useForm();
const [updateJob] = useMutation(UPDATE_JOB);
const handleFinish = async (values) => {
console.log(values);
setLoading(true);
const result = await updateJob({
variables: { jobId: job.id, job: { vehicleid: values.vehicleid } },
});
if (!!!result.errors) {
notification["success"]({ message: t("jobs.successes.save") });
} 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.
};
useEffect(() => {
//form.resetFields();
}, [form, job]);
return (
<div>
<div>{t("jobs.labels.vehicleassociation")}</div>
<Form
onFinish={handleFinish}
autoComplete={"off"}
form={form}
initialValues={{ vehicleid: job.vehicleid }}
>
<Form.Item
name="vehicleid"
label={t("jobs.fields.vehicle")}
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}
>
<VehicleSearchSelect />
</Form.Item>
</Form>
<div>{t("jobs.labels.associationwarning")}</div>
<Button loading={loading} onClick={() => form.submit()}>
{t("general.actions.save")}
</Button>
</div>
);
}

17
client/src/components/jobs-detail-header-actions/jobs-detail-header-actions.component.jsx
View File

@@ -6,13 +6,13 @@ import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { Link, useHistory } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import { logImEXEvent } from "../../firebase/firebase.utils";
import { selectJobReadOnly } from "../../redux/application/application.selectors";
import { setModalContext } from "../../redux/modals/modals.actions";
import { selectBodyshop } from "../../redux/user/user.selectors";
import AddToProduction from "./jobs-detail-header-actions.addtoproduction.util";
import JobsDetaiLheaderCsi from "./jobs-detail-header-actions.csi.component";
import DuplicateJob from "./jobs-detail-header-actions.duplicate.util";
import { logImEXEvent } from "../../firebase/firebase.utils";
import { selectJobReadOnly } from "../../redux/application/application.selectors";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
@@ -199,6 +199,19 @@ export function JobsDetailHeaderActions({
</Link>
)}
</Menu.Item>
<Menu.Item disabled={!!job.date_invoiced || jobRO} key="admin">
{!!job.date_invoiced || jobRO ? (
t("menus.jobsactions.admin")
) : (
<Link
to={{
pathname: `/manage/jobs/${job.id}/admin`,
}}
>
{t("menus.jobsactions.admin")}
</Link>
)}
</Menu.Item>
<JobsDetaiLheaderCsi job={job} />
<Menu.Item
key="jobcosting"

2
client/src/components/labor-allocations-table/labor-allocations-table.component.jsx
View File

@@ -34,7 +34,7 @@ export function LaborAllocationsTable({
)
);
}, [joblines, timetickets, bodyshop, adjustments]);
console.log("Rerender on the allocations table.");
return (
<div>
<div className="imex-flex-row" style={{ margin: ".5rem" }}>

1
client/src/components/labor-allocations-table/labor-allocations-table.utility.js
View File

@@ -30,6 +30,5 @@ export const CalculateAllocationsTotals = (
return acc;
}, []);
console.log("r", r);
return r;
};

96
client/src/components/owner-search-select/owner-search-select.component.jsx Normal file
View File

@@ -0,0 +1,96 @@
import { LoadingOutlined } from "@ant-design/icons";
import { useLazyQuery } from "@apollo/react-hooks";
import { Empty, Select } from "antd";
import _ from "lodash";
import React, { forwardRef, useEffect, useState } from "react";
import {
SEARCH_OWNERS_BY_ID_FOR_AUTOCOMPLETE,
SEARCH_OWNERS_FOR_AUTOCOMPLETE
} from "../../graphql/owners.queries";
import AlertComponent from "../alert/alert.component";
const { Option } = Select;
const OwnerSearchSelect = ({ value, onChange, onBlur, disabled }, ref) => {
const [callSearch, { loading, error, data }] = useLazyQuery(
SEARCH_OWNERS_FOR_AUTOCOMPLETE
);
const [
callIdSearch,
{ loading: idLoading, error: idError, data: idData },
] = useLazyQuery(SEARCH_OWNERS_BY_ID_FOR_AUTOCOMPLETE);
const executeSearch = (v) => {
callSearch(v);
};
const debouncedExecuteSearch = _.debounce(executeSearch, 500);
const handleSearch = (value) => {
debouncedExecuteSearch({ variables: { search: value } });
};
const [option, setOption] = useState(value);
useEffect(() => {
if (value === option && value) {
callIdSearch({ variables: { id: value } });
}
}, [value, option, callIdSearch]);
// useEffect(() => {
// if (value !== option && onChange) {
// onChange(option);
// }
// }, [value, option, onChange]);
const handleSelect = (value) => {
setOption(value);
if (value !== option && onChange) {
onChange(value);
}
};
const theOptions = [
...(idData && idData.owners_by_pk ? [idData.owners_by_pk] : []),
...(data && data.search_owners ? data.search_owners : []),
];
return (
<div>
<Select
ref={ref}
disabled={disabled}
showSearch
autoFocus
value={option}
style={{
width: "100%",
}}
filterOption={false}
onSearch={handleSearch}
// onChange={setOption}
onChange={handleSelect}
onSelect={handleSelect}
notFoundContent={loading ? <LoadingOutlined /> : <Empty />}
onBlur={onBlur}
>
{theOptions
? theOptions.map((o) => (
<Option key={o.id} value={o.id}>
{`${o.ownr_ln || ""} ${o.ownr_fn || ""} ${
o.ownr_co_nm ? ` ${o.ownr_co_num}` : ""
}| ${o.ownr_addr1 || ""} `}
</Option>
))
: null}
</Select>
{idLoading || loading ? <LoadingOutlined /> : null}
{error ? <AlertComponent message={error.message} type="error" /> : null}
{idError ? (
<AlertComponent message={idError.message} type="error" />
) : null}
</div>
);
};
export default forwardRef(OwnerSearchSelect);

1
client/src/components/rbac-wrapper/rbac-defaults.js
View File

@@ -14,6 +14,7 @@ const ret = {
"courtesycar:detail": 2,
"courtesycar:list": 2,
"jobs:admin": 5,
"jobs:list-active": 1,
"jobs:list-all": 2,
"jobs:available-list": 2,

12
client/src/components/shop-info/shop-info.rbac.component.jsx
View File

@@ -152,6 +152,18 @@ export default function ShopInfoRbacComponent({ form }) {
>
<InputNumber />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.rbac.jobs.admin")}
rules={[
{
required: true,
message: t("general.validation.required"),
},
]}
name={["md_rbac", "jobs:admin"]}
>
<InputNumber />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.rbac.jobs.partsqueue")}
rules={[

96
client/src/components/vehicle-search-select/vehicle-search-select.component.jsx Normal file
View File

@@ -0,0 +1,96 @@
import { LoadingOutlined } from "@ant-design/icons";
import { useLazyQuery } from "@apollo/react-hooks";
import { Empty, Select } from "antd";
import _ from "lodash";
import React, { forwardRef, useEffect, useState } from "react";
import {
SEARCH_VEHICLES_BY_ID_FOR_AUTOCOMPLETE,
SEARCH_VEHICLES_FOR_AUTOCOMPLETE
} from "../../graphql/vehicles.queries";
import AlertComponent from "../alert/alert.component";
const { Option } = Select;
const VehicleSearchSelect = ({ value, onChange, onBlur, disabled }, ref) => {
const [callSearch, { loading, error, data }] = useLazyQuery(
SEARCH_VEHICLES_FOR_AUTOCOMPLETE
);
const [
callIdSearch,
{ loading: idLoading, error: idError, data: idData },
] = useLazyQuery(SEARCH_VEHICLES_BY_ID_FOR_AUTOCOMPLETE);
const executeSearch = (v) => {
callSearch(v);
};
const debouncedExecuteSearch = _.debounce(executeSearch, 500);
const handleSearch = (value) => {
debouncedExecuteSearch({ variables: { search: value } });
};
const [option, setOption] = useState(value);
useEffect(() => {
if (value === option && value) {
callIdSearch({ variables: { id: value } });
}
}, [value, option, callIdSearch]);
// useEffect(() => {
// if (value !== option && onChange) {
// onChange(option);
// }
// }, [value, option, onChange]);
const handleSelect = (value) => {
setOption(value);
if (value !== option && onChange) {
onChange(value);
}
};
const theOptions = [
...(idData && idData.vehicles_by_pk ? [idData.vehicles_by_pk] : []),
...(data && data.search_vehicles ? data.search_vehicles : []),
];
return (
<div>
<Select
ref={ref}
disabled={disabled}
showSearch
autoFocus
value={option}
style={{
width: "100%",
}}
filterOption={false}
onSearch={handleSearch}
// onChange={setOption}
onChange={handleSelect}
onSelect={handleSelect}
notFoundContent={loading ? <LoadingOutlined /> : <Empty />}
onBlur={onBlur}
>
{theOptions
? theOptions.map((o) => (
<Option key={o.id} value={o.id}>
{`${o.v_vin || ""} ${o.v_model_yr || ""} ${
o.v_make_desc || ""
} ${o.v_model_desc || ""} `}
</Option>
))
: null}
</Select>
{idLoading || loading ? <LoadingOutlined /> : null}
{error ? <AlertComponent message={error.message} type="error" /> : null}
{idError ? (
<AlertComponent message={idError.message} type="error" />
) : null}
</div>
);
};
export default forwardRef(VehicleSearchSelect);