515 lines
20 KiB
JavaScript
515 lines
20 KiB
JavaScript
import {FloatButton, Layout, Spin} from "antd";
|
|
// import preval from "preval.macro";
|
|
import React, {lazy, Suspense, useEffect, useState} from "react";
|
|
import {useTranslation} from "react-i18next";
|
|
import {connect} from "react-redux";
|
|
import {Link, Route, Routes} from "react-router-dom";
|
|
import {createStructuredSelector} from "reselect";
|
|
import BreadCrumbs from "../../components/breadcrumbs/breadcrumbs.component";
|
|
import ChatAffixContainer from "../../components/chat-affix/chat-affix.container";
|
|
import ConflictComponent from "../../components/conflict/conflict.component";
|
|
import ErrorBoundary from "../../components/error-boundary/error-boundary.component";
|
|
//import FooterComponent from "../../components/footer/footer.component";
|
|
//Component Imports
|
|
import HeaderContainer from "../../components/header/header.container";
|
|
import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
|
|
import PartnerPingComponent from "../../components/partner-ping/partner-ping.component";
|
|
import PrintCenterModalContainer from "../../components/print-center-modal/print-center-modal.container";
|
|
import ShopSubStatusComponent from "../../components/shop-sub-status/shop-sub-status.component";
|
|
import TestComponent from "../../components/_test/test.page";
|
|
import {requestForToken} from "../../firebase/firebase.utils";
|
|
import {selectBodyshop, selectInstanceConflict,} from "../../redux/user/user.selectors";
|
|
import * as Sentry from "@sentry/react";
|
|
|
|
import "./manage.page.styles.scss";
|
|
import UpdateAlert from "../../components/update-alert/update-alert.component";
|
|
import InstanceRenderManager from "../../utils/instanceRenderMgr.js";
|
|
|
|
const JobsPage = lazy(() => import("../jobs/jobs.page"));
|
|
|
|
const CardPaymentModalContainer = lazy(() =>
|
|
import("../../components/card-payment-modal/card-payment-modal.container.")
|
|
);
|
|
|
|
const JobsDetailPage = lazy(() =>
|
|
import("../jobs-detail/jobs-detail.page.container")
|
|
);
|
|
const InventoryListPage = lazy(() => import("../inventory/inventory.page"));
|
|
const ProfilePage = lazy(() => import("../profile/profile.container.page"));
|
|
const JobsAvailablePage = lazy(() =>
|
|
import("../jobs-available/jobs-available.page.container")
|
|
);
|
|
const ScheduleContainer = lazy(() =>
|
|
import("../schedule/schedule.page.container")
|
|
);
|
|
const VehiclesContainer = lazy(() =>
|
|
import("../vehicles/vehicles.page.container")
|
|
);
|
|
const VehiclesDetailContainer = lazy(() =>
|
|
import("../vehicles-detail/vehicles-detail.page.container")
|
|
);
|
|
const OwnersContainer = lazy(() => import("../owners/owners.page.container"));
|
|
const OwnersDetailContainer = lazy(() =>
|
|
import("../owners-detail/owners-detail.page.container")
|
|
);
|
|
const ShopPage = lazy(() => import("../shop/shop.page.component"));
|
|
const ShopVendorPageContainer = lazy(() =>
|
|
import("../shop-vendor/shop-vendor.page.container")
|
|
);
|
|
const EmailOverlayContainer = lazy(() =>
|
|
import("../../components/email-overlay/email-overlay.container.jsx")
|
|
);
|
|
const JobsCreateContainerPage = lazy(() =>
|
|
import("../jobs-create/jobs-create.container")
|
|
);
|
|
const CourtesyCarCreateContainer = lazy(() =>
|
|
import("../courtesy-car-create/courtesy-car-create.page.container")
|
|
);
|
|
const CourtesyCarDetailContainer = lazy(() =>
|
|
import("../courtesy-car-detail/courtesy-car-detail.page.container")
|
|
);
|
|
const CourtesyCarsPage = lazy(() =>
|
|
import("../courtesy-cars/courtesy-cars.page.container")
|
|
);
|
|
const ContractCreatePage = lazy(() =>
|
|
import("../contract-create/contract-create.page.container")
|
|
);
|
|
const ContractDetailPage = lazy(() =>
|
|
import("../contract-detail/contract-detail.page.container")
|
|
);
|
|
const ContractsList = lazy(() =>
|
|
import("../contracts/contracts.page.container")
|
|
);
|
|
const BillsListPage = lazy(() => import("../bills/bills.page.container"));
|
|
|
|
const JobCostingModal = lazy(() =>
|
|
import("../../components/job-costing-modal/job-costing-modal.container")
|
|
);
|
|
const ReportCenterModal = lazy(() =>
|
|
import("../../components/report-center-modal/report-center-modal.container")
|
|
);
|
|
const BillEnterModalContainer = lazy(() =>
|
|
import("../../components/bill-enter-modal/bill-enter-modal.container")
|
|
);
|
|
const TimeTicketModalContainer = lazy(() =>
|
|
import("../../components/time-ticket-modal/time-ticket-modal.container")
|
|
);
|
|
const TimeTicketModalTask = lazy(() =>
|
|
import(
|
|
"../../components/time-ticket-task-modal/time-ticket-task-modal.container"
|
|
)
|
|
);
|
|
const PaymentModalContainer = lazy(() =>
|
|
import("../../components/payment-modal/payment-modal.container")
|
|
);
|
|
const ProductionListPage = lazy(() =>
|
|
import("../production-list/production-list.container")
|
|
);
|
|
const ProductionBoardPage = lazy(() =>
|
|
import("../production-board/production-board.container")
|
|
);
|
|
// const ShopTemplates = lazy(() =>
|
|
// import("../shop-templates/shop-templates.container")
|
|
// );
|
|
const JobIntake = lazy(() =>
|
|
import("../jobs-intake/jobs-intake.page.container")
|
|
);
|
|
const JobChecklistView = lazy(() =>
|
|
import("../jobs-checklist-view/jobs-checklist-view.page")
|
|
);
|
|
const JobDeliver = lazy(() =>
|
|
import("../jobs-deliver/jobs-delivery.page.container")
|
|
);
|
|
const AccountingQboCallback = lazy(() =>
|
|
import("../accounting-qbo/accounting-qbo.page")
|
|
);
|
|
const AccountingReceivables = lazy(() =>
|
|
import("../accounting-receivables/accounting-receivables.container")
|
|
);
|
|
const AccountingPayables = lazy(() =>
|
|
import("../accounting-payables/accounting-payables.container")
|
|
);
|
|
const AccountingPayments = lazy(() =>
|
|
import("../accounting-payments/accounting-payments.container")
|
|
);
|
|
const AllJobs = lazy(() => import("../jobs-all/jobs-all.container"));
|
|
const ReadyJobs = lazy(() => import("../jobs-ready/jobs-ready.page"));
|
|
const JobsClose = lazy(() => import("../jobs-close/jobs-close.container"));
|
|
const JobsAdmin = lazy(() => import("../jobs-admin/jobs-admin.page"));
|
|
const TempDocs = lazy(() =>
|
|
import("../temporary-docs/temporary-docs.container")
|
|
);
|
|
|
|
const ShopCsiPageContainer = lazy(() =>
|
|
import("../shop-csi/shop-csi.container.page")
|
|
);
|
|
const PaymentsAll = lazy(() =>
|
|
import("../payments-all/payments-all.container.page")
|
|
);
|
|
const ShiftClock = lazy(() => import("../shift-clock/shift-clock.page"));
|
|
const Scoreboard = lazy(() =>
|
|
import("../scoreboard/scoreboard.page.container")
|
|
);
|
|
const TimeTicketsAll = lazy(() =>
|
|
import("../time-tickets/time-tickets.container")
|
|
);
|
|
const Help = lazy(() => import("../help/help.page"));
|
|
const PartsQueue = lazy(() =>
|
|
import("../parts-queue/parts-queue.page.container")
|
|
);
|
|
const ExportLogs = lazy(() =>
|
|
import("../export-logs/export-logs.page.container")
|
|
);
|
|
const Phonebook = lazy(() => import("../phonebook/phonebook.page.container"));
|
|
|
|
const EmailTest = lazy(() =>
|
|
import("../../components/email-test/email-test-component")
|
|
);
|
|
const Dashboard = lazy(() => import("../dashboard/dashboard.container"));
|
|
const Dms = lazy(() => import("../dms/dms.container"));
|
|
const DmsPayables = lazy(() =>
|
|
import("../dms-payables/dms-payables.container")
|
|
);
|
|
const ManageRootPage = lazy(() =>
|
|
import("../manage-root/manage-root.page.container")
|
|
);
|
|
const TtApprovals = lazy(() =>
|
|
import("../tt-approvals/tt-approvals.page.container")
|
|
);
|
|
|
|
const {Content, Footer} = Layout;
|
|
|
|
const mapStateToProps = createStructuredSelector({
|
|
conflict: selectInstanceConflict,
|
|
bodyshop: selectBodyshop,
|
|
});
|
|
|
|
export function Manage({conflict, bodyshop}) {
|
|
const {t} = useTranslation();
|
|
const [chatVisible] = useState(false);
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
const widgetId = InstanceRenderManager({ imex:"IABVNO4scRKY11XBQkNr" ,rome: "mQdqARMzkZRUVugJ6TdS"}) ;
|
|
window.noticeable.render("widget", widgetId);
|
|
requestForToken().catch((error) => {
|
|
console.error(`Unable to request for token.`, error)
|
|
});
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
document.title = InstanceRenderManager({imex: t("titles.imexonline"), rome: t("titles.romeonline"), promanager:t("titles.promanager")});
|
|
}, [t]);
|
|
const AppRouteTable = (
|
|
<Suspense
|
|
fallback={<LoadingSpinner message={t("general.labels.loadingapp",{app: InstanceRenderManager({imex:'$t(titles.imexonline)', rome: '$t(titles.romeonline)', promanager: '$t(titles.promanager)'})})}/>} This
|
|
>
|
|
<PaymentModalContainer/>
|
|
|
|
<CardPaymentModalContainer/>
|
|
|
|
<BreadCrumbs/>
|
|
<BillEnterModalContainer/>
|
|
<JobCostingModal/>
|
|
<ReportCenterModal/>
|
|
<EmailOverlayContainer/>
|
|
<TimeTicketModalContainer/>
|
|
<TimeTicketModalTask/>
|
|
<PrintCenterModalContainer/>
|
|
<Routes>
|
|
<Route path='/_test' element={<TestComponent/>}/>
|
|
<Route path='/' element={<ManageRootPage/>}/>
|
|
<Route path='/jobs' element={
|
|
<Suspense fallback={<Spin/>}>
|
|
<JobsPage/>
|
|
</Suspense>
|
|
}/>
|
|
<Route
|
|
path='/jobs/:jobId/intake'
|
|
element={ <Suspense fallback={<Spin/>}>
|
|
<JobIntake/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/jobs/:jobId/deliver'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<JobDeliver/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/jobs/:jobId/checklist'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<JobChecklistView/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/jobs/:jobId/close'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<JobsClose/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/jobs/:jobId/admin'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<JobsAdmin/>
|
|
</Suspense>}
|
|
/>
|
|
<Route path='/jobs/all' element={<Suspense fallback={<Spin/>}>
|
|
<AllJobs/>
|
|
</Suspense>}/>
|
|
<Route path='/jobs/ready' element={<Suspense fallback={<Spin/>}>
|
|
<ReadyJobs/>
|
|
</Suspense>}/>
|
|
<Route
|
|
path='/jobs/new'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<JobsCreateContainerPage/>
|
|
</Suspense>}
|
|
/>
|
|
<Route path='/jobs/:jobId' element={<Suspense fallback={<Spin/>}>
|
|
<JobsDetailPage/>
|
|
</Suspense>}/>
|
|
<Route path='/temporarydocs/' element={<Suspense fallback={<Spin/>}>
|
|
<TempDocs/>
|
|
</Suspense>}/>
|
|
<Route
|
|
path='/inventory/'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<InventoryListPage/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/courtesycars/'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<CourtesyCarsPage/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/courtesycars/new'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<CourtesyCarCreateContainer/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/courtesycars/contracts'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<ContractsList/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/courtesycars/contracts/new'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<ContractCreatePage/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/courtesycars/contracts/:contractId'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<ContractDetailPage/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/courtesycars/:ccId'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<CourtesyCarDetailContainer/>
|
|
</Suspense>}
|
|
/>
|
|
<Route path='/profile' element={<Suspense fallback={<Spin/>}>
|
|
<ProfilePage/>
|
|
</Suspense>}/>
|
|
<Route
|
|
path='/vehicles'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<VehiclesContainer/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/production/list'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<ProductionListPage/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/production/board'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<ProductionBoardPage/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/vehicles/:vehId'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<VehiclesDetailContainer/>
|
|
</Suspense>}
|
|
/>
|
|
<Route path='/bills' element={<Suspense fallback={<Spin/>}>
|
|
<BillsListPage/>
|
|
</Suspense>}/>
|
|
<Route path='/owners' element={<Suspense fallback={<Spin/>}>
|
|
<OwnersContainer/>
|
|
</Suspense>}/>
|
|
<Route
|
|
path='/owners/:ownerId'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<OwnersDetailContainer/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/schedule'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<ScheduleContainer/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/available'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<JobsAvailablePage/>
|
|
</Suspense>}
|
|
/>
|
|
<Route path='/shop' element={<Suspense fallback={<Spin/>}>
|
|
<ShopPage/>
|
|
</Suspense>}/>
|
|
{
|
|
// <Route
|
|
// path='/shop/templates'
|
|
// element={<ShopTemplates />}
|
|
// />
|
|
}
|
|
<Route
|
|
path='/shop/vendors'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<ShopVendorPageContainer/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/shop/csi'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<ShopCsiPageContainer/>
|
|
</Suspense>}
|
|
/>
|
|
|
|
<Route
|
|
path='/accounting/qbo'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<AccountingQboCallback/>
|
|
</Suspense>}
|
|
/>
|
|
|
|
<Route
|
|
path='/accounting/receivables'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<AccountingReceivables/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/accounting/payables'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<AccountingPayables/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/accounting/payments'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<AccountingPayments/>
|
|
</Suspense>}
|
|
/>
|
|
<Route
|
|
path='/accounting/exportlogs'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<ExportLogs/>
|
|
</Suspense>}
|
|
/>
|
|
<Route path='/ttapprovals' element={<Suspense fallback={<Spin/>}>
|
|
<TtApprovals/>
|
|
</Suspense>}/>
|
|
<Route path='/partsqueue' element={<Suspense fallback={<Spin/>}>
|
|
<PartsQueue/>
|
|
</Suspense>}/>
|
|
<Route path='/phonebook' element={<Suspense fallback={<Spin/>}>
|
|
<Phonebook/>
|
|
</Suspense>}/>
|
|
|
|
<Route path='/payments' element={<Suspense fallback={<Spin/>}>
|
|
<PaymentsAll/>
|
|
</Suspense>}/>
|
|
<Route path='/shiftclock' element={<Suspense fallback={<Spin/>}>
|
|
<ShiftClock/>
|
|
</Suspense>}/>
|
|
<Route path='/scoreboard' element={<Suspense fallback={<Spin/>}>
|
|
<Scoreboard/>
|
|
</Suspense>}/>
|
|
<Route
|
|
path='/timetickets'
|
|
element={<Suspense fallback={<Spin/>}>
|
|
<TimeTicketsAll/>
|
|
</Suspense>}
|
|
/>
|
|
<Route path='/help' element={<Suspense fallback={<Spin/>}>
|
|
<Help/>
|
|
</Suspense>}/>
|
|
<Route path='/emailtest' element={<EmailTest/>}/>
|
|
<Route path='/dashboard' element={<Suspense fallback={<Spin/>}>
|
|
<Dashboard/>
|
|
</Suspense>}/>
|
|
<Route path='/dms' element={<Suspense fallback={<Spin/>}>
|
|
<Dms/>
|
|
</Suspense>}/>
|
|
<Route path='/dmsap' element={<Suspense fallback={<Spin/>}>
|
|
<DmsPayables/>
|
|
</Suspense>}/>
|
|
</Routes>
|
|
</Suspense>
|
|
);
|
|
|
|
let PageContent;
|
|
|
|
if (conflict) PageContent = <ConflictComponent/>;
|
|
else if (bodyshop && bodyshop.sub_status !== "active")
|
|
PageContent = <ShopSubStatusComponent/>;
|
|
else PageContent = AppRouteTable;
|
|
|
|
return (
|
|
<>
|
|
<ChatAffixContainer bodyshop={bodyshop} chatVisible={chatVisible}/>
|
|
<Layout style={{minHeight: '100vh'}} className="layout-container">
|
|
<UpdateAlert/>
|
|
<HeaderContainer/>
|
|
<Content className="content-container">
|
|
<PartnerPingComponent/>
|
|
<Sentry.ErrorBoundary fallback={<ErrorBoundary/>} showDialog>
|
|
{PageContent}
|
|
</Sentry.ErrorBoundary>
|
|
|
|
<FloatButton.BackTop style={{right: 100, bottom: 25}}/>
|
|
|
|
</Content>
|
|
<Footer>
|
|
<div
|
|
style={{
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
margin: "1rem 0rem",
|
|
}}
|
|
>
|
|
<div style={{display: "flex"}}>
|
|
<div>
|
|
{`${InstanceRenderManager({imex: t("titles.imexonline"), rome: t("titles.romeonline"), promanager:t("titles.promanager")})} ${
|
|
import.meta.env.VITE_APP_GIT_SHA || 'Local Build'
|
|
} - ${import.meta.env.VITE_APP_GIT_SHA_DATE}`}
|
|
</div>
|
|
<div id="noticeable-widget" style={{marginLeft: "1rem"}}/>
|
|
</div>
|
|
<Link to="/disclaimer" target="_blank" style={{color: "#ccc"}}>
|
|
Disclaimer & Notices
|
|
</Link>
|
|
</div>
|
|
</Footer>
|
|
</Layout>
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default connect(mapStateToProps, null)(Manage);
|