joe/IB-Dashboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

I think that's it for now.

Browse Source
This commit is contained in:
Joe Tretter
2026-04-01 22:38:04 -05:00
parent 1835fb89d8
commit 253858d46a
5 changed files with 467 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
frontend/index.html
View File

@@ -16,7 +16,14 @@
margin-top: 12px;
background: #fff;
}
table { border-collapse: separate; border-spacing: 0; width: 100%; margin-top: 0; background: #fff }
table {
border-collapse: separate;
border-spacing: 0;
width: max-content;
margin-top: 0;
background: #fff;
table-layout: auto;
}
th, td {
padding: 8px;
text-align: left;
@@ -26,6 +33,31 @@
th:first-child, td:first-child { border-left: 1px solid #ddd }
.section-head { display: flex; align-items: center; gap: 10px }
.help-wrap { position: relative; display: inline-flex; align-items: center }
.aggregate-toggle { display: inline-flex; align-items: center; gap: 8px; font-weight: 600 }
.aggregate-toggle input { margin: 0 }
.refresh-button {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 8px 12px;
border: 1px solid #bfc7d1;
border-radius: 8px;
background: #f7f9fb;
color: #19324d;
font-size: 14px;
font-weight: 700;
cursor: pointer;
margin-right: 0;
}
.refresh-button:hover { background: #eef3f8 }
.refresh-button:disabled {
cursor: wait;
opacity: 0.7;
}
.refresh-icon {
font-size: 16px;
line-height: 1;
}
.help-badge {
display: inline-flex;
align-items: center;
@@ -68,6 +100,7 @@
user-select: none;
white-space: nowrap;
}
th.dragging { opacity: 0.55 }
thead tr.sort-row th {
top: 0;
height: var(--sort-row-height);
@@ -92,7 +125,7 @@
thead tr.filter-row th:hover { background: #fafafa }
.filter-input {
width: 100%;
min-width: 82px;
min-width: 0;
margin: 0;
padding: 5px 6px;
box-sizing: border-box;
@@ -100,6 +133,12 @@
border: 1px solid #cfd3d7;
background: #fff;
}
.filter-input.filter-text { width: 9ch }
.filter-input.filter-select { width: auto; min-width: 5.5ch; max-width: 100% }
.filter-input.filter-active {
background: #f9e1e8;
border-color: #e5b8c7;
}
tbody tr:nth-child(odd) { background: #ffffff }
tbody tr:nth-child(even) { background: #f3f3f3 }
td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap }
@@ -142,53 +181,21 @@
<p><strong>Date filters:</strong> use either wildcards like <code>2025-07*</code> or comparisons like <code>&gt;2025-01-01</code>.</p>
</div>
</div>
<label class="aggregate-toggle">
<input id="aggregate-same-day" type="checkbox" checked />
<span>Aggregate same-day lots</span>
</label>
<button id="refresh-lots" class="refresh-button" type="button" title="Refresh lots">
<span class="refresh-icon">&#x21bb;</span>
<span>Refresh</span>
</button>
</div>
<div class="table-wrap">
<table id="positions-table">
<thead>
<tr class="sort-row">
<th data-column="security_type">Type</th>
<th data-column="display_symbol">Security</th>
<th data-column="underlying_symbol">Underlying</th>
<th data-column="qty">Qty</th>
<th data-column="avg_price">Avg Price</th>
<th data-column="cost_basis">Cost Basis</th>
<th data-column="market_price">Market Price</th>
<th data-column="market_value">Market Value</th>
<th data-column="gain_dollars">Gain $</th>
<th data-column="gain_percent">Gain %</th>
<th data-column="cagr_percent">CAGR %</th>
<th data-column="days_since_buy">Days Since Buy</th>
<th data-column="ltcg">LTCG</th>
<th data-column="buy_time">Buy Time</th>
</tr>
<tr class="filter-row">
<th>
<select class="filter-input" data-column="security_type" title="Filter by security type.">
<option value="">All</option>
<option value="STK">STK</option>
<option value="OPT">OPT</option>
</select>
</th>
<th><input class="filter-input" data-column="display_symbol" placeholder="AM*" title="Text filter. Use * and ? wildcards." /></th>
<th><input class="filter-input" data-column="underlying_symbol" placeholder="A*" title="Text filter. Use * and ? wildcards." /></th>
<th><input class="filter-input" data-column="qty" placeholder=">100" title="Numeric filter. Examples: >100, <=0, 25" /></th>
<th><input class="filter-input" data-column="avg_price" placeholder="<20" title="Numeric filter. Examples: >100, <=0, 25" /></th>
<th><input class="filter-input" data-column="cost_basis" placeholder=">1000" title="Numeric filter. Examples: >100, <=0, 25" /></th>
<th><input class="filter-input" data-column="market_price" placeholder="<10" title="Numeric filter. Examples: >100, <=0, 25" /></th>
<th><input class="filter-input" data-column="market_value" placeholder=">5000" title="Numeric filter. Examples: >100, <=0, 25" /></th>
<th><input class="filter-input" data-column="gain_dollars" placeholder=">0" title="Numeric filter. Examples: >100, <=0, 25" /></th>
<th><input class="filter-input" data-column="gain_percent" placeholder=">10" title="Numeric filter. Examples: >100, <=0, 25" /></th>
<th><input class="filter-input" data-column="cagr_percent" placeholder=">5" title="Numeric filter. Examples: >100, <=0, 25" /></th>
<th><input class="filter-input" data-column="days_since_buy" placeholder=">365" title="Numeric filter. Examples: >100, <=0, 25" /></th>
<th>
<select class="filter-input" data-column="ltcg" title="Filter by LTCG eligibility.">
<option value="">All</option>
<option value="X">Long-term</option>
<option value="!X">Short-term</option>
</select>
</th>
<th><input class="filter-input" data-column="buy_time" placeholder=">2025-01-01" title="Date filter. Use * and ? wildcards or comparisons like >2025-01-01." /></th>
</tr>
</thead>
<tbody></tbody>