Cardoza_Construction/EstiMaker
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added Manager Info
CI / build (push) Has been skipped
Details
CI / deploy (push) Successful in 56s
Details

Browse Source
This commit is contained in:
Timothy Cardoza
2026-03-19 16:50:07 -05:00
parent 72135a11d2
commit cc0a1ad15d
5 changed files with 254 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+3
View File
@@ -5,6 +5,9 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet" />
<title>item-extractor-solid</title>
</head>
src/components/EstimateBuilder.tsx
+17 -1
View File
@@ -38,6 +38,8 @@ interface EstimateBuilderProps {
}
const EstimateBuilder: Component<EstimateBuilderProps> = (props) => {
type PrintMode = 'finalized' | 'manager';
// 1. Initialize State
const { scopes, setScopes, subScopes, setSubScopes, estimateItems: items, setEstimateItems: setItems, clientInfo, jobInfo, generalEstimateNotes, setGeneralEstimateNotes, generalPreNotes, setGeneralPreNotes } = appStore;
@@ -56,6 +58,7 @@ const EstimateBuilder: Component<EstimateBuilderProps> = (props) => {
const [pendingCsvImportText, setPendingCsvImportText] = createSignal<string | null>(null);
const [excludedScopeIds, setExcludedScopeIds] = createSignal<string[]>([]);
const [excludedSubScopeIds, setExcludedSubScopeIds] = createSignal<string[]>([]);
const [printMode, setPrintMode] = createSignal<PrintMode>('finalized');
// 2. Initialize custom hooks/primitives
const { selectedIds, setSelectedIds, lastSelectedId, setLastSelectedId, toggleSelection, clearSelection, copyColumnSum } = useSelectionManager();
@@ -92,7 +95,19 @@ const EstimateBuilder: Component<EstimateBuilderProps> = (props) => {
const anyDescriptionIsLong = createMemo(() => items.some(item => (item.description || '').length > 120));
const finalizeBid = () => {
runPrint('finalized');
};
const exportManagerInfo = () => {
runPrint('manager');
};
const runPrint = (mode: PrintMode) => {
setPrintMode(mode);
window.requestAnimationFrame(() => {
window.print();
window.setTimeout(() => setPrintMode('finalized'), 0);
});
};
const addScope = () => {
@@ -347,6 +362,7 @@ const EstimateBuilder: Component<EstimateBuilderProps> = (props) => {
generalPreNotes={generalPreNotes()}
formatNumber={formatNumber}
hideColumns={anyDescriptionIsLong()}
variant={printMode()}
/>
<div class="no-print flex flex-col min-h-dvh">
@@ -465,7 +481,7 @@ const EstimateBuilder: Component<EstimateBuilderProps> = (props) => {
<ValidationStatusBar validationStats={validationStats()} />
<ExecutiveSummary totals={grandTotals()} onFinalizeBid={finalizeBid} />
<ExecutiveSummary totals={grandTotals()} onFinalizeBid={finalizeBid} onExportManagerInfo={exportManagerInfo} />
</main>
</div>
src/components/PrintEstimate.tsx
+145 -4
View File
@@ -28,9 +28,13 @@ interface PrintEstimateProps {
generalEstimateNotes: string;
formatNumber: (num: number) => string;
hideColumns?: boolean;
variant?: 'finalized' | 'manager';
}
const PrintEstimate: Component<PrintEstimateProps> = (props) => {
const variant = () => props.variant ?? 'finalized';
const isManagerVariant = () => variant() === 'manager';
const getScopeTotal = (scopeId: string) => {
let scopeSubtotal = 0;
let scopeMarkup = 0;
@@ -75,6 +79,28 @@ const PrintEstimate: Component<PrintEstimateProps> = (props) => {
return scopeSubtotal + scopeMarkup + scopeContingency + mgmtFee + deliveryFee + modifiersTotal;
};
const getScopeItems = (scopeId: string) => {
const scopeLevelItems = props.items.filter((item: EstimateItem) => item.scopeId === scopeId && !item.subScopeId);
const scopeSubScopes = props.subScopes
.filter((subScope) => subScope.scopeId === scopeId)
.map((subScope) => ({
subScope,
items: props.items.filter((item: EstimateItem) => item.subScopeId === subScope.id)
}))
.filter((entry) => entry.items.length > 0);
return {
scopeLevelItems,
scopeSubScopes
};
};
const getItemSubtotal = (item: EstimateItem) => item.quantity * item.unitPrice;
const getManagerScopeVisibleTotal = (scopeId: string) =>
props.items
.filter((item: EstimateItem) => item.scopeId === scopeId)
.reduce((sum, item) => sum + getItemSubtotal(item), 0);
return (
<div class="print-only p-6 bg-white font-sans max-w-[8.5in] mx-auto text-sm leading-normal text-foreground">
{/* Company Header */}
@@ -88,7 +114,9 @@ const PrintEstimate: Component<PrintEstimateProps> = (props) => {
</div>
</div>
<div class="text-right">
<h2 class="text-2xl font-black text-foreground uppercase tracking-tighter leading-none">Estimate</h2>
<h2 class="text-2xl font-black text-foreground uppercase tracking-tighter leading-none">
{isManagerVariant() ? 'Manager Info' : 'Estimate'}
</h2>
<p class="text-[10px] text-muted-foreground italic uppercase tracking-widest font-bold mb-1">*** NOT A BILL ***</p>
<p class="text-foreground font-bold text-xs">Date: {new Date().toLocaleDateString()}</p>
</div>
@@ -110,6 +138,10 @@ const PrintEstimate: Component<PrintEstimateProps> = (props) => {
<div>
<h3 class="text-[10px] font-bold text-muted-foreground uppercase tracking-wider border-b border-border pb-1 mb-2">Project Details</h3>
<div class="pl-1 space-y-1">
<div class="flex gap-2 text-xs">
<span class="font-bold text-muted-foreground/60 w-16 uppercase text-[10px] pt-0.5">Job No.</span>
<span class="font-bold text-foreground">{props.jobInfo.number || '---'}</span>
</div>
<div class="flex gap-2 text-xs">
<span class="font-bold text-muted-foreground/60 w-16 uppercase text-[10px] pt-0.5">Project</span>
<span class="font-bold text-foreground">{props.jobInfo.name || '---'}</span>
@@ -129,7 +161,7 @@ const PrintEstimate: Component<PrintEstimateProps> = (props) => {
</div>
{/* General Pre-Notes */}
<Show when={props.generalPreNotes}>
<Show when={props.generalPreNotes && !isManagerVariant()}>
<div class="mb-6 p-4 bg-muted/30 rounded-xl border border-border/40 break-inside-avoid shadow-sm outline outline-1 outline-border/20">
<div class="text-[11px] text-foreground/80 leading-relaxed font-medium italic">
{props.generalPreNotes}
@@ -138,6 +170,9 @@ const PrintEstimate: Component<PrintEstimateProps> = (props) => {
</Show>
{/* Scope Details Table */}
<Show
when={isManagerVariant()}
fallback={
<div class="mb-8 border-t-2 border-foreground">
<div class="grid grid-cols-12 gap-2 py-2 bg-muted/40 px-3 text-[10px] font-bold text-muted-foreground uppercase tracking-wider border-b border-border/60">
<div class="col-span-2">Scope</div>
@@ -161,7 +196,6 @@ const PrintEstimate: Component<PrintEstimateProps> = (props) => {
if (processed.trim().startsWith('- ')) {
return <li class="ml-3 list-disc pl-1 text-foreground/90" innerHTML={processed.substring(2)} />;
}
// Handle empty lines more gracefully in compact mode
if (!processed.trim()) return <div class="h-1"></div>;
return <p class="mb-0.5 last:mb-0 text-foreground/90" innerHTML={processed} />;
}}
@@ -176,9 +210,114 @@ const PrintEstimate: Component<PrintEstimateProps> = (props) => {
</For>
</div>
</div>
}
>
<div class="mb-8 space-y-6">
<For each={props.scopes}>
{(scope) => {
const scopeItems = () => getScopeItems(scope.id);
return (
<section class={`border border-border/60 rounded-2xl overflow-hidden ${isManagerVariant() ? '' : 'break-inside-avoid'}`}>
<div class="px-4 py-3 bg-muted/30 border-b border-border/60 flex items-start justify-between gap-4">
<div>
<h4 class="text-sm font-black text-foreground uppercase">{scope.name}</h4>
<p class="text-[10px] text-muted-foreground font-bold uppercase tracking-widest mt-1">Scope Total</p>
</div>
<div class="text-right">
<div class="text-lg font-black text-foreground">${props.formatNumber(getManagerScopeVisibleTotal(scope.id))}</div>
</div>
</div>
<div class="p-4 space-y-4">
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
<div class="rounded-xl border border-border/50 p-3 bg-white">
<div class="text-[10px] font-bold text-muted-foreground uppercase tracking-widest mb-2">Scope Description</div>
<div class="prose prose-sm max-w-none prose-strong:text-foreground prose-em:text-foreground/70 text-xs text-foreground/90">
<For each={(scope.bidDescription || 'See detailed specifications.').split('\n')}>
{(line) => {
let processed = line;
processed = processed.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>');
processed = processed.replace(/(\*|_)(.*?)\1/g, '<em>$2</em>');
if (processed.trim().startsWith('- ')) {
return <li class="ml-3 list-disc pl-1 text-foreground/90" innerHTML={processed.substring(2)} />;
}
if (!processed.trim()) return <div class="h-1"></div>;
return <p class="mb-0.5 last:mb-0 text-foreground/90" innerHTML={processed} />;
}}
</For>
</div>
</div>
<div class="rounded-xl border border-border/50 p-3 bg-white">
<div class="text-[10px] font-bold text-muted-foreground uppercase tracking-widest mb-2">Estimator Notes</div>
<div class="text-xs text-foreground/90 whitespace-pre-wrap leading-relaxed">
{scope.estimatorNotes?.trim() || 'No estimator notes provided.'}
</div>
</div>
</div>
<div class="border border-border/50 rounded-xl overflow-hidden">
<div class="grid grid-cols-12 gap-3 px-3 py-2 bg-muted/20 text-[10px] font-bold text-muted-foreground uppercase tracking-wider border-b border-border/50">
<div class="col-span-2">Section</div>
<div class="col-span-6">Line Item</div>
<div class="col-span-1 text-right">Qty</div>
<div class="col-span-1 text-right">Unit</div>
<div class="col-span-2 text-right">Subtotal</div>
</div>
<Show when={scopeItems().scopeLevelItems.length > 0}>
<div class="border-b border-border/40">
<div class="px-3 py-2 bg-background text-[10px] font-black uppercase tracking-widest text-muted-foreground">Scope Level</div>
<For each={scopeItems().scopeLevelItems}>
{(item) => (
<div class="grid grid-cols-12 gap-3 px-3 py-2 text-xs border-t border-border/20 items-start">
<div class="col-span-2 font-bold text-foreground">Scope Level</div>
<div class="col-span-6 text-foreground/90">{item.description}</div>
<div class="col-span-1 text-right text-foreground">{item.quantity}</div>
<div class="col-span-1 text-right text-foreground">${props.formatNumber(item.unitPrice)}</div>
<div class="col-span-2 text-right font-bold text-foreground">${props.formatNumber(getItemSubtotal(item))}</div>
</div>
)}
</For>
</div>
</Show>
<For each={scopeItems().scopeSubScopes}>
{(entry) => (
<div class="border-b last:border-b-0 border-border/40">
<div class="px-3 py-2 bg-background text-[10px] font-black uppercase tracking-widest text-muted-foreground">
{entry.subScope.name}
</div>
<For each={entry.items}>
{(item) => (
<div class="grid grid-cols-12 gap-3 px-3 py-2 text-xs border-t border-border/20 items-start">
<div class="col-span-2 font-bold text-foreground">{entry.subScope.name}</div>
<div class="col-span-6 text-foreground/90">{item.description}</div>
<div class="col-span-1 text-right text-foreground">{item.quantity}</div>
<div class="col-span-1 text-right text-foreground">${props.formatNumber(item.unitPrice)}</div>
<div class="col-span-2 text-right font-bold text-foreground">${props.formatNumber(getItemSubtotal(item))}</div>
</div>
)}
</For>
</div>
)}
</For>
<Show when={scopeItems().scopeLevelItems.length === 0 && scopeItems().scopeSubScopes.length === 0}>
<div class="px-3 py-4 text-xs text-muted-foreground italic">No line items assigned to this scope.</div>
</Show>
</div>
</div>
</section>
);
}}
</For>
</div>
</Show>
{/* General Estimate Notes */}
<Show when={props.generalEstimateNotes}>
<Show when={props.generalEstimateNotes && !isManagerVariant()}>
<div class="mb-8">
<h5 class="text-[10px] font-bold text-muted-foreground uppercase tracking-wider mb-1 border-b border-border/40 pb-1">General Estimate Notes</h5>
<div class="text-[11px] text-foreground/80 leading-relaxed whitespace-pre-wrap font-medium">
@@ -188,6 +327,7 @@ const PrintEstimate: Component<PrintEstimateProps> = (props) => {
</Show>
{/* Final Section: Totals & Signature aligned */}
<Show when={!isManagerVariant()}>
<div class="grid grid-cols-12 gap-8 items-end mb-8 break-inside-avoid">
<div class="col-span-7">
<div class="flex flex-col gap-2">
@@ -233,6 +373,7 @@ const PrintEstimate: Component<PrintEstimateProps> = (props) => {
{/* Print Page Counter */}
<div class="print-page-number"></div>
</Show>
</div>
);
};
src/components/estimate-builder/ExecutiveSummary.tsx
+9
View File
@@ -11,6 +11,7 @@ interface ExecutiveSummaryProps {
grandTotal: number;
};
onFinalizeBid: () => void;
onExportManagerInfo: () => void;
}
export const ExecutiveSummary: Component<ExecutiveSummaryProps> = (props) => {
@@ -68,12 +69,20 @@ export const ExecutiveSummary: Component<ExecutiveSummaryProps> = (props) => {
{formatNumber(props.totals.grandTotal)}
</div>
<div class="mt-8">
<div class="space-y-3">
<button
onClick={props.onFinalizeBid}
class="w-full py-5 bg-primary hover:bg-primary/90 text-primary-foreground rounded-2xl font-black text-xs uppercase tracking-[0.2em] transition-all shadow-xl shadow-primary/20 active:scale-95 flex items-center justify-center gap-3"
>
<Plus class="w-5 h-5" /> Finalize Bid
</button>
<button
onClick={props.onExportManagerInfo}
class="w-full py-4 bg-muted hover:bg-muted/80 text-foreground rounded-2xl font-black text-xs uppercase tracking-[0.2em] transition-all border border-border active:scale-95 flex items-center justify-center gap-3"
>
<Info class="w-5 h-5" /> Manager Info
</button>
</div>
</div>
</div>
</div>
src/index.css
-2
View File
@@ -2,8 +2,6 @@
@plugin "@tailwindcss/typography";
/* Import Standard Shadcn Font (Inter) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
@theme {
/* Clean, single-font family for a modern SaaS look */
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;