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

Reformat all project files to use the prettier config file.

Browse Source
This commit is contained in:
Patrick Fic
2024-03-27 15:35:07 -07:00
parent b161530381
commit e1df64d592
873 changed files with 111387 additions and 125473 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,10 +1,10 @@
import {useSplitTreatments} from "@splitsoftware/splitio-react";
import {Button, Card, Tabs} from "antd";
import { useSplitTreatments } from "@splitsoftware/splitio-react";
import { Button, Card, Tabs } from "antd";
import React from "react";
import {useTranslation} from "react-i18next";
import {connect} from "react-redux";
import {createStructuredSelector} from "reselect";
import {selectBodyshop} from "../../redux/user/user.selectors";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import ShopInfoGeneral from "./shop-info.general.component";
import ShopInfoIntakeChecklistComponent from "./shop-info.intake.component";
import ShopInfoLaborRates from "./shop-info.laborrates.component";
@@ -15,116 +15,121 @@ import ShopInfoResponsibilityCenterComponent from "./shop-info.responsibilitycen
import ShopInfoROStatusComponent from "./shop-info.rostatus.component";
import ShopInfoSchedulingComponent from "./shop-info.scheduling.component";
import ShopInfoSpeedPrint from "./shop-info.speedprint.component";
import {useLocation, useNavigate} from "react-router-dom";
import { useLocation, useNavigate } from "react-router-dom";
import ShopInfoTaskPresets from "./shop-info.task-presets.component";
import queryString from "query-string";
import InstanceRenderManager from "../../utils/instanceRenderMgr";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
bodyshop: selectBodyshop
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
//setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoComponent);
export function ShopInfoComponent({bodyshop, form, saveLoading}) {
export function ShopInfoComponent({ bodyshop, form, saveLoading }) {
const {
treatments: { CriticalPartsScanning, Enhanced_Payroll }
} = useSplitTreatments({
attributes: {},
names: ["CriticalPartsScanning", "Enhanced_Payroll"],
splitKey: bodyshop.imexshopid
});
const {treatments: {CriticalPartsScanning, Enhanced_Payroll}} = useSplitTreatments({
attributes: {},
names: ["CriticalPartsScanning","Enhanced_Payroll"],
splitKey: bodyshop.imexshopid,
});
const { t } = useTranslation();
const history = useNavigate();
const location = useLocation();
const search = queryString.parse(location.search);
const {t} = useTranslation();
const history = useNavigate();
const location = useLocation();
const search = queryString.parse(location.search);
const tabItems = [
const tabItems = [
{
key: "general",
label: t("bodyshop.labels.shopinfo"),
children: <ShopInfoGeneral form={form} />
},
{
key: "speedprint",
label: t("bodyshop.labels.speedprint"),
children: <ShopInfoSpeedPrint form={form} />
},
{
key: "rbac",
label: t("bodyshop.labels.rbac"),
children: <ShopInfoRbacComponent form={form} />
},
{
key: "roStatus",
label: t("bodyshop.labels.jobstatuses"),
children: <ShopInfoROStatusComponent form={form} />
},
{
key: "scheduling",
label: t("bodyshop.labels.scheduling"),
children: <ShopInfoSchedulingComponent form={form} />
},
{
key: "orderStatus",
label: t("bodyshop.labels.orderstatuses"),
children: <ShopInfoOrderStatusComponent form={form} />
},
{
key: "responsibilityCenters",
label: t("bodyshop.labels.responsibilitycenters.title"),
children: <ShopInfoResponsibilityCenterComponent form={form} />
},
...InstanceRenderManager({
imex: [
{
key: "general",
label: t("bodyshop.labels.shopinfo"),
children: <ShopInfoGeneral form={form}/>,
},
{
key: "speedprint",
label: t("bodyshop.labels.speedprint"),
children: <ShopInfoSpeedPrint form={form}/>,
},
{
key: "rbac",
label: t("bodyshop.labels.rbac"),
children: <ShopInfoRbacComponent form={form}/>,
},
{
key: "roStatus",
label: t("bodyshop.labels.jobstatuses"),
children: <ShopInfoROStatusComponent form={form}/>,
},
{
key: "scheduling",
label: t("bodyshop.labels.scheduling"),
children: <ShopInfoSchedulingComponent form={form}/>,
},
{
key: "orderStatus",
label: t("bodyshop.labels.orderstatuses"),
children: <ShopInfoOrderStatusComponent form={form}/>,
},
{
key: "responsibilityCenters",
label: t("bodyshop.labels.responsibilitycenters.title"),
children: <ShopInfoResponsibilityCenterComponent form={form}/>,
},
...InstanceRenderManager({imex: [ {
key: "checklists",
label: t("bodyshop.labels.checklists"),
children: <ShopInfoIntakeChecklistComponent form={form}/>,
}], rome: "USE_IMEX", promanager:[]})
,
{
key: "laborrates",
label: t("bodyshop.labels.laborrates"),
children: <ShopInfoLaborRates form={form}/>,
},
...(CriticalPartsScanning.treatment === "on"
? [
{
key: "partsscan",
label: t("bodyshop.labels.partsscan"),
children: <ShopInfoPartsScan form={form}/>,
},
]
: []),
...Enhanced_Payroll.treatment === "on" ? [
{
key: 'task-presets',
label: t("bodyshop.labels.task-presets"),
children: <ShopInfoTaskPresets form={form}/>
}]: []
];
return (
<Card
extra={
<Button
type="primary"
loading={saveLoading}
onClick={() => form.submit()}
>
{t("general.actions.save")}
</Button>
}
>
<Tabs
defaultActiveKey={search.subtab}
onChange={(key) =>
history({
search: `?tab=${search.tab}&subtab=${key}`,
})
}
items={tabItems}
/>
</Card>
);
children: <ShopInfoIntakeChecklistComponent form={form} />
}
],
rome: "USE_IMEX",
promanager: []
}),
{
key: "laborrates",
label: t("bodyshop.labels.laborrates"),
children: <ShopInfoLaborRates form={form} />
},
...(CriticalPartsScanning.treatment === "on"
? [
{
key: "partsscan",
label: t("bodyshop.labels.partsscan"),
children: <ShopInfoPartsScan form={form} />
}
]
: []),
...(Enhanced_Payroll.treatment === "on"
? [
{
key: "task-presets",
label: t("bodyshop.labels.task-presets"),
children: <ShopInfoTaskPresets form={form} />
}
]
: [])
];
return (
<Card
extra={
<Button type="primary" loading={saveLoading} onClick={() => form.submit()}>
{t("general.actions.save")}
</Button>
}
>
<Tabs
defaultActiveKey={search.subtab}
onChange={(key) =>
history({
search: `?tab=${search.tab}&subtab=${key}`
})
}
items={tabItems}
/>
</Card>
);
}

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

