Migliora badge stato aste: nuovi colori, icone, animazioni
Rivisti i metodi di calcolo e visualizzazione dello stato delle aste in Index.razor.cs, distinguendo tra stati di sistema e controllati dall’utente. Aggiunte nuove classi CSS e animazioni in modern-pages.css per badge più chiari, compatti e animati. Mantenuta compatibilità con classi Bootstrap legacy. Migliorata la leggibilità e l’usabilità della tabella aste.
This commit is contained in:
@@ -639,31 +639,112 @@ namespace AutoBidder.Pages
|
||||
|
||||
private string GetStatusBadgeClass(AuctionInfo auction)
|
||||
{
|
||||
if (!auction.IsActive) return "bg-secondary";
|
||||
if (auction.IsPaused) return "bg-warning text-dark";
|
||||
return "bg-success";
|
||||
// Prima controlla lo stato real-time dell'asta (da LastState)
|
||||
if (auction.LastState != null)
|
||||
{
|
||||
return auction.LastState.Status switch
|
||||
{
|
||||
AuctionStatus.EndedWon => "status-won",
|
||||
AuctionStatus.EndedLost => "status-lost",
|
||||
AuctionStatus.Closed => "status-closed",
|
||||
AuctionStatus.Paused => "status-system-paused",
|
||||
AuctionStatus.Pending => "status-pending",
|
||||
AuctionStatus.Scheduled => "status-scheduled",
|
||||
AuctionStatus.NotStarted => "status-scheduled",
|
||||
_ => GetUserControlStatusClass(auction)
|
||||
};
|
||||
}
|
||||
|
||||
return GetUserControlStatusClass(auction);
|
||||
}
|
||||
|
||||
private string GetUserControlStatusClass(AuctionInfo auction)
|
||||
{
|
||||
// Stati controllati dall'utente
|
||||
if (!auction.IsActive) return "status-stopped";
|
||||
if (auction.IsPaused) return "status-paused";
|
||||
if (auction.IsAttackInProgress) return "status-attacking";
|
||||
return "status-active";
|
||||
}
|
||||
|
||||
private string GetStatusText(AuctionInfo auction)
|
||||
{
|
||||
if (!auction.IsActive) return "Fermo";
|
||||
// Prima controlla lo stato real-time dell'asta
|
||||
if (auction.LastState != null)
|
||||
{
|
||||
switch (auction.LastState.Status)
|
||||
{
|
||||
case AuctionStatus.EndedWon:
|
||||
return "Vinta!";
|
||||
case AuctionStatus.EndedLost:
|
||||
return "Persa";
|
||||
case AuctionStatus.Closed:
|
||||
return "Chiusa";
|
||||
case AuctionStatus.Paused:
|
||||
return "Sospesa";
|
||||
case AuctionStatus.Pending:
|
||||
return "In Attesa";
|
||||
case AuctionStatus.Scheduled:
|
||||
case AuctionStatus.NotStarted:
|
||||
return "Programmata";
|
||||
}
|
||||
}
|
||||
|
||||
// Stati controllati dall'utente
|
||||
if (!auction.IsActive) return "Fermata";
|
||||
if (auction.IsPaused) return "Pausa";
|
||||
return "Attivo";
|
||||
if (auction.IsAttackInProgress) return "Puntando";
|
||||
return "Attiva";
|
||||
}
|
||||
|
||||
private string GetStatusIcon(AuctionInfo auction)
|
||||
{
|
||||
// Usa icone Bootstrap Icons invece di emoji
|
||||
// Prima controlla lo stato real-time dell'asta
|
||||
if (auction.LastState != null)
|
||||
{
|
||||
switch (auction.LastState.Status)
|
||||
{
|
||||
case AuctionStatus.EndedWon:
|
||||
return "<i class='bi bi-trophy-fill'></i>";
|
||||
case AuctionStatus.EndedLost:
|
||||
return "<i class='bi bi-x-circle-fill'></i>";
|
||||
case AuctionStatus.Closed:
|
||||
return "<i class='bi bi-lock-fill'></i>";
|
||||
case AuctionStatus.Paused:
|
||||
return "<i class='bi bi-moon-fill'></i>";
|
||||
case AuctionStatus.Pending:
|
||||
return "<i class='bi bi-hourglass-split'></i>";
|
||||
case AuctionStatus.Scheduled:
|
||||
case AuctionStatus.NotStarted:
|
||||
return "<i class='bi bi-calendar-event'></i>";
|
||||
}
|
||||
}
|
||||
|
||||
// Stati controllati dall'utente
|
||||
if (!auction.IsActive) return "<i class='bi bi-stop-circle'></i>";
|
||||
if (auction.IsPaused) return "<i class='bi bi-pause-circle'></i>";
|
||||
if (auction.IsAttackInProgress) return "<i class='bi bi-lightning-charge-fill'></i>";
|
||||
return "<i class='bi bi-play-circle-fill'></i>";
|
||||
}
|
||||
|
||||
private string GetStatusAnimationClass(AuctionInfo auction)
|
||||
{
|
||||
// Animazioni per stati speciali
|
||||
if (auction.LastState != null)
|
||||
{
|
||||
switch (auction.LastState.Status)
|
||||
{
|
||||
case AuctionStatus.EndedWon:
|
||||
return "status-anim-won";
|
||||
case AuctionStatus.Running when auction.IsAttackInProgress:
|
||||
return "status-anim-attacking";
|
||||
}
|
||||
}
|
||||
|
||||
if (!auction.IsActive) return "";
|
||||
if (auction.IsPaused) return "status-paused";
|
||||
return "status-active";
|
||||
if (auction.IsPaused) return "status-anim-paused";
|
||||
if (auction.IsAttackInProgress) return "status-anim-attacking";
|
||||
return "status-anim-active";
|
||||
}
|
||||
|
||||
private string GetPriceDisplay(AuctionInfo? auction)
|
||||
|
||||
@@ -458,3 +458,174 @@
|
||||
from { transform: rotate(0deg); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* === AUCTION MONITOR STATUS BADGES === */
|
||||
|
||||
/* Base badge styling for auction status - COMPACT */
|
||||
.col-stato .badge {
|
||||
font-size: 0.65rem;
|
||||
font-weight: 600;
|
||||
padding: 0.25rem 0.45rem;
|
||||
border-radius: 4px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.25rem;
|
||||
min-width: 65px;
|
||||
justify-content: center;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.2px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* Icon inside badge - smaller */
|
||||
.col-stato .badge i {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
|
||||
/* === USER-CONTROLLED STATES === */
|
||||
|
||||
/* Active - Monitoring enabled, bright green */
|
||||
.col-stato .badge.status-active {
|
||||
background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
|
||||
color: white;
|
||||
box-shadow: 0 0 8px rgba(34, 197, 94, 0.4), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* Paused by user - Orange */
|
||||
.col-stato .badge.status-paused {
|
||||
background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
|
||||
color: #1a1a1a;
|
||||
box-shadow: 0 0 6px rgba(245, 158, 11, 0.3), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* Stopped by user - Gray */
|
||||
.col-stato .badge.status-stopped {
|
||||
background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%);
|
||||
color: #e5e5e5;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
/* Attacking/Bidding - Electric blue with glow */
|
||||
.col-stato .badge.status-attacking {
|
||||
background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
|
||||
color: white;
|
||||
box-shadow: 0 0 12px rgba(59, 130, 246, 0.6), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* === AUCTION LIFECYCLE STATES === */
|
||||
|
||||
/* Won - Gold/Yellow celebration */
|
||||
.col-stato .badge.status-won {
|
||||
background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
|
||||
color: #1a1a1a;
|
||||
box-shadow: 0 0 12px rgba(251, 191, 36, 0.6), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* Lost - Red muted */
|
||||
.col-stato .badge.status-lost {
|
||||
background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
|
||||
color: white;
|
||||
box-shadow: 0 0 6px rgba(239, 68, 68, 0.3), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
opacity: 0.85;
|
||||
}
|
||||
|
||||
/* Closed - Dark gray */
|
||||
.col-stato .badge.status-closed {
|
||||
background: linear-gradient(135deg, #374151 0%, #1f2937 100%);
|
||||
color: #9ca3af;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
/* System Paused (night pause) - Purple/Indigo */
|
||||
.col-stato .badge.status-system-paused {
|
||||
background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
|
||||
color: white;
|
||||
box-shadow: 0 0 6px rgba(139, 92, 246, 0.3), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* Pending/Waiting - Cyan */
|
||||
.col-stato .badge.status-pending {
|
||||
background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%);
|
||||
color: white;
|
||||
box-shadow: 0 0 6px rgba(6, 182, 212, 0.3), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* Scheduled - Teal */
|
||||
.col-stato .badge.status-scheduled {
|
||||
background: linear-gradient(135deg, #14b8a6 0%, #0d9488 100%);
|
||||
color: white;
|
||||
box-shadow: 0 0 6px rgba(20, 184, 166, 0.3), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* === ANIMATIONS === */
|
||||
|
||||
/* Active pulse - subtle */
|
||||
.col-stato .badge.status-anim-active {
|
||||
animation: statusPulseActive 2.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes statusPulseActive {
|
||||
0%, 100% {
|
||||
box-shadow: 0 0 8px rgba(34, 197, 94, 0.4), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
50% {
|
||||
box-shadow: 0 0 14px rgba(34, 197, 94, 0.7), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
/* Paused blink */
|
||||
.col-stato .badge.status-anim-paused {
|
||||
animation: statusBlink 1.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes statusBlink {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.65; }
|
||||
}
|
||||
|
||||
/* Attacking - fast pulse */
|
||||
.col-stato .badge.status-anim-attacking {
|
||||
animation: statusAttacking 0.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes statusAttacking {
|
||||
0%, 100% {
|
||||
box-shadow: 0 0 12px rgba(59, 130, 246, 0.6), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
transform: scale(1);
|
||||
}
|
||||
50% {
|
||||
box-shadow: 0 0 20px rgba(59, 130, 246, 0.9), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
transform: scale(1.02);
|
||||
}
|
||||
}
|
||||
|
||||
/* Won celebration */
|
||||
.col-stato .badge.status-anim-won {
|
||||
animation: statusWon 1s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes statusWon {
|
||||
0%, 100% {
|
||||
box-shadow: 0 0 12px rgba(251, 191, 36, 0.6), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
50% {
|
||||
box-shadow: 0 0 20px rgba(251, 191, 36, 0.9), 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
/* Legacy Bootstrap classes override for backward compatibility */
|
||||
.col-stato .badge.bg-success {
|
||||
background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.col-stato .badge.bg-warning {
|
||||
background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
|
||||
color: #1a1a1a !important;
|
||||
}
|
||||
|
||||
.col-stato .badge.bg-secondary {
|
||||
background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%) !important;
|
||||
color: #e5e5e5 !important;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user