Add page to allow admins to inspect all of the details stored on the server of a user account. For now this is just the UserDetails, but in the future this is planned to be expanded to also show sessions and logs.
115 lines
2.6 KiB
Vue
115 lines
2.6 KiB
Vue
<!--
|
|
SPDX-FileCopyrightText: © 2025 Hornwitser <code@hornwitser.no>
|
|
SPDX-License-Identifier: AGPL-3.0-or-later
|
|
-->
|
|
<template>
|
|
<main>
|
|
<h1>Admin</h1>
|
|
<Tabs
|
|
:tabs
|
|
default="users"
|
|
>
|
|
<template #users>
|
|
<TableUsers />
|
|
</template>
|
|
<template #database>
|
|
<p>
|
|
To backup the database you can create and download a
|
|
database snapshot. This will export all schedule and user
|
|
data stored on the server into a single JSON file that can
|
|
then later be used to replace the exsting content of the
|
|
database to restore the system to the state it was in when
|
|
the snapshot was created.
|
|
</p>
|
|
<form
|
|
action="/api/admin/database-export"
|
|
method="post"
|
|
>
|
|
<p>
|
|
<button type="submit">
|
|
Download snapshot
|
|
</button>
|
|
</p>
|
|
</form>
|
|
<fieldset>
|
|
<legend>Restore Database</legend>
|
|
<p>
|
|
To restore the system to a previous state you can load a
|
|
database snapshot obtained from previously running the
|
|
database snapshot tool above. This will delete all
|
|
changes including new events, shifts, users and user
|
|
data that has created since the snapshot was created.
|
|
</p>
|
|
<form
|
|
action="/api/admin/database-import"
|
|
enctype="multipart/form-data"
|
|
method="post"
|
|
>
|
|
<p>
|
|
<label>
|
|
Database snapshot:
|
|
<input name="snapshot" type="file">
|
|
</label>
|
|
</p>
|
|
<p>
|
|
<button type="submit">
|
|
Restore database
|
|
</button>
|
|
</p>
|
|
</form>
|
|
</fieldset>
|
|
<fieldset>
|
|
<legend>Danger Zone</legend>
|
|
<p>
|
|
If you wish to start over with the schedule, you can use
|
|
this button to delete the current schedule.
|
|
</p>
|
|
<form
|
|
action="/api/admin/delete-schedule"
|
|
method="post"
|
|
>
|
|
<p>
|
|
<button type="submit">
|
|
Delete schedule
|
|
</button>
|
|
</p>
|
|
</form>
|
|
<p>
|
|
If you wish to see a demo of how the system can be used
|
|
you can replace the existing schedule with a generated
|
|
demo schedule that shows off all the features. <b>This
|
|
will delete all existing data including users!</b>
|
|
</p>
|
|
<form
|
|
action="/api/admin/database-import-demo"
|
|
method="post"
|
|
>
|
|
<p>
|
|
<button type="submit">
|
|
Replace with demo
|
|
</button>
|
|
</p>
|
|
</form>
|
|
</fieldset>
|
|
</template>
|
|
</Tabs>
|
|
</main>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
useHead({
|
|
title: "Admin",
|
|
});
|
|
|
|
const usersStore = useUsersStore();
|
|
await usersStore.fetch();
|
|
|
|
const tabs = [
|
|
{ id: "users", title: "Users" },
|
|
{ id: "database", title: "Database" },
|
|
];
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|