Tracked orders — persist strategy positions in SQLite

Backend:
- New orders table (symbol, name, legs_json, entry_cost, created_at,
  closed_at, status, note) sharing the snapshots.db
- Endpoints:
  POST   /api/orders          save a position
  GET    /api/orders?symbol=  list (most recent first)
  GET    /api/orders/:id      single
  PATCH  /api/orders/:id      { status:'open'|'closed', note? }
  DELETE /api/orders/:id      remove

Strategy page:
- "Save to Tracker" button posts the currently-active legs (with name,
  net cost, side, qty, entry, IV, lock) as an order

Tracker page:
- New "Tracked Orders" section above the IV history charts: lists each
  saved position for the current symbol with strategy name, leg summary,
  entered cost, current value, P/L $ and %, opened date, status, and
  Close/Reopen + Remove actions. Live P/L uses /api/chain mids for each
  unique leg expiry.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
ojy
2026-05-13 06:54:40 +00:00
parent 58f898b47d
commit c1520d7962
4 changed files with 422 additions and 1 deletions

134
backend/src/db/orders.ts Normal file
View File

@@ -0,0 +1,134 @@
/**
* Tracked-order persistence — strategy positions the user wants to follow
* over time. Single source of truth across browsers/devices.
*
* Schema:
* orders(id, symbol, name, legs_json, entry_cost, created_at, closed_at, status, note)
* legs_json holds the leg array exactly as the Strategy page knows it
* (id, symbol, expiry, type, strike, side, qty, entryPrice, iv, locked).
*/
import { getDb } from "./snapshots.js";
const db = getDb();
db.exec(`
CREATE TABLE IF NOT EXISTS orders (
id INTEGER PRIMARY KEY AUTOINCREMENT,
symbol TEXT NOT NULL,
name TEXT,
legs_json TEXT NOT NULL,
entry_cost REAL,
created_at TEXT NOT NULL,
closed_at TEXT,
status TEXT NOT NULL DEFAULT 'open',
note TEXT
);
CREATE INDEX IF NOT EXISTS idx_orders_symbol_created
ON orders(symbol, created_at);
CREATE INDEX IF NOT EXISTS idx_orders_status
ON orders(status);
`);
export type OrderLeg = {
symbol: string;
expiry: string;
type: "call" | "put";
strike: number;
side: "long" | "short";
qty: number;
entryPrice: number;
iv: number;
locked?: boolean;
};
export type OrderRow = {
id: number;
symbol: string;
name: string | null;
legs_json: string;
entry_cost: number | null;
created_at: string;
closed_at: string | null;
status: "open" | "closed";
note: string | null;
};
export type Order = Omit<OrderRow, "legs_json"> & { legs: OrderLeg[] };
const stmtInsert = db.prepare(`
INSERT INTO orders (symbol, name, legs_json, entry_cost, created_at, status, note)
VALUES (?, ?, ?, ?, ?, 'open', ?)
`);
const stmtListBySymbol = db.prepare(`
SELECT * FROM orders WHERE symbol = ? ORDER BY created_at DESC LIMIT ?
`);
const stmtListAll = db.prepare(`
SELECT * FROM orders ORDER BY created_at DESC LIMIT ?
`);
const stmtGet = db.prepare(`SELECT * FROM orders WHERE id = ?`);
const stmtDelete = db.prepare(`DELETE FROM orders WHERE id = ?`);
const stmtClose = db.prepare(`
UPDATE orders SET status = 'closed', closed_at = ? WHERE id = ?
`);
const stmtReopen = db.prepare(`
UPDATE orders SET status = 'open', closed_at = NULL WHERE id = ?
`);
const stmtNote = db.prepare(`UPDATE orders SET note = ? WHERE id = ?`);
function rowToOrder(row: OrderRow): Order {
let legs: OrderLeg[] = [];
try { legs = JSON.parse(row.legs_json) as OrderLeg[]; } catch { /* ignore */ }
const { legs_json: _legs, ...rest } = row;
return { ...rest, legs };
}
export function saveOrder(
symbol: string,
name: string | null,
legs: OrderLeg[],
entryCost: number | null,
note: string | null = null
): Order {
const info = stmtInsert.run(
symbol,
name,
JSON.stringify(legs),
entryCost,
new Date().toISOString(),
note
);
const row = stmtGet.get(info.lastInsertRowid) as OrderRow;
return rowToOrder(row);
}
export function listOrders(symbol?: string, limit = 200): Order[] {
const rows = (symbol
? (stmtListBySymbol.all(symbol, limit) as OrderRow[])
: (stmtListAll.all(limit) as OrderRow[]));
return rows.map(rowToOrder);
}
export function getOrder(id: number): Order | null {
const row = stmtGet.get(id) as OrderRow | undefined;
return row ? rowToOrder(row) : null;
}
export function deleteOrder(id: number): boolean {
const info = stmtDelete.run(id);
return info.changes > 0;
}
export function closeOrder(id: number): Order | null {
stmtClose.run(new Date().toISOString(), id);
return getOrder(id);
}
export function reopenOrder(id: number): Order | null {
stmtReopen.run(id);
return getOrder(id);
}
export function updateOrderNote(id: number, note: string | null): Order | null {
stmtNote.run(note, id);
return getOrder(id);
}

