File size: 2,751 Bytes
2336542
 
 
 
637c7f1
2336542
 
 
 
 
 
 
 
 
637c7f1
 
2336542
 
 
637c7f1
2336542
 
245b453
637c7f1
 
2336542
 
 
637c7f1
 
 
2336542
245b453
2336542
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
245b453
 
 
 
 
 
 
 
 
637c7f1
 
 
 
 
 
 
 
 
2336542
637c7f1
 
245b453
2336542
 
 
 
637c7f1
 
 
245b453
 
 
2336542
 
637c7f1
 
 
 
 
 
 
 
245b453
637c7f1
 
 
245b453
637c7f1
2336542
 
245b453
637c7f1
 
 
 
 
2336542
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Report Viewer</title>
  <style>
    body {
      background-color: #041C32;
      color: #ECB365;
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 20px;
    }
    .container {
      margin: 20px auto;
      padding: 20px;
      background-color: #04293A;
      border-radius: 10px;
      text-align: center;
      max-width: 90%;
      box-shadow: 0px 0px 15px rgba(236, 179, 101, 0.3);
    }
    .toggle-buttons { margin-bottom: 20px; }
    .toggle-buttons a {
      padding: 10px 15px;
      background-color: #ECB365;
      color: #041C32;
      text-decoration: none;
      margin: 0 10px;
      border-radius: 5px;
      font-weight: bold;
    }
    .toggle-buttons a.active { background-color: #d69f50; }
    .table-wrapper {
      overflow-x: auto;
      margin: auto;
      padding: 15px;
      background-color: #04293A;
      border-radius: 6px;
    }
    table {
      width: 100%;
      border-collapse: collapse;
      color: #ECB365;
    }
    th, td {
      border: 1px solid #ECB365;
      padding: 10px;
      text-align: center;
    }
    th { background-color: #064663; }
    .pagination { margin-top: 15px; }
    .pagination a {
      padding: 8px 12px;
      background-color: #ECB365;
      color: #041C32;
      text-decoration: none;
      margin: 0 5px;
      border-radius: 5px;
    }
    .btn {
      display: inline-block;
      padding: 12px 20px;
      background-color: #ECB365;
      color: #041C32;
      text-decoration: none;
      margin: 10px 5px;
      border-radius: 6px;
      font-weight: bold;
      transition: background-color 0.3s ease;
    }
    .btn:hover { background-color: #d69f50; }
  </style>
</head>
<body>
  <div class="container">
    <!-- Toggle Buttons -->
    <div class="toggle-buttons">
      <a href="{{ url_for('report_view', report_type='pred', page=1) }}"
         class="{% if report_type == 'pred' %}active{% endif %}">
        Prediction Report
      </a>
    </div>

    <!-- Report Table -->
    <div class="table-wrapper">
      {{ table_html | safe }}
    </div>

    <!-- Pagination Controls -->
    <div class="pagination">
      {% if has_prev %}
        <a href="{{ url_for('report_view', report_type=report_type, page=page-1) }}">Previous</a>
      {% endif %}
      <span>Page {{ page }}</span>
      {% if has_next %}
        <a href="{{ url_for('report_view', report_type=report_type, page=page+1) }}">Next</a>
      {% endif %}
    </div>

    <!-- Download & Nav Buttons -->
    <div style="margin-top:20px;">
      <a href="{{ url_for('download_pred') }}" class="btn">Download Prediction CSV</a>
      <a href="/" class="btn">Go Back</a>
    </div>
  </div>
</body>
</html>