314 lines
12 KiB
Vue
314 lines
12 KiB
Vue
<template>
|
|
<AdminLayout title="Predloga">
|
|
<div class="flex flex-col lg:flex-row gap-6 items-start">
|
|
<div class="flex-1 min-w-[320px] space-y-6">
|
|
<Card>
|
|
<CardHeader>
|
|
<div class="flex items-start justify-between gap-4">
|
|
<div class="flex items-start gap-3">
|
|
<div
|
|
class="inline-flex items-center justify-center h-10 w-10 rounded-lg bg-primary/10 text-primary"
|
|
>
|
|
<FileTextIcon class="h-5 w-5" />
|
|
</div>
|
|
<div>
|
|
<CardTitle>{{ template.name }}</CardTitle>
|
|
<CardDescription class="flex flex-wrap gap-3 mt-1">
|
|
<span class="inline-flex items-center gap-1">
|
|
<span>Slug:</span>
|
|
<Badge variant="secondary" class="text-xs">{{
|
|
template.slug
|
|
}}</Badge>
|
|
</span>
|
|
<span class="inline-flex items-center gap-1">
|
|
<span>Verzija:</span>
|
|
<Badge variant="secondary" class="text-xs"
|
|
>v{{ template.version }}</Badge
|
|
>
|
|
</span>
|
|
<Badge
|
|
:variant="template.active ? 'default' : 'outline'"
|
|
class="text-xs"
|
|
>
|
|
{{ template.active ? "Aktivna" : "Neaktivna" }}
|
|
</Badge>
|
|
</CardDescription>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-center gap-2">
|
|
<form @submit.prevent="toggleActive">
|
|
<Button
|
|
type="submit"
|
|
:variant="template.active ? 'destructive' : 'default'"
|
|
size="sm"
|
|
:disabled="toggleForm.processing"
|
|
>
|
|
<PowerOffIcon v-if="template.active" class="h-4 w-4 mr-2" />
|
|
<Power v-else class="h-4 w-4 mr-2" />
|
|
{{ template.active ? "Deaktiviraj" : "Aktiviraj" }}
|
|
</Button>
|
|
</form>
|
|
<Button size="sm" as-child>
|
|
<Link :href="route('admin.document-templates.edit', template.id)">
|
|
<PencilIcon class="h-4 w-4 mr-2" />
|
|
Uredi
|
|
</Link>
|
|
</Button>
|
|
<Button size="sm" variant="outline" as-child>
|
|
<Link :href="route('admin.document-templates.index')">
|
|
<ArrowLeftIcon class="h-4 w-4 mr-2" />
|
|
Nazaj
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div class="grid md:grid-cols-3 gap-6 text-sm">
|
|
<div class="space-y-3">
|
|
<h3 class="font-semibold flex items-center gap-2">
|
|
<FileTextIcon class="h-4 w-4" />
|
|
Datoteka
|
|
</h3>
|
|
<div class="space-y-2 text-sm">
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Velikost:</span>
|
|
<Badge variant="secondary"
|
|
>{{ (template.file_size / 1024).toFixed(1) }} KB</Badge
|
|
>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Hash:</span>
|
|
<code class="text-xs"
|
|
>{{ template.file_hash?.substring(0, 12) }}…</code
|
|
>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Engine:</span>
|
|
<Badge variant="outline">{{ template.engine }}</Badge>
|
|
</div>
|
|
</div>
|
|
<Button size="sm" variant="outline" class="w-full" as-child>
|
|
<a :href="'/storage/' + template.file_path" target="_blank">
|
|
<DownloadIcon class="h-4 w-4 mr-2" />
|
|
Prenesi DOCX
|
|
</a>
|
|
</Button>
|
|
</div>
|
|
<div class="space-y-3">
|
|
<h3 class="font-semibold flex items-center gap-2">
|
|
<HashIcon class="h-4 w-4" />
|
|
Formatiranje
|
|
</h3>
|
|
<div class="space-y-2 text-sm">
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Datum:</span>
|
|
<code class="text-xs">{{
|
|
template.settings?.date_format || "d.m.Y"
|
|
}}</code>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Decimalna mesta:</span>
|
|
<span>{{ template.settings?.number_decimals ?? "-" }}</span>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Separators:</span>
|
|
<code class="text-xs">
|
|
{{ template.settings?.decimal_separator || "." }} /
|
|
{{ template.settings?.thousands_separator || " " }}
|
|
</code>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Valuta:</span>
|
|
<span class="text-xs">
|
|
{{ template.settings?.currency_symbol || "€" }} ({{
|
|
template.settings?.currency_position || "before"
|
|
}})
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="space-y-3">
|
|
<h3 class="font-semibold">Aktivnost</h3>
|
|
<div class="space-y-2 text-sm">
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Akcija:</span>
|
|
<Badge variant="outline">{{ template.action?.name || "-" }}</Badge>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Odločitev:</span>
|
|
<Badge variant="outline">{{ template.decision?.name || "-" }}</Badge>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<span class="text-muted-foreground">Fail unresolved:</span>
|
|
<Badge
|
|
:variant="
|
|
template.settings?.fail_on_unresolved
|
|
? 'destructive'
|
|
: 'secondary'
|
|
"
|
|
>
|
|
{{ template.settings?.fail_on_unresolved ? "DA" : "NE" }}
|
|
</Badge>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card v-if="template.settings?.activity_note_template">
|
|
<CardHeader>
|
|
<CardTitle class="text-base">Predloga opombe aktivnosti</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<pre
|
|
class="bg-muted p-3 rounded border text-xs leading-relaxed whitespace-pre-wrap font-mono"
|
|
>{{ template.settings.activity_note_template }}</pre
|
|
>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card v-if="template.tokens?.length">
|
|
<CardHeader>
|
|
<div class="flex items-center justify-between">
|
|
<div>
|
|
<CardTitle class="text-base">Tokens</CardTitle>
|
|
<CardDescription>{{ template.tokens.length }} tokenov</CardDescription>
|
|
</div>
|
|
<Button
|
|
type="button"
|
|
variant="ghost"
|
|
size="sm"
|
|
@click="expandedTokens = !expandedTokens"
|
|
>
|
|
{{ expandedTokens ? "Skrij" : "Prikaži vse" }}
|
|
</Button>
|
|
</div>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div
|
|
class="flex flex-wrap gap-1.5 overflow-auto"
|
|
:class="!expandedTokens && 'max-h-32'"
|
|
>
|
|
<Badge
|
|
v-for="t in template.tokens"
|
|
:key="t"
|
|
variant="secondary"
|
|
class="font-mono text-xs"
|
|
>
|
|
{{ t }}
|
|
</Badge>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
|
|
<aside class="w-full lg:w-72 space-y-6">
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle class="text-sm">Hitra dejanja</CardTitle>
|
|
</CardHeader>
|
|
<CardContent class="flex flex-col gap-2">
|
|
<Button size="sm" as-child>
|
|
<Link :href="route('admin.document-templates.edit', template.id)">
|
|
<PencilIcon class="h-4 w-4 mr-2" />
|
|
Uredi nastavitve
|
|
</Link>
|
|
</Button>
|
|
<form @submit.prevent="toggleActive">
|
|
<Button
|
|
type="submit"
|
|
size="sm"
|
|
:variant="template.active ? 'destructive' : 'default'"
|
|
:disabled="toggleForm.processing"
|
|
class="w-full"
|
|
>
|
|
<PowerOffIcon v-if="template.active" class="h-4 w-4 mr-2" />
|
|
<Power v-else class="h-4 w-4 mr-2" />
|
|
{{ template.active ? "Deaktiviraj" : "Aktiviraj" }}
|
|
</Button>
|
|
</form>
|
|
<form @submit.prevent="rescan">
|
|
<Button
|
|
type="submit"
|
|
size="sm"
|
|
variant="outline"
|
|
:disabled="rescanForm.processing"
|
|
class="w-full"
|
|
>
|
|
<RefreshCwIcon class="h-4 w-4 mr-2" />
|
|
{{ rescanForm.processing ? "Pregledujem…" : "Ponovno preglej tokene" }}
|
|
</Button>
|
|
</form>
|
|
<Button size="sm" variant="outline" as-child>
|
|
<Link :href="route('admin.document-templates.index')">
|
|
<ArrowLeftIcon class="h-4 w-4 mr-2" />
|
|
Vse predloge
|
|
</Link>
|
|
</Button>
|
|
</CardContent>
|
|
</Card>
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle class="text-sm">Opombe</CardTitle>
|
|
</CardHeader>
|
|
<CardContent class="text-sm text-muted-foreground">
|
|
<p>
|
|
Uporabi to stran za hiter pregled meta podatkov predloge ter njenih tokenov.
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
</aside>
|
|
</div>
|
|
</AdminLayout>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from "vue";
|
|
import { Link, useForm } from "@inertiajs/vue3";
|
|
import AdminLayout from "@/Layouts/AdminLayout.vue";
|
|
import {
|
|
FileTextIcon,
|
|
Power,
|
|
PowerOffIcon,
|
|
PencilIcon,
|
|
ArrowLeftIcon,
|
|
RefreshCwIcon,
|
|
DownloadIcon,
|
|
HashIcon,
|
|
} from "lucide-vue-next";
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardDescription,
|
|
CardHeader,
|
|
CardTitle,
|
|
} from "@/Components/ui/card";
|
|
import { Button } from "@/Components/ui/button";
|
|
import { Badge } from "@/Components/ui/badge";
|
|
import { Separator } from "@/Components/ui/separator";
|
|
|
|
const expandedTokens = ref(false);
|
|
|
|
const props = defineProps({
|
|
template: Object,
|
|
});
|
|
|
|
const toggleForm = useForm({});
|
|
const rescanForm = useForm({});
|
|
|
|
function toggleActive() {
|
|
toggleForm.post(route("admin.document-templates.toggle", props.template.id), {
|
|
preserveScroll: true,
|
|
});
|
|
}
|
|
|
|
function rescan() {
|
|
rescanForm.post(route("admin.document-templates.rescan", props.template.id), {
|
|
preserveScroll: true,
|
|
only: ["template"],
|
|
});
|
|
}
|
|
</script>
|