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

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

View File

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

View File

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

View File

@@ -1,22 +1,35 @@
import React, { useEffect } from "react";
import ShopInfoComponent from "./shop-info.component";
import { Form } from "antd";
import { Form, notification } from "antd";
import { useQuery, useMutation } from "react-apollo";
import { QUERY_BODYSHOP, UPDATE_SHOP } from "../../graphql/bodyshop.queries";
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
import AlertComponent from "../alert/alert.component";
import { useTranslation } from "react-i18next";
export default function ShopInfoContainer() {
const [form] = Form.useForm();
const { t } = useTranslation();
const [updateBodyshop] = useMutation(UPDATE_SHOP);
const { loading, error, data } = useQuery(QUERY_BODYSHOP, {
const { loading, error, data, refetch } = useQuery(QUERY_BODYSHOP, {
fetchPolicy: "network-only"
});
const handleFinish = 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(() => {

View File

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

View File

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

View File

@@ -69,7 +69,8 @@
"newstatus": "Add Status"
},
"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": {
"address1": "Address 1",
@@ -128,7 +129,11 @@
"costs": "Cost Centers",
"profits": "Profit Centers",
"title": "Responsibility Centers"
}
},
"shopinfo": "Shop Information"
},
"successes": {
"save": "Bodyshop saved successfully. "
}
},
"documents": {

View File

@@ -69,7 +69,8 @@
"newstatus": ""
},
"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": {
"address1": "",
@@ -128,7 +129,11 @@
"costs": "",
"profits": "",
"title": ""
}
},
"shopinfo": ""
},
"successes": {
"save": ""
}
},
"documents": {

View File

@@ -69,7 +69,8 @@
"newstatus": ""
},
"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": {
"address1": "",
@@ -128,7 +129,11 @@
"costs": "",
"profits": "",
"title": ""
}
},
"shopinfo": ""
},
"successes": {
"save": ""
}
},
"documents": {