PRDONE-94: updated dashboards, new styles everywhere, moved 90% of codes we are using under qqq directory

2025-07-19 05:40:44 +00:00 · 2022-09-01 16:19:03 -05:00
parent b8cc274af4
commit 7b3dca9843
170 changed files with 11114 additions and 141 deletions
--- a/src/qqq/pages/dashboards/Widgets/ShipmentsByWarehouse.tsx
+++ b/src/qqq/pages/dashboards/Widgets/ShipmentsByWarehouse.tsx
@ -0,0 +1,128 @@
+/*
+ * QQQ - Low-code Application Framework for Engineers.
+ * Copyright (C) 2021-2022.  Kingsrook, LLC
+ * 651 N Broad St Ste 205 # 6917 | Middletown DE 19709 | United States
+ * contact@kingsrook.com
+ * https://github.com/Kingsrook/
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import Card from "@mui/material/Card";
+import Grid from "@mui/material/Grid";
+import Icon from "@mui/material/Icon";
+import {VectorMap} from "@react-jvectormap/core";
+import {usAea} from "@react-jvectormap/unitedstates";
+import MDBox from "qqq/components/Temporary/MDBox";
+import MDTypography from "qqq/components/Temporary/MDTypography";
+import ShipmentsByWarehouseTable from "qqq/pages/dashboards/Tables/ShipmentsByWarehouseTable";
+import shipmentsByWarehouseData from "qqq/pages/dashboards/Widgets/Data/ShipmentsByWarehouseData";
+
+function ShipmentsByWarehouseData(): JSX.Element
+{
+   return (
+      <Card sx={{width: "100%"}}>
+         <MDBox display="flex">
+            <MDBox
+               display="flex"
+               justifyContent="center"
+               alignItems="center"
+               width="4rem"
+               height="4rem"
+               variant="gradient"
+               bgColor="info"
+               color="white"
+               shadow="md"
+               borderRadius="xl"
+               ml={3}
+               mt={-2}
+            >
+               <Icon fontSize="medium" color="inherit">
+                  warehouse
+               </Icon>
+            </MDBox>
+            <MDTypography variant="h6" sx={{mt: 2, mb: 1, ml: 2}}>
+               Shipments by Warehouse
+            </MDTypography>
+         </MDBox>
+         <MDBox p={2}>
+            <Grid container>
+               <Grid item xs={12} md={7} lg={6}>
+                  <ShipmentsByWarehouseTable rows={shipmentsByWarehouseData} shadow={false} />
+               </Grid>
+               <Grid item xs={12} md={5} lg={6} sx={{mt: {xs: 5, lg: 0}}}>
+                  <VectorMap
+                     map={usAea}
+                     zoomOnScroll={false}
+                     zoomButtons={false}
+                     markersSelectable
+                     backgroundColor="transparent"
+                     markers={[
+                        {
+                           name: "edison",
+                           latLng: [40.5274, -74.3933],
+                        },
+                        {
+                           name: "stockton",
+                           latLng: [37.975556, -121.300833],
+                        },
+                        {
+                           name: "patterson",
+                           latLng: [37.473056, -121.132778],
+                        },
+                     ]}
+                     regionStyle={{
+                        initial: {
+                           fill: "#dee2e7",
+                           "fill-opacity": 1,
+                           stroke: "none",
+                           "stroke-width": 0,
+                           "stroke-opacity": 0,
+                        },
+                     }}
+                     markerStyle={{
+                        initial: {
+                           fill: "#e91e63",
+                           stroke: "#ffffff",
+                           "stroke-width": 5,
+                           "stroke-opacity": 0.5,
+                           r: 7,
+                        },
+                        hover: {
+                           fill: "E91E63",
+                           stroke: "#ffffff",
+                           "stroke-width": 5,
+                           "stroke-opacity": 0.5,
+                        },
+                        selected: {
+                           fill: "E91E63",
+                           stroke: "#ffffff",
+                           "stroke-width": 5,
+                           "stroke-opacity": 0.5,
+                        },
+                     }}
+                     style={{
+                        marginTop: "-1.5rem",
+                     }}
+                     onRegionTipShow={() => false}
+                     onMarkerTipShow={() => false}
+                  />
+               </Grid>
+            </Grid>
+         </MDBox>
+      </Card>
+   );
+}
+
+export default ShipmentsByWarehouseData;