Hugging Face's logo

Spaces:
abdullahalioo
/
Ananserver
Build error

App Files Community
abdullahalioo commited on
Commit
1381f54
·
verified ·
1 Parent(s): 39e2f00

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +40 -162
index.html CHANGED
@@ -4,178 +4,56 @@
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Ticket Management System</title>
 
7
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
8
- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
9
- <link rel="stylesheet" href="style.css">
10
  </head>
11
  <body>
12
- <div class="dashboard">
13
- <div class="sidebar">
14
- <div class="logo">
15
- <i class="fas fa-ticket-alt"></i>
16
- <span>TicketSys Pro</span>
 
17
  </div>
18
- <ul class="menu">
19
- <li class="active"><a href="#"><i class="fas fa-home"></i> Dashboard</a></li>
20
- <li><a href="#"><i class="fas fa-chart-bar"></i> Analytics</a></li>
21
- <li><a href="#"><i class="fas fa-cog"></i> Settings</a></li>
22
- </ul>
23
- </div>
24
- <div class="main-content">
25
- <header>
26
- <h1>Ticket Management Dashboard</h1>
27
- <div class="user-actions">
28
- <button id="downloadBtn" class="btn btn-success">
29
- <i class="fas fa-file-excel"></i> Export to Excel
30
- </button>
31
- <div class="user-profile">
32
- <img src="https://via.placeholder.com/40" alt="User">
33
- <span>Admin</span>
34
- </div>
35
- </div>
36
- </header>
37
- <div class="stats-cards">
38
- <div class="card stat-card">
39
- <div class="card-body">
40
- <h5 class="card-title">Total Tickets</h5>
41
- <h2 class="stat-value">{{ tickets|length }}</h2>
42
- <p class="stat-change"><i class="fas fa-arrow-up"></i> 12% from last week</p>
43
- </div>
44
- </div>
45
- <div class="card stat-card">
46
- <div class="card-body">
47
- <h5 class="card-title">Today's Tickets</h5>
48
- <h2 class="stat-value">24</h2>
49
- <p class="stat-change"><i class="fas fa-arrow-down"></i> 5% from yesterday</p>
50
- </div>
51
- </div>
52
- <div class="card stat-card">
53
- <div class="card-body">
54
- <h5 class="card-title">Top Region</h5>
55
- <h2 class="stat-value">Punjab</h2>
56
- <p class="stat-change">35% of total tickets</p>
57
- </div>
58
- </div>
59
  </div>
60
- <div class="data-table-container">
61
- <div class="table-header">
62
- <h3>Recent Tickets</h3>
63
- <div class="table-actions">
64
- <div class="search-box">
65
- <input type="text" placeholder="Search...">
66
- <i class="fas fa-search"></i>
67
- </div>
68
- <button class="btn btn-primary refresh-btn">
69
- <i class="fas fa-sync-alt"></i> Refresh
70
- </button>
71
- </div>
72
- </div>
73
- <div class="table-responsive">
74
- <table class="table table-striped table-hover">
75
- <thead>
76
- <tr>
77
- <th>Ticket #</th>
78
- <th>Name</th>
79
- <th>Email</th>
80
- <th>Phone</th>
81
- <th>Country</th>
82
- <th>Region</th>
83
- <th>Qty</th>
84
- <th>Date</th>
85
- <th>Actions</th>
86
- </tr>
87
- </thead>
88
- <tbody>
89
- {% for ticket in tickets %}
90
- <tr>
91
- <td>{{ ticket.ticket_number }}</td>
92
- <td>{{ ticket.name }}</td>
93
- <td>{{ ticket.email }}</td>
94
- <td>{{ ticket.phone }}</td>
95
- <td>{{ ticket.country }}</td>
96
- <td>{{ ticket.region }}</td>
97
- <td>{{ ticket.ticket_count }}</td>
98
- <td>{{ ticket.timestamp.strftime('%Y-%m-%d %H:%M') }}</td>
99
- <td>
100
- <button class="btn btn-sm btn-info view-btn" data-id="{{ ticket.id }}">
101
- <i class="fas fa-eye"></i>
102
- </button>
103
- <button class="btn btn-sm btn-danger delete-btn" data-id="{{ ticket.id }}">
104
- <i class="fas fa-trash"></i>
105
- </button>
106
- </td>
107
- </tr>
108
- {% endfor %}
109
- </tbody>
110
- </table>
111
- </div>
112
- <nav aria-label="Page navigation">
113
- <ul class="pagination justify-content-center">
114
- <li class="page-item disabled">
115
- <a class="page-link" href="#" tabindex="-1">Previous</a>
116
- </li>
117
- <li class="page-item active"><a class="page-link" href="#">1</a></li>
118
- <li class="page-item"><a class="page-link" href="#">2</a></li>
119
- <li class="page-item"><a class="page-link" href="#">3</a></li>
120
- <li class="page-item">
121
- <a class="page-link" href="#">Next</a>
122
- </li>
123
- </ul>
124
- </nav>
125
  </div>
