Add TallyFlow architecture diagram and description
- Interactive HTML architecture diagram (Core, Assets, Print, Capture, IoT) - Markdown overview with data flows
This commit is contained in:
TNB
@@ -0,0 +1,221 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>TallyFlow Architecture Diagram</title>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||||
|
body {
|
||||||
|
font-family: 'JetBrains Mono', monospace;
|
||||||
|
background: #020617;
|
||||||
|
min-height: 100vh;
|
||||||
|
padding: 2rem;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.container { max-width: 1200px; margin: 0 auto; }
|
||||||
|
.header { margin-bottom: 2rem; }
|
||||||
|
.header-row { display: flex; align-items: center; gap: 1rem; margin-bottom: 0.5rem; }
|
||||||
|
.pulse-dot {
|
||||||
|
width: 12px; height: 12px; background: #22d3ee;
|
||||||
|
border-radius: 50%; animation: pulse 2s infinite;
|
||||||
|
}
|
||||||
|
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
|
||||||
|
h1 { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.025em; }
|
||||||
|
.subtitle { color: #94a3b8; font-size: 0.875rem; margin-left: 1.75rem; }
|
||||||
|
.diagram-container {
|
||||||
|
background: rgba(15, 23, 42, 0.5);
|
||||||
|
border-radius: 1rem; border: 1px solid #1e293b;
|
||||||
|
padding: 1.5rem; overflow-x: auto;
|
||||||
|
}
|
||||||
|
svg { width: 100%; min-width: 980px; display: block; }
|
||||||
|
.cards {
|
||||||
|
display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||||||
|
gap: 1rem; margin-top: 2rem;
|
||||||
|
}
|
||||||
|
.card {
|
||||||
|
background: rgba(15, 23, 42, 0.5);
|
||||||
|
border-radius: 0.75rem; border: 1px solid #1e293b;
|
||||||
|
padding: 1.25rem;
|
||||||
|
}
|
||||||
|
.card-header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
|
||||||
|
.card-dot { width: 8px; height: 8px; border-radius: 50%; }
|
||||||
|
.card-dot.cyan { background: #22d3ee; }
|
||||||
|
.card-dot.emerald { background: #34d399; }
|
||||||
|
.card-dot.violet { background: #a78bfa; }
|
||||||
|
.card-dot.amber { background: #fbbf24; }
|
||||||
|
.card-dot.orange { background: #fb923c; }
|
||||||
|
.card h3 { font-size: 0.875rem; font-weight: 600; }
|
||||||
|
.card ul { list-style: none; color: #94a3b8; font-size: 0.75rem; }
|
||||||
|
.card li { margin-bottom: 0.375rem; }
|
||||||
|
.footer { text-align: center; margin-top: 1.5rem; color: #475569; font-size: 0.75rem; }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="container">
|
||||||
|
<div class="header">
|
||||||
|
<div class="header-row">
|
||||||
|
<div class="pulse-dot"></div>
|
||||||
|
<h1>TallyFlow Architecture</h1>
|
||||||
|
</div>
|
||||||
|
<p class="subtitle">Manufacturing Asset Tracking & RFID Workflow Platform</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="diagram-container">
|
||||||
|
<svg viewBox="0 0 1000 620">
|
||||||
|
<defs>
|
||||||
|
<marker id="arrowhead" markerWidth="10" markerHeight="7" refX="9" refY="3.5" orient="auto">
|
||||||
|
<polygon points="0 0, 10 3.5, 0 7" fill="#64748b" />
|
||||||
|
</marker>
|
||||||
|
<pattern id="grid" width="40" height="40" patternUnits="userSpaceOnUse">
|
||||||
|
<path d="M 40 0 L 0 0 0 40" fill="none" stroke="#1e293b" stroke-width="0.5"/>
|
||||||
|
</pattern>
|
||||||
|
</defs>
|
||||||
|
|
||||||
|
<!-- Background Grid -->
|
||||||
|
<rect width="100%" height="100%" fill="url(#grid)" />
|
||||||
|
|
||||||
|
<!-- Central Core Region -->
|
||||||
|
<rect x="180" y="60" width="640" height="480" rx="16" fill="rgba(6, 78, 59, 0.08)" stroke="#34d399" stroke-width="1.5" stroke-dasharray="6,3"/>
|
||||||
|
<text x="200" y="85" fill="#34d399" font-size="11" font-weight="700">TallyFlow Core (Backend API + Web UI)</text>
|
||||||
|
|
||||||
|
<!-- Core Component -->
|
||||||
|
<rect x="220" y="120" width="160" height="70" rx="8" fill="rgba(6, 78, 59, 0.45)" stroke="#34d399" stroke-width="2"/>
|
||||||
|
<text x="300" y="150" fill="white" font-size="13" font-weight="700" text-anchor="middle">Core</text>
|
||||||
|
<text x="300" y="168" fill="#94a3b8" font-size="9" text-anchor="middle">FastAPI / Node.js</text>
|
||||||
|
<text x="300" y="182" fill="#34d399" font-size="8" text-anchor="middle">REST + WebSocket</text>
|
||||||
|
|
||||||
|
<!-- Assets Component -->
|
||||||
|
<rect x="420" y="120" width="160" height="70" rx="8" fill="rgba(76, 29, 149, 0.45)" stroke="#a78bfa" stroke-width="2"/>
|
||||||
|
<text x="500" y="150" fill="white" font-size="13" font-weight="700" text-anchor="middle">Assets</text>
|
||||||
|
<text x="500" y="168" fill="#94a3b8" font-size="9" text-anchor="middle">Asset Registry</text>
|
||||||
|
<text x="500" y="182" fill="#a78bfa" font-size="8" text-anchor="middle">PostgreSQL + Search</text>
|
||||||
|
|
||||||
|
<!-- Print Component -->
|
||||||
|
<rect x="620" y="120" width="160" height="70" rx="8" fill="rgba(120, 53, 15, 0.4)" stroke="#fbbf24" stroke-width="2"/>
|
||||||
|
<text x="700" y="150" fill="white" font-size="13" font-weight="700" text-anchor="middle">Print</text>
|
||||||
|
<text x="700" y="168" fill="#94a3b8" font-size="9" text-anchor="middle">Label Printing</text>
|
||||||
|
<text x="700" y="182" fill="#fbbf24" font-size="8" text-anchor="middle">Zebra / Brother</text>
|
||||||
|
|
||||||
|
<!-- Capture (Mobile) -->
|
||||||
|
<rect x="80" y="280" width="140" height="90" rx="8" fill="rgba(8, 51, 68, 0.45)" stroke="#22d3ee" stroke-width="2"/>
|
||||||
|
<text x="150" y="310" fill="white" font-size="13" font-weight="700" text-anchor="middle">Capture</text>
|
||||||
|
<text x="150" y="328" fill="#94a3b8" font-size="9" text-anchor="middle">Mobile App</text>
|
||||||
|
<text x="150" y="342" fill="#22d3ee" font-size="8" text-anchor="middle">Janam / Zebra / Atid</text>
|
||||||
|
<text x="150" y="356" fill="#94a3b8" font-size="8" text-anchor="middle">Enroll & Scan</text>
|
||||||
|
|
||||||
|
<!-- IoT / Fixed Readers -->
|
||||||
|
<rect x="780" y="280" width="140" height="90" rx="8" fill="rgba(251, 146, 60, 0.35)" stroke="#fb923c" stroke-width="2"/>
|
||||||
|
<text x="850" y="310" fill="white" font-size="13" font-weight="700" text-anchor="middle">IoT</text>
|
||||||
|
<text x="850" y="328" fill="#94a3b8" font-size="9" text-anchor="middle">Fixed Readers</text>
|
||||||
|
<text x="850" y="342" fill="#fb923c" font-size="8" text-anchor="middle">Impinj / Zebra</text>
|
||||||
|
<text x="850" y="356" fill="#94a3b8" font-size="8" text-anchor="middle">MQTT / HTTP</text>
|
||||||
|
|
||||||
|
<!-- Database Layer -->
|
||||||
|
<rect x="320" y="420" width="360" height="70" rx="8" fill="rgba(76, 29, 149, 0.35)" stroke="#a78bfa" stroke-width="1.5"/>
|
||||||
|
<text x="500" y="450" fill="white" font-size="12" font-weight="700" text-anchor="middle">Database & Event Store</text>
|
||||||
|
<text x="500" y="468" fill="#94a3b8" font-size="9" text-anchor="middle">PostgreSQL • Redis • Time-series</text>
|
||||||
|
<text x="500" y="482" fill="#a78bfa" font-size="8" text-anchor="middle">Asset history, tag events, audit logs</text>
|
||||||
|
|
||||||
|
<!-- External Integrations / Excel -->
|
||||||
|
<rect x="80" y="420" width="120" height="60" rx="6" fill="rgba(30, 41, 59, 0.5)" stroke="#94a3b8" stroke-width="1.5"/>
|
||||||
|
<text x="140" y="445" fill="white" font-size="11" font-weight="600" text-anchor="middle">Excel Import</text>
|
||||||
|
<text x="140" y="462" fill="#94a3b8" font-size="8" text-anchor="middle">Bulk asset load</text>
|
||||||
|
|
||||||
|
<!-- Arrows / Flows -->
|
||||||
|
|
||||||
|
<!-- Capture → Core -->
|
||||||
|
<line x1="222" y1="325" x2="280" y2="190" stroke="#22d3ee" stroke-width="2" marker-end="url(#arrowhead)"/>
|
||||||
|
<text x="235" y="265" fill="#22d3ee" font-size="9" font-weight="600">API Sync</text>
|
||||||
|
|
||||||
|
<!-- Core ↔ Assets (internal) -->
|
||||||
|
<line x1="382" y1="155" x2="418" y2="155" stroke="#a78bfa" stroke-width="2" marker-end="url(#arrowhead)"/>
|
||||||
|
<text x="400" y="148" fill="#a78bfa" font-size="8">CRUD</text>
|
||||||
|
|
||||||
|
<!-- Core → Print -->
|
||||||
|
<line x1="382" y1="155" x2="618" y2="155" stroke="#fbbf24" stroke-width="2" marker-end="url(#arrowhead)"/>
|
||||||
|
<text x="500" y="148" fill="#fbbf24" font-size="8">Print Jobs</text>
|
||||||
|
|
||||||
|
<!-- IoT → Core -->
|
||||||
|
<line x1="778" y1="325" x2="720" y2="190" stroke="#fb923c" stroke-width="2" marker-end="url(#arrowhead)"/>
|
||||||
|
<text x="765" y="265" fill="#fb923c" font-size="9" font-weight="600">Tag Events</text>
|
||||||
|
|
||||||
|
<!-- Core ↔ Database -->
|
||||||
|
<line x1="500" y1="192" x2="500" y2="418" stroke="#a78bfa" stroke-width="2" marker-end="url(#arrowhead)"/>
|
||||||
|
<text x="515" y="310" fill="#a78bfa" font-size="9">Persist</text>
|
||||||
|
|
||||||
|
<!-- Print ↔ Database (via Core) -->
|
||||||
|
<line x1="700" y1="192" x2="680" y2="418" stroke="#fbbf24" stroke-width="1.5" stroke-dasharray="4,2" marker-end="url(#arrowhead)"/>
|
||||||
|
|
||||||
|
<!-- Capture ↔ Excel example flow -->
|
||||||
|
<line x1="140" y1="420" x2="140" y2="370" stroke="#94a3b8" stroke-width="1.5" stroke-dasharray="3,2" marker-end="url(#arrowhead)"/>
|
||||||
|
|
||||||
|
<!-- Legend -->
|
||||||
|
<text x="80" y="560" fill="white" font-size="10" font-weight="700">Legend</text>
|
||||||
|
|
||||||
|
<rect x="80" y="572" width="18" height="11" rx="2" fill="rgba(6, 78, 59, 0.45)" stroke="#34d399" stroke-width="1"/>
|
||||||
|
<text x="105" y="581" fill="#94a3b8" font-size="8">Core Backend</text>
|
||||||
|
|
||||||
|
<rect x="200" y="572" width="18" height="11" rx="2" fill="rgba(76, 29, 149, 0.45)" stroke="#a78bfa" stroke-width="1"/>
|
||||||
|
<text x="225" y="581" fill="#94a3b8" font-size="8">Assets / DB</text>
|
||||||
|
|
||||||
|
<rect x="310" y="572" width="18" height="11" rx="2" fill="rgba(8, 51, 68, 0.45)" stroke="#22d3ee" stroke-width="1"/>
|
||||||
|
<text x="335" y="581" fill="#94a3b8" font-size="8">Mobile / Frontend</text>
|
||||||
|
|
||||||
|
<rect x="440" y="572" width="18" height="11" rx="2" fill="rgba(120, 53, 15, 0.4)" stroke="#fbbf24" stroke-width="1"/>
|
||||||
|
<text x="465" y="581" fill="#94a3b8" font-size="8">Print Service</text>
|
||||||
|
|
||||||
|
<rect x="555" y="572" width="18" height="11" rx="2" fill="rgba(251, 146, 60, 0.35)" stroke="#fb923c" stroke-width="1"/>
|
||||||
|
<text x="580" y="581" fill="#94a3b8" font-size="8">IoT / Edge</text>
|
||||||
|
|
||||||
|
<line x1="680" y1="577" x2="698" y2="577" stroke="#64748b" stroke-width="1.5" marker-end="url(#arrowhead)"/>
|
||||||
|
<text x="705" y="581" fill="#94a3b8" font-size="8">Data Flow</text>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cards">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-dot emerald"></div>
|
||||||
|
<h3>Core + Assets</h3>
|
||||||
|
</div>
|
||||||
|
<ul>
|
||||||
|
<li>• Central orchestration & API layer</li>
|
||||||
|
<li>• Asset registry & lifecycle management</li>
|
||||||
|
<li>• Real-time event processing</li>
|
||||||
|
<li>• Web UI for operators & admins</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-dot cyan"></div>
|
||||||
|
<h3>Capture (Mobile)</h3>
|
||||||
|
</div>
|
||||||
|
<ul>
|
||||||
|
<li>• Field enrollment & tag scanning</li>
|
||||||
|
<li>• Supports Janam XR2, Zebra, Atid</li>
|
||||||
|
<li>• Offline-first with sync</li>
|
||||||
|
<li>• Photo + GPS metadata capture</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<div class="card-dot amber"></div>
|
||||||
|
<h3>Print + IoT</h3>
|
||||||
|
</div>
|
||||||
|
<ul>
|
||||||
|
<li>• On-demand label printing</li>
|
||||||
|
<li>• Fixed reader integration (Impinj/Zebra)</li>
|
||||||
|
<li>• MQTT & HTTP tag event ingestion</li>
|
||||||
|
<li>• Bulk Excel import support</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="footer">
|
||||||
|
TallyFlow • Reducing manufacturing waste through intelligent RFID tracking • 2026
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
# TallyFlow Architecture
|
||||||
|
|
||||||
|
**Diagram:** [[TallyFlow-Architecture-Diagram.html]]
|
||||||
|
|
||||||
|
## Overview
|
||||||
|
|
||||||
|
TallyFlow's architecture is built around a central Core backend that serves as the orchestration layer for all asset tracking, RFID tag management, and workflow automation. The Assets module provides a structured registry and persistence layer (PostgreSQL-backed) for manufacturing assets, their metadata, history, and relationships. Field operations are enabled through the Capture mobile application, which runs on rugged handheld devices (Janam XR2, Zebra, Atid) to support offline-first tag enrollment, scanning, photo capture, and GPS tagging with seamless synchronization to Core. TallyFlow Print handles on-demand label generation and data association, while the IoT layer integrates fixed RFID readers (Impinj and Zebra) via MQTT or HTTP to stream real-time tag events into the platform. All components communicate through the Core API, enabling unified visibility, audit trails, and waste-reduction analytics across the manufacturing environment. Bulk data ingestion is supported via Excel import directly into Core.
|
||||||
|
|
||||||
|
## Key Data Flows
|
||||||
|
- Capture ↔ Core: Real-time and batched sync of tag events and asset updates
|
||||||
|
- Print ↔ Core: Print job submission and confirmation
|
||||||
|
- IoT → Core: Continuous tag read events from fixed readers
|
||||||
|
- Core ↔ Assets/DB: Persistent storage of asset state and event history
|
||||||
|
- Excel → Core: Bulk asset onboarding
|
||||||
|
|
||||||
|
This modular design allows TallyFlow to scale from mobile-only deployments to full IoT-enabled smart factories while maintaining a single source of truth in the Core.
|
||||||
Reference in New Issue
Block a user