mirror of
https://gitlab.com/PronounsPage/PronounsPage.git
synced 2025-09-29 16:04:38 -04:00
314 lines
14 KiB
Vue
314 lines
14 KiB
Vue
<template>
|
|
<Page wide>
|
|
<NotFound v-if="!$isGranted('panel')" />
|
|
<div v-else>
|
|
<div class="d-flex flex-column flex-lg-row justify-content-between align-items-lg-center">
|
|
<div>
|
|
<h2>
|
|
<Icon v="user-cog" />
|
|
<T>admin.header</T>
|
|
</h2>
|
|
|
|
<p v-if="stats.calculatedAt != null" class="small">
|
|
<em>
|
|
Stats calculated at:
|
|
<span :class="stats.calculatedAt < (new Date() - 24 * 60 * 60 * 1000) / 1000 ? `badge bg-danger text-white` : ''">
|
|
{{ $datetime(stats.calculatedAt) }}
|
|
</span>
|
|
</em>
|
|
</p>
|
|
</div>
|
|
<div class="form-check form-switch my-2">
|
|
<label>
|
|
<input v-model="filterAttention" class="form-check-input" type="checkbox">
|
|
<Icon v="filter" />
|
|
Only show items requiring attention
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<h3>General</h3>
|
|
|
|
<div class="row mb-4">
|
|
<AdminDashboardCard
|
|
v-if="$isGranted('users') || $isGranted('community')"
|
|
v-show="!filterAttention"
|
|
icon="users"
|
|
header="Users"
|
|
link="/admin/users"
|
|
:counts="[
|
|
{ count: stats._.users },
|
|
{ name: 'admins', count: stats._.admins },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="$isGranted('users') || $isGranted('community')"
|
|
v-show="!filterAttention || stats._.bansPending"
|
|
icon="ban"
|
|
header="Pending bans"
|
|
link="/admin/pending-bans"
|
|
:counts="[
|
|
{ count: stats._.bansPending, warning: 1, danger: 16 },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="$isGranted('users') || $isGranted('community')"
|
|
v-show="!filterAttention || stats._.userReports"
|
|
icon="siren-on"
|
|
header="Abuse reports"
|
|
link="/admin/abuse-reports"
|
|
:counts="[
|
|
{ count: stats._.userReports, warning: 1, danger: 16 },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-show="!filterAttention"
|
|
icon="user-cog"
|
|
link="/admin/moderation"
|
|
header="Moderation rules"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="$isGranted('code')"
|
|
v-show="!filterAttention || stats._.cardsQueue"
|
|
icon="id-card"
|
|
header="Cards queue"
|
|
:counts="[
|
|
{ count: stats._.cardsQueue, warning: 16, danger: 64 },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="$isGranted('code')"
|
|
v-show="!filterAttention || stats._.linksQueue"
|
|
icon="link"
|
|
header="Links queue"
|
|
:counts="[
|
|
{ count: stats._.linksQueue, warning: 64, danger: 256 },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-show="!filterAttention"
|
|
icon="bell"
|
|
header="Email notifications"
|
|
>
|
|
<span v-for="(label, value) in { 0: 'Never', 1: 'Daily', 7: 'Weekly' }" class="form-check form-check-inline">
|
|
<input
|
|
:id="`notifiactionFrequency_${value}`"
|
|
v-model="adminNotifications"
|
|
class="form-check-input"
|
|
type="radio"
|
|
name="inlineRadioOptions"
|
|
:value="value"
|
|
>
|
|
<label class="form-check-label" :for="`notifiactionFrequency_${value}`">{{ label }}</label>
|
|
</span>
|
|
</AdminDashboardCard>
|
|
<AdminDashboardCard
|
|
v-show="!filterAttention"
|
|
v-if="$isGranted('users') || $isGranted('community')"
|
|
icon="user-secret"
|
|
header="@example"
|
|
>
|
|
<button class="btn btn-primary btn-sm" @click="impersonate('example@pronouns.page')">
|
|
Impersonate
|
|
</button>
|
|
</AdminDashboardCard>
|
|
<AdminDashboardCard
|
|
v-show="!filterAttention"
|
|
icon="b:discord"
|
|
link="https://team-discord.pronouns.page"
|
|
header="Team Discord"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-show="!filterAttention"
|
|
icon="palette"
|
|
link="/design"
|
|
header="Design guidelines"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-show="!filterAttention"
|
|
icon="file-spreadsheet"
|
|
link="/admin/timesheets"
|
|
header="Volunteering timesheets"
|
|
/>
|
|
</div>
|
|
|
|
<template v-for="({ name, config, url, published }, locale) in visibleLocales">
|
|
<h3>
|
|
{{ name }}
|
|
<small v-if="!published" class="text-muted">(not published yet)</small>
|
|
</h3>
|
|
<div class="row mb-4">
|
|
<AdminDashboardCard
|
|
v-show="!filterAttention"
|
|
:base-url="url"
|
|
icon="users"
|
|
header="Profiles"
|
|
link="/admin/profiles"
|
|
:counts="[
|
|
{ count: stats[locale].users },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="config.nouns && config.nouns.enabled && $isGranted('nouns', locale) && (stats[locale].nouns.approved > 0 || stats[locale].nouns.awaiting > 0)"
|
|
v-show="!filterAttention || stats[locale].nouns.awaiting"
|
|
:base-url="url"
|
|
icon="book"
|
|
header="Dictionary"
|
|
:link="`/${config.nouns.route}`"
|
|
:counts="[
|
|
{ count: stats[locale].nouns.approved },
|
|
{ name: 'awaiting', count: stats[locale].nouns.awaiting, warning: 1, danger: 16 },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="config.inclusive && config.inclusive.enabled && $isGranted('inclusive', locale) && (stats[locale].inclusive.approved > 0 || stats[locale].inclusive.awaiting > 0)"
|
|
v-show="!filterAttention || stats[locale].inclusive.awaiting"
|
|
:base-url="url"
|
|
icon="book-heart"
|
|
header="Inclusive"
|
|
:link="`/${config.inclusive.route}`"
|
|
:counts="[
|
|
{ count: stats[locale].inclusive.approved },
|
|
{ name: 'awaiting', count: stats[locale].inclusive.awaiting, warning: 1, danger: 16 },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="config.terminology && config.terminology.enabled && $isGranted('terms', locale) && (stats[locale].terms.approved > 0 || stats[locale].terms.awaiting > 0)"
|
|
v-show="!filterAttention || stats[locale].terms.awaiting"
|
|
:base-url="url"
|
|
icon="flag"
|
|
header="Terminology"
|
|
:link="`/${config.terminology.route}`"
|
|
:counts="[
|
|
{ count: stats[locale].terms.approved },
|
|
{ name: 'awaiting', count: stats[locale].terms.awaiting, warning: 1, danger: 16 },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="config.sources && config.sources.enabled && $isGranted('sources', locale) && (stats[locale].sources.approved > 0 || stats[locale].sources.awaiting > 0)"
|
|
v-show="!filterAttention || stats[locale].sources.awaiting"
|
|
:base-url="url"
|
|
icon="books"
|
|
header="Sources"
|
|
:link="`/${config.sources.route}`"
|
|
:counts="[
|
|
{ count: stats[locale].sources.approved },
|
|
{ name: 'awaiting', count: stats[locale].sources.awaiting, warning: 1, danger: 16 },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="config.names && config.names.enabled && $isGranted('names', locale) && (stats[locale].names.approved > 0 || stats[locale].names.awaiting > 0)"
|
|
v-show="!filterAttention || stats[locale].names.awaiting"
|
|
:base-url="url"
|
|
icon="signature"
|
|
header="Names"
|
|
:link="`/${config.names.route}`"
|
|
:counts="[
|
|
{ count: stats[locale].names.approved },
|
|
{ name: 'awaiting', count: stats[locale].names.awaiting, warning: 1, danger: 16 },
|
|
]"
|
|
/>
|
|
<AdminDashboardCard
|
|
v-if="$isGranted('translations', locale) && (stats[locale].translations.missing > 0 || stats[locale].translations.awaitingApproval > 0) || $isGranted('code', locale) && stats[locale].translations.awaitingMerge > 0"
|
|
v-show="!filterAttention || stats[locale].translations.missing || stats[locale].translations.awaitingApproval || stats[locale].translations.awaitingMerge"
|
|
:base-url="url"
|
|
icon="language"
|
|
header="Translations"
|
|
:counts="[
|
|
{
|
|
name: 'missing',
|
|
link: '/admin/translations/missing',
|
|
count: stats[locale].translations.missing,
|
|
warning: 1,
|
|
danger: 16,
|
|
enabled: $isGranted('translations', locale),
|
|
},
|
|
{
|
|
name: 'proposed',
|
|
link: '/admin/translations/awaiting',
|
|
count: stats[locale].translations.awaitingApproval,
|
|
warning: 1,
|
|
danger: 16,
|
|
enabled: $isGranted('translations', locale),
|
|
},
|
|
{
|
|
name: 'not merged',
|
|
link: '/admin/translations/awaiting',
|
|
count: stats[locale].translations.awaitingMerge,
|
|
warning: 1,
|
|
danger: 16,
|
|
enabled: $isGranted('code', locale),
|
|
},
|
|
]"
|
|
/>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</Page>
|
|
</template>
|
|
|
|
<script>
|
|
import { useNuxtApp } from 'nuxt/app';
|
|
import { longtimeCookieSetting } from '~/src/cookieSettings.ts';
|
|
import useConfig from '~/composables/useConfig.ts';
|
|
import useSimpleHead from '~/composables/useSimpleHead.ts';
|
|
import { useMainStore } from '~/store/index.ts';
|
|
|
|
export default {
|
|
async setup() {
|
|
const { $translator: translator } = useNuxtApp();
|
|
useSimpleHead({
|
|
title: translator.translate('admin.header'),
|
|
}, translator);
|
|
|
|
const tokenCookie = useCookie('token', longtimeCookieSetting);
|
|
const impersonatorCookie = useCookie('impersonator', longtimeCookieSetting);
|
|
|
|
|
|
const stats = useFetch('/api/admin/stats');
|
|
const allLocales = useFetch('/api/admin/all-locales');
|
|
await Promise.all([stats, allLocales]);
|
|
|
|
return {
|
|
config: useConfig(),
|
|
store: useMainStore(),
|
|
tokenCookie,
|
|
impersonatorCookie,
|
|
stats: stats.data.value,
|
|
allLocales: allLocales.data.value,
|
|
};
|
|
},
|
|
data() {
|
|
return {
|
|
adminNotifications: this.$user() ? this.$user().adminNotifications ?? 7 : 7,
|
|
filterAttention: false,
|
|
};
|
|
},
|
|
computed: {
|
|
visibleLocales() {
|
|
return Object.fromEntries(Object.entries(this.allLocales).filter(([locale, _]) => {
|
|
return this.$isGranted('panel', locale) && this.stats[locale];
|
|
}));
|
|
},
|
|
},
|
|
watch: {
|
|
async adminNotifications() {
|
|
const res = await $fetch('/api/admin/set-notification-frequency', {
|
|
method: 'POST',
|
|
body: { frequency: parseInt(this.adminNotifications) },
|
|
});
|
|
this.store.setToken(res.token);
|
|
},
|
|
},
|
|
methods: {
|
|
async impersonate(email) {
|
|
const { token } = await $fetch(`/api/admin/impersonate/${encodeURIComponent(email)}`);
|
|
this.impersonatorCookie = this.tokenCookie;
|
|
this.tokenCookie = token;
|
|
await this.$router.push(`/${this.config.user.route}`);
|
|
setTimeout(() => window.location.reload(), 500);
|
|
},
|
|
},
|
|
};
|
|
</script>
|