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

IO-1914 Add manual inventory and edit.

Browse Source
This commit is contained in:
Patrick Fic
2022-06-08 17:45:58 -07:00
parent 82db7a1f14
commit 4844c42425
24 changed files with 738 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
client/src/components/inventory-line-delete/inventory-line-delete.component.jsx Normal file
View File

@@ -0,0 +1,67 @@
import { DeleteFilled } from "@ant-design/icons";
import { useMutation } from "@apollo/client";
import { Button, notification, Popconfirm } from "antd";
import React, { useState } from "react";
import { useTranslation } from "react-i18next";
import { DELETE_INVENTORY_LINE } from "../../graphql/inventory.queries";
import RbacWrapper from "../rbac-wrapper/rbac-wrapper.component";
export default function InventoryLineDelete({
inventoryline,
disabled,
refetch,
}) {
const [loading, setLoading] = useState(false);
const { t } = useTranslation();
const [deleteInventoryLine] = useMutation(DELETE_INVENTORY_LINE);
const handleDelete = async () => {
setLoading(true);
const result = await deleteInventoryLine({
variables: { lineId: inventoryline.id },
// update(cache, { errors }) {
// cache.modify({
// fields: {
// inventory(existingInventory, { readField }) {
// console.log(existingInventory);
// return existingInventory.filter(
// (invRef) => inventoryline.id !== readField("id", invRef)
// );
// },
// },
// });
// },
});
if (!!!result.errors) {
notification["success"]({ message: t("inventory.successes.deleted") });
} else {
//Check if it's an fkey violation.
notification["error"]({
message: t("bills.errors.deleting", {
error: JSON.stringify(result.errors),
}),
});
}
if (refetch) refetch();
setLoading(false);
};
return (
<RbacWrapper action="inventory:delete" noauth={<></>}>
<Popconfirm
disabled={disabled || inventoryline.consumedbybillid}
onConfirm={handleDelete}
title={t("inventory.labels.deleteconfirm")}
>
<Button
disabled={disabled || inventoryline.consumedbybillid}
loading={loading}
>
<DeleteFilled />
</Button>
</Popconfirm>
</RbacWrapper>
);
}

79
client/src/components/inventory-list/inventory-list.component.jsx
View File

