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

BOD-6 #comment Additional build + layout for shop info screen.

Browse Source
This commit is contained in:
Patrick Fic
2020-03-11 14:21:40 -07:00
parent 90d5045b10
commit c680eb65b1
8 changed files with 181 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
bodyshop_translations.babel
View File

@@ -786,6 +786,27 @@
</translation> </translation>
</translations> </translations>
</concept_node> </concept_node>
<concept_node>
<name>saving</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>
@@ -1840,6 +1861,53 @@
</concept_node> </concept_node>
</children> </children>
</folder_node> </folder_node>
<concept_node>
<name>shopinfo</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>
<name>successes</name>
<children>
<concept_node>
<name>save</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>
</children> </children>

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

@@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import { Form, Input, Button } from "antd"; import { Form, Input, Button, Collapse } from "antd";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import ShopInfoROStatusComponent from "./shop-info.rostatus.component"; import ShopInfoROStatusComponent from "./shop-info.rostatus.component";
import ShopInfoOrderStatusComponent from "./shop-info.orderstatus.component"; import ShopInfoOrderStatusComponent from "./shop-info.orderstatus.component";
@@ -12,56 +12,77 @@ export default function ShopInfoComponent({ form }) {
<Button type="primary" htmlType="submit"> <Button type="primary" htmlType="submit">
{t("general.actions.save")} {t("general.actions.save")}
</Button> </Button>
<Collapse defaultActiveKey="shopinfo">
<Collapse.Panel key="shopinfo" header={t("bodyshop.labels.shopinfo")}>
<Form.Item label={t("bodyshop.fields.shopname")} name="shopname">
<Input />
</Form.Item>
<Form.Item label={t("bodyshop.fields.address1")} name="address1">
<Input />
</Form.Item>
<ShopInfoROStatusComponent form={form} /> <Form.Item label={t("bodyshop.fields.address2")} name="address2">
<ShopInfoOrderStatusComponent form={form} /> <Input />
<ShopInfoResponsibilityCenterComponent form={form} /> </Form.Item>
<Form.Item label={t("bodyshop.fields.shopname")} name="shopname"> <Form.Item label={t("bodyshop.fields.city")} name="city">
<Input /> <Input />
</Form.Item> </Form.Item>
<Form.Item label={t("bodyshop.fields.address1")} name="address1"> <Form.Item label={t("bodyshop.fields.state")} name="state">
<Input /> <Input />
</Form.Item> </Form.Item>
<Form.Item label={t("bodyshop.fields.zip_post")} name="zip_post">
<Form.Item label={t("bodyshop.fields.address2")} name="address2"> <Input />
<Input /> </Form.Item>
</Form.Item> <Form.Item label={t("bodyshop.fields.country")} name="country">
<Form.Item label={t("bodyshop.fields.city")} name="city"> <Input />
<Input /> </Form.Item>
</Form.Item> <Form.Item label={t("bodyshop.fields.email")} name="email">
<Form.Item label={t("bodyshop.fields.state")} name="state"> <Input />
<Input /> </Form.Item>
</Form.Item> <Form.Item
<Form.Item label={t("bodyshop.fields.zip_post")} name="zip_post"> label={t("bodyshop.fields.federal_tax_id")}
<Input /> name="federal_tax_id"
</Form.Item> >
<Form.Item label={t("bodyshop.fields.country")} name="country"> <Input />
<Input /> </Form.Item>
</Form.Item> <Form.Item
<Form.Item label={t("bodyshop.fields.email")} name="email"> label={t("bodyshop.fields.insurance_vendor_id")}
<Input /> name="insurance_vendor_id"
</Form.Item> >
<Form.Item <Input />
label={t("bodyshop.fields.federal_tax_id")} </Form.Item>
name="federal_tax_id" <Form.Item
> label={t("bodyshop.fields.logo_img_path")}
<Input /> name="logo_img_path"
</Form.Item> >
<Form.Item <Input />
label={t("bodyshop.fields.insurance_vendor_id")} </Form.Item>
name="insurance_vendor_id" <Form.Item
> label={t("bodyshop.fields.state_tax_id")}
<Input /> name="state_tax_id"
</Form.Item> >
<Form.Item <Input />
label={t("bodyshop.fields.logo_img_path")} </Form.Item>
name="logo_img_path" </Collapse.Panel>
> <Collapse.Panel
<Input /> key="roStatus"
</Form.Item> header={t("bodyshop.labels.jobstatuses")}
<Form.Item label={t("bodyshop.fields.state_tax_id")} name="state_tax_id"> >
<Input /> <ShopInfoROStatusComponent form={form} />
</Form.Item> </Collapse.Panel>
<Collapse.Panel
key="orderStatus"
header={t("bodyshop.labels.orderstatuses")}
>
<ShopInfoOrderStatusComponent form={form} />
</Collapse.Panel>
<Collapse.Panel
key="responsibilityCenters"
header={t("bodyshop.labels.responsibilitycenters.title")}
>
<ShopInfoResponsibilityCenterComponent form={form} />
</Collapse.Panel>
</Collapse>
</div> </div>
); );
} }

21
client/src/components/shop-info/shop-info.container.jsx
View File

