First Commit

2025-09-16 15:00:16 +02:00
commit c8980f785f
188 changed files with 43407 additions and 0 deletions
@@ -0,0 +1,181 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Transaction History</title>
+    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <!-- Include Chart.js -->
+    <style>
+        body {
+            background-color: #f8f9fa;
+        }
+
+        h1 {
+            font-size: 2.5rem;
+            margin-bottom: 20px;
+            text-align: center;
+        }
+
+        .table {
+            border-radius: 0.5rem;
+            overflow: hidden;
+            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+        }
+
+        .table thead th {
+            background-color: #007bff;
+            color: white;
+            font-weight: bold;
+        }
+
+        .table tbody tr:hover {
+            background-color: #e2e6ea;
+        }
+
+        .table tbody td {
+            vertical-align: middle;
+        }
+
+        .amount-positive {
+            color: rgb(0, 185, 0);
+        }
+
+        .amount-negative {
+            color: red;
+        }
+
+        .btn-back {
+            margin-top: 20px;
+            background-color: #6c757d;
+            color: white;
+        }
+
+        .btn-back:hover {
+            background-color: #5a6268;
+        }
+
+        /* Set a fixed height for the chart */
+        #transactionChart {
+            width: 100%;
+            /* Fill the width of the parent container */
+            height: 400px;
+            /* Fixed height */
+        }
+
+        .chart-container {
+            position: relative;
+            margin: auto;
+            height: 400px;
+            /* Set height for the chart container */
+            width: 80%;
+            /* Adjust width as needed */
+        }
+    </style>
+</head>
+
+<body class="bg-light">
+    <div class="container mt-5">
+        <h1>Transaction History for {{ user['username'] }}#{{ user['discriminator'] }}</h1>
+
+        <!-- Chart Container -->
+        <div class="chart-container">
+            <canvas id="transactionChart"></canvas>
+        </div>
+        <form method="get" action="{{ url_for('transactions') }}">
+            <label for="sort">Sort by:</label>
+            <select name="sort" id="sort">
+                <option value="date" {% if sort_by=='date' %}selected{% endif %}>Date</option>
+                <option value="amount" {% if sort_by=='amount' %}selected{% endif %}>Amount</option>
+                <!-- Add more sorting options as needed -->
+            </select>
+
+            <label for="order">Order:</label>
+            <select name="order" id="order">
+                <option value="asc" {% if order=='asc' %}selected{% endif %}>Ascending</option>
+                <option value="desc" {% if order=='desc' %}selected{% endif %}>Descending</option>
+            </select>
+
+            <button type="submit">Sort</button>
+        </form>
+
+
+        <table class="table table-bordered mt-3">
+            <thead>
+                <tr>
+                    <th>Type</th>
+                    <th>Amount</th>
+                    <th>Time</th>
+                </tr>
+            </thead>
+            <tbody>
+                {% for transaction in transactions %}
+                <tr>
+                    <td>{{ transaction.TYPE }}</td>
+                    <td class="{% if transaction.amount < 0 %}amount-negative{% else %}amount-positive{% endif %}">
+                        ${{ transaction.amount }}</td>
+                    <td>{{ transaction.TIME.strftime('%Y-%m-%d %H:%M:%S') }}</td>
+                </tr>
+                {% else %}
+                <tr>
+                    <td colspan="3" class="text-center">No transactions found.</td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+
+        <a href="{{ url_for('wallet') }}" class="btn btn-secondary mt-3">Back to Wallet</a>
+    </div>
+
+    <script>
+        // Assuming `dates` and `totals` are provided correctly from Flask.
+        const dates = {{ dates | tojson }};
+        const totals = {{ totals | tojson }};
+
+        // Log the dates and totals to the console for debugging
+        console.log("Dates:", dates);
+        console.log("Totals:", totals);
+
+        // Ensure dates are properly formatted
+        const formattedDates = dates.map(date => new Date(date).toLocaleDateString());
+
+        // Chart.js code
+        const ctx = document.getElementById('transactionChart').getContext('2d');
+        const transactionChart = new Chart(ctx, {
+            type: 'line',
+            data: {
+                labels: formattedDates,
+                datasets: [{
+                    label: 'Daily Transaction Totals',
+                    data: totals,
+                    backgroundColor: 'rgba(75, 192, 192, 0.2)',
+                    borderColor: 'rgba(75, 192, 192, 1)',
+                    borderWidth: 1,
+                    fill: true,
+                }]
+            },
+            options: {
+                responsive: true,
+                maintainAspectRatio: true, // Maintain aspect ratio
+                scales: {
+                    y: {
+                        beginAtZero: true,
+                        title: {
+                            display: true,
+                            text: 'Amount ($)'
+                        }
+                    },
+                    x: {
+                        title: {
+                            display: true,
+                            text: 'Date'
+                        }
+                    }
+                }
+            }
+        });
+    </script>
+</body>
+
+</html>