126
  </div>
127
- </div>
128
 
129
- <!-- View Ticket Modal -->
130
- <div class="modal fade" id="viewTicketModal" tabindex="-1" aria-hidden="true">
131
- <div class="modal-dialog">
132
- <div class="modal-content">
133
- <div class="modal-header">
134
- <h5 class="modal-title">Ticket Details</h5>
135
- <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
136
- </div>
137
- <div class="modal-body">
138
- <div class="ticket-details">
139
- <div class="detail-row">
140
- <span class="detail-label">Ticket Number:</span>
141
- <span class="detail-value" id="modal-ticket-number">T-283598</span>
142
- </div>
143
- <div class="detail-row">
144
- <span class="detail-label">Name:</span>
145
- <span class="detail-value" id="modal-name">Abdullah Ali</span>
146
- </div>
147
- <div class="detail-row">
148
- <span class="detail-label">Email:</span>
149
- <span class="detail-value" id="modal-email">[email protected]</span>
150
- </div>
151
- <div class="detail-row">
152
- <span class="detail-label">Phone:</span>
153
- <span class="detail-value" id="modal-phone">03037191639</span>
154
- </div>
155
- <div class="detail-row">
156
- <span class="detail-label">Quantity:</span>
157
- <span class="detail-value" id="modal-quantity">3</span>
158
- </div>
159
- <div class="detail-row">
160
- <span class="detail-label">Location:</span>
161
- <span class="detail-value" id="modal-location">Punjab, Pakistan</span>
162
- </div>
163
- <div class="detail-row">
164
- <span class="detail-label">Purchase Date:</span>
165
- <span class="detail-value" id="modal-date">2023-06-15 14:30</span>
166
- </div>
167
- </div>
168
- </div>
169
- <div class="modal-footer">
170
- <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
171
- <button type="button" class="btn btn-primary">Print Ticket</button>
172
- </div>
173
- </div>
174
  </div>
175
  </div>
176
 
177
- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
178
- <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
179
- <script src="script.js"></script>
180
  </body>
181
  </html>
 
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Ticket Management System</title>
7
+ <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
8
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
9
+ <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
 
10
  </head>
11
  <body>
12
+ <div class="container">
13
+ <header>
14
+ <h1><i class="fas fa-ticket-alt"></i> Ticket Management System</h1>
15
+ <div class="actions">
16
+ <button id="refreshBtn" class="btn"><i class="fas fa-sync-alt"></i> Refresh</button>
17
+ <button id="downloadBtn" class="btn btn-primary"><i class="fas fa-download"></i> Download CSV</button>
18
  </div>
19
+ </header>
20
+
21
+ <div class="stats-container">
22
+ <div class="stat-card">
23
+ <div class="stat-value" id="total-tickets">0</div>
24
+ <div class="stat-label">Total Tickets</div>
25
+ </div>
26
+ <div class="stat-card">
27
+ <div class="stat-value" id="total-count">0</div>
28
+ <div class="stat-label">Total Tickets Sold</div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
29
  </div>
30
+ <div class="stat-card">
31
+ <div class="stat-value" id="unique-countries">0</div>
32
+ <div class="stat-label">Countries</div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
33
  </div>
34
  </div>
 
35
 
36
+ <div class="table-container">
37
+ <table id="ticketsTable">
38
+ <thead>
39
+ <tr>
40
+ <th>Ticket #</th>
41
+ <th>Name</th>
42
+ <th>Email</th>
43
+ <th>Phone</th>
44
+ <th>Quantity</th>
45
+ <th>Country</th>
46
+ <th>Region</th>
47
+ <th>Date</th>
48
+ </tr>
49
+ </thead>
50
+ <tbody id="ticketsBody">
51
+ <!-- Data will be inserted here by JavaScript -->
52
+ </tbody>
53
+ </table>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
54
  </div>
55
  </div>
56
 
57
+ <script src="{{ url_for('static', filename='script.js') }}"></script>
 
 
58
  </body>
59
  </html>