108 lines
2.8 KiB
Vue
108 lines
2.8 KiB
Vue
<script setup>
|
|
import { Link } from "@inertiajs/vue3";
|
|
import AppLayout from "@/Layouts/AppLayout.vue";
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardDescription,
|
|
CardHeader,
|
|
CardTitle,
|
|
} from "@/Components/ui/card";
|
|
import { Button } from "@/Components/ui/button";
|
|
import { BarChart3, FileText, TrendingUp, Activity } from "lucide-vue-next";
|
|
|
|
defineProps({
|
|
reports: { type: Array, required: true },
|
|
});
|
|
|
|
// Icon mapping by category
|
|
const reportIcons = {
|
|
contracts: FileText,
|
|
field: TrendingUp,
|
|
activities: Activity,
|
|
default: BarChart3,
|
|
};
|
|
|
|
function getReportIcon(category) {
|
|
return reportIcons[category] || reportIcons.default;
|
|
}
|
|
|
|
// Generate report URL with default date filters for reports that need them
|
|
function getReportUrl(slug) {
|
|
const now = new Date();
|
|
const startOfMonth = new Date(now.getFullYear(), now.getMonth(), 1);
|
|
|
|
// Format dates as YYYY-MM-DD
|
|
const formatDate = (date) => {
|
|
return date.toISOString().split('T')[0];
|
|
};
|
|
|
|
// Report-specific default parameters
|
|
const reportDefaults = {
|
|
'field-jobs-completed': {
|
|
from: formatDate(startOfMonth),
|
|
to: formatDate(now)
|
|
},
|
|
'decisions-counts': {
|
|
from: formatDate(startOfMonth),
|
|
to: formatDate(now)
|
|
},
|
|
'activities-per-period': {
|
|
from: formatDate(startOfMonth),
|
|
to: formatDate(now),
|
|
period: 'day'
|
|
}
|
|
};
|
|
|
|
const params = reportDefaults[slug];
|
|
|
|
if (params) {
|
|
return route('reports.show', { slug, ...params });
|
|
}
|
|
|
|
return route('reports.show', slug);
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<AppLayout title="Poročila">
|
|
<template #header />
|
|
<div class="pt-12">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="mb-8">
|
|
<h1 class="text-3xl font-bold text-gray-900">Poročila</h1>
|
|
<p class="mt-2 text-sm text-muted-foreground">
|
|
Izberite poročilo za pregled in izvoz podatkov
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
<Card
|
|
v-for="r in reports"
|
|
:key="r.slug"
|
|
class="hover:shadow-lg transition-shadow"
|
|
>
|
|
<CardHeader>
|
|
<div class="flex items-center gap-2">
|
|
<component
|
|
:is="getReportIcon(r.category)"
|
|
class="h-5 w-5 text-muted-foreground"
|
|
/>
|
|
<CardTitle>{{ r.name }}</CardTitle>
|
|
</div>
|
|
<CardDescription>{{ r.description }}</CardDescription>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<Link :href="getReportUrl(r.slug)">
|
|
<Button variant="ghost" size="sm" class="w-full justify-start">
|
|
Odpri →
|
|
</Button>
|
|
</Link>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</AppLayout>
|
|
</template>
|