PronounsPage/pages/admin/profiles.vue

<template>
    <Page>
        <NotFound v-if="!$isGranted('users') && !$isGranted('community')" />
        <div v-else>
            <p>
                <nuxt-link to="/admin">
                    <Icon v="user-cog" />
                    <T>admin.header</T>
                </nuxt-link>
            </p>
            <h2>
                <Icon v="user-cog" />
                Profiles
            </h2>

            <section>
                <ChartSet :name="`profiles (${config.locale})`" :data="chart" init="cumulative" />
            </section>
        </div>
    </Page>
</template>

<script lang="ts">
import { useFetch, useNuxtApp } from 'nuxt/app';
import { defineComponent } from 'vue';
import useSimpleHead from '~/composables/useSimpleHead.ts';
import useConfig from '~/composables/useConfig.ts';

export default defineComponent({
    async setup() {
        const { $translator: translator } = useNuxtApp();
        const config = useConfig();
        useSimpleHead({
            title: `${translator.translate('admin.header')} • Profiles`,
        }, translator);

        const { data: chart } = await useFetch(`/api/admin/stats/users-chart/${config.locale}`);

        return {
            config: useConfig(),
            chart,
        };
    },
});
</script>