@@ -1,86 +1,81 @@
import {useMutation, useQuery} from "@apollo/client";
import {Form, notification} from "antd";
import { useMutation, useQuery } from "@apollo/client";
import { Form, notification } from "antd";
import dayjs from "../../utils/day";
import React, {useEffect, useState} from "react";
import {useTranslation} from "react-i18next";
import {logImEXEvent} from "../../firebase/firebase.utils";
import {QUERY_BODYSHOP, UPDATE_SHOP} from "../../graphql/bodyshop.queries";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { logImEXEvent } from "../../firebase/firebase.utils";
import { QUERY_BODYSHOP, UPDATE_SHOP } from "../../graphql/bodyshop.queries";
import AlertComponent from "../alert/alert.component";
import FormsFieldChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
import ShopInfoComponent from "./shop-info.component";
export default function ShopInfoContainer() {
const [form] = Form.useForm();
const {t} = useTranslation();
const [saveLoading, setSaveLoading] = useState(false);
const [updateBodyshop] = useMutation(UPDATE_SHOP);
const {loading, error, data, refetch} = useQuery(QUERY_BODYSHOP, {
fetchPolicy: "network-only",
nextFetchPolicy: "network-only",
});
const [form] = Form.useForm();
const { t } = useTranslation();
const [saveLoading, setSaveLoading] = useState(false);
const [updateBodyshop] = useMutation(UPDATE_SHOP);
const { loading, error, data, refetch } = useQuery(QUERY_BODYSHOP, {
fetchPolicy: "network-only",
nextFetchPolicy: "network-only"
});
const handleFinish = (values) => {
setSaveLoading(true);
logImEXEvent("shop_update");
const handleFinish = (values) => {
setSaveLoading(true);
logImEXEvent("shop_update");
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 })
});
});
setSaveLoading(false);
};
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}),
});
});
setSaveLoading(false);
};
useEffect(() => {
if (data) form.resetFields();
}, [form, data]);
useEffect(() => {
if (data) form.resetFields();
}, [form, data]);
if (error) return <AlertComponent message={error.message} type="error"/>;
if (loading) return <LoadingSpinner/>;
return (
<Form
form={form}
layout="vertical"
autoComplete="new-password"
onFinish={handleFinish}
initialValues={
data
? data.bodyshops[0].accountingconfig.ClosingPeriod
? {
...data.bodyshops[0],
accountingconfig: {
...data.bodyshops[0].accountingconfig,
ClosingPeriod: [
dayjs(data.bodyshops[0].accountingconfig.ClosingPeriod[0]),
dayjs(data.bodyshops[0].accountingconfig.ClosingPeriod[1]),
],
},
schedule_start_time: dayjs(
data.bodyshops[0].schedule_start_time
),
schedule_end_time: dayjs(data.bodyshops[0].schedule_end_time),
}
: {
...data.bodyshops[0],
schedule_start_time: dayjs(
data.bodyshops[0].schedule_start_time
),
schedule_end_time: dayjs(data.bodyshops[0].schedule_end_time),
}
: null
}
>
<FormsFieldChanged form={form}/>
<ShopInfoComponent form={form} saveLoading={saveLoading}/>
</Form>
);
if (error) return <AlertComponent message={error.message} type="error" />;
if (loading) return <LoadingSpinner />;
return (
<Form
form={form}
layout="vertical"
autoComplete="new-password"
onFinish={handleFinish}
initialValues={
data
? data.bodyshops[0].accountingconfig.ClosingPeriod
? {
...data.bodyshops[0],
accountingconfig: {
...data.bodyshops[0].accountingconfig,
ClosingPeriod: [
dayjs(data.bodyshops[0].accountingconfig.ClosingPeriod[0]),
dayjs(data.bodyshops[0].accountingconfig.ClosingPeriod[1])
]
},
schedule_start_time: dayjs(data.bodyshops[0].schedule_start_time),
schedule_end_time: dayjs(data.bodyshops[0].schedule_end_time)
}
: {
...data.bodyshops[0],
schedule_start_time: dayjs(data.bodyshops[0].schedule_start_time),
schedule_end_time: dayjs(data.bodyshops[0].schedule_end_time)
}
: null
}
>
<FormsFieldChanged form={form} />
<ShopInfoComponent form={form} saveLoading={saveLoading} />
</Form>
);
}

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

File diff suppressed because it is too large Load Diff

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

