An order task & progress control system driven by SOP templates
2026
The Order Process Control System is an internal ops tool built for a client already running an ERP. Their ERP is great at bookkeeping and documents, but lacks cross-department process control — who does which steps, in what order, for a given order. That is exactly the gap this system fills.
At its core is a visual SOP template editor: a Vue Flow node canvas that turns shipping, purchasing, transfer, processing, and accounting operations into flowcharts, configuring main-line steps, exception branches, and cross-template jumps, and assigning an owner and order-number prefix to each step. Once a template is published, orders auto-expand into tasks from a template snapshot, assigned to people and tracked, with status strictly governed by a state machine.
The frontend runs on Astro 5 SSR with Vue 3 interactive components; the data layer uses better-sqlite3 + Drizzle ORM for a lightweight footprint, with Zod validation throughout and four-tier RBAC for permissions. The whole project is spec-driven, mapping acceptance criteria AC-01–13 and business rules BR-01–14 point by point so delivery passes acceptance by design.
A Vue Flow node canvas for dragging main-line and exception steps, configuring optional exceptions, exception flows, and cross-template jumps; each step assigns an owner and order-number prefix, with versioned publishing.
Each order locks a snapshot of the current SOP template, so later template revisions never affect in-flight orders — every order always runs the flow it started with, ensuring consistency and auditability.
The snapshot auto-expands each step into a task assigned to owners and secondary owners; the home dashboard tallies active / paused / completed / cancelled in real time.
Order status is driven by a state machine (active, paused/exception, completed, cancelled), with exception branches, order blocking (blocked by another order), and post-completion cross-template transitions.
Admin / Supervisor / Operator / Viewer tiers precisely control template editing, order operations, and view scope, with a nav role switcher to preview each perspective.
Every action writes to an orderEvents log for full traceability; admins can review recent events on the home page to keep a pulse on the whole flow.
SOP templates map to ERP document types (ordering, sales, purchasing, billing…) and connect via order-number prefixes, filling the cross-department process-control gap the ERP lacks.
Built against a system spec and a client requirements document, implementing acceptance criteria AC-01–13 and business rules BR-01–14 point by point — delivery passes acceptance by design.
SOP templates are edited on a Vue Flow node canvas: main-line steps connect with solid edges, exception steps branch with dashed ones, distinguishing four edge semantics — optional exception, exception flow, and cross-template jump. Each node sets an owner, order-number prefix, and properties, and once published becomes the blueprint orders execute against.
The data layer pairs Drizzle ORM with better-sqlite3, defining users, orders, tasks, sopTemplates, and orderEvents as type-safe schemas. SQLite lets this internal tool run with no extra database service and a single-file store, keeping deployment and backups trivial — ideal for a private deployment alongside the client’s existing systems.
Business logic lives in src/domain/, using a state machine to manage the order lifecycle (active → paused/exception → completed/cancelled), with order blocking (blockedByOrderId) and post-completion cross-template transitions. Every transition emits a domain event to orderEvents, forming a fully auditable operation trail.
When an order is created, it takes a snapshot of the SOP template and locks it in. Even if the template is later revised or retired, in-flight orders keep running their original steps and owners — avoiding the "flow changed, old orders drifted" data-consistency risk. This is the key to a process-control system’s auditability.
Every API endpoint validates input with a Zod schema aligned with TypeScript types, keeping end-to-end type safety from Astro API routes down to the Drizzle data layer — stopping errors before they ever hit the database.
src/lib/permissions implements authorization for four role tiers (admin / supervisor / operator / viewer), governing template editing, order operations, and event viewing. Middleware guards at both the page and API layers, rejecting unauthenticated or over-privileged requests.
CONTACT US
Whether it's an internal ops system, digitizing SOP workflows, order/work-order control, or reinforcing an existing ERP's processes, we can tailor the right solution for you.
Contact Us