@@ -1,22 +1,35 @@
import React, { useEffect } from "react"; import React, { useEffect } from "react";
import ShopInfoComponent from "./shop-info.component"; import ShopInfoComponent from "./shop-info.component";
import { Form } from "antd"; import { Form, notification } from "antd";
import { useQuery, useMutation } from "react-apollo"; import { useQuery, useMutation } from "react-apollo";
import { QUERY_BODYSHOP, UPDATE_SHOP } from "../../graphql/bodyshop.queries"; import { QUERY_BODYSHOP, UPDATE_SHOP } from "../../graphql/bodyshop.queries";
import LoadingSpinner from "../loading-spinner/loading-spinner.component"; import LoadingSpinner from "../loading-spinner/loading-spinner.component";
import AlertComponent from "../alert/alert.component"; import AlertComponent from "../alert/alert.component";
import { useTranslation } from "react-i18next";
export default function ShopInfoContainer() { export default function ShopInfoContainer() {
const [form] = Form.useForm(); const [form] = Form.useForm();
const { t } = useTranslation();
const [updateBodyshop] = useMutation(UPDATE_SHOP); const [updateBodyshop] = useMutation(UPDATE_SHOP);
const { loading, error, data } = useQuery(QUERY_BODYSHOP, { const { loading, error, data, refetch } = useQuery(QUERY_BODYSHOP, {
fetchPolicy: "network-only" fetchPolicy: "network-only"
}); });
const handleFinish = values => { const handleFinish = values => {
console.log("values", values); console.log("values", values);
updateBodyshop({ variables: { id: data.bodyshops[0].id, shop: values } }); updateBodyshop({
variables: { id: data.bodyshops[0].id, shop: values }
})
.then(r => {
notification["success"]({ message: t("bodyshop.successes.save") });
refetch().then(_ => form.resetFields());
})
.catch(error => {
notification["error"](
{ message: t("bodyshop.errors.saving") },
{ message: error }
);
});
}; };
useEffect(() => { useEffect(() => {

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

@@ -15,15 +15,15 @@ export default function ShopInfoResponsibilityCenterComponent({ form }) {
const [options, setOptions] = useState( const [options, setOptions] = useState(
[ [
...form.getFieldValue(["md_responsibility_centers", "costs"]), ...(form.getFieldValue(["md_responsibility_centers", "costs"]) || []),
...form.getFieldValue(["md_responsibility_centers", "profits"]) ...(form.getFieldValue(["md_responsibility_centers", "profits"]) || [])
] || [] ] || []
); );
const handleBlur = () => { const handleBlur = () => {
setOptions([ setOptions([
...form.getFieldValue(["md_responsibility_centers", "costs"]), ...(form.getFieldValue(["md_responsibility_centers", "costs"]) || []),
...form.getFieldValue(["md_responsibility_centers", "profits"]) ...(form.getFieldValue(["md_responsibility_centers", "profits"]) || [])
]); ]);
}; };

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

@@ -23,7 +23,6 @@ export default function ShopInfoROStatusComponent({ form }) {
return ( return (
<div> <div>
<strong>{t("bodyshop.labels.jobstatuses")}</strong>
<Row> <Row>
<Col span={12}> <Col span={12}>
<Form.List name={["md_ro_statuses", "statuses"]}> <Form.List name={["md_ro_statuses", "statuses"]}>

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

@@ -69,7 +69,8 @@
"newstatus": "Add Status" "newstatus": "Add Status"
}, },
"errors": { "errors": {
"loading": "Unable to load shop details. Please call technical support." "loading": "Unable to load shop details. Please call technical support.",
"saving": "Error encountered while saving. {{message}}"
}, },
"fields": { "fields": {
"address1": "Address 1", "address1": "Address 1",
@@ -128,7 +129,11 @@
"costs": "Cost Centers", "costs": "Cost Centers",
"profits": "Profit Centers", "profits": "Profit Centers",
"title": "Responsibility Centers" "title": "Responsibility Centers"
} },
"shopinfo": "Shop Information"
},
"successes": {
"save": "Bodyshop saved successfully. "
} }
}, },
"documents": { "documents": {

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

@@ -69,7 +69,8 @@
"newstatus": "" "newstatus": ""
}, },
"errors": { "errors": {
"loading": "No se pueden cargar los detalles de la tienda. Por favor llame al soporte técnico." "loading": "No se pueden cargar los detalles de la tienda. Por favor llame al soporte técnico.",
"saving": ""
}, },
"fields": { "fields": {
"address1": "", "address1": "",
@@ -128,7 +129,11 @@
"costs": "", "costs": "",
"profits": "", "profits": "",
"title": "" "title": ""
} },
"shopinfo": ""
},
"successes": {
"save": ""
} }
}, },
"documents": { "documents": {

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

@@ -69,7 +69,8 @@
"newstatus": "" "newstatus": ""
}, },
"errors": { "errors": {
"loading": "Impossible de charger les détails de la boutique. Veuillez appeler le support technique." "loading": "Impossible de charger les détails de la boutique. Veuillez appeler le support technique.",
"saving": ""
}, },
"fields": { "fields": {
"address1": "", "address1": "",
@@ -128,7 +129,11 @@
"costs": "", "costs": "",
"profits": "", "profits": "",
"title": "" "title": ""
} },
"shopinfo": ""
},
"successes": {
"save": ""
} }
}, },
"documents": { "documents": {