c90f446bcb
- Added SystemHealthController with 6 monitoring endpoints - Created System Health Dashboard (Index) with real-time metrics - Implemented Database Performance monitoring with query analysis - Added API Performance tracking with endpoint usage stats - Created Server Resources monitoring (CPU/Memory/Disk/Network) - Implemented Activity Feed with player/combat/purchase/admin events - Added Error Tracking with trend analysis and stack traces - Fixed navigation routing from System to SystemHealth controller - All views use real data from database and system diagnostics - Dark theme styling consistent across all monitoring pages - Chart.js visualizations for trends and metrics Phase 6 Complete - Admin Dashboard fully functional!
869 lines
37 KiB
Plaintext
869 lines
37 KiB
Plaintext
@*
|
|
* File: D:\shadowed-realms-mobile\ShadowedRealmsMobile\src\server\ShadowedRealms.Admin\Views\RevenueAnalytics\PurchasePatterns.cshtml
|
|
* Created: 2025-11-06
|
|
* Last Modified: 2025-11-06
|
|
* Description: Phase 5 - Purchase Patterns Analytics with fraud detection and velocity tracking
|
|
* Last Edit Notes: Complete implementation with real database data, fraud monitoring, and payment analytics
|
|
*@
|
|
|
|
@model ShadowedRealms.Admin.Models.PurchasePatternsViewModel
|
|
|
|
@{
|
|
ViewData["Title"] = "Purchase Patterns Analytics";
|
|
Layout = "~/Views/Shared/_Layout.cshtml";
|
|
}
|
|
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
<style>
|
|
/* Match Revenue Dashboard Dark Theme */
|
|
.stat-card {
|
|
background: linear-gradient(135deg, #1a1f2e 0%, #252b3d 100%);
|
|
border: 1px solid rgba(139, 92, 246, 0.3);
|
|
border-radius: 12px;
|
|
padding: 1.5rem;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.stat-card:hover {
|
|
border-color: rgba(139, 92, 246, 0.6);
|
|
box-shadow: 0 8px 16px rgba(139, 92, 246, 0.2);
|
|
transform: translateY(-2px);
|
|
}
|
|
|
|
.card {
|
|
background: linear-gradient(135deg, #1a1f2e 0%, #252b3d 100%);
|
|
border: 1px solid rgba(139, 92, 246, 0.3);
|
|
border-radius: 12px;
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
.card-header {
|
|
background: rgba(139, 92, 246, 0.1);
|
|
border-bottom: 1px solid rgba(139, 92, 246, 0.3);
|
|
border-radius: 12px 12px 0 0 !important;
|
|
padding: 1rem 1.5rem;
|
|
}
|
|
|
|
.card-header h5 {
|
|
color: #e2e8f0;
|
|
font-weight: 600;
|
|
margin: 0;
|
|
}
|
|
|
|
.card-body {
|
|
padding: 1.5rem;
|
|
}
|
|
|
|
.alert-fraud {
|
|
background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(220, 38, 38, 0.1));
|
|
border: 1px solid rgba(239, 68, 68, 0.3);
|
|
border-radius: 8px;
|
|
padding: 1rem;
|
|
animation: pulse-warning 2s infinite;
|
|
}
|
|
|
|
@@keyframes pulse-warning {
|
|
0%, 100% {
|
|
border-color: rgba(239, 68, 68, 0.3);
|
|
}
|
|
|
|
50% {
|
|
border-color: rgba(239, 68, 68, 0.6);
|
|
}
|
|
}
|
|
|
|
.risk-badge {
|
|
display: inline-block;
|
|
padding: 0.25rem 0.75rem;
|
|
border-radius: 6px;
|
|
font-weight: 600;
|
|
font-size: 0.875rem;
|
|
}
|
|
|
|
.risk-low {
|
|
background: rgba(16, 185, 129, 0.2);
|
|
color: #10b981;
|
|
}
|
|
|
|
.risk-medium {
|
|
background: rgba(245, 158, 11, 0.2);
|
|
color: #f59e0b;
|
|
}
|
|
|
|
.risk-high {
|
|
background: rgba(239, 68, 68, 0.2);
|
|
color: #ef4444;
|
|
}
|
|
|
|
.payment-method-icon {
|
|
width: 40px;
|
|
height: 40px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 8px;
|
|
font-size: 1.25rem;
|
|
}
|
|
|
|
.pm-credit-card {
|
|
background: rgba(59, 130, 246, 0.2);
|
|
color: #3b82f6;
|
|
}
|
|
|
|
.pm-paypal {
|
|
background: rgba(0, 112, 240, 0.2);
|
|
color: #0070f0;
|
|
}
|
|
|
|
.pm-apple-pay {
|
|
background: rgba(0, 0, 0, 0.4);
|
|
color: #ffffff;
|
|
}
|
|
|
|
.pm-google-pay {
|
|
background: rgba(66, 133, 244, 0.2);
|
|
color: #4285f4;
|
|
}
|
|
|
|
.pm-crypto {
|
|
background: rgba(245, 158, 11, 0.2);
|
|
color: #f59e0b;
|
|
}
|
|
|
|
h2, h3, h4, h5, h6 {
|
|
color: #e2e8f0;
|
|
}
|
|
|
|
.text-muted {
|
|
color: #94a3b8 !important;
|
|
}
|
|
|
|
.text-success {
|
|
color: #10b981 !important;
|
|
}
|
|
|
|
.text-warning {
|
|
color: #f59e0b !important;
|
|
}
|
|
|
|
.text-danger {
|
|
color: #ef4444 !important;
|
|
}
|
|
|
|
.text-info {
|
|
color: #3b82f6 !important;
|
|
}
|
|
|
|
.text-primary {
|
|
color: #8b5cf6 !important;
|
|
}
|
|
|
|
.border-danger {
|
|
border-color: rgba(239, 68, 68, 0.5) !important;
|
|
}
|
|
|
|
.border-warning {
|
|
border-color: rgba(245, 158, 11, 0.5) !important;
|
|
}
|
|
|
|
.border-success {
|
|
border-color: rgba(16, 185, 129, 0.5) !important;
|
|
}
|
|
|
|
.border-primary {
|
|
border-color: rgba(139, 92, 246, 0.5) !important;
|
|
}
|
|
|
|
.border-info {
|
|
border-color: rgba(59, 130, 246, 0.5) !important;
|
|
}
|
|
|
|
.table-dark {
|
|
--bs-table-bg: rgba(30, 41, 59, 0.5);
|
|
--bs-table-border-color: rgba(139, 92, 246, 0.2);
|
|
}
|
|
|
|
.table-dark th {
|
|
background: rgba(139, 92, 246, 0.1);
|
|
color: #e2e8f0;
|
|
font-weight: 600;
|
|
border-bottom: 2px solid rgba(139, 92, 246, 0.3);
|
|
}
|
|
|
|
.table-dark td {
|
|
color: #cbd5e1;
|
|
border-color: rgba(139, 92, 246, 0.1);
|
|
}
|
|
|
|
.btn-outline-primary,
|
|
.btn-outline-danger {
|
|
border-width: 2px;
|
|
font-weight: 500;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.btn-outline-primary:hover,
|
|
.btn-outline-danger:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 4px 12px rgba(139, 92, 246, 0.4);
|
|
}
|
|
</style>
|
|
|
|
<div class="container-fluid">
|
|
<!-- Page Header -->
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<nav aria-label="breadcrumb">
|
|
<ol class="breadcrumb mb-2">
|
|
<li class="breadcrumb-item"><a href="@Url.Action("Index", "RevenueAnalytics")">Revenue Analytics</a></li>
|
|
<li class="breadcrumb-item active">Purchase Patterns</li>
|
|
</ol>
|
|
</nav>
|
|
<h2 class="mb-1">
|
|
<i class="fas fa-shopping-cart text-info me-2"></i>
|
|
Purchase Patterns Analytics
|
|
</h2>
|
|
<p class="text-muted mb-0">
|
|
<small>
|
|
<i class="fas fa-clock me-1"></i>
|
|
Last Updated: <span id="lastUpdateTime">@Model.LastUpdated.ToString("MMM dd, yyyy HH:mm:ss")</span>
|
|
</small>
|
|
</p>
|
|
</div>
|
|
<div>
|
|
<button class="btn btn-sm btn-outline-primary" id="refreshDashboard">
|
|
<i class="fas fa-sync-alt"></i> Refresh
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Fraud Detection Alert (if issues detected) -->
|
|
@if (Model.SuspiciousPurchaseCount > 0 || Model.HighRiskPurchaseCount > 0 || Model.VelocityFlaggedCount > 0)
|
|
{
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<div class="alert-fraud">
|
|
<div class="d-flex align-items-center">
|
|
<i class="fas fa-shield-alt fa-2x text-danger me-3"></i>
|
|
<div>
|
|
<h5 class="mb-1 text-danger">Fraud Detection Alerts</h5>
|
|
<p class="mb-0 text-muted">
|
|
<strong>@(Model.SuspiciousPurchaseCount + Model.HighRiskPurchaseCount + Model.VelocityFlaggedCount)</strong>
|
|
potentially fraudulent transactions detected in the last 30 days. Review recommended.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<!-- Fraud Detection Metrics -->
|
|
<div class="row g-3 mb-4">
|
|
<!-- Suspicious Purchases -->
|
|
<div class="col-md-3">
|
|
<div class="card border-danger h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="text-muted mb-2">Suspicious Purchases</h6>
|
|
<h3 class="mb-0 text-danger" id="suspiciousPurchases">
|
|
@Model.SuspiciousPurchaseCount
|
|
</h3>
|
|
<small class="text-muted">Last 30 days</small>
|
|
</div>
|
|
<div class="fs-1 text-danger" style="opacity: 0.5;">
|
|
<i class="fas fa-exclamation-triangle"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- High Risk Transactions -->
|
|
<div class="col-md-3">
|
|
<div class="card border-warning h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="text-muted mb-2">High Risk Transactions</h6>
|
|
<h3 class="mb-0 text-warning" id="highRiskPurchases">
|
|
@Model.HighRiskPurchaseCount
|
|
</h3>
|
|
<small class="text-muted">Flagged by system</small>
|
|
</div>
|
|
<div class="fs-1 text-warning" style="opacity: 0.5;">
|
|
<i class="fas fa-flag"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Velocity Flagged -->
|
|
<div class="col-md-3">
|
|
<div class="card border-warning h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="text-muted mb-2">Velocity Flagged</h6>
|
|
<h3 class="mb-0 text-warning" id="velocityFlagged">
|
|
@Model.VelocityFlaggedCount
|
|
</h3>
|
|
<small class="text-muted">Rapid purchase alerts</small>
|
|
</div>
|
|
<div class="fs-1 text-warning" style="opacity: 0.5;">
|
|
<i class="fas fa-gauge-high"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- High Velocity Players -->
|
|
<div class="col-md-3">
|
|
<div class="card border-info h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="text-muted mb-2">High Velocity Players</h6>
|
|
<h3 class="mb-0 text-info" id="highVelocityPlayers">
|
|
@Model.HighVelocityPlayers
|
|
</h3>
|
|
<small class="text-muted">5+ purchases in 24hr</small>
|
|
</div>
|
|
<div class="fs-1 text-info" style="opacity: 0.5;">
|
|
<i class="fas fa-user-clock"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Purchase Behavior Metrics -->
|
|
<div class="row g-3 mb-4">
|
|
<!-- First Purchases -->
|
|
<div class="col-md-3">
|
|
<div class="card border-success h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="text-muted mb-2">First Purchases (30d)</h6>
|
|
<h3 class="mb-0 text-success" id="firstPurchases">
|
|
@Model.FirstPurchaseCount
|
|
</h3>
|
|
<small class="text-muted">Avg: @Model.AverageFirstPurchaseAmount.ToString("C2")</small>
|
|
</div>
|
|
<div class="fs-1 text-success" style="opacity: 0.5;">
|
|
<i class="fas fa-star"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Repeat Purchasers -->
|
|
<div class="col-md-3">
|
|
<div class="card border-primary h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<h6 class="text-muted mb-2">Repeat Purchasers</h6>
|
|
<h3 class="mb-0 text-primary" id="repeatPurchasers">
|
|
@Model.RepeatPurchaserCount
|
|
</h3>
|
|
<small class="text-muted">2+ purchases</small>
|
|
</div>
|
|
<div class="fs-1 text-primary" style="opacity: 0.5;">
|
|
<i class="fas fa-repeat"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Avg Days Between Purchases -->
|
|
<div class="col-md-3">
|
|
<div class="card h-100">
|
|
<div class="card-body text-center">
|
|
<h6 class="text-muted mb-2">Avg Days Between Purchases</h6>
|
|
<h4 class="mb-0">
|
|
@Model.AverageDaysBetweenPurchases.ToString("F1")
|
|
</h4>
|
|
<small class="text-muted">Repeat purchasers</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Purchase Health -->
|
|
<div class="col-md-3">
|
|
<div class="card h-100">
|
|
<div class="card-body text-center">
|
|
<h6 class="text-muted mb-2">Purchase Health Score</h6>
|
|
<h4 class="mb-0 @(Model.SuspiciousPurchaseCount + Model.HighRiskPurchaseCount < 10 ? "text-success" : "text-warning")">
|
|
@{
|
|
var healthScore = 100 - Math.Min(100, (Model.SuspiciousPurchaseCount + Model.HighRiskPurchaseCount) * 2);
|
|
}
|
|
@healthScore
|
|
</h4>
|
|
<small class="text-muted">Out of 100</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Charts Row -->
|
|
<div class="row g-3 mb-4">
|
|
<!-- Purchase Type Distribution -->
|
|
<div class="col-lg-6">
|
|
<div class="card h-100">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">
|
|
<i class="fas fa-chart-pie me-2"></i>
|
|
Purchase Type Distribution
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
@if (Model.PurchaseTypeDistribution.Any())
|
|
{
|
|
<div style="height: 300px; position: relative;">
|
|
<canvas id="purchaseTypeChart"></canvas>
|
|
</div>
|
|
}
|
|
else
|
|
{
|
|
<div class="text-center py-5">
|
|
<i class="fas fa-shopping-cart fa-3x text-muted mb-3"></i>
|
|
<p class="text-muted">No purchase data available</p>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Payment Method Distribution -->
|
|
<div class="col-lg-6">
|
|
<div class="card h-100">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">
|
|
<i class="fas fa-credit-card me-2"></i>
|
|
Payment Method Distribution
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
@if (Model.PaymentMethodDistribution.Any())
|
|
{
|
|
<div class="row">
|
|
@foreach (var method in Model.PaymentMethodDistribution)
|
|
{
|
|
var iconClass = method.Key.Contains("Credit") ? "fa-credit-card" :
|
|
method.Key.Contains("PayPal") ? "fa-paypal" :
|
|
method.Key.Contains("Apple") ? "fa-apple-pay" :
|
|
method.Key.Contains("Google") ? "fa-google-pay" :
|
|
method.Key.Contains("Crypto") ? "fa-bitcoin" : "fa-wallet";
|
|
|
|
var pmClass = method.Key.Contains("Credit") ? "pm-credit-card" :
|
|
method.Key.Contains("PayPal") ? "pm-paypal" :
|
|
method.Key.Contains("Apple") ? "pm-apple-pay" :
|
|
method.Key.Contains("Google") ? "pm-google-pay" :
|
|
method.Key.Contains("Crypto") ? "pm-crypto" : "pm-credit-card";
|
|
|
|
<div class="col-md-6 mb-3">
|
|
<div class="d-flex align-items-center">
|
|
<div class="payment-method-icon @pmClass me-3">
|
|
<i class="fab @iconClass"></i>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<div class="d-flex justify-content-between mb-1">
|
|
<strong>@method.Key</strong>
|
|
<span class="text-muted">@method.Value.Count</span>
|
|
</div>
|
|
<small class="text-success">@(((decimal)method.Value.Revenue).ToString("C0"))</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
}
|
|
else
|
|
{
|
|
<div class="text-center py-5">
|
|
<i class="fas fa-credit-card fa-3x text-muted mb-3"></i>
|
|
<p class="text-muted">No payment method data available</p>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Fraud Risk Analysis -->
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">
|
|
<i class="fas fa-shield-halved me-2"></i>
|
|
Fraud Risk Analysis
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row text-center">
|
|
<div class="col-md-3">
|
|
<div class="mb-3">
|
|
<i class="fas fa-circle-check fa-2x text-success mb-2"></i>
|
|
<h4 class="mb-1">Low Risk</h4>
|
|
<p class="text-muted mb-0">Clean transactions</p>
|
|
<h3 class="text-success mt-2">
|
|
@{
|
|
var totalFlagged = Model.SuspiciousPurchaseCount + Model.HighRiskPurchaseCount + Model.VelocityFlaggedCount;
|
|
var assumedTotal = totalFlagged > 0 ? totalFlagged * 10 : 100; // Estimate total from flagged
|
|
var lowRisk = Math.Max(0, assumedTotal - totalFlagged);
|
|
}
|
|
@lowRisk
|
|
</h3>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="mb-3">
|
|
<i class="fas fa-exclamation-circle fa-2x text-warning mb-2"></i>
|
|
<h4 class="mb-1">Medium Risk</h4>
|
|
<p class="text-muted mb-0">Requires monitoring</p>
|
|
<h3 class="text-warning mt-2">@Model.VelocityFlaggedCount</h3>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="mb-3">
|
|
<i class="fas fa-triangle-exclamation fa-2x text-danger mb-2"></i>
|
|
<h4 class="mb-1">High Risk</h4>
|
|
<p class="text-muted mb-0">Immediate review</p>
|
|
<h3 class="text-danger mt-2">@Model.HighRiskPurchaseCount</h3>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="mb-3">
|
|
<i class="fas fa-ban fa-2x text-danger mb-2"></i>
|
|
<h4 class="mb-1">Suspicious</h4>
|
|
<p class="text-muted mb-0">Flagged for fraud</p>
|
|
<h3 class="text-danger mt-2">@Model.SuspiciousPurchaseCount</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<hr class="my-4">
|
|
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-3">
|
|
<i class="fas fa-clipboard-list me-2"></i>
|
|
Fraud Prevention Measures Active
|
|
</h6>
|
|
<ul class="list-unstyled">
|
|
<li class="mb-2">
|
|
<i class="fas fa-check-circle text-success me-2"></i>
|
|
<strong>Velocity Tracking:</strong> 24hr, 7day, 30day windows
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-check-circle text-success me-2"></i>
|
|
<strong>Risk Scoring:</strong> Multi-factor fraud analysis
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-check-circle text-success me-2"></i>
|
|
<strong>Device Fingerprinting:</strong> Track unique devices
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-check-circle text-success me-2"></i>
|
|
<strong>Pattern Detection:</strong> Unusual behavior alerts
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-3">
|
|
<i class="fas fa-exclamation-triangle me-2"></i>
|
|
Common Fraud Indicators
|
|
</h6>
|
|
<ul class="list-unstyled">
|
|
<li class="mb-2">
|
|
<i class="fas fa-circle text-warning me-2" style="font-size: 0.5rem;"></i>
|
|
Multiple purchases in short time span
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-circle text-warning me-2" style="font-size: 0.5rem;"></i>
|
|
Unusually high transaction amounts
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-circle text-warning me-2" style="font-size: 0.5rem;"></i>
|
|
Multiple failed payment attempts
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-circle text-warning me-2" style="font-size: 0.5rem;"></i>
|
|
New account with large purchases
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Purchase Velocity Insights -->
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">
|
|
<i class="fas fa-tachometer-alt me-2"></i>
|
|
Purchase Velocity Insights
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col-md-4 text-center mb-3">
|
|
<div class="p-3 border border-info rounded">
|
|
<i class="fas fa-clock fa-2x text-info mb-2"></i>
|
|
<h6 class="text-muted">24-Hour Window</h6>
|
|
<p class="mb-0 small">Players with 5+ purchases or $200+ spending in 24 hours are flagged</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4 text-center mb-3">
|
|
<div class="p-3 border border-warning rounded">
|
|
<i class="fas fa-calendar-week fa-2x text-warning mb-2"></i>
|
|
<h6 class="text-muted">7-Day Window</h6>
|
|
<p class="mb-0 small">Monitored for sustained high spending patterns</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4 text-center mb-3">
|
|
<div class="p-3 border border-danger rounded">
|
|
<i class="fas fa-calendar-days fa-2x text-danger mb-2"></i>
|
|
<h6 class="text-muted">30-Day Window</h6>
|
|
<p class="mb-0 small">Long-term spending behavior analysis</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="alert alert-info mt-3">
|
|
<i class="fas fa-info-circle me-2"></i>
|
|
<strong>Note:</strong> Velocity tracking helps identify problematic spending patterns early,
|
|
allowing for player protection interventions and fraud prevention.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Chargeback Warning Section -->
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-12">
|
|
<div class="card border-danger">
|
|
<div class="card-header bg-danger bg-opacity-10">
|
|
<h5 class="mb-0">
|
|
<i class="fas fa-rotate-left me-2"></i>
|
|
Chargeback Monitoring
|
|
<span class="badge bg-danger ms-2">Account Protection Active</span>
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row text-center mb-4">
|
|
<div class="col-md-3">
|
|
<div class="border border-danger rounded p-3">
|
|
<i class="fas fa-money-bill-transfer fa-2x text-danger mb-2"></i>
|
|
<h6 class="text-muted">Accounts with Chargebacks</h6>
|
|
<h4 class="text-danger mb-0">Track in Player Details</h4>
|
|
<small class="text-muted">Per-account history</small>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="border border-warning rounded p-3">
|
|
<i class="fas fa-exclamation-triangle fa-2x text-warning mb-2"></i>
|
|
<h6 class="text-muted">Chargeback Risk</h6>
|
|
<h4 class="text-warning mb-0">Flagged Players</h4>
|
|
<small class="text-muted">Multiple chargebacks</small>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="border border-info rounded p-3">
|
|
<i class="fas fa-scale-balanced fa-2x text-info mb-2"></i>
|
|
<h6 class="text-muted">Disputed Chargebacks</h6>
|
|
<h4 class="text-info mb-0">Active Cases</h4>
|
|
<small class="text-muted">Under review</small>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="border border-success rounded p-3">
|
|
<i class="fas fa-shield-check fa-2x text-success mb-2"></i>
|
|
<h6 class="text-muted">Protection Score</h6>
|
|
<h4 class="text-success mb-0">View Full Report</h4>
|
|
<small class="text-muted">
|
|
<a href="@Url.Action("ChargebackProtection", "RevenueAnalytics")" class="text-success">
|
|
Detailed Analytics →
|
|
</a>
|
|
</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="alert alert-warning">
|
|
<i class="fas fa-shield-alt me-2"></i>
|
|
<strong>Chargeback Protection:</strong> All purchase transactions track chargeback status, dispute evidence,
|
|
and resolution outcomes. Players with multiple chargebacks are automatically flagged in the Player Management system.
|
|
Full chargeback analytics available in the
|
|
<a href="@Url.Action("ChargebackProtection", "RevenueAnalytics")" class="alert-link">Chargeback Protection Dashboard</a>.
|
|
</div>
|
|
|
|
<div class="row mt-3">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-3">
|
|
<i class="fas fa-database me-2"></i>
|
|
Chargeback Data Tracked Per Account
|
|
</h6>
|
|
<ul class="list-unstyled">
|
|
<li class="mb-2">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Chargeback date and amount
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Chargeback fees incurred
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Dispute status and evidence
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
10-day dispute deadline tracking
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Resolution outcomes (Won/Lost)
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-3">
|
|
<i class="fas fa-user-shield me-2"></i>
|
|
Account-Level Protections
|
|
</h6>
|
|
<ul class="list-unstyled">
|
|
<li class="mb-2">
|
|
<i class="fas fa-circle text-info me-2" style="font-size: 0.5rem;"></i>
|
|
Players with 1+ chargebacks flagged
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-circle text-warning me-2" style="font-size: 0.5rem;"></i>
|
|
Multiple chargebacks = high-risk status
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-circle text-danger me-2" style="font-size: 0.5rem;"></i>
|
|
Automatic purchase restrictions on repeat offenders
|
|
</li>
|
|
<li class="mb-2">
|
|
<i class="fas fa-circle text-success me-2" style="font-size: 0.5rem;"></i>
|
|
Full history visible in Player Management
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Back to Revenue Dashboard -->
|
|
<div class="row g-3">
|
|
<div class="col-12">
|
|
<a href="@Url.Action("Index", "RevenueAnalytics")" class="btn btn-outline-primary">
|
|
<i class="fas fa-arrow-left me-2"></i>Back to Revenue Dashboard
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@section Scripts {
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
|
|
<script>
|
|
// Purchase Type Distribution Chart
|
|
@if (Model.PurchaseTypeDistribution.Any())
|
|
{
|
|
<text>
|
|
const purchaseTypeCtx = document.getElementById('purchaseTypeChart').getContext('2d');
|
|
const purchaseTypeData = @Html.Raw(Json.Serialize(Model.PurchaseTypeDistribution));
|
|
|
|
// Extract labels and data
|
|
const typeLabels = Object.keys(purchaseTypeData);
|
|
const typeRevenue = typeLabels.map(label => purchaseTypeData[label].Revenue);
|
|
const typeCounts = typeLabels.map(label => purchaseTypeData[label].Count);
|
|
|
|
new Chart(purchaseTypeCtx, {
|
|
type: 'doughnut',
|
|
data: {
|
|
labels: typeLabels,
|
|
datasets: [{
|
|
data: typeRevenue,
|
|
backgroundColor: [
|
|
'rgba(139, 92, 246, 0.8)',
|
|
'rgba(59, 130, 246, 0.8)',
|
|
'rgba(16, 185, 129, 0.8)',
|
|
'rgba(245, 158, 11, 0.8)',
|
|
'rgba(239, 68, 68, 0.8)'
|
|
],
|
|
borderColor: '#1a1d29',
|
|
borderWidth: 2
|
|
}]
|
|
},
|
|
options: {
|
|
responsive: true,
|
|
maintainAspectRatio: false,
|
|
plugins: {
|
|
legend: {
|
|
position: 'bottom',
|
|
labels: { color: '#e0e0e0', padding: 15, font: { size: 12 } }
|
|
},
|
|
tooltip: {
|
|
callbacks: {
|
|
label: function(context) {
|
|
const index = context.dataIndex;
|
|
const revenue = context.parsed;
|
|
const count = typeCounts[index];
|
|
return [
|
|
context.label + ':',
|
|
'Revenue: $' + revenue.toLocaleString(),
|
|
'Count: ' + count
|
|
];
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
</text>
|
|
}
|
|
|
|
// AJAX Refresh
|
|
document.getElementById('refreshDashboard').addEventListener('click', async function() {
|
|
const btn = this;
|
|
const icon = btn.querySelector('i');
|
|
|
|
btn.disabled = true;
|
|
icon.classList.add('fa-spin');
|
|
|
|
try {
|
|
// Reload the page to get fresh data
|
|
window.location.reload();
|
|
} catch (error) {
|
|
console.error('Refresh failed:', error);
|
|
btn.classList.add('btn-danger');
|
|
setTimeout(() => btn.classList.replace('btn-danger', 'btn-outline-primary'), 2000);
|
|
} finally {
|
|
btn.disabled = false;
|
|
icon.classList.remove('fa-spin');
|
|
}
|
|
});
|
|
</script>
|
|
} |