@@ -1,4 +1,4 @@
import { SyncOutlined } from "@ant-design/icons";
import { EditFilled, SyncOutlined, FileAddFilled } from "@ant-design/icons";
import { Button, Card, Input, Space, Table, Typography } from "antd";
import queryString from "query-string";
import React from "react";
@@ -6,18 +6,28 @@ import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { Link, useHistory, useLocation } from "react-router-dom";
import { createStructuredSelector } from "reselect";
import { setModalContext } from "../../redux/modals/modals.actions";
import { selectBodyshop } from "../../redux/user/user.selectors";
import CurrencyFormatter from "../../utils/CurrencyFormatter";
import InventoryBillRo from "../inventory-bill-ro/inventory-bill-ro.component";
import InventoryLineDelete from "../inventory-line-delete/inventory-line-delete.component";
const mapStateToProps = createStructuredSelector({
//currentUser: selectCurrentUser
bodyshop: selectBodyshop,
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
setInventoryUpsertContext: (context) =>
dispatch(setModalContext({ context: context, modal: "inventoryUpsert" })),
});
export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
export function JobsList({
bodyshop,
refetch,
loading,
jobs,
total,
setInventoryUpsertContext,
}) {
const search = queryString.parse(useLocation().search);
const { page, sortcolumn, sortorder } = search;
const history = useHistory();
@@ -31,6 +41,15 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
sorter: true, //(a, b) => alphaSort(a.line_desc, b.line_desc),
sortOrder: sortcolumn === "line_desc" && sortorder,
render: (text, record) =>
record.billline?.bill?.job ? (
<div>
<div>{text}</div>
<strong>{`(${record.billline?.bill?.job?.v_model_yr} ${record.billline?.bill?.job?.v_make_desc} ${record.billline?.bill?.job?.v_model_desc})`}</strong>
</div>
) : (
text
),
},
{
title: t("inventory.labels.frombillinvoicenumber"),
@@ -40,7 +59,12 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
//sorter: true, // (a, b) => alphaSort(a.ownr_ln, b.ownr_ln),
//sortOrder: sortcolumn === "ownr_ln" && sortorder,
render: (text, record) => record.billline?.bill?.invoice_number,
render: (text, record) =>
(
(record.billline?.bill?.invoice_number || "") +
" " +
(record.manualinvoicenumber || "")
).trim(),
},
{
title: t("inventory.labels.fromvendor"),
@@ -50,7 +74,12 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
//sorter: true, // (a, b) => alphaSort(a.ownr_ln, b.ownr_ln),
//sortOrder: sortcolumn === "ownr_ln" && sortorder,
render: (text, record) => record.billline?.bill?.vendor?.name,
render: (text, record) =>
(
(record.billline?.bill?.vendor?.name || "") +
" " +
(record.manualvendor || "")
).trim(),
},
{
title: t("billlines.fields.actual_price"),
@@ -70,6 +99,11 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
<CurrencyFormatter>{record.actual_cost}</CurrencyFormatter>
),
},
{
title: t("inventory.fields.comment"),
dataIndex: "comment",
key: "comment",
},
{
title: t("inventory.labels.consumedbyjob"),
dataIndex: "consumedbyjob",
@@ -85,6 +119,30 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
<InventoryBillRo inventoryline={record} />
),
},
{
title: t("general.labels.actions"),
dataIndex: "actions",
key: "actions",
ellipsis: true,
render: (text, record) => (
<Space wrap>
<Button
onClick={() => {
setInventoryUpsertContext({
actions: { refetch: refetch },
context: {
existingInventory: record,
},
});
}}
>
<EditFilled />
</Button>
<InventoryLineDelete inventoryline={record} refetch={refetch} />
</Space>
),
},
];
const handleTableChange = (pagination, filters, sorter) => {
@@ -113,7 +171,16 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
</Button>
</>
)}
<Button
onClick={() => {
setInventoryUpsertContext({
actions: { refetch: refetch },
context: {},
});
}}
>
<FileAddFilled />
</Button>
<Button
onClick={() => {
if (search.showall) delete search.showall;

17
client/src/components/inventory-list/inventory-list.container.jsx
View File

@@ -11,7 +11,6 @@ import {
} from "../../redux/application/application.actions";
import AlertComponent from "../alert/alert.component";
import InventoryListPaginated from "./inventory-list.component";
import RbacWrapper from "../rbac-wrapper/rbac-wrapper.component";
const mapStateToProps = createStructuredSelector({
//bodyshop: selectBodyshop,
@@ -52,15 +51,13 @@ export function InventoryList({ setBreadcrumbs, setSelectedHeader }) {
if (error) return <AlertComponent message={error.message} type="error" />;
return (
<RbacWrapper action="jobs:list-all">
<InventoryListPaginated
refetch={refetch}
loading={loading}
searchParams={searchParams}
total={data ? data.search_inventory_aggregate.aggregate.count : 0}
jobs={data ? data.search_inventory : []}
/>
</RbacWrapper>
<InventoryListPaginated
refetch={refetch}
loading={loading}
searchParams={searchParams}
total={data ? data.search_inventory_aggregate.aggregate.count : 0}
jobs={data ? data.search_inventory : []}
/>
);
}

68
client/src/components/inventory-upsert-modal/inventory-upsert-modal.component.jsx Normal file
View File

@@ -0,0 +1,68 @@
import { Form, Input, Space } from "antd";
import React from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectInventoryUpsert } from "../../redux/modals/modals.selectors";
import FormItemCurrency from "../form-items-formatted/currency-form-item.component";
const mapStateToProps = createStructuredSelector({
inventoryUpsertModal: selectInventoryUpsert,
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(NoteUpsertModalComponent);
export function NoteUpsertModalComponent({ form, inventoryUpsertModal }) {
const { t } = useTranslation();
const { existingInventory } = inventoryUpsertModal.context;
return (
<Space wrap>
<Form.Item
label={t("billlines.fields.line_desc")}
rules={[{ required: true }]}
name="line_desc"
>
<Input />
</Form.Item>
<Form.Item label={t("inventory.fields.comment")} name="comment">
<Input />
</Form.Item>
{!existingInventory && (
<>
<Form.Item
label={t("inventory.fields.manualinvoicenumber")}
name="manualinvoicenumber"
>
<Input />
</Form.Item>
<Form.Item
label={t("inventory.fields.manualvendor")}
name="manualvendor"
>
<Input />
</Form.Item>
<Form.Item
rules={[{ required: true }]}
label={t("billlines.fields.actual_cost")}
name="actual_cost"
>
<FormItemCurrency />
</Form.Item>
<Form.Item
rules={[{ required: true }]}
label={t("billlines.fields.actual_price")}
name="actual_price"
>
<FormItemCurrency />
</Form.Item>
</>
)}
</Space>
);
}

126
client/src/components/inventory-upsert-modal/inventory-upsert-modal.container.jsx Normal file
View File

@@ -0,0 +1,126 @@
import { useMutation } from "@apollo/client";
import { Form, Modal, notification } from "antd";
import React, { useEffect } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { logImEXEvent } from "../../firebase/firebase.utils";
import {
INSERT_INVENTORY_LINE,
UPDATE_INVENTORY_LINE,
} from "../../graphql/inventory.queries";
import { toggleModalVisible } from "../../redux/modals/modals.actions";
import { selectInventoryUpsert } from "../../redux/modals/modals.selectors";
import {
selectBodyshop,
selectCurrentUser,
} from "../../redux/user/user.selectors";
import InventoryUpsertModal from "./inventory-upsert-modal.component";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
currentUser: selectCurrentUser,
inventoryUpsertModal: selectInventoryUpsert,
});
const mapDispatchToProps = (dispatch) => ({
toggleModalVisible: () => dispatch(toggleModalVisible("inventoryUpsert")),
});
export function InventoryUpsertModalContainer({
currentUser,
bodyshop,
inventoryUpsertModal,
toggleModalVisible,
}) {
const { t } = useTranslation();
const [insertInventory] = useMutation(INSERT_INVENTORY_LINE);
const [updateInventoryLine] = useMutation(UPDATE_INVENTORY_LINE);
const { visible, context, actions } = inventoryUpsertModal;
const { existingInventory } = context;
const { refetch } = actions;
const [form] = Form.useForm();
useEffect(() => {
//Required to prevent infinite looping.
if (existingInventory && visible) {
form.setFieldsValue(existingInventory);
} else if (!existingInventory && visible) {
form.resetFields();
}
}, [existingInventory, form, visible]);
const handleFinish = async (formValues) => {
const values = formValues;
if (existingInventory) {
logImEXEvent("inventory_update");
updateInventoryLine({
variables: {
inventoryId: existingInventory.id,
inventoryItem: values,
},
}).then((r) => {
notification["success"]({
message: t("inventory.successes.updated"),
});
});
// if (refetch) refetch();
toggleModalVisible();
} else {
logImEXEvent("inventory_insert");
await insertInventory({
variables: {
inventoryItem: { shopid: bodyshop.id, ...values },
},
update(cache, { data }) {
cache.modify({
fields: {
inventory(existingInv) {
return [...existingInv, data.insert_inventory_one];
},
},
});
},
});
if (refetch) refetch();
form.resetFields();
toggleModalVisible();
notification["success"]({
message: t("inventory.successes.inserted"),
});
}
};
return (
<Modal
title={
existingInventory
? t("inventory.actions.edit")
: t("inventory.actions.new")
}
visible={visible}
okText={t("general.actions.save")}
onOk={() => {
form.submit();
}}
onCancel={() => {
toggleModalVisible();
}}
destroyOnClose
>
<Form form={form} onFinish={handleFinish} layout="vertical">
<InventoryUpsertModal form={form} />
</Form>
</Modal>
);
}
export default connect(
mapStateToProps,
mapDispatchToProps
)(InventoryUpsertModalContainer);

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

@@ -68,5 +68,6 @@ const ret = {
"users:editaccess": 4,
"inventory:list": 1,
"inventory:delete": 2,
};
export default ret;

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

@@ -3,9 +3,28 @@ import React from "react";
import { useTranslation } from "react-i18next";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import RbacWrapper from "../rbac-wrapper/rbac-wrapper.component";
export default function ShopInfoRbacComponent({ form }) {
const { t } = useTranslation();
import { useTreatments } from "@splitsoftware/splitio-react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(ShopInfoRbacComponent);
export function ShopInfoRbacComponent({ form, bodyshop }) {
const { t } = useTranslation();
const { Simple_Inventory } = useTreatments(
["Simple_Inventory"],
{},
bodyshop && bodyshop.imexshopid
);
return (
<RbacWrapper action="shop:rbac">
<LayoutFormRow>
@@ -633,18 +652,34 @@ export default function ShopInfoRbacComponent({ form }) {
>
<InputNumber />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.rbac.inventory.list")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_rbac", "inventory:list"]}
>
<InputNumber />
</Form.Item>
{Simple_Inventory.treatment === "on" && (
<>
<Form.Item
label={t("bodyshop.fields.rbac.inventory.list")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_rbac", "inventory:list"]}
>
<InputNumber />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.rbac.inventory.delete")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_rbac", "inventory:delete"]}
>
<InputNumber />
</Form.Item>
</>
)}
</LayoutFormRow>
</RbacWrapper>
);