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

Majority of Dropdown Overlay Menu refactors.

Browse Source 
Signed-off-by: Dave Richer <dave@imexsystems.ca>
This commit is contained in:
Dave Richer
2023-12-29 13:26:37 -05:00
parent 79dce5d069
commit 07b46ed92b
32 changed files with 744 additions and 833 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
client/src/components/job-at-change/job-at-change.component.jsx
View File

@@ -4,7 +4,7 @@ import { UPDATE_JOB } from "../../graphql/jobs.queries";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { Dropdown, Menu, notification } from "antd";
import { Dropdown, notification } from "antd";
import { DownOutlined } from "@ant-design/icons";
import { selectBodyshop } from "../../redux/user/user.selectors";
@@ -37,19 +37,19 @@ export function JobAltTransportChange({ bodyshop, job }) {
});
}
};
const menu = (
<Menu
selectedKeys={[job && job.alt_transport]}
onClick={onClick}
items={[
...(bodyshop.appt_alt_transport || []).map((alt) => ({
const menu = {
items: [
...(bodyshop.appt_alt_transport || []).map((alt) => ({
key: alt,
label: alt,
})),
{ key: "null", label: t("general.actions.clear") },
]}
/>
);
})),
{ key: "null", label: t("general.actions.clear") },
],
onClick: onClick,
defaultSelectedKeys: [job && job.alt_transport]
}
return (
<Dropdown menu={menu}>
<a href=" #" onClick={(e) => e.preventDefault()}>

32
client/src/components/job-at-change/schedule-event.color.component.jsx
View File

@@ -4,7 +4,7 @@ import { UPDATE_APPOINTMENT } from "../../graphql/appointments.queries";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { Dropdown, Menu, notification } from "antd";
import { Dropdown, notification } from "antd";
import { DownOutlined } from "@ant-design/icons";
import { selectBodyshop } from "../../redux/user/user.selectors";
@@ -44,21 +44,20 @@ export function ScheduleEventColor({ bodyshop, event }) {
bodyshop.appt_colors.filter((color) => color.color.hex === event.color)[0]
?.label;
const menu = (
<Menu
selectedKeys={[event.color]}
onClick={onClick}
items={[
...(bodyshop.appt_colors || []).map((color) => ({
key: color.color.hex,
label: color.label,
style: { color: color.color.hex },
})),
{ key: "divider", label: <hr />, disabled: true },
{ key: "null", label: t("general.actions.clear") },
]}
/>
);
const menu = {
defaultSelectedKeys: [event.color],
onClick: onClick,
items: [
...(bodyshop.appt_colors || []).map((color) => ({
key: color.color.hex,
label: color.label,
style: { color: color.color.hex },
})),
{ key: "divider", label: <hr />, disabled: true },
{ key: "null", label: t("general.actions.clear") },
]
};
return (
<Dropdown menu={menu}>
@@ -69,4 +68,5 @@ export function ScheduleEventColor({ bodyshop, event }) {
</Dropdown>
);
}
export default connect(mapStateToProps, mapDispatchToProps)(ScheduleEventColor);

97
client/src/components/job-at-change/schedule-event.component.jsx
View File

@@ -5,7 +5,6 @@ import {
Dropdown,
Form,
Input,
Menu,
notification,
Popover,
Select,
@@ -185,58 +184,54 @@ export function ScheduleEventComponent({
) : null}
{event.job ? (
<Dropdown
menu={
<Menu
items={[
{
key: "email",
label: t("general.labels.email"),
disabled: event.arrived,
onClick: () => {
const Template = TemplateList("job").appointment_reminder;
GenerateDocument(
{
name: Template.key,
variables: { id: event.job.id },
},
{
to: event.job && event.job.ownr_ea,
subject: Template.subject,
},
"e",
event.job && event.job.id
menu={{items: [
{
key: "email",
label: t("general.labels.email"),
disabled: event.arrived,
onClick: () => {
const Template = TemplateList("job").appointment_reminder;
GenerateDocument(
{
name: Template.key,
variables: { id: event.job.id },
},
{
to: event.job && event.job.ownr_ea,
subject: Template.subject,
},
"e",
event.job && event.job.id
);
},
},
{
key: "sms",
label: t("general.labels.sms"),
disabled: event.arrived || !bodyshop.messagingservicesid,
onClick: () => {
const p = parsePhoneNumber(event.job.ownr_ph1, "CA");
if (p && p.isValid()) {
openChatByPhone({
phone_num: p.formatInternational(),
jobid: event.job.id,
});
setMessage(
t("appointments.labels.reminder", {
shopname: bodyshop.shopname,
date: dayjs(event.start).format("MM/DD/YYYY"),
time: dayjs(event.start).format("HH:mm a"),
})
);
},
setVisible(false);
} else {
notification["error"]({
message: t("messaging.error.invalidphone"),
});
}
},
{
key: "sms",
label: t("general.labels.sms"),
disabled: event.arrived || !bodyshop.messagingservicesid,
onClick: () => {
const p = parsePhoneNumber(event.job.ownr_ph1, "CA");
if (p && p.isValid()) {
openChatByPhone({
phone_num: p.formatInternational(),
jobid: event.job.id,
});
setMessage(
t("appointments.labels.reminder", {
shopname: bodyshop.shopname,
date: dayjs(event.start).format("MM/DD/YYYY"),
time: dayjs(event.start).format("HH:mm a"),
})
);
setVisible(false);
} else {
notification["error"]({
message: t("messaging.error.invalidphone"),
});
}
},
},
]}
/>
}
},
]}}
>
<Button>{t("appointments.actions.sendreminder")}</Button>
</Dropdown>