import React, { useState, useEffect } from 'react'; import { Head } from '@inertiajs/react'; import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout'; import { Activity, Building2, TrendingUp, Trash2 } from '@/Components/AnimatedIcons'; interface BranchMatrixItem { branch_id: number; code: string; name: string; short_name: string; manager_name: string; sales: number; bills: number; cash: number; upi: number; card: number; wastage: number; expenses: number; variance: number; closing_status: string; } interface Props { matrix: BranchMatrixItem[]; todayDate: string; } export default function BranchOperations({ matrix, todayDate }: Props) { const [accentColor, setAccentColor] = useState(() => localStorage.getItem('admin_accent_color') || 'pink'); useEffect(() => { const handleAccentChange = (e: CustomEvent) => setAccentColor(e.detail); window.addEventListener('theme_accent_changed', handleAccentChange as EventListener); return () => window.removeEventListener('theme_accent_changed', handleAccentChange as EventListener); }, []); const accentText = accentColor === 'seagreen' ? 'text-[#0CA996]' : 'text-[#FF0D8F]'; const totalSalesAll = matrix.reduce((acc, b) => acc + b.sales, 0); const totalBillsAll = matrix.reduce((acc, b) => acc + b.bills, 0); const totalWastageAll = matrix.reduce((acc, b) => acc + b.wastage, 0); return (
{/* Header */}

Central Branch Operations Control Room

Live operational comparison across retail bakery branches for {todayDate}

Live Operations Feed
{/* Global Summary KPI Row */}
Total Chain Revenue ₹{totalSalesAll.toFixed(2)} Across all active branches today
Total Orders Fulfilled {totalBillsAll} Fulfilled customer invoices
Chain Spoilage Loss ₹{totalWastageAll.toFixed(2)} Reported wastage value
{/* Operational Matrix Table */}

Branch Performance & Daily Closing Matrix

{matrix.length} Branches Online
{matrix.map((row) => ( ))}
Branch Manager Net Sales Bills Cash UPI Card Wastage Expenses Variance Status
{row.code} {row.name}
{row.manager_name} ₹{row.sales.toFixed(2)} {row.bills} ₹{row.cash.toFixed(2)} ₹{row.upi.toFixed(2)} ₹{row.card.toFixed(2)} ₹{row.wastage.toFixed(2)} ₹{row.expenses.toFixed(2)} {row.variance > 0 ? `+₹${row.variance.toFixed(2)}` : row.variance < 0 ? `-₹${Math.abs(row.variance).toFixed(2)}` : '₹0.00'} {row.closing_status}
); }