Squashed commit of the following:
All checks were successful
Gitea Actions Demo / Explore-Gitea-Actions (push) Successful in 40s

commit 579f0878e5240dc17db69be1e0b0c0f5af7ef9fe
Author: Arno Kaimbacher <arno.kaimbacher@geosphere.at>
Date:   Tue Jun 9 09:25:44 2026 +0200

    feat: Refactor error handling in Dataset Edit form and improve validation messages

    - Updated error handling in the Dataset Edit form to use a centralized formatError function for displaying validation messages.
    - Enhanced user feedback by ensuring that error messages are displayed consistently across various fields.
    - Modified the validation rule for arrayContainsTypes to provide clearer error messages for missing main and translated titles/abstracts.
    - Introduced a new ValidationService to manage manual construction of validation errors.
    - Updated Vite configuration to streamline asset loading and improve performance.
    - Adjusted Inertia setup to utilize dynamic imports for page-specific assets.
    - Cleaned up unnecessary comments and code in various files for better readability.

commit 5efddc2a58c0e164fef585cc7344c06155dbc2c1
Author: Arno Kaimbacher <arno.kaimbacher@geosphere.at>
Date:   Mon Jan 12 17:02:47 2026 +0100

    feat: add dataset change detection and form submission composables

    - Implemented `useDatasetChangeDetection` for tracking unsaved changes in dataset forms, including comparisons for licenses, basic properties, files, coverage, and more.
    - Added `useDatasetFormSubmission` for handling dataset form submissions with validation, success/error handling, and auto-save functionality.
This commit is contained in:
Kaimbacher 2026-06-09 09:35:15 +02:00
commit 9368a0dd8d
38 changed files with 5588 additions and 6181 deletions

View file

