Files
fnx_web/svelte/src/admin_panel/user_bans/UserFiles.svelte

121 lines
2.7 KiB
Svelte

<script>
import { onMount } from "svelte";
import LoadingIndicator from "../../util/LoadingIndicator.svelte";
import { formatDataVolume, formatDate } from "../../util/Formatting.svelte";
import SortButton from "../SortButton.svelte";
export let user_id = ""
let files = []
let loading = true
onMount(() => reload())
export const reload = async () => {
try {
const req = await fetch(
window.api_endpoint+"/user/files",
{
headers: {
"Admin-User-Override": user_id,
}
}
);
if(req.status >= 400) {
alert(await req.text())
return
}
files = (await req.json()).files
sort("")
} catch (err) {
alert(err);
} finally {
loading = false;
}
}
let sort_field = "date_upload"
let asc = false
const sort = (field) => {
if (field !== "" && field === sort_field) {
asc = !asc
}
if (field === "") {
field = sort_field
}
sort_field = field
console.log("sorting by", field, "asc", asc)
files.sort((a, b) => {
if (typeof (a[field]) === "number") {
// Sort ints from high to low
if (asc) {
return a[field] - b[field]
} else {
return b[field] - a[field]
}
} else {
// Sort strings alphabetically
if (asc) {
return a[field].localeCompare(b[field])
} else {
return b[field].localeCompare(a[field])
}
}
})
files = files
}
</script>
<LoadingIndicator loading={loading}/>
<div class="table_scroll">
<table>
<thead>
<tr>
<td></td>
<td><SortButton field="name" active_field={sort_field} asc={asc} sort_func={sort}>Name</SortButton></td>
<td><SortButton field="abuse_type" active_field={sort_field} asc={asc} sort_func={sort}>Abuse</SortButton></td>
<td><SortButton field="size" active_field={sort_field} asc={asc} sort_func={sort}>Size</SortButton></td>
<td><SortButton field="views" active_field={sort_field} asc={asc} sort_func={sort}>V</SortButton></td>
<td><SortButton field="downloads" active_field={sort_field} asc={asc} sort_func={sort}>DL</SortButton></td>
<td><SortButton field="date_upload" active_field={sort_field} asc={asc} sort_func={sort}>Created</SortButton></td>
</tr>
</thead>
<tbody>
{#each files as file (file.id)}
<tr>
<td style="padding: 0;">
<img src="{window.api_endpoint+file.thumbnail_href}?height=32&width=32" alt="thumbnail" class="thumbnail" />
</td>
<td>
<a href="/u/{file.id}" target="_blank">{file.name}</a>
</td>
<td>
{file.abuse_type}
</td>
<td>
{formatDataVolume(file.size, 3)}
</td>
<td>
{file.views}
</td>
<td>
{file.downloads}
</td>
<td>
{formatDate(file.date_upload, true, true)}
</td>
</tr>
{/each}
</tbody>
</table>
</div>
<style>
.thumbnail {
width: 32px;
height: 32px;
}
</style>