Additional Menu Refactors
Signed-off-by: Dave Richer <dave@imexsystems.ca>
This commit is contained in:
Dave Richer
@@ -1,430 +1,469 @@
|
|||||||
import Icon, {
|
import Icon, {
|
||||||
BankFilled,
|
BankFilled,
|
||||||
BarChartOutlined,
|
BarChartOutlined,
|
||||||
CarFilled,
|
CarFilled,
|
||||||
CheckCircleOutlined,
|
CheckCircleOutlined,
|
||||||
ClockCircleFilled,
|
ClockCircleFilled,
|
||||||
DashboardFilled,
|
DashboardFilled,
|
||||||
DollarCircleFilled,
|
DollarCircleFilled,
|
||||||
ExportOutlined,
|
ExportOutlined,
|
||||||
FieldTimeOutlined,
|
FieldTimeOutlined,
|
||||||
FileAddFilled,
|
FileAddFilled,
|
||||||
FileAddOutlined,
|
FileAddOutlined,
|
||||||
FileFilled,
|
FileFilled,
|
||||||
//GlobalOutlined,
|
HomeFilled,
|
||||||
HomeFilled,
|
ImportOutlined,
|
||||||
ImportOutlined,
|
LineChartOutlined,
|
||||||
LineChartOutlined,
|
PaperClipOutlined,
|
||||||
PaperClipOutlined,
|
PhoneOutlined,
|
||||||
PhoneOutlined,
|
QuestionCircleFilled,
|
||||||
QuestionCircleFilled,
|
ScheduleOutlined,
|
||||||
ScheduleOutlined,
|
SettingOutlined,
|
||||||
SettingOutlined,
|
TeamOutlined,
|
||||||
TeamOutlined,
|
ToolFilled,
|
||||||
ToolFilled,
|
UnorderedListOutlined,
|
||||||
UnorderedListOutlined,
|
UserOutlined,
|
||||||
UserOutlined,
|
|
||||||
} from "@ant-design/icons";
|
} from "@ant-design/icons";
|
||||||
import {useSplitTreatments} from "@splitsoftware/splitio-react";
|
import {useSplitTreatments} from "@splitsoftware/splitio-react";
|
||||||
import { Layout, Menu } from "antd";
|
import {Layout, Menu} from "antd";
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { useTranslation } from "react-i18next";
|
import {useTranslation} from "react-i18next";
|
||||||
import { BsKanban } from "react-icons/bs";
|
import {BsKanban} from "react-icons/bs";
|
||||||
import {
|
import {FaCalendarAlt, FaCarCrash, FaCreditCard, FaFileInvoiceDollar,} from "react-icons/fa";
|
||||||
FaCalendarAlt,
|
import {GiPayMoney, GiPlayerTime, GiSettingsKnobs} from "react-icons/gi";
|
||||||
FaCarCrash,
|
import {IoBusinessOutline} from "react-icons/io5";
|
||||||
FaCreditCard,
|
import {RiSurveyLine} from "react-icons/ri";
|
||||||
FaFileInvoiceDollar,
|
import {connect} from "react-redux";
|
||||||
} from "react-icons/fa";
|
import {Link} from "react-router-dom";
|
||||||
import { GiPayMoney, GiPlayerTime, GiSettingsKnobs } from "react-icons/gi";
|
import {createStructuredSelector} from "reselect";
|
||||||
import { IoBusinessOutline } from "react-icons/io5";
|
import {selectRecentItems, selectSelectedHeader,} from "../../redux/application/application.selectors";
|
||||||
import { RiSurveyLine } from "react-icons/ri";
|
import {setModalContext} from "../../redux/modals/modals.actions";
|
||||||
import { connect } from "react-redux";
|
import {signOutStart} from "../../redux/user/user.actions";
|
||||||
import { Link } from "react-router-dom";
|
import {selectBodyshop, selectCurrentUser,} from "../../redux/user/user.selectors";
|
||||||
import { createStructuredSelector } from "reselect";
|
import {FiLogOut} from "react-icons/fi";
|
||||||
import {
|
|
||||||
selectRecentItems,
|
|
||||||
selectSelectedHeader,
|
|
||||||
} from "../../redux/application/application.selectors";
|
|
||||||
import { setModalContext } from "../../redux/modals/modals.actions";
|
|
||||||
import { signOutStart } from "../../redux/user/user.actions";
|
|
||||||
import {
|
|
||||||
selectBodyshop,
|
|
||||||
selectCurrentUser,
|
|
||||||
} from "../../redux/user/user.selectors";
|
|
||||||
|
|
||||||
const mapStateToProps = createStructuredSelector({
|
const mapStateToProps = createStructuredSelector({
|
||||||
currentUser: selectCurrentUser,
|
currentUser: selectCurrentUser,
|
||||||
recentItems: selectRecentItems,
|
recentItems: selectRecentItems,
|
||||||
selectedHeader: selectSelectedHeader,
|
selectedHeader: selectSelectedHeader,
|
||||||
bodyshop: selectBodyshop,
|
bodyshop: selectBodyshop,
|
||||||
});
|
});
|
||||||
|
|
||||||
const mapDispatchToProps = (dispatch) => ({
|
const mapDispatchToProps = (dispatch) => ({
|
||||||
setBillEnterContext: (context) =>
|
setBillEnterContext: (context) =>
|
||||||
dispatch(setModalContext({ context: context, modal: "billEnter" })),
|
dispatch(setModalContext({context: context, modal: "billEnter"})),
|
||||||
setTimeTicketContext: (context) =>
|
setTimeTicketContext: (context) =>
|
||||||
dispatch(setModalContext({ context: context, modal: "timeTicket" })),
|
dispatch(setModalContext({context: context, modal: "timeTicket"})),
|
||||||
setPaymentContext: (context) =>
|
setPaymentContext: (context) =>
|
||||||
dispatch(setModalContext({ context: context, modal: "payment" })),
|
dispatch(setModalContext({context: context, modal: "payment"})),
|
||||||
setReportCenterContext: (context) =>
|
setReportCenterContext: (context) =>
|
||||||
dispatch(setModalContext({ context: context, modal: "reportCenter" })),
|
dispatch(setModalContext({context: context, modal: "reportCenter"})),
|
||||||
signOutStart: () => dispatch(signOutStart()),
|
signOutStart: () => dispatch(signOutStart()),
|
||||||
setCardPaymentContext: (context) =>
|
setCardPaymentContext: (context) =>
|
||||||
dispatch(setModalContext({ context: context, modal: "cardPayment" })),
|
dispatch(setModalContext({context: context, modal: "cardPayment"})),
|
||||||
});
|
});
|
||||||
|
|
||||||
function Header({
|
function Header({handleMenuClick, currentUser, bodyshop, selectedHeader, signOutStart, setBillEnterContext, setTimeTicketContext, setPaymentContext, setReportCenterContext, recentItems, setCardPaymentContext}) {
|
||||||
handleMenuClick,
|
|
||||||
currentUser,
|
|
||||||
bodyshop,
|
|
||||||
selectedHeader,
|
|
||||||
signOutStart,
|
|
||||||
setBillEnterContext,
|
|
||||||
setTimeTicketContext,
|
|
||||||
setPaymentContext,
|
|
||||||
setReportCenterContext,
|
|
||||||
recentItems,
|
|
||||||
setCardPaymentContext,
|
|
||||||
}) {
|
|
||||||
// TODO: Client Update - New Split Treatments usage example
|
|
||||||
const { treatments: {ImEXPay, DmsAp, Simple_Inventory} } = useSplitTreatments({
|
|
||||||
attributes: {},
|
|
||||||
names: ["ImEXPay", "DmsAp", "Simple_Inventory"],
|
|
||||||
splitKey: bodyshop && bodyshop.imexshopid,
|
|
||||||
});
|
|
||||||
|
|
||||||
const { t } = useTranslation();
|
const {treatments: {ImEXPay, DmsAp, Simple_Inventory}} = useSplitTreatments({
|
||||||
|
attributes: {},
|
||||||
|
names: ["ImEXPay", "DmsAp", "Simple_Inventory"],
|
||||||
|
splitKey: bodyshop && bodyshop.imexshopid,
|
||||||
|
});
|
||||||
|
|
||||||
return (
|
const {t} = useTranslation();
|
||||||
<Layout.Header>
|
|
||||||
<Menu
|
const accountingChildren = [
|
||||||
mode="horizontal"
|
{
|
||||||
//theme="light"
|
key: 'bills',
|
||||||
theme={"dark"}
|
icon: <Icon component={FaFileInvoiceDollar}/>,
|
||||||
selectedKeys={[selectedHeader]}
|
label: (<Link to="/manage/bills">{t("menus.header.bills")}</Link>)
|
||||||
onClick={handleMenuClick}
|
},
|
||||||
subMenuCloseDelay={0.3}
|
{
|
||||||
>
|
key: 'enterbills',
|
||||||
<Menu.Item key="home" icon={<HomeFilled />}>
|
icon: <Icon component={GiPayMoney}/>,
|
||||||
<Link to="/manage/">{t("menus.header.home")}</Link>
|
label: t("menus.header.enterbills"),
|
||||||
</Menu.Item>
|
onClick: () => {
|
||||||
<Menu.Item key="schedule" icon={<Icon component={FaCalendarAlt} />}>
|
setBillEnterContext({
|
||||||
<Link to="/manage/schedule">{t("menus.header.schedule")}</Link>
|
actions: {},
|
||||||
</Menu.Item>
|
context: {},
|
||||||
<Menu.SubMenu
|
|
||||||
key="jobssubmenu"
|
|
||||||
icon={<Icon component={FaCarCrash} />}
|
|
||||||
title={t("menus.header.jobs")}
|
|
||||||
>
|
|
||||||
<Menu.Item key="activejobs" icon={<FileFilled />}>
|
|
||||||
<Link to="/manage/jobs">{t("menus.header.activejobs")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item key="readyjobs" icon={<CheckCircleOutlined />}>
|
|
||||||
<Link to="/manage/jobs/ready">{t("menus.header.readyjobs")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item key="parts-queue" icon={<ToolFilled />}>
|
|
||||||
<Link to="/manage/partsqueue">{t("menus.header.parts-queue")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item key="availablejobs" icon={<ImportOutlined />}>
|
|
||||||
<Link to="/manage/available">
|
|
||||||
{t("menus.header.availablejobs")}
|
|
||||||
</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item key="newjob" icon={<FileAddOutlined />}>
|
|
||||||
<Link to="/manage/jobs/new">{t("menus.header.newjob")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Divider key="div1" />
|
|
||||||
<Menu.Item key="alljobs" icon={<UnorderedListOutlined />}>
|
|
||||||
<Link to="/manage/jobs/all">{t("menus.header.alljobs")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Divider key="div2" />
|
|
||||||
<Menu.Item key="productionlist" icon={<ScheduleOutlined />}>
|
|
||||||
<Link to="/manage/production/list">
|
|
||||||
{t("menus.header.productionlist")}
|
|
||||||
</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item key="productionboard" icon={<Icon component={BsKanban} />}>
|
|
||||||
<Link to="/manage/production/board">
|
|
||||||
{t("menus.header.productionboard")}
|
|
||||||
</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Divider key="div3" />
|
|
||||||
<Menu.Item key="scoreboard" icon={<LineChartOutlined />}>
|
|
||||||
<Link to="/manage/scoreboard">{t("menus.header.scoreboard")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
</Menu.SubMenu>
|
|
||||||
<Menu.SubMenu
|
|
||||||
key="customers"
|
|
||||||
icon={<UserOutlined />}
|
|
||||||
title={t("menus.header.customers")}
|
|
||||||
>
|
|
||||||
<Menu.Item key="owners" icon={<TeamOutlined />}>
|
|
||||||
<Link to="/manage/owners">{t("menus.header.owners")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item key="vehicles" icon={<CarFilled />}>
|
|
||||||
<Link to="/manage/vehicles">{t("menus.header.vehicles")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
</Menu.SubMenu>
|
|
||||||
<Menu.SubMenu
|
|
||||||
key="ccs"
|
|
||||||
icon={<CarFilled />}
|
|
||||||
title={t("menus.header.courtesycars")}
|
|
||||||
>
|
|
||||||
<Menu.Item key="courtesycarsall" icon={<CarFilled />}>
|
|
||||||
<Link to="/manage/courtesycars">
|
|
||||||
{t("menus.header.courtesycars-all")}
|
|
||||||
</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item key="contracts" icon={<FileFilled />}>
|
|
||||||
<Link to="/manage/courtesycars/contracts">
|
|
||||||
{t("menus.header.courtesycars-contracts")}
|
|
||||||
</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item key="newcontract" icon={<FileAddFilled />}>
|
|
||||||
<Link to="/manage/courtesycars/contracts/new">
|
|
||||||
{t("menus.header.courtesycars-newcontract")}
|
|
||||||
</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
</Menu.SubMenu>
|
|
||||||
<Menu.SubMenu
|
|
||||||
key="accounting"
|
|
||||||
icon={<DollarCircleFilled />}
|
|
||||||
title={t("menus.header.accounting")}
|
|
||||||
>
|
|
||||||
<Menu.Item
|
|
||||||
key="bills"
|
|
||||||
icon={<Icon component={FaFileInvoiceDollar} />}
|
|
||||||
>
|
|
||||||
<Link to="/manage/bills">{t("menus.header.bills")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item
|
|
||||||
key="enterbills"
|
|
||||||
icon={<Icon component={GiPayMoney} />}
|
|
||||||
onClick={() => {
|
|
||||||
setBillEnterContext({
|
|
||||||
actions: {},
|
|
||||||
context: {},
|
|
||||||
});
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{t("menus.header.enterbills")}
|
|
||||||
</Menu.Item>
|
|
||||||
{Simple_Inventory.treatment === "on" && (
|
|
||||||
<>
|
|
||||||
<Menu.Divider key="div4" />
|
|
||||||
<Menu.Item
|
|
||||||
key="inventory"
|
|
||||||
icon={<Icon component={FaFileInvoiceDollar} />}
|
|
||||||
>
|
|
||||||
<Link to="/manage/inventory">
|
|
||||||
{t("menus.header.inventory")}
|
|
||||||
</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
<Menu.Divider key="div7" />
|
|
||||||
<Menu.Item key="allpayments" icon={<BankFilled />}>
|
|
||||||
<Link to="/manage/payments">{t("menus.header.allpayments")}</Link>
|
|
||||||
</Menu.Item>
|
|
||||||
<Menu.Item
|
|
||||||
key="enterpayments"
|
|
||||||
onClick={() => {
|
|
||||||
setPaymentContext({
|
|
||||||
actions: {},
|
|
||||||
context: null,
|
|
||||||
});
|
|
||||||
}}
|
|
||||||
icon={<Icon component={FaCreditCard} />}
|
|
||||||
>
|
|
||||||
{t("menus.header.enterpayment")}
|
|
||||||
</Menu.Item>
|
|
||||||
{ImEXPay.treatment === "on" && (
|
|
||||||
<Menu.Item
|
|
||||||
key="entercardpayments"
|
|
||||||
onClick={() => {
|
|
||||||
setCardPaymentContext({
|
|
||||||
actions: {},
|
|
||||||
context: {},
|
|
||||||
});
|
});
|
||||||
}}
|
}
|
||||||
icon={<Icon component={FaCreditCard} />}
|
},
|
||||||
>
|
];
|
||||||
{t("menus.header.entercardpayment")}
|
|
||||||
</Menu.Item>
|
if (Simple_Inventory.treatment === "on") {
|
||||||
)}
|
accountingChildren.push(
|
||||||
<Menu.Divider key="div5" />
|
{
|
||||||
<Menu.Item key="timetickets" icon={<FieldTimeOutlined />}>
|
type: 'divider',
|
||||||
<Link to="/manage/timetickets">
|
},
|
||||||
{t("menus.header.timetickets")}
|
{
|
||||||
</Link>
|
key: 'inventory',
|
||||||
</Menu.Item>
|
icon: <Icon component={FaFileInvoiceDollar}/>,
|
||||||
<Menu.Item
|
label: (<Link to="/manage/inventory">{t("menus.header.inventory")}</Link>)
|
||||||
key="entertimetickets"
|
}
|
||||||
icon={<Icon component={GiPlayerTime} />}
|
);
|
||||||
onClick={() => {
|
}
|
||||||
setTimeTicketContext({
|
accountingChildren.push(
|
||||||
actions: {},
|
{
|
||||||
context: {
|
type: 'divider'
|
||||||
created_by: currentUser.displayName
|
},
|
||||||
? currentUser.email.concat(" | ", currentUser.displayName)
|
{
|
||||||
: currentUser.email,
|
key: 'allpayments',
|
||||||
|
icon: <BankFilled/>,
|
||||||
|
label: (<Link to="/manage/payments">{t("menus.header.allpayments")}</Link>)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'enterpayments',
|
||||||
|
icon: <Icon component={FaCreditCard}/>,
|
||||||
|
label: t("menus.header.enterpayment"),
|
||||||
|
onClick: () => {
|
||||||
|
setPaymentContext({
|
||||||
|
actions: {},
|
||||||
|
context: null,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
if (ImEXPay.treatment === "on") {
|
||||||
|
accountingChildren.push({
|
||||||
|
key: 'entercardpayments',
|
||||||
|
icon: <Icon component={FaCreditCard}/>,
|
||||||
|
label: t("menus.header.entercardpayment"),
|
||||||
|
onClick: () => {
|
||||||
|
setCardPaymentContext({
|
||||||
|
actions: {},
|
||||||
|
context: {},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
accountingChildren.push(
|
||||||
|
{
|
||||||
|
type: 'divider',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'timetickets',
|
||||||
|
icon: <FieldTimeOutlined/>,
|
||||||
|
label: (<Link to="/manage/timetickets">{t("menus.header.timetickets")}</Link>)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'entertimetickets',
|
||||||
|
icon: <Icon component={GiPlayerTime}/>,
|
||||||
|
label: t("menus.header.entertimeticket"),
|
||||||
|
onClick: () => {
|
||||||
|
setTimeTicketContext({
|
||||||
|
actions: {},
|
||||||
|
context: {
|
||||||
|
created_by: currentUser.displayName
|
||||||
|
? currentUser.email.concat(" | ", currentUser.displayName)
|
||||||
|
: currentUser.email,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'divider',
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
const accountingExportChildren = [
|
||||||
|
{
|
||||||
|
key: 'receivables',
|
||||||
|
label: (<Link to="/manage/accounting/receivables">{t("menus.header.accounting-receivables")}</Link>)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
if (!((bodyshop && bodyshop.cdk_dealerid) || (bodyshop && bodyshop.pbs_serialnumber)) || DmsAp.treatment === "on") {
|
||||||
|
accountingExportChildren.push({
|
||||||
|
key: 'payables',
|
||||||
|
label: (<Link to="/manage/accounting/payables">{t("menus.header.accounting-payables")}</Link>)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!(
|
||||||
|
(bodyshop && bodyshop.cdk_dealerid) ||
|
||||||
|
(bodyshop && bodyshop.pbs_serialnumber)
|
||||||
|
)) {
|
||||||
|
accountingExportChildren.push({
|
||||||
|
key: 'payments',
|
||||||
|
label: (<Link to="/manage/accounting/payments">{t("menus.header.accounting-payments")}</Link>)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
accountingExportChildren.push(
|
||||||
|
{
|
||||||
|
key: 'exportlogs',
|
||||||
|
label: (<Link to="/manage/accounting/exportlogs">{t("menus.header.export-logs")}</Link>)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'accountingexport',
|
||||||
|
icon: <ExportOutlined/>,
|
||||||
|
label: t("menus.header.export"),
|
||||||
|
children: accountingExportChildren
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
const menuItems = [
|
||||||
|
{
|
||||||
|
key: 'home',
|
||||||
|
icon: <HomeFilled/>,
|
||||||
|
label: (<Link to="/manage/">{t("menus.header.home")}</Link>)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'schedule',
|
||||||
|
icon: <Icon component={FaCalendarAlt}/>,
|
||||||
|
label: (<Link to="/manage/schedule">{t("menus.header.schedule")}</Link>)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'jobssubmenu',
|
||||||
|
icon: <Icon component={FaCarCrash}/>,
|
||||||
|
label: t("menus.header.jobs"),
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
key: 'activejobs',
|
||||||
|
icon: <FileFilled/>,
|
||||||
|
label: (<Link to="/manage/jobs">{t("menus.header.activejobs")}</Link>)
|
||||||
},
|
},
|
||||||
});
|
{
|
||||||
}}
|
key: 'readyjobs',
|
||||||
>
|
icon: <CheckCircleOutlined/>,
|
||||||
{t("menus.header.entertimeticket")}
|
label: (<Link to="/manage/jobs/ready">{t("menus.header.readyjobs")}</Link>)
|
||||||
</Menu.Item>
|
},
|
||||||
<Menu.Divider key="div6" />
|
{
|
||||||
<Menu.SubMenu
|
key: 'parts-queue',
|
||||||
key="accountingexport"
|
icon: <ToolFilled/>,
|
||||||
title={t("menus.header.export")}
|
label: (<Link to="/manage/partsqueue">{t("menus.header.parts-queue")}</Link>)
|
||||||
icon={<ExportOutlined />}
|
},
|
||||||
>
|
{
|
||||||
<Menu.Item key="receivables">
|
key: 'availablejobs',
|
||||||
<Link to="/manage/accounting/receivables">
|
icon: <ImportOutlined/>,
|
||||||
{t("menus.header.accounting-receivables")}
|
label: (<Link to="/manage/available">{t("menus.header.availablejobs")}</Link>)
|
||||||
</Link>
|
},
|
||||||
</Menu.Item>
|
{
|
||||||
{(!(
|
key: 'newjob',
|
||||||
(bodyshop && bodyshop.cdk_dealerid) ||
|
icon: <FileAddOutlined/>,
|
||||||
(bodyshop && bodyshop.pbs_serialnumber)
|
label: (<Link to="/manage/jobs/new">{t("menus.header.newjob")}</Link>)
|
||||||
) ||
|
},
|
||||||
DmsAp.treatment === "on") && (
|
{
|
||||||
<Menu.Item key="payables">
|
type: 'divider',
|
||||||
<Link to="/manage/accounting/payables">
|
},
|
||||||
{t("menus.header.accounting-payables")}
|
{
|
||||||
</Link>
|
key: 'alljobs',
|
||||||
</Menu.Item>
|
icon: <UnorderedListOutlined/>,
|
||||||
)}
|
label: (<Link to="/manage/jobs/all">{t("menus.header.alljobs")}</Link>)
|
||||||
{!(
|
},
|
||||||
(bodyshop && bodyshop.cdk_dealerid) ||
|
{
|
||||||
(bodyshop && bodyshop.pbs_serialnumber)
|
key: 'productionlist',
|
||||||
) && (
|
icon: <ScheduleOutlined/>,
|
||||||
<Menu.Item key="payments">
|
label: (<Link to="/manage/production/list">{t("menus.header.productionlist")}</Link>)
|
||||||
<Link to="/manage/accounting/payments">
|
},
|
||||||
{t("menus.header.accounting-payments")}
|
{
|
||||||
</Link>
|
key: 'productionboard',
|
||||||
</Menu.Item>
|
icon: <Icon component={BsKanban}/>,
|
||||||
)}
|
label: (<Link to="/manage/production/board">{t("menus.header.productionboard")}</Link>)
|
||||||
<Menu.Item key="export-logs">
|
},
|
||||||
<Link to="/manage/accounting/exportlogs">
|
{
|
||||||
{t("menus.header.export-logs")}
|
type: 'divider',
|
||||||
</Link>
|
},
|
||||||
</Menu.Item>
|
{
|
||||||
</Menu.SubMenu>
|
key: 'scoreboard',
|
||||||
</Menu.SubMenu>
|
icon: <LineChartOutlined/>,
|
||||||
<Menu.Item key="phonebook" icon={<PhoneOutlined />}>
|
label: (<Link to="/manage/scoreboard">{t("menus.header.scoreboard")}</Link>)
|
||||||
<Link to="/manage/phonebook">{t("menus.header.phonebook")}</Link>
|
},
|
||||||
</Menu.Item>
|
]
|
||||||
<Menu.Item key="temporarydocs" icon={<PaperClipOutlined />}>
|
},
|
||||||
<Link to="/manage/temporarydocs">
|
{
|
||||||
{t("menus.header.temporarydocs")}
|
key: 'customers',
|
||||||
</Link>
|
icon: <UserOutlined/>,
|
||||||
</Menu.Item>
|
label: t("menus.header.customers"),
|
||||||
<Menu.SubMenu
|
children: [
|
||||||
key="shopsubmenu"
|
{
|
||||||
title={t("menus.header.shop")}
|
key: 'owners',
|
||||||
icon={<SettingOutlined />}
|
icon: <TeamOutlined/>,
|
||||||
>
|
label: (<Link to="/manage/owners">{t("menus.header.owners")}</Link>)
|
||||||
<Menu.Item key="shop" icon={<Icon component={GiSettingsKnobs} />}>
|
},
|
||||||
<Link to="/manage/shop?tab=info">
|
{
|
||||||
{t("menus.header.shop_config")}
|
key: 'vehicles',
|
||||||
</Link>
|
icon: <CarFilled/>,
|
||||||
</Menu.Item>
|
label: (<Link to="/manage/vehicles">{t("menus.header.vehicles")}</Link>)
|
||||||
<Menu.Item key="dashboard" icon={<DashboardFilled />}>
|
},
|
||||||
<Link to="/manage/dashboard">{t("menus.header.dashboard")}</Link>
|
]
|
||||||
</Menu.Item>
|
},
|
||||||
<Menu.Item
|
{
|
||||||
key="reportcenter"
|
key: 'ccs',
|
||||||
icon={<BarChartOutlined />}
|
icon: <CarFilled/>,
|
||||||
onClick={() => {
|
label: t("menus.header.courtesycars"),
|
||||||
setReportCenterContext({
|
children: [
|
||||||
actions: {},
|
{
|
||||||
context: {},
|
key: 'courtesycarsall',
|
||||||
});
|
icon: <CarFilled/>,
|
||||||
}}
|
label: (<Link to="/manage/courtesycars">{t("menus.header.courtesycars-all")}</Link>)
|
||||||
>
|
},
|
||||||
{t("menus.header.reportcenter")}
|
{
|
||||||
</Menu.Item>
|
key: 'contracts',
|
||||||
<Menu.Item
|
icon: <FileFilled/>,
|
||||||
key="shop-vendors"
|
label: (<Link to="/manage/courtesycars/contracts">{t("menus.header.courtesycars-contracts")}</Link>)
|
||||||
icon={<Icon component={IoBusinessOutline} />}
|
},
|
||||||
>
|
{
|
||||||
<Link to="/manage/shop/vendors">
|
key: 'newcontract',
|
||||||
{t("menus.header.shop_vendors")}
|
icon: <FileAddFilled/>,
|
||||||
</Link>
|
label: (<Link
|
||||||
</Menu.Item>
|
to="/manage/courtesycars/contracts/new">{t("menus.header.courtesycars-newcontract")}</Link>)
|
||||||
<Menu.Item key="shop-csi" icon={<Icon component={RiSurveyLine} />}>
|
},
|
||||||
<Link to="/manage/shop/csi">{t("menus.header.shop_csi")}</Link>
|
]
|
||||||
</Menu.Item>
|
},
|
||||||
</Menu.SubMenu>
|
{
|
||||||
<Menu.SubMenu
|
key: 'accounting',
|
||||||
key="user"
|
icon: <DollarCircleFilled/>,
|
||||||
title={
|
label: t("menus.header.accounting"),
|
||||||
currentUser.displayName ||
|
children: accountingChildren,
|
||||||
currentUser.email ||
|
},
|
||||||
t("general.labels.unknown")
|
{
|
||||||
}
|
key: 'phonebook',
|
||||||
>
|
icon: <PhoneOutlined/>,
|
||||||
<Menu.Item key="signout" danger onClick={() => signOutStart()}>
|
label: (<Link to="/manage/phonebook">{t("menus.header.phonebook")}</Link>)
|
||||||
{t("user.actions.signout")}
|
},
|
||||||
</Menu.Item>
|
{
|
||||||
<Menu.Item
|
key: 'temporarydocs',
|
||||||
key="help"
|
icon: <PaperClipOutlined/>,
|
||||||
onClick={() => {
|
label: (<Link to="/manage/temporarydocs">{t("menus.header.temporarydocs")}</Link>)
|
||||||
window.open("https://help.imex.online/", "_blank");
|
},
|
||||||
}}
|
{
|
||||||
icon={<Icon component={QuestionCircleFilled} />}
|
key: 'shopsubmenu',
|
||||||
>
|
icon: <SettingOutlined/>,
|
||||||
{t("menus.header.help")}
|
label: t("menus.header.shop"),
|
||||||
</Menu.Item>
|
children: [
|
||||||
<Menu.Item
|
{
|
||||||
key="rescue"
|
key: 'shop',
|
||||||
onClick={() => {
|
icon: <Icon component={GiSettingsKnobs}/>,
|
||||||
window.open("https://imexrescue.com/", "_blank");
|
label: (<Link to="/manage/shop?tab=info">{t("menus.header.shop_config")}</Link>)
|
||||||
}}
|
},
|
||||||
>
|
{
|
||||||
{t("menus.header.rescueme")}
|
key: 'dashboard',
|
||||||
</Menu.Item>
|
icon: <DashboardFilled/>,
|
||||||
<Menu.Item key="shiftclock">
|
label: (<Link to="/manage/dashboard">{t("menus.header.dashboard")}</Link>)
|
||||||
<Link to="/manage/shiftclock">{t("menus.header.shiftclock")}</Link>
|
},
|
||||||
</Menu.Item>
|
{
|
||||||
<Menu.Item key="profile">
|
key: 'reportcenter',
|
||||||
<Link to="/manage/profile">{t("menus.currentuser.profile")}</Link>
|
icon: <BarChartOutlined/>,
|
||||||
</Menu.Item>
|
label: t("menus.header.reportcenter"),
|
||||||
{
|
onClick: () => {
|
||||||
// <Menu.SubMenu
|
setReportCenterContext({
|
||||||
// key="langselecter"
|
actions: {},
|
||||||
// title={
|
context: {},
|
||||||
// <span>
|
});
|
||||||
// <GlobalOutlined />
|
}
|
||||||
// <span>{t("menus.currentuser.languageselector")}</span>
|
},
|
||||||
// </span>
|
{
|
||||||
// }
|
key: 'shop-vendors',
|
||||||
// >
|
icon: <Icon component={IoBusinessOutline}/>,
|
||||||
// <Menu.Item actiontype="lang-select" key="en-US">
|
label: (<Link to="/manage/shop/vendors">{t("menus.header.shop_vendors")}</Link>)
|
||||||
// {t("general.languages.english")}
|
},
|
||||||
// </Menu.Item>
|
{
|
||||||
// <Menu.Item actiontype="lang-select" key="fr-CA">
|
key: 'shop-csi',
|
||||||
// {t("general.languages.french")}
|
icon: <Icon component={RiSurveyLine}/>,
|
||||||
// </Menu.Item>
|
label: (<Link to="/manage/shop/csi">{t("menus.header.shop_csi")}</Link>)
|
||||||
// <Menu.Item actiontype="lang-select" key="es-MX">
|
},
|
||||||
// {t("general.languages.spanish")}
|
]
|
||||||
// </Menu.Item>
|
},
|
||||||
// </Menu.SubMenu>
|
{
|
||||||
}
|
key: 'user',
|
||||||
</Menu.SubMenu>
|
label: (
|
||||||
<Menu.SubMenu key="recent" title={<ClockCircleFilled />}>
|
currentUser.displayName ||
|
||||||
{recentItems.map((i, idx) => (
|
currentUser.email ||
|
||||||
<Menu.Item key={idx}>
|
t("general.labels.unknown")
|
||||||
<Link to={i.url}>{i.label}</Link>
|
),
|
||||||
</Menu.Item>
|
children: [
|
||||||
))}
|
{
|
||||||
</Menu.SubMenu>
|
key: 'signout',
|
||||||
</Menu>
|
icon: <Icon component={FiLogOut}/>,
|
||||||
</Layout.Header>
|
danger: true,
|
||||||
);
|
label: t("user.actions.signout"),
|
||||||
|
onClick: () => signOutStart()
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'help',
|
||||||
|
icon: <Icon component={QuestionCircleFilled}/>,
|
||||||
|
label: t("menus.header.help"),
|
||||||
|
onClick: () => {
|
||||||
|
window.open("https://help.imex.online/", "_blank");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'rescue',
|
||||||
|
icon: <Icon component={CarFilled}/>,
|
||||||
|
label: t("menus.header.rescueme"),
|
||||||
|
onClick: () => {
|
||||||
|
window.open("https://imexrescue.com/", "_blank");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'shiftclock',
|
||||||
|
icon: <Icon component={GiPlayerTime}/>,
|
||||||
|
label: (<Link to="/manage/shiftclock">{t("menus.header.shiftclock")}</Link>)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'profile',
|
||||||
|
icon: <UserOutlined/>,
|
||||||
|
label: (<Link to="/manage/profile">{t("menus.currentuser.profile")}</Link>)
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// key: 'langselecter',
|
||||||
|
// label: t("menus.currentuser.languageselector"),
|
||||||
|
// children: [
|
||||||
|
// {
|
||||||
|
// key: 'en-US',
|
||||||
|
// label: t("general.languages.english"),
|
||||||
|
// onClick: () => {
|
||||||
|
// window.location.href = "/?lang=en-US";
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// key: 'fr-CA',
|
||||||
|
// label: t("general.languages.french"),
|
||||||
|
// onClick: () => {
|
||||||
|
// window.location.href = "/?lang=fr-CA";
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// key: 'es-MX',
|
||||||
|
// label: t("general.languages.spanish"),
|
||||||
|
// onClick: () => {
|
||||||
|
// window.location.href = "/?lang=es-MX";
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// ]
|
||||||
|
// },
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'recent',
|
||||||
|
icon: <ClockCircleFilled/>,
|
||||||
|
children: recentItems.map((i, idx) => ({
|
||||||
|
key: idx,
|
||||||
|
label: (<Link to={i.url}>{i.label}</Link>)
|
||||||
|
|
||||||
|
})),
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Layout.Header>
|
||||||
|
<Menu
|
||||||
|
mode="horizontal"
|
||||||
|
//theme="light"
|
||||||
|
theme={"dark"}
|
||||||
|
selectedKeys={[selectedHeader]}
|
||||||
|
onClick={handleMenuClick}
|
||||||
|
subMenuCloseDelay={0.3}
|
||||||
|
items={menuItems}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</Layout.Header>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export default connect(mapStateToProps, mapDispatchToProps)(Header);
|
export default connect(mapStateToProps, mapDispatchToProps)(Header);
|
||||||
|
|||||||
@@ -54,7 +54,7 @@ export function ScheduleEventColor({ bodyshop, event }) {
|
|||||||
label: color.label,
|
label: color.label,
|
||||||
style: { color: color.color.hex },
|
style: { color: color.color.hex },
|
||||||
})),
|
})),
|
||||||
{ key: "divider", label: <hr />, disabled: true },
|
{ type: "divider" },
|
||||||
{ key: "null", label: t("general.actions.clear") },
|
{ key: "null", label: t("general.actions.clear") },
|
||||||
]
|
]
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -416,7 +416,7 @@ export function JobLinesComponent({
|
|||||||
{ key: "PAN", label: t("joblines.fields.part_types.PAN") },
|
{ key: "PAN", label: t("joblines.fields.part_types.PAN") },
|
||||||
{ key: "PAL", label: t("joblines.fields.part_types.PAL") },
|
{ key: "PAL", label: t("joblines.fields.part_types.PAL") },
|
||||||
{ key: "PAS", label: t("joblines.fields.part_types.PAS") },
|
{ key: "PAS", label: t("joblines.fields.part_types.PAS") },
|
||||||
{ key: "divider", label: <hr />, disabled: true },
|
{ type: 'divider' },
|
||||||
{ key: "clear", label: t("general.labels.clear") },
|
{ key: "clear", label: t("general.labels.clear") },
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -89,7 +89,7 @@ export function JobsChangeStatus({ job, bodyshop, jobRO, insertAuditTrail }) {
|
|||||||
})),
|
})),
|
||||||
...(job.converted
|
...(job.converted
|
||||||
? [
|
? [
|
||||||
{ key: "divider", label: <hr />, disabled: true },
|
{ type: "divider" },
|
||||||
...otherStages.map((item) => ({
|
...otherStages.map((item) => ({
|
||||||
key: item,
|
key: item,
|
||||||
label: item,
|
label: item,
|
||||||
|
|||||||
Reference in New Issue
Block a user