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

Add options stats holding time metrics and lightweight charts.

Browse Source 
Show average hold duration for wins and losses, open positions, and CSS ring/bar visualizations in the stats tab.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-07-10 11:32:45 +08:00
parent 9f255f13dd
commit d1ab2d5172
7 changed files with 455 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/common/static/instance_theme.css
+106
View File
@@ -3254,6 +3254,102 @@ html[data-theme="light"] .options-estimate-row {
.options-pos-stats-card {
flex-shrink: 0;
}
.options-stats-panel {
display: flex;
flex-direction: column;
gap: 10px;
min-height: 0;
}
.options-stats-charts {
display: grid;
grid-template-columns: auto 1fr;
gap: 10px 12px;
align-items: center;
}
.opt-stats-chart--ring {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
}
.opt-stats-ring {
--win-pct: 0;
width: 68px;
height: 68px;
border-radius: 50%;
background: conic-gradient(
#4cd97f 0 calc(var(--win-pct) * 1%),
#ff6b6b calc(var(--win-pct) * 1%) 100%
);
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.opt-stats-ring::before {
content: "";
position: absolute;
inset: 8px;
border-radius: 50%;
background: #141923;
}
.opt-stats-ring-label {
position: relative;
z-index: 1;
font-size: 0.82rem;
font-weight: 700;
font-variant-numeric: tabular-nums;
}
.opt-stats-chart-caption,
.opt-stats-chart-title {
font-size: 0.66rem;
color: #9aa3bf;
text-align: center;
}
.opt-stats-chart-title {
margin-bottom: 4px;
text-align: left;
}
.opt-stats-chart--pnl,
.opt-stats-chart--hold {
display: flex;
flex-direction: column;
gap: 6px;
min-width: 0;
}
.opt-stats-bar-row {
display: grid;
grid-template-columns: 2.2em 1fr auto;
gap: 6px;
align-items: center;
font-size: 0.72rem;
}
.opt-stats-bar-row .k {
opacity: 0.8;
}
.opt-stats-bar-row .v {
font-size: 0.7rem;
font-weight: 600;
white-space: nowrap;
}
.opt-stats-bar-track {
height: 8px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.06);
overflow: hidden;
}
.opt-stats-bar-fill {
height: 100%;
width: 0;
border-radius: 999px;
transition: width 0.25s ease;
}
.opt-stats-bar-fill--profit {
background: linear-gradient(90deg, #2f9f62, #4cd97f);
}
.opt-stats-bar-fill--loss {
background: linear-gradient(90deg, #c44a4a, #ff6b6b);
}
.options-stats-grid {
display: flex;
flex-wrap: wrap;
@@ -3690,6 +3786,16 @@ html[data-theme="light"] .opt-pos-tab.active {
box-shadow: inset 0 0 0 1px rgba(0, 95, 140, 0.22) !important;
}
html[data-theme="light"] .opt-stats-ring::before {
background: #f4f7fb;
}
html[data-theme="light"] .opt-stats-bar-track {
background: rgba(20, 34, 50, 0.08);
}
html[data-theme="light"] .opt-stats-chart-caption,
html[data-theme="light"] .opt-stats-chart-title {
color: #5a6a80 !important;
}
html[data-theme="light"] .opt-moneyness-itm {
color: #087a50 !important;
background: rgba(8, 122, 80, 0.12) !important;