165 lines
6.8 KiB
HTML
165 lines
6.8 KiB
HTML
<div class="container mx-auto p-4 mt-4 animate-in fade-in slide-in-from-bottom duration-500">
|
|
<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 stored files</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="shadow stats bg-white">
|
|
<div class="stat">
|
|
<div class="stat-title">Operational For</div>
|
|
<div class="stat-value">{{ statistics.applicationOnlineTime | duration }}</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 *ngIf="statistics.lastUserLogin" class="stat-value">{{ statistics.lastUserLogin.loginTime | relativeTime }}</div>
|
|
<div *ngIf="!statistics.lastUserLogin" class="stat-value">First login...</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" (click)="openEditUserModal()">
|
|
<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" (click)="confirm('Are you sure?') && deleteAllFileUploads()">Delete All Uploaded Files</button>
|
|
<button class="btn btn-accent" (click)="openLoginHistoryModal()">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-clock-history" viewBox="0 0 16 16">
|
|
<path d="M8.515 1.019A7 7 0 0 0 8 1V0a8 8 0 0 1 .589.022zm2.004.45a7 7 0 0 0-.985-.299l.219-.976q.576.129 1.126.342zm1.37.71a7 7 0 0 0-.439-.27l.493-.87a8 8 0 0 1 .979.654l-.615.789a7 7 0 0 0-.418-.302zm1.834 1.79a7 7 0 0 0-.653-.796l.724-.69q.406.429.747.91zm.744 1.352a7 7 0 0 0-.214-.468l.893-.45a8 8 0 0 1 .45 1.088l-.95.313a7 7 0 0 0-.179-.483m.53 2.507a7 7 0 0 0-.1-1.025l.985-.17q.1.58.116 1.17zm-.131 1.538q.05-.254.081-.51l.993.123a8 8 0 0 1-.23 1.155l-.964-.267q.069-.247.12-.501m-.952 2.379q.276-.436.486-.908l.914.405q-.24.54-.555 1.038zm-.964 1.205q.183-.183.35-.378l.758.653a8 8 0 0 1-.401.432z"/>
|
|
<path d="M8 1a7 7 0 1 0 4.95 11.95l.707.707A8.001 8.001 0 1 1 8 0z"/>
|
|
<path d="M7.5 3a.5.5 0 0 1 .5.5v5.21l3.248 1.856a.5.5 0 0 1-.496.868l-3.5-2A.5.5 0 0 1 7 9V3.5a.5.5 0 0 1 .5-.5"/>
|
|
</svg>
|
|
Login History
|
|
</button>
|
|
<button class="btn btn-neutral" (click)="logout()">
|
|
<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 | 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>
|
|
</div>
|
|
<!-- Modal -->
|
|
<dialog #edit_user_modal class="modal">
|
|
<div class="modal-box">
|
|
<app-edituser
|
|
[username]="username"
|
|
></app-edituser>
|
|
</div>
|
|
</dialog>
|
|
<dialog #login_history_modal class="modal">
|
|
<div class="modal-box w-11/12 max-w-5xl">
|
|
<app-loginhistory>
|
|
[username]="username"
|
|
</app-loginhistory>
|
|
</div>
|
|
</dialog>
|