99 lines
3.5 KiB
Vue
99 lines
3.5 KiB
Vue
<script setup lang="ts">
|
|
const { getOverviewStats } = useAdmin()
|
|
|
|
const { data: statsRes, pending } = useAsyncData('admin-stats', () => getOverviewStats())
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<div class="callout callout-highlight callout-danger mb-4">
|
|
<div class="callout-title">Pannello Admin</div>
|
|
<p>Accesso di livello 1. Da qui puoi gestire le configurazioni di sistema, le categorie e moderare le segnalazioni.</p>
|
|
</div>
|
|
|
|
<div class="row mb-5" v-if="!pending && statsRes?.ok">
|
|
|
|
<div class="col-6 col-md-3 mb-3">
|
|
<div class="card-wrapper card-space">
|
|
<div class="card card-bg text-center">
|
|
<div class="card-body">
|
|
<h2 class="text-primary">
|
|
{{ statsRes.reports_by_status?.reduce((sum, item) => sum + Number(item.total), 0) || 0 }}
|
|
</h2>
|
|
<p class="card-text">Totale Segnalazioni</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-6 col-md-3 mb-3">
|
|
<div class="card-wrapper card-space">
|
|
<div class="card card-bg text-center">
|
|
<div class="card-body">
|
|
<h2 class="text-danger">
|
|
{{ statsRes.reports_by_status?.find(s => s.status === 'OPEN')?.total ?? 0 }}
|
|
</h2>
|
|
<p class="card-text">Aperte (Da Gestire)</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-6 col-md-3 mb-3">
|
|
<div class="card-wrapper card-space">
|
|
<div class="card card-bg text-center">
|
|
<div class="card-body">
|
|
<h2 class="text-warning">
|
|
{{ statsRes.reports_by_status?.find(s => s.status === 'ASSIGNED')?.total ?? 0 }}
|
|
</h2>
|
|
<p class="card-text">In Carico (Assegnate)</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-6 col-md-3 mb-3">
|
|
<div class="card-wrapper card-space">
|
|
<div class="card card-bg text-center">
|
|
<div class="card-body">
|
|
<h2 class="text-success">
|
|
{{ statsRes.reports_by_status?.find(s => s.status === 'CLOSED')?.total ?? 0 }}
|
|
</h2>
|
|
<p class="card-text">Risolte (Chiuse)</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<h3 class="mb-3">Gestione Sistema</h3>
|
|
<div class="row">
|
|
<div class="col-12 col-md-4 mb-3">
|
|
<NuxtLink to="/admin/catalog" class="btn btn-outline-primary w-100 py-3 d-flex flex-column align-items-center">
|
|
<BIIcon name="it-list" size="sm" color="primary" class="mb-2" />
|
|
Categorie e Team
|
|
</NuxtLink>
|
|
</div>
|
|
<div class="col-12 col-md-4 mb-3">
|
|
<NuxtLink to="/admin/areas" class="btn btn-outline-primary w-100 py-3 d-flex flex-column align-items-center">
|
|
<BIIcon name="it-map-marker" size="sm" color="primary" class="mb-2" />
|
|
Aree
|
|
</NuxtLink>
|
|
</div>
|
|
<div class="col-12 col-md-4 mb-3">
|
|
<NuxtLink to="/admin/users" class="btn btn-outline-primary w-100 py-3 d-flex flex-column align-items-center">
|
|
<BIIcon name="it-user" size="sm" color="primary" class="mb-2" />
|
|
Gestione Utenti
|
|
</NuxtLink>
|
|
</div>
|
|
<div class="col-12 col-md-6 mb-3">
|
|
<NuxtLink to="/admin/moderation" class="btn btn-outline-danger w-100 py-3 d-flex flex-column align-items-center">
|
|
<BIIcon name="it-warning" size="sm" color="danger" class="mb-2" />
|
|
Moderazione Abusi
|
|
</NuxtLink>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|