View File

@@ -22,6 +22,16 @@ import {
getSnapshots,
getLatestSnapshot,
} from "../db/snapshots.js";
import {
saveOrder,
listOrders,
getOrder,
deleteOrder,
closeOrder,
reopenOrder,
updateOrderNote,
type OrderLeg,
} from "../db/orders.js";
// ---------------------------------------------------------------------------
// Helpers
@@ -425,3 +435,103 @@ optionsRouter.post("/refresh", async (c) => {
return c.json(fail(msg), 502);
}
});
// ---------------------------------------------------------------------------
// Tracked orders — strategy positions persisted in SQLite
// ---------------------------------------------------------------------------
function validLegs(raw: unknown): OrderLeg[] | null {
if (!Array.isArray(raw)) return null;
const out: OrderLeg[] = [];
for (const l of raw) {
if (!l || typeof l !== "object") return null;
const o = l as Record<string, unknown>;
const strike = Number(o.strike);
const qty = Math.max(1, Math.round(Number(o.qty) || 1));
if (!Number.isFinite(strike) || strike <= 0) return null;
if (o.type !== "call" && o.type !== "put") return null;
if (typeof o.symbol !== "string" || !o.symbol) return null;
if (typeof o.expiry !== "string" || !o.expiry) return null;
out.push({
symbol: o.symbol,
expiry: o.expiry,
type: o.type,
strike,
side: o.side === "short" ? "short" : "long",
qty,
entryPrice: Number(o.entryPrice) || 0,
iv: Number(o.iv) || 0,
locked: o.locked === true,
});
}
return out;
}
// POST /api/orders { symbol, name?, legs:[...], entryCost?, note? }
optionsRouter.post("/orders", async (c) => {
let body: any;
try { body = await c.req.json(); } catch { return c.json(fail("Invalid JSON body"), 400); }
const symbol = typeof body.symbol === "string" ? body.symbol.toUpperCase().trim() : "";
const legs = validLegs(body.legs);
if (!symbol) return c.json(fail("Missing symbol"), 400);
if (!legs || legs.length === 0) return c.json(fail("legs must be a non-empty array of {symbol,expiry,type,strike,side,qty,entryPrice,iv}"), 400);
const name = typeof body.name === "string" ? body.name.slice(0, 80) : null;
const note = typeof body.note === "string" ? body.note.slice(0, 500) : null;
const entryCost = (typeof body.entryCost === "number" && Number.isFinite(body.entryCost)) ? body.entryCost : null;
try {
const order = saveOrder(symbol, name, legs, entryCost, note);
return c.json(ok(order), 201);
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
console.error("[POST /api/orders]", msg);
return c.json(fail(msg), 500);
}
});
// GET /api/orders?symbol=...&limit=...
optionsRouter.get("/orders", (c) => {
const sym = c.req.query("symbol")?.toUpperCase();
const limit = Math.min(parseInt(c.req.query("limit") ?? "200", 10) || 200, 1000);
try {
const orders = listOrders(sym, limit);
return c.json(ok({ count: orders.length, orders }));
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
return c.json(fail(msg), 500);
}
});
// GET /api/orders/:id
optionsRouter.get("/orders/:id", (c) => {
const id = Number(c.req.param("id"));
if (!Number.isFinite(id)) return c.json(fail("Invalid id"), 400);
const o = getOrder(id);
return o ? c.json(ok(o)) : c.json(fail("Order not found"), 404);
});
// DELETE /api/orders/:id
optionsRouter.delete("/orders/:id", (c) => {
const id = Number(c.req.param("id"));
if (!Number.isFinite(id)) return c.json(fail("Invalid id"), 400);
const removed = deleteOrder(id);
return removed ? c.json(ok({ id, removed: true })) : c.json(fail("Order not found"), 404);
});
// PATCH /api/orders/:id { status:'open'|'closed', note?:string }
optionsRouter.patch("/orders/:id", async (c) => {
const id = Number(c.req.param("id"));
if (!Number.isFinite(id)) return c.json(fail("Invalid id"), 400);
let body: any = {};
try { body = await c.req.json(); } catch { /* allow empty patch */ }
try {
let order = getOrder(id);
if (!order) return c.json(fail("Order not found"), 404);
if (body.status === "closed" && order.status !== "closed") order = closeOrder(id) ?? order;
else if (body.status === "open" && order.status !== "open") order = reopenOrder(id) ?? order;
if (typeof body.note === "string") order = updateOrderNote(id, body.note.slice(0, 500)) ?? order;
return c.json(ok(order));
} catch (err) {
const msg = err instanceof Error ? err.message : String(err);
return c.json(fail(msg), 500);
}
});

