@seedtactics/insight-client 16.4.0

package/dist/components/operations/CompletedParts.js

@@ -0,0 +1,286 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/* Copyright (c) 2025, John Lenz
+
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+    * Redistributions of source code must retain the above copyright
+      notice, this list of conditions and the following disclaimer.
+
+    * Redistributions in binary form must reproduce the above
+      copyright notice, this list of conditions and the following
+      disclaimer in the documentation and/or other materials provided
+      with the distribution.
+
+    * Neither the name of John Lenz, Black Maple Software, SeedTactics,
+      nor the names of other contributors may be used to endorse or
+      promote products derived from this software without specific
+      prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+import { memo, useMemo, useState } from "react";
+import { Box, Button, Stack, TableSortLabel, IconButton, Tooltip, Typography, Table, TableRow, TableCell, TableHead, TableBody, Toolbar, Select, MenuItem, InputBase, styled, } from "@mui/material";
+import { MaterialDialog, PartIdenticon } from "../station-monitor/Material.js";
+import { FirstPage as FirstPageIcon, KeyboardArrowLeft, KeyboardArrowRight, LastPage as LastPageIcon, KeyboardArrowDown as KeyboardArrowDownIcon, KeyboardArrowUp as KeyboardArrowUpIcon, ImportExport, MoreHoriz, Check, ErrorOutline, SavedSearch, HelpOutline, } from "@mui/icons-material";
+import { Collapse } from "@mui/material";
+import { LazySeq, mkCompareByProperties } from "@seedtactics/immutable-collections";
+import { AppLink, RouteLocation, useSetTitle } from "../routes.js";
+import { materialDialogOpen, materialInDialogInfo, useCompleteCloseout, } from "../../cell-status/material-details.js";
+import copy from "copy-to-clipboard";
+import { useAtomValue, useSetAtom } from "jotai";
+import { SelectWorkorderDialog, selectWorkorderDialogOpen } from "../station-monitor/SelectWorkorder.js";
+import { last30PartSummary, last30PartSummaryRange } from "../../data/part-summary.js";
+import { Last30ChartRangeToolbar } from "./ChartRangeEdit.js";
+const numFormat = new Intl.NumberFormat(undefined, { maximumFractionDigits: 1 });
+const partColCount = 6;
+function sortPartSummary(parts, col, order) {
+    let sortCol;
+    switch (col) {
+        case "PartName":
+            sortCol = (j) => j.part;
+            break;
+        case "CompletedQty":
+            sortCol = (j) => j.completedQty;
+            break;
+        case "AbnormalQty":
+            sortCol = (j) => j.abnormalQty;
+            break;
+        case "Workorders":
+            sortCol = (j) => j.workorders.lookupMin()?.[0] ?? null;
+            break;
+        case "Elapsed":
+            sortCol = (j) => j.stationMins
+                .toAscLazySeq()
+                .filter(([_, stat]) => !stat.isLoadUnload)
+                .sumBy(([, t]) => t.elapsed);
+            break;
+        case "Active":
+            sortCol = (j) => j.stationMins
+                .toAscLazySeq()
+                .filter(([_, stat]) => !stat.isLoadUnload)
+                .sumBy(([_, t]) => t.active);
+            break;
+        case "Median":
+            sortCol = (j) => j.stationMins
+                .toAscLazySeq()
+                .filter(([_, stat]) => !stat.isLoadUnload)
+                .sumBy(([_, t]) => t.medianElapsed);
+            break;
+    }
+    const sorted = [...parts];
+    sorted.sort(mkCompareByProperties(order === "asc" ? { asc: sortCol } : { desc: sortCol }));
+    return sorted;
+}
+const completedDateFormat = new Intl.DateTimeFormat(undefined, {
+    month: "short",
+    day: "numeric",
+    hour: "numeric",
+    minute: "2-digit",
+});
+function sortMaterial(material, col, order) {
+    let sortCol;
+    switch (col) {
+        case "Serial":
+            sortCol = (j) => j.serial ?? null;
+            break;
+        case "CompletedDate":
+            sortCol = (j) => j.last_unload_time ?? null;
+            break;
+        case "Workorder":
+            sortCol = (j) => j.workorderId ?? null;
+            break;
+        case "Quarantined":
+            sortCol = (j) => j.currently_quarantined ?? null;
+            break;
+        case "InspectFailed":
+            sortCol = (j) => LazySeq.ofObject(j.completedInspections ?? {}).some(([, insp]) => insp.success === false) ? -1 : 0;
+            break;
+        case "CloseOut":
+            sortCol = (j) => (j.closeout_failed === undefined ? 1 : j.closeout_failed === true ? -1 : 0);
+            break;
+    }
+    const sorted = [...material];
+    sorted.sort(mkCompareByProperties(order === "asc" ? { asc: sortCol } : { desc: sortCol }));
+    return sorted;
+}
+function SortColHeader(props) {
+    return (_jsxs(TableCell, { align: props.align, sortDirection: props.sortBy === props.col ? props.order : false, sx: props.noWhitespaceWrap ? { whiteSpace: "nowrap" } : undefined, children: [_jsx(Tooltip, { title: "Sort", enterDelay: 300, children: _jsx(TableSortLabel, { active: props.sortBy === props.col, direction: props.order, onClick: () => {
+                        if (props.col === props.sortBy) {
+                            props.setOrder(props.order === "asc" ? "desc" : "asc");
+                        }
+                        else {
+                            props.setSortBy(props.col);
+                            props.setOrder("asc");
+                        }
+                    }, children: props.children }) }), props.extraIcon] }));
+}
+const WorkorderLink = memo(function WorkorderLink({ workorderId, }) {
+    if (!workorderId || workorderId === "") {
+        return _jsx("span", {});
+    }
+    else {
+        return (_jsx(AppLink, { to: { route: RouteLocation.Operations_CurrentWorkorders, workorder: workorderId }, children: workorderId }));
+    }
+});
+function MaterialTable({ material }) {
+    const setMatToShow = useSetAtom(materialDialogOpen);
+    const [sortCol, setSortCol] = useState("Serial");
+    const [order, setOrder] = useState("asc");
+    const sortedMats = useMemo(() => sortMaterial(material, sortCol, order), [material, sortCol, order]);
+    const sort = {
+        sortBy: sortCol,
+        setSortBy: setSortCol,
+        order: order,
+        setOrder: setOrder,
+    };
+    const [rowsPerPage, setRowsPerPage] = useState(10);
+    const [page, setPage] = useState(0);
+    const curPage = sortedMats.slice(page * rowsPerPage, (page + 1) * rowsPerPage);
+    return (_jsxs(_Fragment, { children: [_jsxs(Table, { size: "small", children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(SortColHeader, { col: "Serial", ...sort, children: "Serial" }), _jsx(SortColHeader, { col: "CompletedDate", ...sort, children: "Completed" }), _jsx(SortColHeader, { col: "Workorder", ...sort, children: "Workorder" }), _jsx(SortColHeader, { col: "Quarantined", ...sort, children: "Quarantine?" }), _jsx(SortColHeader, { col: "InspectFailed", noWhitespaceWrap: true, ...sort, children: "Inspect Failed?" }), _jsx(SortColHeader, { col: "CloseOut", noWhitespaceWrap: true, ...sort, children: "Close Out" }), _jsx(TableCell, { padding: "checkbox" })] }) }), _jsxs(TableBody, { children: [curPage.map((s) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: s.serial ?? "" }), _jsx(TableCell, { children: s.last_unload_time ? completedDateFormat.format(s.last_unload_time) : "" }), _jsx(TableCell, { children: _jsx(WorkorderLink, { workorderId: s.workorderId }) }), _jsx(TableCell, { sx: { textAlign: "center" }, padding: "checkbox", children: s.currently_quarantined ? _jsx(SavedSearch, { fontSize: "inherit" }) : "" }), _jsx(TableCell, { sx: { textAlign: "center" }, padding: "checkbox", children: LazySeq.ofObject(s.completedInspections ?? {}).some(([, insp]) => insp.success === false) ? (_jsx(ErrorOutline, { fontSize: "inherit" })) : ("") }), _jsx(TableCell, { sx: { textAlign: "center" }, padding: "checkbox", children: s.closeout_completed === undefined ? ("") : s.closeout_failed === false ? (_jsx(Check, { fontSize: "inherit" })) : (_jsx(ErrorOutline, { fontSize: "inherit" })) }), _jsx(TableCell, { padding: "checkbox", children: _jsx(IconButton, { onClick: () => setMatToShow({
+                                                type: "MatSummary",
+                                                summary: s,
+                                            }), size: "large", children: _jsx(MoreHoriz, { fontSize: "inherit" }) }) })] }, s.materialID))), LazySeq.ofRange(0, rowsPerPage - curPage.length).map((i) => (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 7, children: "\u00A0" }) }, i)))] })] }), _jsxs(Toolbar, { variant: "dense", sx: { mb: "0.5em" }, children: [_jsx(Typography, { color: "textSecondary", variant: "caption", children: "Rows per page:" }), _jsx(Select, { style: { marginLeft: 8, marginRight: "1em" }, value: rowsPerPage, SelectDisplayProps: { style: { color: "rgba(0, 0, 0, 0.54)" } }, input: _jsx(InputBase, {}), onChange: (evt) => {
+                            const rpp = evt.target.value;
+                            setRowsPerPage(rpp);
+                            const maxPage = Math.ceil(material.length / rpp) - 1;
+                            if (page > maxPage) {
+                                setPage(maxPage);
+                            }
+                        }, children: [10, 15, 20, 50].map((rowsPerPageOption) => (_jsx(MenuItem, { value: rowsPerPageOption, children: rowsPerPageOption }, rowsPerPageOption))) }), _jsx(Typography, { color: "textSecondary", variant: "caption", children: `${material.length === 0 ? 0 : page * rowsPerPage + 1}-${Math.min(material.length, (page + 1) * rowsPerPage)} of ${material.length}` }), _jsx(IconButton, { onClick: () => setPage(0), disabled: page === 0, "aria-label": "First Page", size: "large", children: _jsx(FirstPageIcon, {}) }), _jsx(IconButton, { onClick: () => setPage(page - 1), disabled: page === 0, "aria-label": "Previous Page", size: "large", children: _jsx(KeyboardArrowLeft, {}) }), _jsx(IconButton, { onClick: () => setPage(page + 1), disabled: page >= Math.ceil(material.length / rowsPerPage) - 1, "aria-label": "Next Page", size: "large", children: _jsx(KeyboardArrowRight, {}) }), _jsx(IconButton, { onClick: () => setPage(Math.max(0, Math.ceil(material.length / rowsPerPage) - 1)), disabled: page >= Math.ceil(material.length / rowsPerPage) - 1, "aria-label": "Last Page", size: "large", children: _jsx(LastPageIcon, {}) })] })] }));
+}
+const PartDetails = memo(function PartDetails({ part }) {
+    return (_jsxs(Stack, { direction: "row", flexWrap: "wrap", justifyContent: "space-around", ml: "1em", mr: "1em", children: [_jsx(Box, { sx: { width: "60em", overflow: "auto" }, children: _jsx(MaterialTable, { material: part.mats }) }), _jsx(Box, { sx: { width: "40em", overflow: "auto" }, children: _jsxs(Table, { size: "small", children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { children: "Station" }), _jsx(TableCell, { children: "Active Hours" }), _jsx(TableCell, { children: "Elapsed Hours" }), _jsx(TableCell, { children: "Total Median Hours" })] }) }), _jsx(TableBody, { children: part.stationMins.toAscLazySeq().map(([st, times]) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: st }), _jsx(TableCell, { children: numFormat.format(times.active / 60) }), _jsx(TableCell, { children: numFormat.format(times.elapsed / 60) }), _jsx(TableCell, { children: numFormat.format(times.medianElapsed / 60) })] }, st))) })] }) })] }));
+});
+const PartTableRow = styled(TableRow)({
+    "& > *": {
+        borderBottom: "unset !important",
+    },
+});
+const PartRow = memo(function PartRow({ part }) {
+    const [open, setOpen] = useState(false);
+    return (_jsxs(_Fragment, { children: [_jsxs(PartTableRow, { children: [_jsx(TableCell, { children: _jsxs(Box, { sx: {
+                                display: "flex",
+                                alignItems: "center",
+                            }, children: [_jsx(Box, { sx: { mr: "0.2em" }, children: _jsx(PartIdenticon, { part: part.part, size: 25 }) }), _jsx("div", { children: _jsx(Typography, { variant: "body2", component: "span", display: "block", children: part.part }) })] }) }), _jsx(TableCell, { align: "right", children: part.completedQty }), _jsx(TableCell, { align: "right", children: part.abnormalQty }), _jsx(TableCell, { align: "right", children: numFormat.format(part.stationMins
+                            .toAscLazySeq()
+                            .filter(([_, stat]) => !stat.isLoadUnload)
+                            .sumBy(([_, t]) => t.active) / 60) }), _jsx(TableCell, { align: "right", children: numFormat.format(part.stationMins
+                            .toAscLazySeq()
+                            .filter(([_, stat]) => !stat.isLoadUnload)
+                            .sumBy(([, t]) => t.elapsed) / 60) }), _jsx(TableCell, { align: "right", children: numFormat.format(part.stationMins
+                            .toAscLazySeq()
+                            .filter(([_, stat]) => !stat.isLoadUnload)
+                            .sumBy(([, t]) => t.medianElapsed) / 60) }), _jsx(TableCell, { align: "left", children: part.workorders.size <= 1 ? (_jsx(WorkorderLink, { workorderId: part.workorders.lookupMin() ?? null })) : part.workorders.size === 2 ? (_jsxs("span", { children: [_jsx(WorkorderLink, { workorderId: part.workorders.lookupMin() }), " &", " ", _jsx(WorkorderLink, { workorderId: part.workorders.lookupMax() })] })) : (`${part.workorders.size} workorders`) }), _jsx(TableCell, { children: _jsx(Tooltip, { title: "Show Details", children: _jsx(IconButton, { size: "small", onClick: () => setOpen(!open), children: open ? _jsx(KeyboardArrowUpIcon, {}) : _jsx(KeyboardArrowDownIcon, {}) }) }) })] }), _jsx(TableRow, { children: _jsx(TableCell, { sx: { pb: "0", pt: "0" }, colSpan: partColCount + 1, children: _jsx(Collapse, { in: open, timeout: "auto", unmountOnExit: true, children: _jsx(PartDetails, { part: part }) }) }) })] }));
+});
+function CopyToClipboardBtn({ partsAtom }) {
+    const parts = useAtomValue(partsAtom);
+    return (_jsx(Tooltip, { title: "Copy to Clipboard", children: _jsx(IconButton, { style: { height: "25px", paddingTop: 0, paddingBottom: 0 }, size: "large", onClick: () => copyPartsToClipboard(parts), children: _jsx(ImportExport, {}) }) }));
+}
+function MedianHelpTooltip() {
+    return (_jsx(Tooltip, { title: "Total Median Hours are calculated by taking the median cycle time (excluding outliers) and adding up for each piece of material.", children: _jsx("span", { style: { verticalAlign: "middle", marginLeft: "0.5em", fontSize: 16 }, children: _jsx(HelpOutline, { fontSize: "inherit" }) }) }));
+}
+function TimeCuttoffHelpTooltip() {
+    return (_jsx(Tooltip, { title: "The entire cycle time is credited at the time the cycle completes, so it may be that a day has more than 24 hours of credited time for example.", children: _jsx("span", { style: { verticalAlign: "middle", marginLeft: "0.5em", fontSize: 16 }, children: _jsx(HelpOutline, { fontSize: "inherit" }) }) }));
+}
+function AbnormalHelpTooltip() {
+    return (_jsx(Tooltip, { title: "An abnormal part is one which was quarantined, had a failed inspection, or was explicitly marked as failing closeout.  A successful closeout overrides this and will never be an abnormal part.", children: _jsx("span", { style: { verticalAlign: "middle", marginLeft: "0.5em", fontSize: 16 }, children: _jsx(HelpOutline, { fontSize: "inherit" }) }) }));
+}
+const PartHeader = memo(function PartHeader({ partsAtom, order, setOrder, sortBy, setSortBy, }) {
+    const sort = {
+        sortBy: sortBy,
+        setSortBy: setSortBy,
+        order: order,
+        setOrder: setOrder,
+    };
+    return (_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(SortColHeader, { align: "left", col: "PartName", ...sort, children: "Part" }), _jsx(SortColHeader, { align: "right", col: "CompletedQty", ...sort, children: "Completed Quantity" }), _jsx(SortColHeader, { align: "right", col: "AbnormalQty", ...sort, extraIcon: _jsx(AbnormalHelpTooltip, {}), children: "Abnormal Quantity" }), _jsx(SortColHeader, { align: "right", col: "Active", ...sort, extraIcon: _jsx(TimeCuttoffHelpTooltip, {}), children: "Active Hours" }), _jsx(SortColHeader, { align: "right", col: "Elapsed", ...sort, extraIcon: _jsx(TimeCuttoffHelpTooltip, {}), children: "Elapsed Hours" }), _jsx(SortColHeader, { align: "right", col: "Median", ...sort, extraIcon: _jsx(MedianHelpTooltip, {}), children: "Total Median Hours" }), _jsx(SortColHeader, { align: "left", col: "Workorders", ...sort, children: "Workorders" }), _jsx(TableCell, { children: _jsx(CopyToClipboardBtn, { partsAtom: partsAtom }) })] }) }));
+});
+const CompletedPartsTable = memo(function CompletedPartsTable({ partsAtom, }) {
+    const parts = useAtomValue(partsAtom);
+    const [sortBy, setSortBy] = useState("PartName");
+    const [order, setOrder] = useState("asc");
+    const sorted = sortPartSummary(parts, sortBy, order);
+    return (_jsxs(Table, { stickyHeader: true, children: [_jsx(PartHeader, { partsAtom: partsAtom, sortBy: sortBy, setSortBy: setSortBy, order: order, setOrder: setOrder }), _jsx(TableBody, { children: sorted.map((part) => (_jsx(PartRow, { part: part }, part.part))) })] }));
+});
+function CompPartsMatDialogBtns() {
+    const setWorkorderDialogOpen = useSetAtom(selectWorkorderDialogOpen);
+    const mat = useAtomValue(materialInDialogInfo);
+    const [complete, isCompleting] = useCompleteCloseout();
+    const setToShow = useSetAtom(materialDialogOpen);
+    if (mat === null || mat.materialID < 0) {
+        return null;
+    }
+    function closeout(failed) {
+        if (mat === null)
+            return;
+        complete({
+            mat,
+            operator: "Manager",
+            failed,
+        });
+        setToShow(null);
+    }
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { color: "primary", disabled: isCompleting, onClick: () => closeout(true), children: "Fail CloseOut" }), _jsx(Button, { color: "primary", disabled: isCompleting, onClick: () => closeout(false), children: "Pass CloseOut" }), _jsx(Button, { color: "primary", onClick: () => setWorkorderDialogOpen(true), children: "Change Workorder" })] }));
+}
+const CompletedPartsMaterialDialog = memo(function CompletedPartsMaterialDialog() {
+    return _jsx(MaterialDialog, { buttons: _jsx(CompPartsMatDialogBtns, {}) });
+});
+export function RecentCompletedPartsPage() {
+    useSetTitle("Completed Parts");
+    return (_jsxs(Box, { component: "main", padding: "24px", children: [_jsxs(Stack, { direction: "row", spacing: 2, alignItems: "center", justifyContent: "space-between", children: [_jsx("span", { children: "Completed Parts" }), _jsx(Last30ChartRangeToolbar, { chartAtom: last30PartSummaryRange })] }), _jsx(CompletedPartsTable, { partsAtom: last30PartSummary }), _jsx(CompletedPartsMaterialDialog, {}), _jsx(SelectWorkorderDialog, {})] }));
+}
+function copyPartsToClipboard(parts) {
+    let table = "<table>\n<thead><tr>";
+    table += "<th>Part</th>";
+    table += "<th>Completed Qty</th>";
+    table += "<th>Abnormal Qty</th>";
+    table += "<th>Workorders</th>";
+    table += "<th>Active Machine Time (mins)</th>";
+    table += "<th>Elapsed Machine Time (mins)</th>";
+    table += "<th>Total Median Machine Time (mins)</th>";
+    table += "<th>Active L/U Time (mins)</th>";
+    table += "<th>Elapsed L/U Time (mins)</th>";
+    table += "<th>Total Median L/U Time (mins)</th>";
+    table += "</tr></thead>\n<tbody>\n";
+    for (const p of parts) {
+        table += "<tr>";
+        table += `<td>${p.part}</td>`;
+        table += `<td>${p.completedQty}</td>`;
+        table += `<td>${p.abnormalQty}</td>`;
+        table += `<td>${p.workorders.toAscLazySeq().toRArray().join(";")}</td>`;
+        for (const lul of [false, true]) {
+            const stats = p.stationMins
+                .toAscLazySeq()
+                .filter(([_, stat]) => stat.isLoadUnload === lul)
+                .toRArray();
+            if (stats.length === 0) {
+                table += `<td>0</td><td>0</td><td>0</td>`;
+            }
+            else if (stats.length === 1) {
+                table += `<td>${stats[0][1].active}</td>`;
+                table += `<td>${stats[0][1].elapsed}</td>`;
+                table += `<td>${stats[0][1].medianElapsed}</td>`;
+            }
+            else {
+                table += `<td>${stats.map(([st, t]) => `${st}: ${t.active}`).join(";")}</td>`;
+                table += `<td>${stats.map(([st, t]) => `${st}: ${t.elapsed}`).join(";")}</td>`;
+                table += `<td>${stats.map(([st, t]) => `${st}: ${t.medianElapsed}`).join(";")}</td>`;
+            }
+        }
+        table += "</tr>\n";
+    }
+    table += "</tbody></table>\n";
+    copy(table, { format: "text/html" });
+}

package/dist/components/operations/CurrentWorkorders.d.ts

@@ -0,0 +1,3 @@
+export declare const CurrentWorkordersPage: import("react").NamedExoticComponent<{
+    disableSearch?: boolean;
+}>;