-
Notifications
You must be signed in to change notification settings - Fork 0
/
admin.hbs
192 lines (185 loc) · 11.7 KB
/
admin.hbs
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
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
<div class="bg-gray-100 dark:bg-gray-900 dark:text-white text-gray-600 h-screen flex overflow-hidden text-sm">
<div class="bg-white dark:bg-gray-900 dark:border-gray-800 w-20 flex-shrink-0 border-r border-gray-200 flex-col hidden sm:flex">
<div class="h-16 text-blue-500 flex items-center justify-center">
<svg class="w-9" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 54 33">
<path fill="currentColor" fill-rule="evenodd" d="M27 0c-7.2 0-11.7 3.6-13.5 10.8 2.7-3.6 5.85-4.95 9.45-4.05 2.054.513 3.522 2.004 5.147 3.653C30.744 13.09 33.808 16.2 40.5 16.2c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C36.756 3.11 33.692 0 27 0zM13.5 16.2C6.3 16.2 1.8 19.8 0 27c2.7-3.6 5.85-4.95 9.45-4.05 2.054.514 3.522 2.004 5.147 3.653C17.244 29.29 20.308 32.4 27 32.4c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C23.256 19.31 20.192 16.2 13.5 16.2z" clip-rule="evenodd" />
</svg>
<!-- <img src="img/logo.png" alt="" style="width: 1.5cm; height: 1.5cm; background-color: black; border-radius: 100px;"> -->
</div>
<div class="flex mx-auto flex-grow mt-4 flex-col text-gray-400 space-y-4">
<button class="h-10 w-12 dark:bg-gray-700 dark:text-white rounded-md flex items-center justify-center bg-blue-100 text-blue-500">
<svg viewBox="0 0 24 24" class="h-5" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path>
<polyline points="9 22 9 12 15 12 15 22"></polyline>
</svg>
</button>
</div>
</div>
<div class="flex-grow overflow-hidden h-full flex flex-col">
<div class="h-16 lg:flex w-full border-b border-gray-200 dark:border-gray-800 hidden px-10">
<div class="flex h-full text-gray-600 dark:text-gray-400">
<a href="#" class="cursor-pointer h-full border-b-2 border-transparent inline-flex items-center mr-8">Dashboard</a>
<a href="#" class="cursor-pointer h-full border-b-2 border-blue-500 text-blue-500 dark:text-white dark:border-white inline-flex mr-8 items-center">Users</a>
<a href="#" class="cursor-pointer h-full border-b-2 border-transparent inline-flex items-center mr-8">Expired Tickets</a>
<a href="#" class="cursor-pointer h-full border-b-2 border-transparent inline-flex items-center">Current Tickets</a>
</div>
<div class="ml-auto flex items-center space-x-7">
<button class="flex items-center" onclick="menuToggle();">
<span class="relative flex-shrink-0">
<img class="w-7 h-7 rounded-full" src="https://images.unsplash.com/photo-1521587765099-8835e7201186?ixlib=rb-1.2.1&q=80&fm=jpg&crop=faces&fit=crop&h=200&w=200&ixid=eyJhcHBfaWQiOjE3Nzg0fQ" alt="profile" />
<span class="absolute right-0 -mb-0.5 bottom-0 w-2 h-2 rounded-full bg-green-500 border border-white dark:border-gray-900"></span>
</span>
<div class="menu">
<ul>
<li>
<img src="img/dashboard/user.png" /><a href="#">My profile</a>
</li>
<li>
<img src="img/dashboard/edit.png" /><a href="#">Edit profile</a>
</li>
<li>
<img src="img/dashboard/log-out.png" /><a href="#">Logout</a>
</li>
</ul>
</div>
<span class="ml-2">{{user.E_Name}}</span>
<svg viewBox="0 0 24 24" class="w-4 ml-1 flex-shrink-0" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<polyline points="6 9 12 15 18 9"></polyline>
</svg>
</button>
</div>
</div>
<div class="flex-grow flex overflow-x-hidden">
<div class="flex-grow bg-white dark:bg-gray-900 overflow-y-auto">
<div class="sm:px-7 sm:pt-7 px-4 pt-4 flex flex-col w-full border-b border-gray-200 bg-white dark:bg-gray-900 dark:text-white dark:border-gray-800 sticky top-0" style="border-width: 0px;">
<div class="flex w-full items-center">
<div class="flex items-center text-3xl text-gray-900 dark:text-white">
User details
</div>
</div>
</div>
<div class="sm:p-7 p-4">
<div class="flex w-full items-center mb-7">
<button class="inline-flex mr-3 items-center h-8 pl-2.5 pr-2 rounded-md shadow text-gray-700 dark:text-gray-400 dark:border-gray-800 border border-gray-200 leading-none py-0">
<svg viewBox="0 0 24 24" class="w-4 mr-2 text-gray-400 dark:text-gray-600" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
<line x1="16" y1="2" x2="16" y2="6"></line>
<line x1="8" y1="2" x2="8" y2="6"></line>
<line x1="3" y1="10" x2="21" y2="10"></line>
</svg>
Pro Accounts
<svg viewBox="0 0 24 24" class="w-4 ml-1.5 text-gray-400 dark:text-gray-600" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<polyline points="6 9 12 15 18 9"></polyline>
</svg>
</button>
<button class="inline-flex items-center h-8 pl-2.5 pr-2 rounded-md shadow text-gray-700 dark:text-gray-400 dark:border-gray-800 border border-gray-200 leading-none py-0">
Filter by
<svg viewBox="0 0 24 24" class="w-4 ml-1.5 text-gray-400 dark:text-gray-600" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<polyline points="6 9 12 15 18 9"></polyline>
</svg>
</button>
<div class="ml-auto text-gray-500 text-xs sm:inline-flex hidden items-center">
<span class="mr-3">Page 1 of 4</span>
<button class="inline-flex mr-2 items-center h-8 w-8 justify-center text-gray-400 rounded-md shadow border border-gray-200 dark:border-gray-800 leading-none py-0">
<svg class="w-4" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<polyline points="15 18 9 12 15 6"></polyline>
</svg>
</button>
<button class="inline-flex items-center h-8 w-8 justify-center text-gray-400 rounded-md shadow border border-gray-200 dark:border-gray-800 leading-none py-0">
<svg class="w-4" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<polyline points="9 18 15 12 9 6"></polyline>
</svg>
</button>
</div>
</div>
<table class="w-full text-left">
<thead>
<tr class="text-gray-400">
<th class="font-normal px-3 pt-0 pb-3 border-b border-gray-200 dark:border-gray-800">Name</th>
<th class="font-normal px-3 pt-0 pb-3 border-b border-gray-200 dark:border-gray-800">Account No</th>
<th class="font-normal px-3 pt-0 pb-3 border-b border-gray-200 dark:border-gray-800 hidden md:table-cell">Government ID</th>
<th class="font-normal px-3 pt-0 pb-3 border-b border-gray-200 dark:border-gray-800">Address</th>
<th class="font-normal px-3 pt-0 pb-3 border-b border-gray-200 dark:border-gray-800 sm:text-gray-400 text-white">Balance</th>
</tr>
</thead>
<tbody class="text-gray-600 dark:text-gray-100">
{{#each results}}
<tr>
<td class="sm:p-3 py-2 px-1 border-b border-gray-200 dark:border-gray-800">
<div class="flex items-center">
{{this.name}}
</div>
</td>
<td class="sm:p-3 py-2 px-1 border-b border-gray-200 dark:border-gray-800">
<div class="flex items-center">
{{this.Account_No}}
</div>
</td>
<td class="sm:p-3 py-2 px-1 border-b border-gray-200 dark:border-gray-800 md:table-cell hidden">{{this.GovernmentID}}</td>
<td class="sm:p-3 py-2 px-1 border-b border-gray-200 dark:border-gray-800">
{{this.city}},
<div class="text-gray-400 text-xs">{{this.state}}</div>
</td>
<td class="sm:p-3 py-2 px-1 border-b border-gray-200 dark:border-gray-800">
<div class="flex items-center">
{{this.Balance}}
<button class="w-8 h-8 inline-flex items-center justify-center text-gray-400 ml-auto" onclick="viewmenuToggle()">
<svg viewBox="0 0 24 24" class="w-5" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="1"></circle>
<circle cx="19" cy="12" r="1"></circle>
<circle cx="5" cy="12" r="1"></circle>
</svg>
</button>
<div class="view-menu">
<ul>
<li>
<img src="img/user-image.jpg" /><a href="editalluser/{{this.username}}">View profile</a>
</li>
<li>
<img src="img/dashboard/edit.png" /><a href="editalluser/{{this.username}}">Edit profile</a>
</li>
<li id="extra">
<img src="img/dashboard/delete.jpg" id="delete-img"><a href="">Delete Profile</a>
</li>
</ul>
</div>
</div>
</td>
</tr>
{{/each}}
</tbody>
</table>
<div class="flex w-full mt-5 space-x-2 justify-end">
<button class="inline-flex items-center h-8 w-8 justify-center text-gray-400 rounded-md shadow border border-gray-200 dark:border-gray-800 leading-none">
<svg class="w-4" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<polyline points="15 18 9 12 15 6"></polyline>
</svg>
</button>
<button class="inline-flex items-center h-8 w-8 justify-center text-gray-500 rounded-md shadow border border-gray-200 dark:border-gray-800 bg-gray-100 dark:bg-gray-800 dark:text-white leading-none">1</button>
<button class="inline-flex items-center h-8 w-8 justify-center text-gray-500 rounded-md shadow border border-gray-200 dark:border-gray-800 leading-none">2</button>
<button class="inline-flex items-center h-8 w-8 justify-center text-gray-500 rounded-md shadow border border-gray-200 dark:border-gray-800 leading-none">3</button>
<button class="inline-flex items-center h-8 w-8 justify-center text-gray-500 rounded-md shadow border border-gray-200 dark:border-gray-800 leading-none">4</button>
<button class="inline-flex items-center h-8 w-8 justify-center text-gray-400 rounded-md shadow border border-gray-200 dark:border-gray-800 leading-none">
<svg class="w-4" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round">
<polyline points="9 18 15 12 9 6"></polyline>
</svg>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- partial -->
<script>
function menuToggle() {
const toggleMenu = document.querySelector(".menu");
toggleMenu.classList.toggle("active");
}
</script>
<script>
function viewmenuToggle() {
const toggleMenu = document.querySelector(".view-menu");
toggleMenu.classList.toggle("active");
}
</script>