@ -48,9 +48,22 @@ mainService.fetchApi('authors');
mainService.fetchApi('datasets');
mainService.fetchChartData();
// Safe role check: authUser or its roles may be absent depending on auth state
const userHasRoles = (roleNames: Array<string>): boolean => {
return user.value.roles.some((role) => roleNames.includes(role.name));
return user.value?.roles?.some((role) => roleNames.includes(role)) ?? false;
};
// Greeting that adapts to the time of day
const greeting = computed(() => {
const h = new Date().getHours();
if (h < 12) return 'Good morning';
if (h < 18) return 'Good afternoon';
return 'Good evening';
});
const today = computed(() =>
new Date().toLocaleDateString(undefined, { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }),
);
</script>
<template>
@ -58,67 +71,62 @@ const userHasRoles = (roleNames: Array<string>): boolean => {
<Head title="Dashboard" />
<SectionMain>
<SectionTitleLineWithButton :icon="mdiChartTimelineVariant" title="Dashboard Overview" main>
<div class="text-sm text-gray-500 dark:text-gray-400">
Welcome back, <span class="font-semibold">{{ user.login }}</span>
</div>
</SectionTitleLineWithButton>
<!-- Greeting hero -->
<div
class="reveal relative overflow-hidden rounded-2xl mb-8 p-6 md:p-8 bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 text-white shadow-xl ring-1 ring-white/5"
>
<!-- grüner Akzent-Glow statt weißer Kreise -->
<div class="absolute -right-10 -top-10 w-48 h-48 rounded-full bg-emerald-500/15 blur-3xl"></div>
<div class="absolute -left-8 -bottom-12 w-40 h-40 rounded-full bg-green-400/10 blur-3xl"></div>
<!-- schmale Akzentkante links -->
<div class="absolute inset-y-0 left-0 w-1 bg-gradient-to-b from-green-400 to-emerald-600"></div>
<div class="relative">
<p class="text-sm font-medium text-slate-400">{{ today }}</p>
<h1 class="mt-1 text-2xl md:text-3xl font-bold tracking-tight">
{{ greeting }}, <span class="text-green-400">{{ user?.login ?? 'there' }}</span>
</h1>
<p class="mt-2 text-sm text-slate-400 max-w-xl">
Here's an overview of authors, publications and submitters across the repository.
</p>
</div>
</div>
<!-- Stats Grid -->
<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"
class="hover:shadow-lg transition-shadow duration-300"
/>
<CardBoxWidget
trend-type="info"
color="text-blue-500"
:icon="mdiDatabaseOutline"
:number="datasets.length"
label="Publications"
class="hover:shadow-lg transition-shadow duration-300"
/>
<CardBoxWidget
trend-type="up"
color="text-purple-500"
:icon="mdiChartTimelineVariant"
:number="submitters.length"
label="Submitters"
class="hover:shadow-lg transition-shadow duration-300"
/>
</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 class="reveal reveal-1 grid grid-cols-1 gap-6 lg:grid-cols-3 mb-8">
<div class="rounded-xl border-l-4 border-emerald-500 bg-white dark:bg-slate-900/40 shadow-sm hover:shadow-lg hover:-translate-y-1 transition-all duration-300">
<CardBoxWidget
trend="12%"
trend-type="up"
color="text-emerald-500"
:icon="mdiAccountMultiple"
:number="authors.length"
label="Authors"
/>
</div>
</div>
<div class="rounded-xl border-l-4 border-blue-500 bg-white dark:bg-slate-900/40 shadow-sm hover:shadow-lg hover:-translate-y-1 transition-all duration-300">
<CardBoxWidget
trend-type="info"
color="text-blue-500"
:icon="mdiDatabaseOutline"
:number="datasets.length"
label="Publications"
/>
</div>
<div class="rounded-xl border-l-4 border-purple-500 bg-white dark:bg-slate-900/40 shadow-sm hover:shadow-lg hover:-translate-y-1 transition-all duration-300">
<CardBoxWidget
trend-type="up"
color="text-purple-500"
:icon="mdiChartTimelineVariant"
:number="submitters.length"
label="Submitters"
/>
</div>
</div>
<!-- Recent Datasets Section -->
<div v-if="datasetBarItems.length > 0" class="mb-6">
<div v-if="datasetBarItems.length > 0" class="reveal reveal-2 mb-8">
<SectionTitleLineWithButton :icon="mdiTrendingUp" title="Recent Publications">
<span class="text-sm text-gray-500 dark:text-gray-400"> Latest {{ datasetBarItems.length }} publications </span>
<span class="text-sm text-gray-500 dark:text-gray-400">Latest {{ datasetBarItems.length }} publications</span>
</SectionTitleLineWithButton>
<div class="grid grid-cols-1 gap-4">
@ -131,18 +139,16 @@ const userHasRoles = (roleNames: Array<string>): boolean => {
</div>
</div>
<!-- <SectionBannerStarOnGitHub /> -->
<!-- Chart Section -->
<SectionTitleLineWithButton :icon="mdiChartPie" title="Trends Overview" class="mt-8">
<span class="text-sm text-gray-500 dark:text-gray-400"> Publications per month </span>
<SectionTitleLineWithButton :icon="mdiChartPie" title="Trends Overview" class="reveal reveal-3 mt-8">
<span class="text-sm text-gray-500 dark:text-gray-400">Publications per month</span>
</SectionTitleLineWithButton>
<CardBox
title="Performance"
:icon="mdiFinance"
:header-icon="mdiReload"
class="mb-6 shadow-lg"
class="reveal reveal-3 mb-6 shadow-lg"
@header-icon-click="fillChartData"
>
<div v-if="isLoadingChart" class="flex items-center justify-center h-96">
@ -162,14 +168,46 @@ const userHasRoles = (roleNames: Array<string>): boolean => {
<!-- Admin Section -->
<template v-if="userHasRoles(['administrator'])">
<SectionTitleLineWithButton :icon="mdiAccountMultiple" title="Submitters Management" class="mt-8">
<span class="text-sm text-gray-500 dark:text-gray-400"> Administrator view </span>
<span class="text-sm text-gray-500 dark:text-gray-400">Administrator view</span>
</SectionTitleLineWithButton>
<CardBox :icon="mdiMonitorCellphone" title="All Submitters" has-table class="shadow-lg">
<TableSampleClients />
</CardBox>
</template>
</SectionMain>
</LayoutAuthenticated>
</template>
<style scoped>
/* Staggered entrance reveal */
@keyframes fade-up {
from {
opacity: 0;
transform: translateY(12px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.reveal {
animation: fade-up 0.5s ease-out both;
}
.reveal-1 {
animation-delay: 0.08s;
}
.reveal-2 {
animation-delay: 0.16s;
}
.reveal-3 {
animation-delay: 0.24s;
}
@media (prefers-reduced-motion: reduce) {
.reveal {
animation: none;
}
}
</style>