View File

@@ -76,6 +76,10 @@
<button class="btn btn-outline-primary btn-sm me-1" @click="reloadMarket()" :disabled="refreshing" title="Re-fetch spot, marks &amp; IVs; refresh entry price on unlocked legs">
<span x-show="refreshing" class="spinner-border spinner-border-sm me-1" role="status"></span>Reload
</button>
<button class="btn btn-success btn-sm me-1" @click="saveOrder()" :disabled="savingOrder || activeLegs.length === 0"
title="Save this position to the Tracker (uses currently-checked legs)">
<span x-show="savingOrder" class="spinner-border spinner-border-sm me-1" role="status"></span>Save to Tracker
</button>
<button class="btn btn-outline-danger btn-sm" @click="clearAll()">Clear all</button>
</div>
</div>
@@ -341,7 +345,7 @@
dteOffset: 0,
xZoom: 1, xPan: 0, lastHalfPct: 0,
expiryLocked: false, masterExpiry: '',
refreshing: false, showManual: false, toast: '',
refreshing: false, savingOrder: false, showManual: false, toast: '',
manual: { side:'long', type:'call', qty:1, strike:null, expiry:'', entryPrice:null, ivPct:null },
chart: null, _renderTimer: null,
_chainCache: {}, // "SYMBOL@EXPIRY" -> { "strike@type": optionRow }
@@ -744,6 +748,36 @@
},
flash(msg) { this.toast = msg; setTimeout(()=>{ this.toast=''; }, 2500); },
// POST the current active basket to /api/orders for tracking
async saveOrder() {
const legs = this.activeLegs;
if (legs.length === 0 || !this.symbol) return;
this.savingOrder = true;
try {
const body = {
symbol: this.symbol,
name: this.strategyName,
entryCost: this.netCost,
legs: legs.map(l => ({
symbol: l.symbol, expiry: l.expiry, type: l.type, strike: l.strike,
side: l.side, qty: l.qty, entryPrice: l.entryPrice, iv: l.iv, locked: !!l.locked,
})),
};
const r = await fetch('/api/orders', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(body),
});
const d = await r.json();
if (!r.ok || !d.ok) throw new Error(d.error || ('HTTP ' + r.status));
this.flash('Saved to Tracker · order #' + d.data.id + ' (' + this.strategyName + ')');
} catch (e) {
this.flash('Save failed: ' + e.message);
} finally {
this.savingOrder = false;
}
},
scheduleRender() {
clearTimeout(this._renderTimer);
this._renderTimer = setTimeout(() => this.renderChart(), 40);

View File

@@ -255,6 +255,54 @@
<div class="page-body">
<div class="container-xl">
<!-- Tracked Orders (persisted strategy positions) -->
<div class="card mb-3" x-show="orders.length > 0 || ordersLoading" x-cloak style="background:#161824; border:1px solid #2d3045;">
<div class="card-header d-flex align-items-center justify-content-between" style="border-bottom:1px solid #2d3045;">
<h3 class="card-title text-white mb-0">
Tracked Orders
<span class="text-secondary small fw-normal" x-show="symbol"><span x-text="symbol"></span></span>
</h3>
<div class="d-flex align-items-center gap-2">
<span x-show="ordersLoading" class="spinner-border spinner-border-sm text-secondary"></span>
<button class="btn btn-sm btn-outline-secondary" @click="loadOrders()" :disabled="ordersLoading">Refresh</button>
<span class="text-secondary small" x-text="orders.length + ' order' + (orders.length===1?'':'s')"></span>
</div>
</div>
<div class="table-responsive">
<table class="table table-sm table-hover mb-0" style="color:#d0d5e0;">
<thead style="background:#1a1c2e;color:#8b95a7;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;">
<tr>
<th>Strategy</th>
<th>Legs</th>
<th class="text-end">Entered</th>
<th class="text-end">Current</th>
<th class="text-end">P/L $</th>
<th class="text-end">P/L %</th>
<th>Opened</th>
<th>Status</th>
<th></th><th></th>
</tr>
</thead>
<tbody>
<template x-for="o in orders" :key="o.id">
<tr :style="o.status === 'closed' ? 'opacity:.55' : ''" style="font-size:.85rem;">
<td><span class="badge bg-purple-lt" x-text="o.name || ('Custom (' + o.legs.length + ' legs)')"></span></td>
<td class="text-secondary" style="font-family:'JetBrains Mono',monospace;font-size:.75rem;" x-text="legsSummary(o)"></td>
<td class="text-end" style="font-family:'JetBrains Mono',monospace;" x-text="fmtMoney(orderPL(o).entered)"></td>
<td class="text-end" style="font-family:'JetBrains Mono',monospace;" x-text="fmtMoney(orderPL(o).value)"></td>
<td class="text-end" style="font-family:'JetBrains Mono',monospace;" :class="orderPL(o).pl >= 0 ? 'text-success' : 'text-danger'" x-text="fmtMoney(orderPL(o).pl)"></td>
<td class="text-end" style="font-family:'JetBrains Mono',monospace;" :class="orderPL(o).pl >= 0 ? 'text-success' : 'text-danger'" x-text="orderPL(o).plPct.toFixed(1) + '%'"></td>
<td class="small text-secondary" x-text="(o.created_at||'').slice(0,10)"></td>
<td><span class="badge" :class="o.status === 'open' ? 'bg-success-lt text-success' : 'bg-secondary-lt text-secondary'" x-text="o.status"></span></td>
<td><button class="btn btn-sm" :class="o.status === 'open' ? 'btn-outline-warning' : 'btn-outline-success'" @click="toggleCloseOrder(o)" x-text="o.status === 'open' ? 'Close' : 'Reopen'"></button></td>
<td><button class="btn btn-sm btn-ghost-danger" @click="removeOrder(o.id)" aria-label="Remove order"></button></td>
</tr>
</template>
</tbody>
</table>
</div>
</div>
<!-- Empty state -->
<div x-show="!loading && filteredSnapshots.length === 0" x-cloak class="text-center py-5">
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24"
@@ -612,6 +660,10 @@
loading: false,
error: '',
orders: [],
ordersLoading: false,
ordersChain: {}, // "SYMBOL@EXPIRY" -> { "strike@type": option }
_charts: { atmIv: null, rr25: null, fly25: null },
async init() {
@@ -624,6 +676,96 @@
this.snapshots = vs.snapshots ?? [];
if (this.snapshots.length) this.$nextTick(() => this.renderCharts());
}
if (this.symbol) this.loadOrders();
},
async loadOrders() {
if (!this.symbol) return;
this.ordersLoading = true;
try {
const r = await fetch('/api/orders?symbol=' + encodeURIComponent(this.symbol.trim().toUpperCase()));
const d = await r.json();
this.orders = d.data?.orders || [];
// fetch live chains for the unique expiries (one /api/chain call each)
const need = new Set();
for (const o of this.orders) for (const l of (o.legs||[])) if (l.expiry) need.add(o.symbol + '@' + l.expiry);
const cache = { ...this.ordersChain };
for (const key of need) {
if (cache[key]) continue;
const [sym, exp] = key.split('@');
try {
const cr = await fetch('/api/chain?symbol=' + encodeURIComponent(sym) + '&expiry=' + encodeURIComponent(exp));
if (!cr.ok) continue;
const ce = await cr.json();
const snap = ce.data?.snapshots?.[0];
if (!snap) continue;
const map = {};
for (const o of (snap.chain || [])) {
const t = (o.type || o.optionType || '').toLowerCase();
map[Number(o.strike) + '@' + t] = o;
}
cache[key] = map;
} catch {}
}
this.ordersChain = cache;
} catch (e) {
console.warn('loadOrders failed:', e);
} finally {
this.ordersLoading = false;
}
},
orderPL(o) {
let value = 0, entered = 0;
for (const l of (o.legs||[])) {
const sign = l.side === 'short' ? -1 : 1;
entered += sign * l.qty * 100 * (l.entryPrice || 0);
const m = this.ordersChain[o.symbol + '@' + l.expiry];
const oo = m && m[Number(l.strike) + '@' + l.type];
const mid = oo ? Number(oo.midPrice ?? oo.mid ?? oo.bsPrice ?? 0) : 0;
value += sign * l.qty * 100 * mid;
}
const baseCost = (o.entry_cost != null) ? Number(o.entry_cost) : entered;
const pl = value - baseCost;
const plPct = Math.abs(baseCost) > 1e-6 ? (pl / Math.abs(baseCost)) * 100 : 0;
return { value, entered: baseCost, pl, plPct };
},
async toggleCloseOrder(o) {
const newStatus = o.status === 'open' ? 'closed' : 'open';
try {
const r = await fetch('/api/orders/' + o.id, {
method:'PATCH', headers:{'Content-Type':'application/json'},
body: JSON.stringify({ status: newStatus }),
});
const d = await r.json();
if (d.ok) {
const idx = this.orders.findIndex(x => x.id === o.id);
if (idx >= 0) this.orders[idx] = d.data;
}
} catch (e) { /* silent */ }
},
async removeOrder(id) {
if (!confirm('Remove this tracked order?')) return;
try {
await fetch('/api/orders/' + id, { method:'DELETE' });
this.orders = this.orders.filter(o => o.id !== id);
} catch {}
},
legsSummary(o) {
return (o.legs||[]).map(l =>
(l.side === 'long' ? '+' : '-') + l.qty +
' ' + l.strike + (l.type === 'call' ? 'C' : 'P') +
'·' + (l.expiry || '').slice(5)
).join(' / ');
},
fmtMoney(v) {
if (v == null || !isFinite(v)) return '—';
const a = Math.abs(v), sign = v < 0 ? '-' : '';
return sign + '$' + a.toLocaleString('en-US', { maximumFractionDigits: a < 100 ? 2 : 0 });
},
_persist() {
@@ -670,6 +812,7 @@
}
this._persist();
this.$nextTick(() => this.renderCharts());
this.loadOrders();
} catch (e) {
this.error = e.message;
this.snapshots = [];