Arno Kaimbacher
c245c8e97d
- Renamed "Collections" to "Classify" in dataset category views for submitters and editors to better reflect the page's purpose. - Modified the `SectionTitleLineWithButton` component to conditionally render the cog button based on the `showCogButton` prop. - Updated the Dataset Edit and Create views to use `textarea` instead of `text` for title and description input fields, allowing for multi-line text. - Added authorization checks for dataset review and reject actions in the `Reviewer/DatasetController`, and passed the `can` object to the `Review` view. - Added a "Reject" button to the dataset review page, visible only to users with the `dataset-review-reject` permission and when the dataset is in the 'approved' state. - Improved the display of dataset information in index views by adding dark mode styling to table headers. - Removed unused code and comments from the Dashboard.vue file. - Removed the `show-header-icon` property from the CardBox component in the Create.vue file. - Updated dependencies
142 lines
5.6 KiB
Vue
142 lines
5.6 KiB
Vue
<script setup lang="ts">
|
|
import { Head, usePage } from '@inertiajs/vue3';
|
|
import { computed } from 'vue';
|
|
import { MainService } from '@/Stores/main';
|
|
import {
|
|
mdiAccountMultiple,
|
|
mdiDatabaseOutline,
|
|
mdiChartTimelineVariant,
|
|
mdiFinance,
|
|
mdiMonitorCellphone,
|
|
mdiReload,
|
|
mdiChartPie,
|
|
} from '@mdi/js';
|
|
import LineChart from '@/Components/Charts/LineChart.vue';
|
|
import SectionMain from '@/Components/SectionMain.vue';
|
|
import CardBoxWidget from '@/Components/CardBoxWidget.vue';
|
|
import CardBox from '@/Components/CardBox.vue';
|
|
import TableSampleClients from '@/Components/TableSampleClients.vue';
|
|
// import NotificationBar from '@/Components/NotificationBar.vue';
|
|
import CardBoxClient from '@/Components/CardBoxClient.vue';
|
|
import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
|
|
import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
|
|
// import SectionBannerStarOnGitHub from '@/Components/SectionBannerStarOnGitea.vue';
|
|
import CardBoxDataset from '@/Components/CardBoxDataset.vue';
|
|
import type { User } from '@/Dataset';
|
|
const mainService = MainService()
|
|
|
|
// const chartData = ref();
|
|
const fillChartData = async () => {
|
|
await mainService.fetchChartData();
|
|
// chartData.value = chartConfig.sampleChartData();
|
|
// chartData.value = mainService.graphData;
|
|
};
|
|
const chartData = computed(() => mainService.graphData);
|
|
// onMounted(async () => {
|
|
// await mainService.fetchChartData("2022");
|
|
// });
|
|
|
|
// mainService.fetch('clients');
|
|
// mainService.fetch('history');
|
|
|
|
// mainService.fetchApi('authors');
|
|
// mainService.fetchApi('datasets');
|
|
|
|
// const clientBarItems = computed(() => mainService.clients.slice(0, 4));
|
|
// const transactionBarItems = computed(() => mainService.history);
|
|
|
|
const authorBarItems = computed(() => mainService.authors.slice(0, 5));
|
|
const authors = computed(() => mainService.authors);
|
|
const datasets = computed(() => mainService.datasets);
|
|
const datasetBarItems = computed(() => mainService.datasets.slice(0, 5));
|
|
const submitters = computed(() => mainService.clients);
|
|
const user = computed(() => {
|
|
return usePage().props.authUser as User;
|
|
});
|
|
|
|
const userHasRoles = (roleNames: Array<string>): boolean => {
|
|
return user.value.roles.some(role => roleNames.includes(role.name));
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<LayoutAuthenticated :showAsideMenu="false">
|
|
<Head title="Dashboard" />
|
|
|
|
<SectionMain>
|
|
<SectionTitleLineWithButton v-bind:icon="mdiChartTimelineVariant" title="Overview" main>
|
|
<!-- <BaseButton
|
|
href=""
|
|
target="_blank"
|
|
:icon="mdiGithub"
|
|
label="Star on GeoSphere Forgejo"
|
|
color="contrast"
|
|
rounded-full
|
|
small
|
|
/> -->
|
|
</SectionTitleLineWithButton>
|
|
|
|
<div class="grid grid-cols-1 gap-6 lg:grid-cols-3 mb-6">
|
|
<CardBoxWidget
|
|
trend="12%"
|
|
trend-type="up"
|
|
color="text-emerald-500"
|
|
:icon="mdiAccountMultiple"
|
|
:number="authors.length"
|
|
label="Authors"
|
|
/>
|
|
<CardBoxWidget
|
|
trend-type="info"
|
|
color="text-blue-500"
|
|
:icon="mdiDatabaseOutline"
|
|
:number="datasets.length"
|
|
label="Publications"
|
|
/>
|
|
<CardBoxWidget
|
|
trend-type="up"
|
|
color="text-purple-500"
|
|
:icon="mdiChartTimelineVariant"
|
|
:number="submitters.length"
|
|
label="Submitters"
|
|
/>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-6">
|
|
<!-- <div class="flex flex-col justify-between">
|
|
<CardBoxClient
|
|
v-for="client in authorBarItems"
|
|
:key="client.id"
|
|
:name="client.name"
|
|
:email="client.email"
|
|
:date="client.created_at"
|
|
:text="client.identifier_orcid"
|
|
:count="client.dataset_count"
|
|
|
|
/>
|
|
</div> -->
|
|
<div class="flex flex-col justify-between">
|
|
<CardBoxDataset
|
|
v-for="(dataset, index) in datasetBarItems"
|
|
:key="index"
|
|
:dataset="dataset"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- <SectionBannerStarOnGitHub /> -->
|
|
|
|
<SectionTitleLineWithButton :icon="mdiChartPie" title="Trends overview: Publications per month" ></SectionTitleLineWithButton>
|
|
<CardBox title="Performance" :icon="mdiFinance" :header-icon="mdiReload" class="mb-6" @header-icon-click="fillChartData">
|
|
<div v-if="chartData">
|
|
<line-chart :data="chartData" class="h-96" />
|
|
</div>
|
|
</CardBox>
|
|
|
|
<SectionTitleLineWithButton v-if="userHasRoles(['administrator'])" :icon="mdiAccountMultiple" title="Submitters" />
|
|
<!-- <NotificationBar color="info" :icon="mdiMonitorCellphone"> <b>Responsive table.</b> Collapses on mobile </NotificationBar> -->
|
|
<CardBox v-if="userHasRoles(['administrator'])" :icon="mdiMonitorCellphone" title="Responsive table" has-table>
|
|
<TableSampleClients />
|
|
</CardBox>
|
|
</SectionMain>
|
|
</LayoutAuthenticated>
|
|
</template>
|