Added statistics
- Added total file size statistic - Added total uploads statistic - Added total downloads statistic - Added icons to btns
This commit is contained in:
@ -1 +1,146 @@
|
||||
<p>adminui works!</p>
|
||||
<div class="container mx-auto p-4 mt-4">
|
||||
<h1 class="text-5xl font-bold text-center text-gray-800 mb-10">Admin Dashboard</h1>
|
||||
|
||||
<!-- Statistics Section -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-4 mb-10">
|
||||
<div class="shadow stats bg-white">
|
||||
<div class="stat">
|
||||
<div class="stat-title">Total Files Uploaded</div>
|
||||
<div class="stat-value">{{ fileUploads.length + expiredFileUploads.length }}</div>
|
||||
<div class="stat-desc">Since launch</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="shadow stats bg-white">
|
||||
<div class="stat">
|
||||
<div class="stat-title">Total File Size on Disk</div>
|
||||
<div class="stat-value">{{ totalFileSizeOnDisk | formatFileSizePipe }}</div>
|
||||
<div class="stat-desc">Across all files</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="shadow stats bg-white">
|
||||
<div class="stat">
|
||||
<div class="stat-title">Operational For</div>
|
||||
<div class="stat-value">2 Years</div>
|
||||
<div class="stat-desc">Since launch</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="shadow stats bg-white">
|
||||
<div class="stat">
|
||||
<div class="stat-title">Total Downloads</div>
|
||||
<div class="stat-value">{{ totalFileDownloads }}</div>
|
||||
<div class="stat-desc">All time</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="shadow stats bg-white">
|
||||
<div class="stat">
|
||||
<div class="stat-title">Last Admin Login</div>
|
||||
<div class="stat-value">2 days ago</div>
|
||||
<div class="stat-desc">Most recent login</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Buttons Section -->
|
||||
<div class="flex justify-center mt-10 space-x-4">
|
||||
<button class="btn btn-primary">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person" viewBox="0 0 16 16">
|
||||
<path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6m2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0m4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4m-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10s-3.516.68-4.168 1.332c-.678.678-.83 1.418-.832 1.664z"/>
|
||||
</svg>
|
||||
Change Administrator Login
|
||||
</button>
|
||||
<button class="btn btn-secondary">Delete All Uploaded Files</button>
|
||||
<button class="btn btn-accent">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-people" viewBox="0 0 16 16">
|
||||
<path d="M15 14s1 0 1-1-1-4-5-4-5 3-5 4 1 1 1 1zm-7.978-1L7 12.996c.001-.264.167-1.03.76-1.72C8.312 10.629 9.282 10 11 10c1.717 0 2.687.63 3.24 1.276.593.69.758 1.457.76 1.72l-.008.002-.014.002zM11 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4m3-2a3 3 0 1 1-6 0 3 3 0 0 1 6 0M6.936 9.28a6 6 0 0 0-1.23-.247A7 7 0 0 0 5 9c-4 0-5 3-5 4q0 1 1 1h4.216A2.24 2.24 0 0 1 5 13c0-1.01.377-2.042 1.09-2.904.243-.294.526-.569.846-.816M4.92 10A5.5 5.5 0 0 0 4 13H1c0-.26.164-1.03.76-1.724.545-.636 1.492-1.256 3.16-1.275ZM1.5 5.5a3 3 0 1 1 6 0 3 3 0 0 1-6 0m3-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4"/>
|
||||
</svg>
|
||||
User Management
|
||||
</button>
|
||||
<button class="btn btn-neutral">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-box-arrow-left" viewBox="0 0 16 16">
|
||||
<path fill-rule="evenodd" d="M6 12.5a.5.5 0 0 0 .5.5h8a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 0-.5-.5h-8a.5.5 0 0 0-.5.5v2a.5.5 0 0 1-1 0v-2A1.5 1.5 0 0 1 6.5 2h8A1.5 1.5 0 0 1 16 3.5v9a1.5 1.5 0 0 1-1.5 1.5h-8A1.5 1.5 0 0 1 5 12.5v-2a.5.5 0 0 1 1 0z"/>
|
||||
<path fill-rule="evenodd" d="M.146 8.354a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L1.707 7.5H10.5a.5.5 0 0 1 0 1H1.707l2.147 2.146a.5.5 0 0 1-.708.708z"/>
|
||||
</svg>
|
||||
Logout
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<hr class="mt-10 mb-10">
|
||||
|
||||
<!-- Table Section -->
|
||||
<h2>Active file uploads</h2>
|
||||
<div class="w-full overflow-x-auto mt-10 mb-10">
|
||||
<table class="table w-full">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Entity ID</th>
|
||||
<th>File ID</th>
|
||||
<th>File Name</th>
|
||||
<th>File Size</th>
|
||||
<th>Single Download</th>
|
||||
<th>Disabled</th>
|
||||
<th>Upload Date</th>
|
||||
<th>Uploaded By IP</th>
|
||||
<th>Download Count</th>
|
||||
<!--<th>File Description</th>-->
|
||||
<th>Password Protected</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor="let file of fileUploads">
|
||||
<td>{{ file.id }}</td>
|
||||
<td>{{ file.fileId }}</td>
|
||||
<td>{{ file.fileName }}</td>
|
||||
<td>{{ file.fileSize | formatFileSizePipe }}</td>
|
||||
<td>{{ file.singleDownload ? 'true' : 'false' }}</td>
|
||||
<td>{{ file.disabled ? 'true' : 'false' }}</td>
|
||||
<td>{{ file.uploadDate | date: 'medium' }}</td>
|
||||
<td>{{ file.uploadedByIpAddress }}</td>
|
||||
<td>{{ file.downloadCount }}</td>
|
||||
<!--<td>{{ file.fileDescription }}</td>-->
|
||||
<td>{{ file.passwordProtected ? 'true' : 'false' }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<h2>Expired file uploads</h2>
|
||||
<div class="w-full overflow-x-auto mt-10">
|
||||
<table class="table w-full">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Entity ID</th>
|
||||
<th>File ID</th>
|
||||
<th>File Name</th>
|
||||
<th>File Size</th>
|
||||
<th>Single Download</th>
|
||||
<th>Disabled</th>
|
||||
<th>Upload Date</th>
|
||||
<th>Uploaded By IP</th>
|
||||
<th>Download Count</th>
|
||||
<!--<th>File Description</th>-->
|
||||
<th>Password Protected</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor="let file of expiredFileUploads">
|
||||
<td>{{ file.id }}</td>
|
||||
<td>{{ file.fileId }}</td>
|
||||
<td>{{ file.fileName }}</td>
|
||||
<td>{{ file.fileSize | number }}</td>
|
||||
<td>{{ file.singleDownload ? 'true' : 'false' }}</td>
|
||||
<td>{{ file.disabled ? 'true' : 'false' }}</td>
|
||||
<td>{{ file.uploadDate | date: 'medium' }}</td>
|
||||
<td>{{ file.uploadedByIpAddress }}</td>
|
||||
<td>{{ file.downloadCount }}</td>
|
||||
<!--<td>{{ file.fileDescription }}</td>-->
|
||||
<td>{{ file.passwordProtected ? 'true' : 'false' }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user