mirror of
https://github.com/Xe138/AI-Trader.git
synced 2026-04-02 09:37:23 -04:00
119 lines
5.3 KiB
HTML
119 lines
5.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Portfolio Analysis - LiveTradeBench</title>
|
|
<link rel="stylesheet" href="assets/css/styles.css">
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<nav class="navbar">
|
|
<div class="nav-container">
|
|
<div class="nav-brand">
|
|
<span class="brand-icon">📊</span>
|
|
<h1>LiveTradeBench</h1>
|
|
</div>
|
|
<ul class="nav-menu">
|
|
<li><a href="index.html" class="nav-link">Asset Evolution</a></li>
|
|
<li><a href="portfolio.html" class="nav-link active">Portfolio Analysis</a></li>
|
|
</ul>
|
|
<a href="https://github.com/HKUDS/AI-Trader" target="_blank" rel="noopener noreferrer" class="github-link" aria-label="View source on GitHub">
|
|
<svg class="github-icon" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
|
|
</svg>
|
|
<span class="github-text">Star on GitHub</span>
|
|
</a>
|
|
</div>
|
|
</nav>
|
|
|
|
<main class="container">
|
|
<header class="page-header">
|
|
<h2>Agent Portfolio Breakdown</h2>
|
|
<p class="subtitle">Detailed analysis of each AI agent's holdings and performance</p>
|
|
</header>
|
|
|
|
<section class="agent-selector-section">
|
|
<label for="agentSelect">Select Agent:</label>
|
|
<select id="agentSelect" class="agent-select"></select>
|
|
</section>
|
|
|
|
<section class="portfolio-grid">
|
|
<div class="portfolio-card">
|
|
<h3>Performance Metrics</h3>
|
|
<div class="metrics-list">
|
|
<div class="metric-item">
|
|
<span class="metric-label">Total Asset Value</span>
|
|
<span class="metric-value" id="totalAsset">$0.00</span>
|
|
</div>
|
|
<div class="metric-item">
|
|
<span class="metric-label">Total Return</span>
|
|
<span class="metric-value" id="totalReturn">0.00%</span>
|
|
</div>
|
|
<div class="metric-item">
|
|
<span class="metric-label">Cash Position</span>
|
|
<span class="metric-value" id="cashPosition">$0.00</span>
|
|
</div>
|
|
<div class="metric-item">
|
|
<span class="metric-label">Total Trades</span>
|
|
<span class="metric-value" id="totalTrades">0</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="portfolio-card">
|
|
<h3>Asset Allocation</h3>
|
|
<div class="chart-container-small">
|
|
<canvas id="allocationChart"></canvas>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="holdings-section">
|
|
<h3>Current Holdings</h3>
|
|
<div class="holdings-scroll-wrapper">
|
|
<div class="holdings-table-container">
|
|
<table class="holdings-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Symbol</th>
|
|
<th>Shares</th>
|
|
<th>Current Price</th>
|
|
<th>Market Value</th>
|
|
<th>Weight</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="holdingsTableBody">
|
|
<!-- Populated by JavaScript -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="trade-history-section">
|
|
<h3>Recent Trade Activity</h3>
|
|
<div class="trade-timeline" id="tradeTimeline">
|
|
<!-- Populated by JavaScript -->
|
|
</div>
|
|
</section>
|
|
|
|
<div class="loading-overlay" id="loadingOverlay">
|
|
<div class="spinner"></div>
|
|
<p>Loading portfolio data...</p>
|
|
</div>
|
|
|
|
<button class="scroll-to-top" id="scrollToTop" aria-label="Scroll to top">
|
|
↑
|
|
</button>
|
|
</main>
|
|
|
|
<footer class="footer">
|
|
<p>LiveTradeBench © 2025 | AI-Powered Trading Agent Benchmark</p>
|
|
</footer>
|
|
|
|
<script src="assets/js/data-loader.js"></script>
|
|
<script src="assets/js/portfolio.js"></script>
|
|
</body>
|
|
</html>
|