dekun/market_intel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add min hours-to-expiry filter on ops map (8-48h step 2)

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-08-02 10:42:55 +08:00
parent f798c11cf9
commit 3e492eb46c
7 changed files with 143 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/dist/index.html
Vendored
+26 -3
View File
@@ -34,7 +34,7 @@
.seg button { appearance: none; border: 0; background: transparent; color: var(--muted); padding: 0.45rem 0.85rem; cursor: pointer; }
.seg button.active { background: #1e2a3a; color: var(--text); }
.date-field { color: var(--muted); font-size: 0.85rem; display: inline-flex; gap: 0.5rem; align-items: center; }
.date-field input { background: var(--panel); border: 1px solid #243041; color: var(--text); border-radius: 6px; padding: 0.35rem 0.5rem; }
.date-field input, .date-field select { background: var(--panel); border: 1px solid #243041; color: var(--text); border-radius: 6px; padding: 0.35rem 0.5rem; }
.chart-wrap { background: var(--panel); border: 1px solid #243041; border-radius: 10px; padding: 0.75rem 0.5rem; margin-top: 0.5rem; }
.chart-title { padding: 0 0.75rem 0.25rem; color: var(--muted); font-size: 0.85rem; }
.chart-svg { width: 100%; height: auto; display: block; }
@@ -123,6 +123,9 @@
<button type="button" data-side="P">Put</button>
</div>
<label class="date-field">锚点日 <input type="date" id="anchorDate" /></label>
<label class="date-field">距离到期 ≥
<select id="minHours" aria-label="距离到期最小小时数"></select>
</label>
</div>
<div class="row">
<div class="tile"><div class="label">范围</div><div class="value" id="opsRange" style="font-size:1.05rem">—</div><div class="hint" id="opsSamples">—</div></div>
@@ -211,7 +214,7 @@
</div>
<script>
const TOKEN_KEY = "mi_token";
const state = { page: "dash", range: "day", side: "both", moveMode: "abs", lastMov: null, authRequired: false, loadedUsername: "admin" };
const state = { page: "dash", range: "day", side: "both", moveMode: "abs", minHours: 12, lastMov: null, authRequired: false, loadedUsername: "admin" };
function getToken() { try { return localStorage.getItem(TOKEN_KEY); } catch { return null; } }
function setToken(t) { try { if (t) localStorage.setItem(TOKEN_KEY, t); else localStorage.removeItem(TOKEN_KEY); } catch {} }
function authHeaders() {
@@ -233,6 +236,16 @@
return d.getFullYear() + "-" + String(d.getMonth()+1).padStart(2,"0") + "-" + String(d.getDate()).padStart(2,"0");
}
document.getElementById("anchorDate").value = todayYmd();
(function initMinHours() {
const sel = document.getElementById("minHours");
for (let h = 8; h <= 48; h += 2) {
const opt = document.createElement("option");
opt.value = String(h);
opt.textContent = h + "h";
if (h === state.minHours) opt.selected = true;
sel.appendChild(opt);
}
})();
function showLogin() {
document.getElementById("page-login").classList.remove("hidden");
@@ -540,6 +553,10 @@
}
}));
document.getElementById("anchorDate").addEventListener("change", loadOps);
document.getElementById("minHours").addEventListener("change", () => {
state.minHours = Number(document.getElementById("minHours").value) || 12;
loadOps();
});
function drawChart(buckets, minLev) {
const svg = document.getElementById("levChart");
@@ -681,7 +698,13 @@
async function loadOps() {
const date = document.getElementById("anchorDate").value;
const q = new URLSearchParams({ range: state.range, side: state.side, bucket_minutes: "60", date });
const q = new URLSearchParams({
range: state.range,
side: state.side,
bucket_minutes: "60",
date,
min_hours: String(state.minHours || 12),
});
try {
const d = await apiFetch("/api/stats/ops-map?" + q).then(r => {
if (!r.ok) throw new Error("ops-map " + r.status);
web/src/api/client.ts
+2
View File
@@ -251,12 +251,14 @@ export async function fetchOpsMap(params: {
date?: string;
side?: string;
bucket_minutes?: number;
min_hours?: number;
}): Promise<OpsMap> {
const q = new URLSearchParams();
q.set("range", params.range);
if (params.date) q.set("date", params.date);
if (params.side) q.set("side", params.side);
if (params.bucket_minutes) q.set("bucket_minutes", String(params.bucket_minutes));
if (params.min_hours != null) q.set("min_hours", String(params.min_hours));
const r = await apiFetch(`/api/stats/ops-map?${q}`);
if (!r.ok) throw new Error(r.status === 401 ? "unauthorized" : "ops-map failed");
return r.json();
web/src/pages/OpsMap.tsx
+19 -2
View File
@@ -15,6 +15,8 @@ import { leverageSummary, moveSummary } from "../lib/opsSummary";
type RangeKey = "day" | "week" | "month";
type SideKey = "both" | "C" | "P";
const MIN_HOURS_OPTIONS = Array.from({ length: (48 - 8) / 2 + 1 }, (_, i) => 8 + i * 2);
function todayYmd() {
const d = new Date();
const y = d.getFullYear();
@@ -29,6 +31,7 @@ export default function OpsMapPage() {
const [range, setRange] = useState<RangeKey>("day");
const [side, setSide] = useState<SideKey>("both");
const [date, setDate] = useState(todayYmd());
const [minHours, setMinHours] = useState(12);
const [moveMode, setMoveMode] = useState<"abs" | "signed">("abs");
const [data, setData] = useState<OpsMap | null>(null);
const [err, setErr] = useState<string | null>(null);
@@ -52,7 +55,7 @@ export default function OpsMapPage() {
if (!ready || needLogin) return;
let alive = true;
setLoading(true);
fetchOpsMap({ range, date, side, bucket_minutes: 60 })
fetchOpsMap({ range, date, side, bucket_minutes: 60, min_hours: minHours })
.then((d) => {
if (!alive) return;
setData(d);
@@ -70,7 +73,7 @@ export default function OpsMapPage() {
return () => {
alive = false;
};
}, [range, side, date, ready, needLogin]);
}, [range, side, date, minHours, ready, needLogin]);
if (!ready) {
return (
@@ -122,6 +125,20 @@ export default function OpsMapPage() {
锚点日
<input type="date" value={date} onChange={(e) => setDate(e.target.value)} />
</label>
<label className="date-field">
距离到期 ≥
<select
value={minHours}
onChange={(e) => setMinHours(Number(e.target.value))}
aria-label="距离到期最小小时数"
>
{MIN_HOURS_OPTIONS.map((h) => (
<option key={h} value={h}>
{h}h
</option>
))}
</select>
</label>
</div>
{err && <p style={{ color: "#e85d5d" }}>{err}</p>}
web/src/styles.css
+2 -1
View File
@@ -159,7 +159,8 @@ select.field-input { cursor: pointer; }
color: var(--muted);
font-size: 0.85rem;
}
.date-field input {
.date-field input,
.date-field select {
background: var(--panel);
border: 1px solid #243041;
color: var(--text);