@@ -1,9 +1,9 @@
import {DeleteFilled} from "@ant-design/icons";
import {Button, Form, Input, InputNumber, Select, Space, Switch} from "antd";
import { DeleteFilled } from "@ant-design/icons";
import { Button, Form, Input, InputNumber, Select, Space, Switch } from "antd";
import React from "react";
import {useTranslation} from "react-i18next";
import { useTranslation } from "react-i18next";
import styled from "styled-components";
import {TemplateList} from "../../utils/TemplateConstants";
import { TemplateList } from "../../utils/TemplateConstants";
import ConfigFormTypes from "../config-form-components/config-form-types";
import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
@@ -14,356 +14,312 @@ const SelectorDiv = styled.div`
}
`;
export default function ShopInfoIntakeChecklistComponent({form}) {
const {t} = useTranslation();
export default function ShopInfoIntakeChecklistComponent({ form }) {
const { t } = useTranslation();
const TemplateListGenerated = TemplateList();
return (
<div>
<LayoutFormRow
header={t("bodyshop.labels.intakechecklist")}
id="intakechecklist"
>
<Form.List name={["intakechecklist", "form"]}>
{(fields, {add, remove, move}) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("jobs.fields.intake.name")}
key={`${index}name`}
name={[field.name, "name"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.type")}
key={`${index}type`}
name={[field.name, "type"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Select>
{Object.keys(ConfigFormTypes).map((i, idx) => (
<Select.Option key={i} value={i}>
{i}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.label")}
key={`${index}label`}
name={[field.name, "label"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item shouldUpdate>
{() => {
if (
form.getFieldValue([
"intakechecklist",
"form",
index,
"type",
]) !== "slider"
)
return null;
return (
<>
<Form.Item
label={t("jobs.fields.intake.min")}
key={`${index}min`}
name={[field.name, "min"]}
dependencies={[[field.name, "type"]]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<InputNumber/>
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.max")}
key={`${index}max`}
name={[field.name, "max"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<InputNumber/>
</Form.Item>
</>
);
}}
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.required")}
key={`${index}required`}
name={[field.name, "required"]}
valuePropName="checked"
>
<Switch/>
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows
move={move}
index={index}
total={fields.length}
/>
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{width: "100%"}}
>
{t("general.actions.add")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
<SelectorDiv>
<Form.Item
name={["intakechecklist", "templates"]}
label={t("bodyshop.fields.intake.templates")}
rules={[
{
required: true,
const TemplateListGenerated = TemplateList();
return (
<div>
<LayoutFormRow header={t("bodyshop.labels.intakechecklist")} id="intakechecklist">
<Form.List name={["intakechecklist", "form"]}>
{(fields, { add, remove, move }) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("jobs.fields.intake.name")}
key={`${index}name`}
name={[field.name, "name"]}
rules={[
{
required: true
//message: t("general.validation.required"),
type: "array",
},
]}
>
<Select mode="multiple">
{Object.keys(TemplateListGenerated).map((i) => (
<Select.Option
key={TemplateListGenerated[i].key}
value={TemplateListGenerated[i].key}
>
{TemplateListGenerated[i].title}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
name={["intakechecklist", "next_contact_hours"]}
label={t("bodyshop.fields.intake.next_contact_hours")}
>
<InputNumber min={0} precision={0}/>
</Form.Item>
</SelectorDiv>
<LayoutFormRow
header={t("bodyshop.labels.deliverchecklist")}
id="deliverchecklist"
>
<Form.List name={["deliverchecklist", "form"]}>
{(fields, {add, remove, move}) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("jobs.fields.intake.name")}
key={`${index}named`}
name={[field.name, "name"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.type")}
key={`${index}typed`}
name={[field.name, "type"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Select>
{Object.keys(ConfigFormTypes).map((i, idx) => (
<Select.Option key={i} value={i}>
{i}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.label")}
key={`${index}labeld`}
name={[field.name, "label"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item shouldUpdate>
{() => {
if (
form.getFieldValue([
"deliverchecklist",
"form",
index,
"type",
]) !== "slider"
)
return null;
return (
<>
<Form.Item
label={t("jobs.fields.intake.min")}
key={`${index}mind`}
name={[field.name, "min"]}
dependencies={[[field.name, "type"]]}
rules={[
{
required:
form.getFieldValue([
field.name,
"type",
]) === "slider",
//message: t("general.validation.required"),
},
]}
>
<InputNumber/>
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.max")}
key={`${index}maxd`}
name={[field.name, "max"]}
dependencies={[[field.name, "type"]]}
rules={[
{
required:
form.getFieldValue([
field.name,
"type",
]) === "slider",
//message: t("general.validation.required"),
},
]}
>
<InputNumber/>
</Form.Item>
</>
);
}}
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.required")}
key={`${index}requiredd`}
name={[field.name, "required"]}
valuePropName="checked"
>
<Switch/>
</Form.Item>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows
move={move}
index={index}
total={fields.length}
/>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{width: "100%"}}
>
{t("general.actions.add")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
<SelectorDiv>
<Form.Item
name={["deliverchecklist", "templates"]}
label={t("bodyshop.fields.deliver.templates")}
rules={[
{
required: true,
}
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.type")}
key={`${index}type`}
name={[field.name, "type"]}
rules={[
{
required: true
//message: t("general.validation.required"),
type: "array",
},
]}
>
<Select mode="multiple">
{Object.keys(TemplateListGenerated).map((i) => (
<Select.Option
key={TemplateListGenerated[i].key}
value={TemplateListGenerated[i].key}
>
{TemplateListGenerated[i].title}
}
]}
>
<Select>
{Object.keys(ConfigFormTypes).map((i, idx) => (
<Select.Option key={i} value={i}>
{i}
</Select.Option>
))}
</Select>
))}
</Select>
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.label")}
key={`${index}label`}
name={[field.name, "label"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item shouldUpdate>
{() => {
if (form.getFieldValue(["intakechecklist", "form", index, "type"]) !== "slider") return null;
return (
<>
<Form.Item
label={t("jobs.fields.intake.min")}
key={`${index}min`}
name={[field.name, "min"]}
dependencies={[[field.name, "type"]]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<InputNumber />
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.max")}
key={`${index}max`}
name={[field.name, "max"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<InputNumber />
</Form.Item>
</>
);
}}
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.required")}
key={`${index}required`}
name={[field.name, "required"]}
valuePropName="checked"
>
<Switch />
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows move={move} index={index} total={fields.length} />
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{ width: "100%" }}
>
{t("general.actions.add")}
</Button>
</Form.Item>
</SelectorDiv>
</div>
);
</div>
);
}}
</Form.List>
</LayoutFormRow>
<SelectorDiv>
<Form.Item
name={["intakechecklist", "templates"]}
label={t("bodyshop.fields.intake.templates")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<Select mode="multiple">
{Object.keys(TemplateListGenerated).map((i) => (
<Select.Option key={TemplateListGenerated[i].key} value={TemplateListGenerated[i].key}>
{TemplateListGenerated[i].title}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
name={["intakechecklist", "next_contact_hours"]}
label={t("bodyshop.fields.intake.next_contact_hours")}
>
<InputNumber min={0} precision={0} />
</Form.Item>
</SelectorDiv>
<LayoutFormRow header={t("bodyshop.labels.deliverchecklist")} id="deliverchecklist">
<Form.List name={["deliverchecklist", "form"]}>
{(fields, { add, remove, move }) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("jobs.fields.intake.name")}
key={`${index}named`}
name={[field.name, "name"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.type")}
key={`${index}typed`}
name={[field.name, "type"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Select>
{Object.keys(ConfigFormTypes).map((i, idx) => (
<Select.Option key={i} value={i}>
{i}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.label")}
key={`${index}labeld`}
name={[field.name, "label"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item shouldUpdate>
{() => {
if (form.getFieldValue(["deliverchecklist", "form", index, "type"]) !== "slider") return null;
return (
<>
<Form.Item
label={t("jobs.fields.intake.min")}
key={`${index}mind`}
name={[field.name, "min"]}
dependencies={[[field.name, "type"]]}
rules={[
{
required: form.getFieldValue([field.name, "type"]) === "slider"
//message: t("general.validation.required"),
}
]}
>
<InputNumber />
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.max")}
key={`${index}maxd`}
name={[field.name, "max"]}
dependencies={[[field.name, "type"]]}
rules={[
{
required: form.getFieldValue([field.name, "type"]) === "slider"
//message: t("general.validation.required"),
}
]}
>
<InputNumber />
</Form.Item>
</>
);
}}
</Form.Item>
<Form.Item
label={t("jobs.fields.intake.required")}
key={`${index}requiredd`}
name={[field.name, "required"]}
valuePropName="checked"
>
<Switch />
</Form.Item>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows move={move} index={index} total={fields.length} />
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{ width: "100%" }}
>
{t("general.actions.add")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
<SelectorDiv>
<Form.Item
name={["deliverchecklist", "templates"]}
label={t("bodyshop.fields.deliver.templates")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<Select mode="multiple">
{Object.keys(TemplateListGenerated).map((i) => (
<Select.Option key={TemplateListGenerated[i].key} value={TemplateListGenerated[i].key}>
{TemplateListGenerated[i].title}
</Select.Option>
))}
</Select>
</Form.Item>
</SelectorDiv>
</div>
);
}

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

@@ -1,339 +1,335 @@
import {DeleteFilled} from "@ant-design/icons";
import {Button, Form, Input} from "antd";
import { DeleteFilled } from "@ant-design/icons";
import { Button, Form, Input } from "antd";
import React from "react";
import {useTranslation} from "react-i18next";
import { useTranslation } from "react-i18next";
import CurrencyInput from "../form-items-formatted/currency-form-item.component";
import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
export default function ShopInfoLaborRates({form}) {
const {t} = useTranslation();
export default function ShopInfoLaborRates({ form }) {
const { t } = useTranslation();
return (
<div>
<Form.List name={["md_labor_rates"]}>
{(fields, {add, remove, move}) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow>
<Form.Item
label={t("jobs.fields.labor_rate_desc")}
key={`${index}rate_label`}
name={[field.name, "rate_label"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_laa")}
key={`${index}rate_laa`}
name={[field.name, "rate_laa"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lab")}
key={`${index}rate_lab`}
name={[field.name, "rate_lab"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lad")}
key={`${index}rate_lad`}
name={[field.name, "rate_lad"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lae")}
key={`${index}rate_lae`}
name={[field.name, "rate_lae"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_laf")}
key={`${index}rate_laf`}
name={[field.name, "rate_laf"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lag")}
key={`${index}rate_lag`}
name={[field.name, "rate_lag"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lam")}
key={`${index}rate_lam`}
name={[field.name, "rate_lam"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lar")}
key={`${index}rate_lar`}
name={[field.name, "rate_lar"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_las")}
key={`${index}rate_las`}
name={[field.name, "rate_las"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_la1")}
key={`${index}rate_la1`}
name={[field.name, "rate_la1"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_la2")}
key={`${index}rate_la2`}
name={[field.name, "rate_la2"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_la3")}
key={`${index}rate_la3`}
name={[field.name, "rate_la3"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_la4")}
key={`${index}rate_la4`}
name={[field.name, "rate_la4"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_mash")}
key={`${index}rate_mash`}
name={[field.name, "rate_mash"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_mapa")}
key={`${index}rate_mapa`}
name={[field.name, "rate_mapa"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_ma2s")}
key={`${index}rate_ma2s`}
name={[field.name, "rate_ma2s"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_ma3s")}
key={`${index}rate_ma3s`}
name={[field.name, "rate_ma3s"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
{
// <Form.Item
// label={t("jobs.fields.rate_mabl")}
// key={`${index}rate_mabl`}
// name={[field.name, "rate_mabl"]}
// rules={[
// {
// required: true,
// //message: t("general.validation.required"),
// },
// ]}
// >
// <CurrencyInput min={0} />
// </Form.Item>
// <Form.Item
// label={t("jobs.fields.rate_macs")}
// key={`${index}rate_macs`}
// name={[field.name, "rate_macs"]}
// rules={[
// {
// required: true,
// //message: t("general.validation.required"),
// },
// ]}
// >
// <CurrencyInput min={0} />
// </Form.Item>
}
<Form.Item
label={t("jobs.fields.rate_matd")}
key={`${index}rate_matd`}
name={[field.name, "rate_matd"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_mahw")}
key={`${index}rate_mahw`}
name={[field.name, "rate_mahw"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<CurrencyInput min={0}/>
</Form.Item>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows
move={move}
index={index}
total={fields.rate_length}
/>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{width: "100%"}}
>
{t("bodyshop.actions.newlaborrate")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</div>
);
return (
<div>
<Form.List name={["md_labor_rates"]}>
{(fields, { add, remove, move }) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow>
<Form.Item
label={t("jobs.fields.labor_rate_desc")}
key={`${index}rate_label`}
name={[field.name, "rate_label"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_laa")}
key={`${index}rate_laa`}
name={[field.name, "rate_laa"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lab")}
key={`${index}rate_lab`}
name={[field.name, "rate_lab"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lad")}
key={`${index}rate_lad`}
name={[field.name, "rate_lad"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lae")}
key={`${index}rate_lae`}
name={[field.name, "rate_lae"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_laf")}
key={`${index}rate_laf`}
name={[field.name, "rate_laf"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lag")}
key={`${index}rate_lag`}
name={[field.name, "rate_lag"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lam")}
key={`${index}rate_lam`}
name={[field.name, "rate_lam"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_lar")}
key={`${index}rate_lar`}
name={[field.name, "rate_lar"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_las")}
key={`${index}rate_las`}
name={[field.name, "rate_las"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_la1")}
key={`${index}rate_la1`}
name={[field.name, "rate_la1"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_la2")}
key={`${index}rate_la2`}
name={[field.name, "rate_la2"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_la3")}
key={`${index}rate_la3`}
name={[field.name, "rate_la3"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_la4")}
key={`${index}rate_la4`}
name={[field.name, "rate_la4"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_mash")}
key={`${index}rate_mash`}
name={[field.name, "rate_mash"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_mapa")}
key={`${index}rate_mapa`}
name={[field.name, "rate_mapa"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_ma2s")}
key={`${index}rate_ma2s`}
name={[field.name, "rate_ma2s"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_ma3s")}
key={`${index}rate_ma3s`}
name={[field.name, "rate_ma3s"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
{
// <Form.Item
// label={t("jobs.fields.rate_mabl")}
// key={`${index}rate_mabl`}
// name={[field.name, "rate_mabl"]}
// rules={[
// {
// required: true,
// //message: t("general.validation.required"),
// },
// ]}
// >
// <CurrencyInput min={0} />
// </Form.Item>
// <Form.Item
// label={t("jobs.fields.rate_macs")}
// key={`${index}rate_macs`}
// name={[field.name, "rate_macs"]}
// rules={[
// {
// required: true,
// //message: t("general.validation.required"),
// },
// ]}
// >
// <CurrencyInput min={0} />
// </Form.Item>
}
<Form.Item
label={t("jobs.fields.rate_matd")}
key={`${index}rate_matd`}
name={[field.name, "rate_matd"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<Form.Item
label={t("jobs.fields.rate_mahw")}
key={`${index}rate_mahw`}
name={[field.name, "rate_mahw"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<CurrencyInput min={0} />
</Form.Item>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows move={move} index={index} total={fields.rate_length} />
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{ width: "100%" }}
>
{t("bodyshop.actions.newlaborrate")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</div>
);
}

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

@@ -1,97 +1,96 @@
import {Form, Input} from "antd";
import { Form, Input } from "antd";
import React from "react";
import {useTranslation} from "react-i18next";
import { useTranslation } from "react-i18next";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import {connect} from "react-redux";
import {createStructuredSelector} from "reselect";
import {selectBodyshop} from "../../redux/user/user.selectors";
import {useSplitTreatments} from "@splitsoftware/splitio-react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import { useSplitTreatments } from "@splitsoftware/splitio-react";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
bodyshop: selectBodyshop
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
//setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(ShopInfoOrderStatusComponent);
export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoOrderStatusComponent);
export function ShopInfoOrderStatusComponent({bodyshop, form}) {
const {t} = useTranslation();
export function ShopInfoOrderStatusComponent({ bodyshop, form }) {
const { t } = useTranslation();
const {treatments: {OEConnection}} = useSplitTreatments({
attributes: {},
names: ["OEConnection"],
splitKey: bodyshop.imexshopid,
});
const {
treatments: { OEConnection }
} = useSplitTreatments({
attributes: {},
names: ["OEConnection"],
splitKey: bodyshop.imexshopid
});
return (
<LayoutFormRow header={t("bodyshop.labels.orderstatuses")}>
<Form.Item
label={t("bodyshop.fields.statuses.default_bo")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_order_statuses", "default_bo"]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_ordered")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_order_statuses", "default_ordered"]}
>
<Input/>
</Form.Item>
return (
<LayoutFormRow header={t("bodyshop.labels.orderstatuses")}>
<Form.Item
label={t("bodyshop.fields.statuses.default_bo")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_order_statuses", "default_bo"]}
>
<Input />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_ordered")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_order_statuses", "default_ordered"]}
>
<Input />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_received")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_order_statuses", "default_received"]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_returned")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_order_statuses", "default_returned"]}
>
<Input/>
</Form.Item>
{OEConnection.treatment === "on" && (
<Form.Item
label={t("bodyshop.fields.statuses.default_quote")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_order_statuses", "default_quote"]}
>
<Input/>
</Form.Item>
)}
</LayoutFormRow>
);
<Form.Item
label={t("bodyshop.fields.statuses.default_received")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_order_statuses", "default_received"]}
>
<Input />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_returned")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_order_statuses", "default_returned"]}
>
<Input />
</Form.Item>
{OEConnection.treatment === "on" && (
<Form.Item
label={t("bodyshop.fields.statuses.default_quote")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_order_statuses", "default_quote"]}
>
<Input />
</Form.Item>
)}
</LayoutFormRow>
);
}

142
client/src/components/shop-info/shop-info.parts-scan.jsx
View File

@@ -1,81 +1,77 @@
import {DeleteFilled} from "@ant-design/icons";
import {Button, Form, Input, Space} from "antd";
import { DeleteFilled } from "@ant-design/icons";
import { Button, Form, Input, Space } from "antd";
import React from "react";
import {useTranslation} from "react-i18next";
import { useTranslation } from "react-i18next";
import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
export default function ShopInfoPartsScan({form}) {
const {t} = useTranslation();
export default function ShopInfoPartsScan({ form }) {
const { t } = useTranslation();
return (
<div>
<LayoutFormRow header={t("bodyshop.labels.md_parts_scan")}>
<Form.List name={["md_parts_scan"]}>
{(fields, {add, remove, move}) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.md_parts_scan.expression")}
key={`${index}expression`}
name={[field.name, "expression"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_parts_scan.flags")}
key={`${index}flags`}
name={[field.name, "flags"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
return (
<div>
<LayoutFormRow header={t("bodyshop.labels.md_parts_scan")}>
<Form.List name={["md_parts_scan"]}>
{(fields, { add, remove, move }) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.md_parts_scan.expression")}
key={`${index}expression`}
name={[field.name, "expression"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_parts_scan.flags")}
key={`${index}flags`}
name={[field.name, "flags"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows
move={move}
index={index}
total={fields.length}
/>
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{width: "100%"}}
>
{t("bodyshop.actions.addpartsrule")}
</Button>
</Form.Item>
</div>
);
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows move={move} index={index} total={fields.length} />
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
</Form.List>
</LayoutFormRow>
</div>
);
style={{ width: "100%" }}
>
{t("bodyshop.actions.addpartsrule")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
</div>
);
}

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

File diff suppressed because it is too large Load Diff

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

File diff suppressed because it is too large Load Diff

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

File diff suppressed because it is too large Load Diff

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

@@ -1,415 +1,401 @@
import {DeleteFilled} from "@ant-design/icons";
import {Button, Form, Select, Space} from "antd";
import React, {useState} from "react";
import {ChromePicker} from "react-color";
import {useTranslation} from "react-i18next";
import { DeleteFilled } from "@ant-design/icons";
import { Button, Form, Select, Space } from "antd";
import React, { useState } from "react";
import { ChromePicker } from "react-color";
import { useTranslation } from "react-i18next";
import styled from "styled-components";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import {connect} from "react-redux";
import {createStructuredSelector} from "reselect";
import {selectBodyshop} from "../../redux/user/user.selectors";
import {useSplitTreatments} from "@splitsoftware/splitio-react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import { useSplitTreatments } from "@splitsoftware/splitio-react";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
bodyshop: selectBodyshop
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
//setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(ShopInfoROStatusComponent);
export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoROStatusComponent);
const SelectorDiv = styled.div`
.ant-form-item .ant-select {
width: 200px;
}
.ant-form-item .ant-select {
width: 200px;
}
`;
export function ShopInfoROStatusComponent({bodyshop, form}) {
export function ShopInfoROStatusComponent({ bodyshop, form }) {
const { t } = useTranslation();
const {t} = useTranslation();
const {
treatments: { Production_List_Status_Colors }
} = useSplitTreatments({
attributes: {},
names: ["Production_List_Status_Colors"],
splitKey: bodyshop.imexshopid
});
const {treatments: {Production_List_Status_Colors}} = useSplitTreatments({
attributes: {},
names: ["Production_List_Status_Colors"],
splitKey: bodyshop.imexshopid,
});
const [options, setOptions] = useState(form.getFieldValue(["md_ro_statuses", "statuses"]) || []);
const [options, setOptions] = useState(
form.getFieldValue(["md_ro_statuses", "statuses"]) || []
);
const handleBlur = () => {
setOptions(form.getFieldValue(["md_ro_statuses", "statuses"]));
};
const handleBlur = () => {
setOptions(form.getFieldValue(["md_ro_statuses", "statuses"]));
};
return (
<SelectorDiv id="jobstatus">
<Form.Item
name={["md_ro_statuses", "statuses"]}
label={t("bodyshop.labels.alljobstatuses")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array",
},
]}
>
<Select mode="tags" onBlur={handleBlur}/>
</Form.Item>
<Form.Item
name={["md_ro_statuses", "active_statuses"]}
label={t("bodyshop.fields.statuses.active_statuses")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array",
},
]}
>
<Select mode="multiple">
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
return (
<SelectorDiv id="jobstatus">
<Form.Item
name={["md_ro_statuses", "statuses"]}
label={t("bodyshop.labels.alljobstatuses")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<Select mode="tags" onBlur={handleBlur} />
</Form.Item>
<Form.Item
name={["md_ro_statuses", "active_statuses"]}
label={t("bodyshop.fields.statuses.active_statuses")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<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", "pre_production_statuses"]}
label={t("bodyshop.fields.statuses.pre_production_statuses")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<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) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
name={["md_ro_statuses", "post_production_statuses"]}
label={t("bodyshop.fields.statuses.post_production_statuses")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<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", "ready_statuses"]}
label={t("bodyshop.fields.statuses.ready_statuses")}
rules={[
{
//required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<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", "additional_board_statuses"]}
label={t("bodyshop.fields.statuses.additional_board_statuses")}
rules={[
{
//required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<Select mode="multiple">
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.statuses.default_scheduled")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_ro_statuses", "default_scheduled"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_arrived")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_ro_statuses", "default_arrived"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_exported")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_ro_statuses", "default_exported"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_imported")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_ro_statuses", "default_imported"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_invoiced")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_ro_statuses", "default_invoiced"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_completed")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_ro_statuses", "default_completed"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_delivered")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_ro_statuses", "default_delivered"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_void")}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={["md_ro_statuses", "default_void"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
</LayoutFormRow>
{Production_List_Status_Colors.treatment === "on" && (
<LayoutFormRow grow header={t("bodyshop.fields.statuses.production_colors")} id="production_colors">
<Form.List name={["md_ro_statuses", "production_colors"]}>
{(fields, { add, remove, move }) => {
return (
<div>
<LayoutFormRow>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<Space direction="vertical">
<div style={{ display: "flex" }}>
<Form.Item
style={{ flex: 1 }}
label={t("jobs.fields.status")}
key={`${index}status`}
name={[field.name, "status"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
</div>
<Form.Item
label={t("bodyshop.fields.statuses.color")}
key={`${index}color`}
name={[field.name, "color"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<ColorPicker />
</Form.Item>
</Space>
</Form.Item>
))}
</Select>
</Form.Item>
<Form.Item
name={["md_ro_statuses", "pre_production_statuses"]}
label={t("bodyshop.fields.statuses.pre_production_statuses")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array",
},
]}
>
<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) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
name={["md_ro_statuses", "post_production_statuses"]}
label={t("bodyshop.fields.statuses.post_production_statuses")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array",
},
]}
>
<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", "ready_statuses"]}
label={t("bodyshop.fields.statuses.ready_statuses")}
rules={[
{
//required: true,
//message: t("general.validation.required"),
type: "array",
},
]}
>
<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", "additional_board_statuses"]}
label={t("bodyshop.fields.statuses.additional_board_statuses")}
rules={[
{
//required: true,
//message: t("general.validation.required"),
type: "array",
},
]}
>
<Select mode="multiple">
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.statuses.default_scheduled")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_ro_statuses", "default_scheduled"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_arrived")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_ro_statuses", "default_arrived"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_exported")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_ro_statuses", "default_exported"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_imported")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_ro_statuses", "default_imported"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_invoiced")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_ro_statuses", "default_invoiced"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_completed")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_ro_statuses", "default_completed"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_delivered")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_ro_statuses", "default_delivered"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.statuses.default_void")}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={["md_ro_statuses", "default_void"]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
</LayoutFormRow>
{Production_List_Status_Colors.treatment === "on" && (
<LayoutFormRow
grow
header={t("bodyshop.fields.statuses.production_colors")}
id="production_colors"
>
<Form.List name={["md_ro_statuses", "production_colors"]}>
{(fields, {add, remove, move}) => {
return (
<div>
<LayoutFormRow>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<Space direction="vertical">
<div style={{display: "flex"}}>
<Form.Item
style={{flex: 1}}
label={t("jobs.fields.status")}
key={`${index}status`}
name={[field.name, "status"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Select>
{options.map((item, idx) => (
<Select.Option key={idx} value={item}>
{item}
</Select.Option>
))}
</Select>
</Form.Item>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
</div>
<Form.Item
label={t("bodyshop.fields.statuses.color")}
key={`${index}color`}
name={[field.name, "color"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<ColorPicker/>
</Form.Item>
</Space>
</Form.Item>
))}
</LayoutFormRow>
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{width: "100%"}}
>
{t("general.actions.add")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
)}
</SelectorDiv>
);
</LayoutFormRow>
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{ width: "100%" }}
>
{t("general.actions.add")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
)}
</SelectorDiv>
);
}
export const ColorPicker = ({value, onChange, style, ...restProps}) => {
const handleChange = (color) => {
if (onChange) onChange(color.rgb);
};
return (
<ChromePicker
{...restProps}
color={value}
onChangeComplete={handleChange}
/>
);
export const ColorPicker = ({ value, onChange, style, ...restProps }) => {
const handleChange = (color) => {
if (onChange) onChange(color.rgb);
};
return <ChromePicker {...restProps} color={value} onChangeComplete={handleChange} />;
};

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

@@ -1,341 +1,304 @@
import {DeleteFilled} from "@ant-design/icons";
import {Button, Divider, Form, Input, InputNumber, Select, Space, Switch, TimePicker,} from "antd";
import { DeleteFilled } from "@ant-design/icons";
import { Button, Divider, Form, Input, InputNumber, Select, Space, Switch, TimePicker } from "antd";
import React from "react";
import {useTranslation} from "react-i18next";
import { useTranslation } from "react-i18next";
import ColorpickerFormItemComponent from "../form-items-formatted/colorpicker-form-item.component";
import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import {ColorPicker} from "./shop-info.rostatus.component";
import { ColorPicker } from "./shop-info.rostatus.component";
import InstanceRenderManager from "../../utils/instanceRenderMgr";
export default function ShopInfoSchedulingComponent({form}) {
const {t} = useTranslation();
export default function ShopInfoSchedulingComponent({ form }) {
const { t } = useTranslation();
return (
<div>
<LayoutFormRow>
<Form.Item
label={t("bodyshop.fields.appt_length")}
name={"appt_length"}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<InputNumber min={15} precision={0}/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.schedule_start_time")}
name={"schedule_start_time"}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<TimePicker disableSeconds={true} format="HH:mm"/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.schedule_end_time")}
name={"schedule_end_time"}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<TimePicker disableSeconds={true} format="HH:mm"/>
</Form.Item>
<Form.Item
name={["appt_alt_transport"]}
label={t("bodyshop.fields.appt_alt_transport")}
rules={[
{
//message: t("general.validation.required"),
type: "array",
},
]}
>
<Select mode="tags"/>
</Form.Item>
<Form.Item
name={["ss_configuration", "dailyhrslimit"]}
label={t("bodyshop.fields.ss_configuration.dailyhrslimit")}
>
<InputNumber min={0}/>
</Form.Item>
<Form.Item
name={["md_lost_sale_reasons"]}
label={t("bodyshop.fields.md_lost_sale_reasons")}
rules={[
{
// required: true,
//message: t("general.validation.required"),
type: "array",
},
]}
>
<Select mode="tags"/>
</Form.Item>
</LayoutFormRow>
<Divider orientation="left">{t("bodyshop.labels.workingdays")}</Divider>
<Space wrap size="large" id="workingdays">
<Form.Item
label={t("general.labels.sunday")}
name={["workingdays", "sunday"]}
valuePropName="checked"
>
<Switch/>
</Form.Item>
<Form.Item
label={t("general.labels.monday")}
name={["workingdays", "monday"]}
valuePropName="checked"
>
<Switch/>
</Form.Item>
<Form.Item
label={t("general.labels.tuesday")}
name={["workingdays", "tuesday"]}
valuePropName="checked"
>
<Switch/>
</Form.Item>
<Form.Item
label={t("general.labels.wednesday")}
name={["workingdays", "wednesday"]}
valuePropName="checked"
>
<Switch/>
</Form.Item>
<Form.Item
label={t("general.labels.thursday")}
name={["workingdays", "thursday"]}
valuePropName="checked"
>
<Switch/>
</Form.Item>
<Form.Item
label={t("general.labels.friday")}
name={["workingdays", "friday"]}
valuePropName="checked"
>
<Switch/>
</Form.Item>
<Form.Item
label={t("general.labels.saturday")}
name={["workingdays", "saturday"]}
valuePropName="checked"
>
<Switch/>
</Form.Item>
</Space>
<LayoutFormRow header={t("bodyshop.labels.apptcolors")} id="apptcolors">
<Form.List name={["appt_colors"]}>
{(fields, {add, remove, move}) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.appt_colors.label")}
key={`${index}aptcolorlabel`}
name={[field.name, "label"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.appt_colors.color")}
key={`${index}aptcolorcolor`}
name={[field.name, "color"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<ColorpickerFormItemComponent/>
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows
move={move}
index={index}
total={fields.length}
/>
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{width: "100%"}}
>
{t("bodyshop.actions.addapptcolor")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
return (
<div>
<LayoutFormRow>
<Form.Item
label={t("bodyshop.fields.appt_length")}
name={"appt_length"}
rules={[
{
InstanceRenderManager({imex: <LayoutFormRow header={t("bodyshop.labels.ssbuckets")} id="ssbuckets">
<Form.List name={["ssbuckets"]}>
{(fields, {add, remove, move}) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.ssbuckets.id")}
key={`${index}id`}
name={[field.name, "id"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.ssbuckets.label")}
key={`${index}label`}
name={[field.name, "label"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.ssbuckets.gte")}
key={`${index}gte`}
name={[field.name, "gte"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<InputNumber/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.ssbuckets.lt")}
key={`${index}lt`}
name={[field.name, "lt"]}
>
<InputNumber/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.ssbuckets.target")}
key={`${index}target`}
name={[field.name, "target"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<InputNumber/>
</Form.Item>
<Space direction="horizontal">
<Form.Item
label={
<Space>
{t("bodyshop.fields.ssbuckets.color")}
<Button
size="small"
onClick={() => {
form.setFieldValue([
"ssbuckets",
field.name,
"color",
]);
form.setFields([
{
name: ["ssbuckets", field.name, "color"],
touched: true,
},
]);
}}
>
Reset
</Button>
</Space>
}
key={`${index}color`}
name={[field.name, "color"]}
>
<ColorPicker/>
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows
move={move}
index={index}
total={fields.length}
/>
</Space>
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{width: "100%"}}
>
{t("bodyshop.actions.addbucket")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>, rome: "USE_IMEX", promanager: null})
required: true
//message: t("general.validation.required"),
}
</div>
);
]}
>
<InputNumber min={15} precision={0} />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.schedule_start_time")}
name={"schedule_start_time"}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<TimePicker disableSeconds={true} format="HH:mm" />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.schedule_end_time")}
name={"schedule_end_time"}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<TimePicker disableSeconds={true} format="HH:mm" />
</Form.Item>
<Form.Item
name={["appt_alt_transport"]}
label={t("bodyshop.fields.appt_alt_transport")}
rules={[
{
//message: t("general.validation.required"),
type: "array"
}
]}
>
<Select mode="tags" />
</Form.Item>
<Form.Item
name={["ss_configuration", "dailyhrslimit"]}
label={t("bodyshop.fields.ss_configuration.dailyhrslimit")}
>
<InputNumber min={0} />
</Form.Item>
<Form.Item
name={["md_lost_sale_reasons"]}
label={t("bodyshop.fields.md_lost_sale_reasons")}
rules={[
{
// required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<Select mode="tags" />
</Form.Item>
</LayoutFormRow>
<Divider orientation="left">{t("bodyshop.labels.workingdays")}</Divider>
<Space wrap size="large" id="workingdays">
<Form.Item label={t("general.labels.sunday")} name={["workingdays", "sunday"]} valuePropName="checked">
<Switch />
</Form.Item>
<Form.Item label={t("general.labels.monday")} name={["workingdays", "monday"]} valuePropName="checked">
<Switch />
</Form.Item>
<Form.Item label={t("general.labels.tuesday")} name={["workingdays", "tuesday"]} valuePropName="checked">
<Switch />
</Form.Item>
<Form.Item label={t("general.labels.wednesday")} name={["workingdays", "wednesday"]} valuePropName="checked">
<Switch />
</Form.Item>
<Form.Item label={t("general.labels.thursday")} name={["workingdays", "thursday"]} valuePropName="checked">
<Switch />
</Form.Item>
<Form.Item label={t("general.labels.friday")} name={["workingdays", "friday"]} valuePropName="checked">
<Switch />
</Form.Item>
<Form.Item label={t("general.labels.saturday")} name={["workingdays", "saturday"]} valuePropName="checked">
<Switch />
</Form.Item>
</Space>
<LayoutFormRow header={t("bodyshop.labels.apptcolors")} id="apptcolors">
<Form.List name={["appt_colors"]}>
{(fields, { add, remove, move }) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.appt_colors.label")}
key={`${index}aptcolorlabel`}
name={[field.name, "label"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.appt_colors.color")}
key={`${index}aptcolorcolor`}
name={[field.name, "color"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<ColorpickerFormItemComponent />
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows move={move} index={index} total={fields.length} />
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{ width: "100%" }}
>
{t("bodyshop.actions.addapptcolor")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
{InstanceRenderManager({
imex: (
<LayoutFormRow header={t("bodyshop.labels.ssbuckets")} id="ssbuckets">
<Form.List name={["ssbuckets"]}>
{(fields, { add, remove, move }) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.ssbuckets.id")}
key={`${index}id`}
name={[field.name, "id"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.ssbuckets.label")}
key={`${index}label`}
name={[field.name, "label"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.ssbuckets.gte")}
key={`${index}gte`}
name={[field.name, "gte"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<InputNumber />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.ssbuckets.lt")}
key={`${index}lt`}
name={[field.name, "lt"]}
>
<InputNumber />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.ssbuckets.target")}
key={`${index}target`}
name={[field.name, "target"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<InputNumber />
</Form.Item>
<Space direction="horizontal">
<Form.Item
label={
<Space>
{t("bodyshop.fields.ssbuckets.color")}
<Button
size="small"
onClick={() => {
form.setFieldValue(["ssbuckets", field.name, "color"]);
form.setFields([
{
name: ["ssbuckets", field.name, "color"],
touched: true
}
]);
}}
>
Reset
</Button>
</Space>
}
key={`${index}color`}
name={[field.name, "color"]}
>
<ColorPicker />
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows move={move} index={index} total={fields.length} />
</Space>
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{ width: "100%" }}
>
{t("bodyshop.actions.addbucket")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
),
rome: "USE_IMEX",
promanager: null
})}
</div>
);
}

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

@@ -1,101 +1,94 @@
import {DeleteFilled} from "@ant-design/icons";
import {Button, Form, Input, Select, Space} from "antd";
import { DeleteFilled } from "@ant-design/icons";
import { Button, Form, Input, Select, Space } from "antd";
import React from "react";
import {useTranslation} from "react-i18next";
import {TemplateList} from "../../utils/TemplateConstants";
import { useTranslation } from "react-i18next";
import { TemplateList } from "../../utils/TemplateConstants";
import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
export default function ShopInfoSpeedPrint({bodyshop, form}) {
const {t} = useTranslation();
const TemplateListGenerated = TemplateList("job");
return (
<Form.List name={["speedprint"]}>
{(fields, {add, remove, move}) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key} style={{padding: 0, margin: 2}}>
<LayoutFormRow grow>
<Form.Item
label={t("bodyshop.fields.speedprint.id")}
key={`${index}id`}
name={[field.name, "id"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.speedprint.label")}
key={`${index}label`}
name={[field.name, "label"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
export default function ShopInfoSpeedPrint({ bodyshop, form }) {
const { t } = useTranslation();
const TemplateListGenerated = TemplateList("job");
return (
<Form.List name={["speedprint"]}>
{(fields, { add, remove, move }) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key} style={{ padding: 0, margin: 2 }}>
<LayoutFormRow grow>
<Form.Item
label={t("bodyshop.fields.speedprint.id")}
key={`${index}id`}
name={[field.name, "id"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.speedprint.label")}
key={`${index}label`}
name={[field.name, "label"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item
name={[field.name, "templates"]}
label={t("bodyshop.fields.speedprint.templates")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array",
},
]}
>
<Select mode="multiple">
{Object.keys(TemplateListGenerated).map((key, idx) => (
<Select.Option
key={idx}
value={TemplateListGenerated[key].key}
>
{TemplateListGenerated[key].title}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
name={[field.name, "templates"]}
label={t("bodyshop.fields.speedprint.templates")}
rules={[
{
required: true,
//message: t("general.validation.required"),
type: "array"
}
]}
>
<Select mode="multiple">
{Object.keys(TemplateListGenerated).map((key, idx) => (
<Select.Option key={idx} value={TemplateListGenerated[key].key}>
{TemplateListGenerated[key].title}
</Select.Option>
))}
</Select>
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows
move={move}
index={index}
total={fields.length}
/>
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{width: "100%"}}
>
{t("bodyshop.actions.addspeedprint")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
);
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows move={move} index={index} total={fields.length} />
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{ width: "100%" }}
>
{t("bodyshop.actions.addspeedprint")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
);
}

442
client/src/components/shop-info/shop-info.task-presets.component.jsx
View File

@@ -1,259 +1,211 @@
import {DeleteFilled} from "@ant-design/icons";
import {Button, Checkbox, Col, Form, Input, InputNumber, Row, Select, Space, Switch,} from "antd";
import { DeleteFilled } from "@ant-design/icons";
import { Button, Checkbox, Col, Form, Input, InputNumber, Row, Select, Space, Switch } from "antd";
import React from "react";
import {useTranslation} from "react-i18next";
import { useTranslation } from "react-i18next";
import FormListMoveArrows from "../form-list-move-arrows/form-list-move-arrows.component";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
import {connect} from "react-redux";
import {createStructuredSelector} from "reselect";
import {selectBodyshop} from "../../redux/user/user.selectors";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
bodyshop: selectBodyshop
});
const mapDispatchToProps = (dispatch) => ({
//setUserLanguage: language => dispatch(setUserLanguage(language))
//setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(ShopInfoTaskPresets);
export default connect(mapStateToProps, mapDispatchToProps)(ShopInfoTaskPresets);
export function ShopInfoTaskPresets({bodyshop, form}) {
const {t} = useTranslation();
export function ShopInfoTaskPresets({ bodyshop, form }) {
const { t } = useTranslation();
return (
<>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.enable_tasks")}
valuePropName="checked"
name={["md_tasks_presets", "enable_tasks"]}
>
<Switch/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.use_approvals")}
valuePropName="checked"
name={["md_tasks_presets", "use_approvals"]}
>
<Switch/>
</Form.Item>
</LayoutFormRow>
return (
<>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.enable_tasks")}
valuePropName="checked"
name={["md_tasks_presets", "enable_tasks"]}
>
<Switch />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.use_approvals")}
valuePropName="checked"
name={["md_tasks_presets", "use_approvals"]}
>
<Switch />
</Form.Item>
</LayoutFormRow>
<LayoutFormRow header={t("bodyshop.labels.md_tasks_presets")}>
<Form.List name={["md_tasks_presets", "presets"]}>
{(fields, {add, remove, move}) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.name")}
key={`${index}name`}
name={[field.name, "name"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Input/>
</Form.Item>
<Form.Item
span={12}
label={t("bodyshop.fields.md_tasks_presets.hourstype")}
key={`${index}hourstype`}
name={[field.name, "hourstype"]}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<Checkbox.Group>
<Row>
<Col span={4}>
<Checkbox
value="LAA"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAA")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LAB"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAB")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LAD"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAD")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LAE"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAE")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LAF"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAF")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LAG"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAG")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LAM"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAM")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LAR"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAR")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LAS"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAS")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LAU"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LAU")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LA1"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LA1")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LA2"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LA2")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LA3"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LA3")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox
value="LA4"
style={{lineHeight: "32px"}}
>
{t("joblines.fields.lbr_types.LA4")}
</Checkbox>
</Col>
</Row>
</Checkbox.Group>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.percent")}
key={`${index}percent`}
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
name={[field.name, "percent"]}
>
<InputNumber min={0} max={100}/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.memo")}
key={`${index}memo`}
name={[field.name, "memo"]}
>
<Input/>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.nextstatus")}
key={`${index}nextstatus`}
name={[field.name, "nextstatus"]}
>
<Select
options={bodyshop.md_ro_statuses.production_statuses.map(
(o) => ({value: o, label: o})
)}
/>
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows
move={move}
index={index}
total={fields.length}
/>
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
style={{width: "100%"}}
>
{t("bodyshop.actions.add_task_preset")}
</Button>
</Form.Item>
</div>
);
<LayoutFormRow header={t("bodyshop.labels.md_tasks_presets")}>
<Form.List name={["md_tasks_presets", "presets"]}>
{(fields, { add, remove, move }) => {
return (
<div>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<LayoutFormRow noDivider>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.name")}
key={`${index}name`}
name={[field.name, "name"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Input />
</Form.Item>
<Form.Item
span={12}
label={t("bodyshop.fields.md_tasks_presets.hourstype")}
key={`${index}hourstype`}
name={[field.name, "hourstype"]}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
>
<Checkbox.Group>
<Row>
<Col span={4}>
<Checkbox value="LAA" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAA")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LAB" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAB")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LAD" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAD")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LAE" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAE")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LAF" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAF")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LAG" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAG")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LAM" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAM")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LAR" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAR")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LAS" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAS")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LAU" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LAU")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LA1" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LA1")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LA2" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LA2")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LA3" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LA3")}
</Checkbox>
</Col>
<Col span={4}>
<Checkbox value="LA4" style={{ lineHeight: "32px" }}>
{t("joblines.fields.lbr_types.LA4")}
</Checkbox>
</Col>
</Row>
</Checkbox.Group>
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.percent")}
key={`${index}percent`}
rules={[
{
required: true
//message: t("general.validation.required"),
}
]}
name={[field.name, "percent"]}
>
<InputNumber min={0} max={100} />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.memo")}
key={`${index}memo`}
name={[field.name, "memo"]}
>
<Input />
</Form.Item>
<Form.Item
label={t("bodyshop.fields.md_tasks_presets.nextstatus")}
key={`${index}nextstatus`}
name={[field.name, "nextstatus"]}
>
<Select
options={bodyshop.md_ro_statuses.production_statuses.map((o) => ({
value: o,
label: o
}))}
/>
</Form.Item>
<Space wrap>
<DeleteFilled
onClick={() => {
remove(field.name);
}}
/>
<FormListMoveArrows move={move} index={index} total={fields.length} />
</Space>
</LayoutFormRow>
</Form.Item>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => {
add();
}}
</Form.List>
</LayoutFormRow>
</>
);
style={{ width: "100%" }}
>
{t("bodyshop.actions.add_task_preset")}
</Button>
</Form.Item>
</div>
);
}}
</Form.List>
</LayoutFormRow>
</>
);
}