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

Added production level statuses for shop page and updated production board to filter accordingly BOD-4

Browse Source
This commit is contained in:
Patrick Fic
2020-06-24 14:21:17 -07:00
parent dab34aef49
commit db08be58ac
12 changed files with 154 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
bodyshop_translations.babel
View File

@@ -2337,6 +2337,27 @@
</translation> </translation>
</translations> </translations>
</concept_node> </concept_node>
<concept_node>
<name>production_statuses</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>
<concept_node> <concept_node>

12
client/src/components/production-board-kanban/production-board-kanban.component.jsx
View File

@@ -25,9 +25,16 @@ export function ProductionBoardKanbanComponent({ data, bodyshop }) {
const { t } = useTranslation(); const { t } = useTranslation();
useEffect(() => { useEffect(() => {
setBoardLanes(createBoardData(bodyshop.md_ro_statuses.open_statuses, data)); setBoardLanes(
createBoardData(bodyshop.md_ro_statuses.production_statuses, data)
);
setIsMoving(false); setIsMoving(false);
}, [data, setBoardLanes, setIsMoving, bodyshop.md_ro_statuses.open_statuses]); }, [
data,
setBoardLanes,
setIsMoving,
bodyshop.md_ro_statuses.production_statuses,
]);
const findById = (id) => { const findById = (id) => {
return id; return id;
@@ -108,7 +115,6 @@ export function ProductionBoardKanbanComponent({ data, bodyshop }) {
return ( return (
<div> <div>
<IndefiniteLoading loading={isMoving} /> <IndefiniteLoading loading={isMoving} />
<div>{isMoving}</div>
<Board <Board
children={boardLanes} children={boardLanes}
disableCardDrag={isMoving} disableCardDrag={isMoving}

16
client/src/components/production-board-kanban/production-board-kanban.container.jsx
View File

@@ -1,10 +1,21 @@
import { useSubscription } from "@apollo/react-hooks"; import { useSubscription } from "@apollo/react-hooks";
import React from "react"; import React from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { SUBSCRIPTION_JOBS_IN_PRODUCTION } from "../../graphql/jobs.queries"; import { SUBSCRIPTION_JOBS_IN_PRODUCTION } from "../../graphql/jobs.queries";
import { selectBodyshop } from "../../redux/user/user.selectors";
import ProductionBoardKanbanComponent from "./production-board-kanban.component"; import ProductionBoardKanbanComponent from "./production-board-kanban.component";
export default function ProductionBoardKanbanContainer({ columnState }) { const mapStateToProps = createStructuredSelector({
const { loading, data } = useSubscription(SUBSCRIPTION_JOBS_IN_PRODUCTION); bodyshop: selectBodyshop,
});
export function ProductionBoardKanbanContainer({ bodyshop }) {
const { loading, data } = useSubscription(SUBSCRIPTION_JOBS_IN_PRODUCTION, {
variables: {
statusList: bodyshop.md_ro_statuses.production_statuses || [],
},
});
return ( return (
<ProductionBoardKanbanComponent <ProductionBoardKanbanComponent
@@ -13,3 +24,4 @@ export default function ProductionBoardKanbanContainer({ columnState }) {
/> />
); );
} }
export default connect(mapStateToProps, null)(ProductionBoardKanbanContainer);

10
client/src/components/production-board-kanban/production-board-kanban.utils.js
View File

@@ -25,6 +25,16 @@ const sortByParentId = (arr) => {
if (byParentsIdsList["null"]) if (byParentsIdsList["null"])
byParentsIdsList["null"].map((i) => sortedList.push(i)); byParentsIdsList["null"].map((i) => sortedList.push(i));
//Validate that the 2 arrays are of the same length and no children are missing.
if (arr.length !== sortedList.length) {
arr.map((origItem) => {
if (!!!sortedList.find((s) => s.id === origItem.id)) {
sortedList.push(origItem);
console.log("DATA CONSISTENCY ERROR: ", origItem.ro_number);
}
});
}
return sortedList; return sortedList;
}; };

31
client/src/components/production-list-table/production-list-table.container.jsx
View File

@@ -1,10 +1,35 @@
import { useSubscription } from "@apollo/react-hooks"; import { useSubscription } from "@apollo/react-hooks";
import React from "react"; import React, { useState } from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { SUBSCRIPTION_JOBS_IN_PRODUCTION } from "../../graphql/jobs.queries"; import { SUBSCRIPTION_JOBS_IN_PRODUCTION } from "../../graphql/jobs.queries";
import { selectBodyshop } from "../../redux/user/user.selectors";
import ProductionListColumns from "../production-list-columns/production-list-columns.data";
import ProductionListTable from "./production-list-table.component"; import ProductionListTable from "./production-list-table.component";
export default function ProductionListTableContainer({ columnState }) { const mapStateToProps = createStructuredSelector({
const { loading, data } = useSubscription(SUBSCRIPTION_JOBS_IN_PRODUCTION); bodyshop: selectBodyshop,
});
export default connect(mapStateToProps, null)(ProductionListTableContainer);
export function ProductionListTableContainer({ bodyshop }) {
const { loading, data } = useSubscription(SUBSCRIPTION_JOBS_IN_PRODUCTION, {
variables: {
statusList: bodyshop.md_ro_statuses.production_statuses || [],
},
});
const columnState = useState(
(bodyshop.production_config &&
bodyshop.production_config.columnKeys.map((k) => {
return {
...ProductionListColumns.find((e) => e.key === k.key),
width: k.width,
};
})) ||
[]
);
return ( return (
<ProductionListTable <ProductionListTable

92
client/src/components/shop-info/shop-info.rostatus.component.jsx
View File

@@ -33,7 +33,8 @@ export default function ShopInfoROStatusComponent({ form }) {
{fields.map((field, index) => ( {fields.map((field, index) => (
<Form.Item <Form.Item
key={field.key} key={field.key}
style={{ padding: 0, margin: 2 }}> style={{ padding: 0, margin: 2 }}
>
<div style={{ display: "flex" }}> <div style={{ display: "flex" }}>
<Form.Item <Form.Item
style={{ padding: 0, margin: 2 }} style={{ padding: 0, margin: 2 }}
@@ -43,9 +44,10 @@ export default function ShopInfoROStatusComponent({ form }) {
rules={[ rules={[
{ {
required: true, required: true,
message: t("general.validation.required") message: t("general.validation.required"),
} },
]}> ]}
>
<Input onBlur={handleBlur} /> <Input onBlur={handleBlur} />
</Form.Item> </Form.Item>
<DeleteFilled <DeleteFilled
@@ -58,11 +60,12 @@ export default function ShopInfoROStatusComponent({ form }) {
))} ))}
<Form.Item> <Form.Item>
<Button <Button
type='dashed' type="dashed"
onClick={() => { onClick={() => {
add(); add();
}} }}
style={{ width: "100%" }}> style={{ width: "100%" }}
>
{t("bodyshop.actions.newstatus")} {t("bodyshop.actions.newstatus")}
</Button> </Button>
</Form.Item> </Form.Item>
@@ -80,10 +83,30 @@ export default function ShopInfoROStatusComponent({ form }) {
{ {
required: true, required: true,
message: t("general.validation.required"), message: t("general.validation.required"),
type: "array" type: "array",
} },
]}> ]}
<Select mode='multiple'> >
<Select mode="multiple">
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
name={["md_ro_statuses", "production_statuses"]}
label={t("bodyshop.fields.statuses.production_statuses")}
rules={[
{
required: true,
message: t("general.validation.required"),
type: "array",
},
]}
>
<Select mode="multiple">
{options.map((item, idx) => ( {options.map((item, idx) => (
<Select.Option key={idx} value={item}> <Select.Option key={idx} value={item}>
{item} {item}
@@ -96,10 +119,11 @@ export default function ShopInfoROStatusComponent({ form }) {
rules={[ rules={[
{ {
required: true, required: true,
message: t("general.validation.required") message: t("general.validation.required"),
} },
]} ]}
name={["md_ro_statuses", "default_scheduled"]}> name={["md_ro_statuses", "default_scheduled"]}
>
<Select> <Select>
{options.map((item, idx) => ( {options.map((item, idx) => (
<Select.Option key={idx}>{item}</Select.Option> <Select.Option key={idx}>{item}</Select.Option>
@@ -111,10 +135,11 @@ export default function ShopInfoROStatusComponent({ form }) {
rules={[ rules={[
{ {
required: true, required: true,
message: t("general.validation.required") message: t("general.validation.required"),
} },
]} ]}
name={["md_ro_statuses", "default_arrived"]}> name={["md_ro_statuses", "default_arrived"]}
>
<Select> <Select>
{options.map((item, idx) => ( {options.map((item, idx) => (
<Select.Option key={idx}>{item}</Select.Option> <Select.Option key={idx}>{item}</Select.Option>
@@ -126,10 +151,11 @@ export default function ShopInfoROStatusComponent({ form }) {
rules={[ rules={[
{ {
required: true, required: true,
message: t("general.validation.required") message: t("general.validation.required"),
} },
]} ]}
name={["md_ro_statuses", "default_exported"]}> name={["md_ro_statuses", "default_exported"]}
>
<Select> <Select>
{options.map((item, idx) => ( {options.map((item, idx) => (
<Select.Option key={idx}>{item}</Select.Option> <Select.Option key={idx}>{item}</Select.Option>
@@ -141,10 +167,11 @@ export default function ShopInfoROStatusComponent({ form }) {
rules={[ rules={[
{ {
required: true, required: true,
message: t("general.validation.required") message: t("general.validation.required"),
} },
]} ]}
name={["md_ro_statuses", "default_imported"]}> name={["md_ro_statuses", "default_imported"]}
>
<Select> <Select>
{options.map((item, idx) => ( {options.map((item, idx) => (
<Select.Option key={idx}>{item}</Select.Option> <Select.Option key={idx}>{item}</Select.Option>
@@ -156,10 +183,11 @@ export default function ShopInfoROStatusComponent({ form }) {
rules={[ rules={[
{ {
required: true, required: true,
message: t("general.validation.required") message: t("general.validation.required"),
} },
]} ]}
name={["md_ro_statuses", "default_invoiced"]}> name={["md_ro_statuses", "default_invoiced"]}
>
<Select> <Select>
{options.map((item, idx) => ( {options.map((item, idx) => (
<Select.Option key={idx}>{item}</Select.Option> <Select.Option key={idx}>{item}</Select.Option>
@@ -171,10 +199,11 @@ export default function ShopInfoROStatusComponent({ form }) {
rules={[ rules={[
{ {
required: true, required: true,
message: t("general.validation.required") message: t("general.validation.required"),
} },
]} ]}
name={["md_ro_statuses", "default_completed"]}> name={["md_ro_statuses", "default_completed"]}
>
<Select> <Select>
{options.map((item, idx) => ( {options.map((item, idx) => (
<Select.Option key={idx}>{item}</Select.Option> <Select.Option key={idx}>{item}</Select.Option>
@@ -186,10 +215,11 @@ export default function ShopInfoROStatusComponent({ form }) {
rules={[ rules={[
{ {
required: true, required: true,
message: t("general.validation.required") message: t("general.validation.required"),
} },
]} ]}
name={["md_ro_statuses", "default_delivered"]}> name={["md_ro_statuses", "default_delivered"]}
>
<Select> <Select>
{options.map((item, idx) => ( {options.map((item, idx) => (
<Select.Option key={idx}>{item}</Select.Option> <Select.Option key={idx}>{item}</Select.Option>

4
client/src/graphql/jobs.queries.js
View File

@@ -80,8 +80,8 @@ export const QUERY_JOBS_IN_PRODUCTION = gql`
`; `;
export const SUBSCRIPTION_JOBS_IN_PRODUCTION = gql` export const SUBSCRIPTION_JOBS_IN_PRODUCTION = gql`
subscription SUBSCRIPTION_JOBS_IN_PRODUCTION { subscription SUBSCRIPTION_JOBS_IN_PRODUCTION($statusList: [String!]!) {
productionview { productionview(where: { status: { _in: $statusList } }) {
id id
status status
ro_number ro_number

2
client/src/pages/production-list/production-list.component.jsx
View File

@@ -2,5 +2,5 @@ import React from "react";
import ProductionListTable from "../../components/production-list-table/production-list-table.container"; import ProductionListTable from "../../components/production-list-table/production-list-table.container";
export default function ProductionListComponent({ columnState }) { export default function ProductionListComponent({ columnState }) {
return <ProductionListTable columnState={columnState} />; return <ProductionListTable />;
} }

15
client/src/pages/production-list/production-list.container.jsx
View File

@@ -1,11 +1,10 @@
import React, { useEffect, useState } from "react"; import React, { useEffect } 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 { setBreadcrumbs } from "../../redux/application/application.actions"; import { setBreadcrumbs } from "../../redux/application/application.actions";
import { selectBodyshop } from "../../redux/user/user.selectors"; import { selectBodyshop } from "../../redux/user/user.selectors";
import ProductionListComponent from "./production-list.component"; import ProductionListComponent from "./production-list.component";
import ProductionListColumns from "../../components/production-list-columns/production-list-columns.data";
const mapStateToProps = createStructuredSelector({ const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop, bodyshop: selectBodyshop,
@@ -17,16 +16,6 @@ const mapDispatchToProps = (dispatch) => ({
export function ProductionListContainer({ setBreadcrumbs, bodyshop }) { export function ProductionListContainer({ setBreadcrumbs, bodyshop }) {
const { t } = useTranslation(); const { t } = useTranslation();
const columnState = useState(
(bodyshop.production_config &&
bodyshop.production_config.columnKeys.map((k) => {
return {
...ProductionListColumns.find((e) => e.key === k.key),
width: k.width,
};
})) ||
[]
);
useEffect(() => { useEffect(() => {
document.title = t("titles.productionlist"); document.title = t("titles.productionlist");
@@ -37,7 +26,7 @@ export function ProductionListContainer({ setBreadcrumbs, bodyshop }) {
return ( return (
<div> <div>
<ProductionListComponent columnState={columnState} /> <ProductionListComponent />
</div> </div>
); );
} }

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

@@ -149,7 +149,8 @@
"default_received": "Default Received Status", "default_received": "Default Received Status",
"default_returned": "Default Returned", "default_returned": "Default Returned",
"default_scheduled": "Default Scheduled Status", "default_scheduled": "Default Scheduled Status",
"open_statuses": "Open Statuses" "open_statuses": "Open Statuses",
"production_statuses": "Production Statuses"
}, },
"zip_post": "Zip/Postal Code" "zip_post": "Zip/Postal Code"
}, },

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

@@ -149,7 +149,8 @@
"default_received": "", "default_received": "",
"default_returned": "", "default_returned": "",
"default_scheduled": "", "default_scheduled": "",
"open_statuses": "" "open_statuses": "",
"production_statuses": ""
}, },
"zip_post": "" "zip_post": ""
}, },

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

@@ -149,7 +149,8 @@
"default_received": "", "default_received": "",
"default_returned": "", "default_returned": "",
"default_scheduled": "", "default_scheduled": "",
"open_statuses": "" "open_statuses": "",
"production_statuses": ""
}, },
"zip_post": "" "zip_post": ""
}, },