Alberto Balbo
d25b4443c0
Sono stati aggiunti tutti i file principali di Bootstrap 5.3.3, inclusi CSS, JavaScript (bundle, ESM, UMD, minificati), versioni RTL, utility, reboot, griglia e relative mappe delle sorgenti. Questi file abilitano un sistema di design moderno, responsive e accessibile, con supporto per layout LTR e RTL, debugging avanzato tramite source map e tutte le funzionalità di Bootstrap per lo sviluppo dell’interfaccia utente. Nessuna modifica ai file esistenti.
319 lines
12 KiB
Plaintext
319 lines
12 KiB
Plaintext
@page "/strategies"
|
|
@using TradingBot.Models
|
|
@using TradingBot.Services
|
|
@inject TradingBotService BotService
|
|
@implements IDisposable
|
|
@rendermode InteractiveServer
|
|
|
|
<PageTitle>Strategie - TradingBot</PageTitle>
|
|
|
|
<div class="strategies-page">
|
|
<div class="page-header">
|
|
<div>
|
|
<h1>Gestione Strategie</h1>
|
|
<p class="subtitle">Crea e gestisci le tue strategie di trading automatizzate</p>
|
|
</div>
|
|
<button class="btn-primary">
|
|
<span class="bi bi-plus-lg"></span>
|
|
Nuova Strategia
|
|
</button>
|
|
</div>
|
|
|
|
<div class="strategies-grid">
|
|
|
|
<!-- Active Strategy Card -->
|
|
<div class="strategy-card active">
|
|
<div class="card-header">
|
|
<div class="strategy-info">
|
|
<h3>RSI + MACD Cross</h3>
|
|
<span class="badge active">ATTIVA</span>
|
|
</div>
|
|
<div class="strategy-actions">
|
|
<button class="btn-icon" title="Modifica">
|
|
<span class="bi bi-pencil"></span>
|
|
</button>
|
|
<button class="btn-icon" title="Duplica">
|
|
<span class="bi bi-files"></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
<div class="strategy-description">
|
|
Strategia basata su indicatori tecnici RSI e MACD per identificare punti di ingresso e uscita ottimali
|
|
</div>
|
|
|
|
<div class="strategy-stats">
|
|
<div class="stat">
|
|
<span class="stat-label">Asset Applicati</span>
|
|
<span class="stat-value">@activeAssets/@totalAssets</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-label">Win Rate</span>
|
|
<span class="stat-value profit">@portfolioStats.WinRate.ToString("F1")%</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-label">Trades Totali</span>
|
|
<span class="stat-value">@portfolioStats.TotalTrades</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-label">Profitto</span>
|
|
<span class="stat-value @(portfolioStats.TotalProfit >= 0 ? "profit" : "loss")">
|
|
$@portfolioStats.TotalProfit.ToString("N2")
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="strategy-parameters">
|
|
<h4>Parametri</h4>
|
|
<div class="params-grid">
|
|
<div class="param">
|
|
<span class="param-label">Condizione BUY</span>
|
|
<code class="param-value">RSI < 40 AND MACD > 0</code>
|
|
</div>
|
|
<div class="param">
|
|
<span class="param-label">Condizione SELL</span>
|
|
<code class="param-value">RSI > 60 AND MACD < 0</code>
|
|
</div>
|
|
<div class="param">
|
|
<span class="param-label">Stop Loss</span>
|
|
<code class="param-value">5%</code>
|
|
</div>
|
|
<div class="param">
|
|
<span class="param-label">Take Profit</span>
|
|
<code class="param-value">10%</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="strategy-indicators">
|
|
<h4>Indicatori Utilizzati</h4>
|
|
<div class="indicators-list">
|
|
<span class="indicator-tag">
|
|
<span class="bi bi-graph-up"></span>
|
|
RSI (14)
|
|
</span>
|
|
<span class="indicator-tag">
|
|
<span class="bi bi-graph-down"></span>
|
|
MACD (12, 26, 9)
|
|
</span>
|
|
<span class="indicator-tag">
|
|
<span class="bi bi-activity"></span>
|
|
EMA (12, 26)
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-footer">
|
|
<button class="btn-secondary">
|
|
<span class="bi bi-pause-circle"></span>
|
|
Disattiva
|
|
</button>
|
|
<button class="btn-primary" @onclick="@(() => NavigateToStatistics())">
|
|
<span class="bi bi-bar-chart-line"></span>
|
|
Vedi Performance
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Example Inactive Strategy Cards -->
|
|
<div class="strategy-card">
|
|
<div class="card-header">
|
|
<div class="strategy-info">
|
|
<h3>Media Mobile Semplice</h3>
|
|
<span class="badge inactive">INATTIVA</span>
|
|
</div>
|
|
<div class="strategy-actions">
|
|
<button class="btn-icon" title="Modifica">
|
|
<span class="bi bi-pencil"></span>
|
|
</button>
|
|
<button class="btn-icon" title="Elimina">
|
|
<span class="bi bi-trash"></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
<div class="strategy-description">
|
|
Strategia classica basata sull'incrocio di medie mobili a breve e lungo termine
|
|
</div>
|
|
|
|
<div class="strategy-stats">
|
|
<div class="stat">
|
|
<span class="stat-label">Asset Applicati</span>
|
|
<span class="stat-value">0/@totalAssets</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-label">Win Rate</span>
|
|
<span class="stat-value">-</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-label">Trades Totali</span>
|
|
<span class="stat-value">0</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-label">Profitto</span>
|
|
<span class="stat-value">$0.00</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="strategy-parameters">
|
|
<h4>Parametri</h4>
|
|
<div class="params-grid">
|
|
<div class="param">
|
|
<span class="param-label">SMA Breve</span>
|
|
<code class="param-value">10 periodi</code>
|
|
</div>
|
|
<div class="param">
|
|
<span class="param-label">SMA Lungo</span>
|
|
<code class="param-value">30 periodi</code>
|
|
</div>
|
|
<div class="param">
|
|
<span class="param-label">Stop Loss</span>
|
|
<code class="param-value">3%</code>
|
|
</div>
|
|
<div class="param">
|
|
<span class="param-label">Take Profit</span>
|
|
<code class="param-value">8%</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="strategy-indicators">
|
|
<h4>Indicatori Utilizzati</h4>
|
|
<div class="indicators-list">
|
|
<span class="indicator-tag">
|
|
<span class="bi bi-graph-up"></span>
|
|
SMA (10)
|
|
</span>
|
|
<span class="indicator-tag">
|
|
<span class="bi bi-graph-up"></span>
|
|
SMA (30)
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-footer">
|
|
<button class="btn-secondary">
|
|
<span class="bi bi-play-circle"></span>
|
|
Attiva
|
|
</button>
|
|
<button class="btn-secondary">
|
|
<span class="bi bi-pencil"></span>
|
|
Modifica
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Template Strategy Card -->
|
|
<div class="strategy-card template">
|
|
<div class="template-content">
|
|
<div class="template-icon">
|
|
<span class="bi bi-diagram-3"></span>
|
|
</div>
|
|
<h3>Crea Nuova Strategia</h3>
|
|
<p>Progetta una strategia personalizzata con indicatori tecnici e regole di trading</p>
|
|
<button class="btn-primary">
|
|
<span class="bi bi-plus-lg"></span>
|
|
Inizia Ora
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Strategy Templates Section -->
|
|
<div class="templates-section">
|
|
<h2>Template Strategie</h2>
|
|
<p class="section-subtitle">Inizia da modelli predefiniti e personalizzali secondo le tue esigenze</p>
|
|
|
|
<div class="templates-grid">
|
|
<div class="template-item">
|
|
<div class="template-header">
|
|
<span class="bi bi-lightning-charge"></span>
|
|
<h4>Scalping Veloce</h4>
|
|
</div>
|
|
<p>Strategia ad alta frequenza per profitti rapidi su piccoli movimenti di prezzo</p>
|
|
<button class="btn-outline">
|
|
<span class="bi bi-download"></span>
|
|
Usa Template
|
|
</button>
|
|
</div>
|
|
|
|
<div class="template-item">
|
|
<div class="template-header">
|
|
<span class="bi bi-graph-up-arrow"></span>
|
|
<h4>Trend Following</h4>
|
|
</div>
|
|
<p>Segui le tendenze di mercato dominanti per massimizzare i profitti</p>
|
|
<button class="btn-outline">
|
|
<span class="bi bi-download"></span>
|
|
Usa Template
|
|
</button>
|
|
</div>
|
|
|
|
<div class="template-item">
|
|
<div class="template-header">
|
|
<span class="bi bi-arrow-left-right"></span>
|
|
<h4>Mean Reversion</h4>
|
|
</div>
|
|
<p>Sfrutta il ritorno dei prezzi verso la media storica</p>
|
|
<button class="btn-outline">
|
|
<span class="bi bi-download"></span>
|
|
Usa Template
|
|
</button>
|
|
</div>
|
|
|
|
<div class="template-item">
|
|
<div class="template-header">
|
|
<span class="bi bi-shield-check"></span>
|
|
<h4>Conservative</h4>
|
|
</div>
|
|
<p>Strategia a basso rischio con protezione del capitale</p>
|
|
<button class="btn-outline">
|
|
<span class="bi bi-download"></span>
|
|
Usa Template
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@code {
|
|
private PortfolioStatistics portfolioStats = new();
|
|
private int activeAssets = 0;
|
|
private int totalAssets = 0;
|
|
|
|
protected override void OnInitialized()
|
|
{
|
|
BotService.OnStatusChanged += HandleUpdate;
|
|
BotService.OnTradeExecuted += HandleTradeExecuted;
|
|
|
|
RefreshData();
|
|
}
|
|
|
|
private void RefreshData()
|
|
{
|
|
portfolioStats = BotService.GetPortfolioStatistics();
|
|
activeAssets = BotService.AssetConfigurations.Values.Count(c => c.IsEnabled);
|
|
totalAssets = BotService.AssetConfigurations.Count;
|
|
StateHasChanged();
|
|
}
|
|
|
|
private void NavigateToStatistics()
|
|
{
|
|
// Navigate to statistics page
|
|
}
|
|
|
|
private void HandleUpdate() => InvokeAsync(RefreshData);
|
|
private void HandleTradeExecuted(Trade trade) => InvokeAsync(RefreshData);
|
|
|
|
public void Dispose()
|
|
{
|
|
BotService.OnStatusChanged -= HandleUpdate;
|
|
BotService.OnTradeExecuted -= HandleTradeExecuted;
|
|
}
|
|
}
|