sipo/Teren-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

production #1

Merged
sipo merged 45 commits from production into master 2026-01-27 18:02:44 +00:00
Conversation 0 Commits 45 Files Changed 553 +335 -319
9 changed files with 335 additions and 319 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 70dc0b893f - Show all commits

18
package-lock.json generated
View File

@ -3627,9 +3627,9 @@
"license": "ISC" "license": "ISC"
}, },
"node_modules/electron-to-chromium": { "node_modules/electron-to-chromium": {
"version": "1.5.262", "version": "1.5.263",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.262.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.263.tgz",
"integrity": "sha512-NlAsMteRHek05jRUxUR0a5jpjYq9ykk6+kO0yRaMi5moe7u0fVIOeQ3Y30A8dIiWFBNUoQGi1ljb1i5VtS9WQQ==", "integrity": "sha512-DrqJ11Knd+lo+dv+lltvfMDLU27g14LMdH2b0O3Pio4uk0x+z7OR+JrmyacTPN2M8w3BrZ7/RTwG3R9B7irPlg==",
"dev": true, "dev": true,
"license": "ISC" "license": "ISC"
}, },
@ -5056,9 +5056,9 @@
} }
}, },
"node_modules/reka-ui": { "node_modules/reka-ui": {
"version": "2.6.0", "version": "2.6.1",
"resolved": "https://registry.npmjs.org/reka-ui/-/reka-ui-2.6.0.tgz", "resolved": "https://registry.npmjs.org/reka-ui/-/reka-ui-2.6.1.tgz",
"integrity": "sha512-NrGMKrABD97l890mFS3TNUzB0BLUfbL3hh0NjcJRIUSUljb288bx3Mzo31nOyUcdiiW0HqFGXJwyCBh9cWgb0w==", "integrity": "sha512-XK7cJDQoNuGXfCNzBBo/81Yg/OgjPwvbabnlzXG2VsdSgNsT6iIkuPBPr+C0Shs+3bb0x0lbPvgQAhMSCKm5Ww==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@floating-ui/dom": "^1.6.13", "@floating-ui/dom": "^1.6.13",
@ -5655,9 +5655,9 @@
} }
}, },
"node_modules/vite": { "node_modules/vite": {
"version": "7.2.4", "version": "7.2.6",
"resolved": "https://registry.npmjs.org/vite/-/vite-7.2.4.tgz", "resolved": "https://registry.npmjs.org/vite/-/vite-7.2.6.tgz",
"integrity": "sha512-NL8jTlbo0Tn4dUEXEsUg8KeyG/Lkmc4Fnzb8JXN/Ykm9G4HNImjtABMJgkQoVjOBN/j2WAwDTRytdqJbZsah7w==", "integrity": "sha512-tI2l/nFHC5rLh7+5+o7QjKjSR04ivXDF4jcgV0f/bTQ+OJiITy5S6gaynVsEM+7RqzufMnVbIon6Sr5x1SDYaQ==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {

44
resources/css/app.css
View File

@ -195,8 +195,8 @@ :root {
--card-foreground: oklch(0.141 0.005 285.823); --card-foreground: oklch(0.141 0.005 285.823);
--popover: oklch(1 0 0); --popover: oklch(1 0 0);
--popover-foreground: oklch(0.141 0.005 285.823); --popover-foreground: oklch(0.141 0.005 285.823);
--primary: oklch(0.648 0.2 131.684); --primary: oklch(0.488 0.243 264.376);
--primary-foreground: oklch(0.986 0.031 120.757); --primary-foreground: oklch(0.97 0.014 254.604);
--secondary: oklch(0.967 0.001 286.375); --secondary: oklch(0.967 0.001 286.375);
--secondary-foreground: oklch(0.21 0.006 285.885); --secondary-foreground: oklch(0.21 0.006 285.885);
--muted: oklch(0.967 0.001 286.375); --muted: oklch(0.967 0.001 286.375);
@ -206,20 +206,20 @@ :root {
--destructive: oklch(0.577 0.245 27.325); --destructive: oklch(0.577 0.245 27.325);
--border: oklch(0.92 0.004 286.32); --border: oklch(0.92 0.004 286.32);
--input: oklch(0.92 0.004 286.32); --input: oklch(0.92 0.004 286.32);
--ring: oklch(0.841 0.238 128.85); --ring: oklch(0.708 0 0);
--chart-1: oklch(0.871 0.15 154.449); --chart-1: oklch(0.809 0.105 251.813);
--chart-2: oklch(0.723 0.219 149.579); --chart-2: oklch(0.623 0.214 259.815);
--chart-3: oklch(0.627 0.194 149.214); --chart-3: oklch(0.546 0.245 262.881);
--chart-4: oklch(0.527 0.154 150.069); --chart-4: oklch(0.488 0.243 264.376);
--chart-5: oklch(0.448 0.119 151.328); --chart-5: oklch(0.424 0.199 265.638);
--sidebar: oklch(0.985 0 0); --sidebar: oklch(0.985 0 0);
--sidebar-foreground: oklch(0.141 0.005 285.823); --sidebar-foreground: oklch(0.141 0.005 285.823);
--sidebar-primary: oklch(0.648 0.2 131.684); --sidebar-primary: oklch(0.546 0.245 262.881);
--sidebar-primary-foreground: oklch(0.986 0.031 120.757); --sidebar-primary-foreground: oklch(0.97 0.014 254.604);
--sidebar-accent: oklch(0.967 0.001 286.375); --sidebar-accent: oklch(0.967 0.001 286.375);
--sidebar-accent-foreground: oklch(0.21 0.006 285.885); --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
--sidebar-border: oklch(0.92 0.004 286.32); --sidebar-border: oklch(0.92 0.004 286.32);
--sidebar-ring: oklch(0.841 0.238 128.85); --sidebar-ring: oklch(0.708 0 0);
} }
.dark { .dark {
@ -229,8 +229,8 @@ .dark {
--card-foreground: oklch(0.985 0 0); --card-foreground: oklch(0.985 0 0);
--popover: oklch(0.21 0.006 285.885); --popover: oklch(0.21 0.006 285.885);
--popover-foreground: oklch(0.985 0 0); --popover-foreground: oklch(0.985 0 0);
--primary: oklch(0.648 0.2 131.684); --primary: oklch(0.488 0.243 264.376);
--primary-foreground: oklch(0.986 0.031 120.757); --primary-foreground: oklch(0.97 0.014 254.604);
--secondary: oklch(0.274 0.006 286.033); --secondary: oklch(0.274 0.006 286.033);
--secondary-foreground: oklch(0.985 0 0); --secondary-foreground: oklch(0.985 0 0);
--muted: oklch(0.274 0.006 286.033); --muted: oklch(0.274 0.006 286.033);
@ -240,20 +240,20 @@ .dark {
--destructive: oklch(0.704 0.191 22.216); --destructive: oklch(0.704 0.191 22.216);
--border: oklch(1 0 0 / 10%); --border: oklch(1 0 0 / 10%);
--input: oklch(1 0 0 / 15%); --input: oklch(1 0 0 / 15%);
--ring: oklch(0.405 0.101 131.063); --ring: oklch(0.556 0 0);
--chart-1: oklch(0.871 0.15 154.449); --chart-1: oklch(0.809 0.105 251.813);
--chart-2: oklch(0.723 0.219 149.579); --chart-2: oklch(0.623 0.214 259.815);
--chart-3: oklch(0.627 0.194 149.214); --chart-3: oklch(0.546 0.245 262.881);
--chart-4: oklch(0.527 0.154 150.069); --chart-4: oklch(0.488 0.243 264.376);
--chart-5: oklch(0.448 0.119 151.328); --chart-5: oklch(0.424 0.199 265.638);
--sidebar: oklch(0.21 0.006 285.885); --sidebar: oklch(0.21 0.006 285.885);
--sidebar-foreground: oklch(0.985 0 0); --sidebar-foreground: oklch(0.985 0 0);
--sidebar-primary: oklch(0.768 0.233 130.85); --sidebar-primary: oklch(0.623 0.214 259.815);
--sidebar-primary-foreground: oklch(0.986 0.031 120.757); --sidebar-primary-foreground: oklch(0.97 0.014 254.604);
--sidebar-accent: oklch(0.274 0.006 286.033); --sidebar-accent: oklch(0.274 0.006 286.033);
--sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-accent-foreground: oklch(0.985 0 0);
--sidebar-border: oklch(1 0 0 / 10%); --sidebar-border: oklch(1 0 0 / 10%);
--sidebar-ring: oklch(0.405 0.101 131.063); --sidebar-ring: oklch(0.439 0 0);
} }
@layer base { @layer base {

57
resources/js/Components/Dialogs/CreateDialog.vue
View File

@ -6,40 +6,43 @@ import {
DialogFooter, DialogFooter,
DialogHeader, DialogHeader,
DialogTitle, DialogTitle,
} from '@/Components/ui/dialog'; } from "@/Components/ui/dialog";
import { Button } from '@/Components/ui/button'; import { Button } from "@/Components/ui/button";
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'; import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
import { faPlusCircle } from '@fortawesome/free-solid-svg-icons'; import { faPlusCircle } from "@fortawesome/free-solid-svg-icons";
import { computed, ref, watch, nextTick } from 'vue'; import { computed, ref, watch, nextTick } from "vue";
const props = defineProps({ const props = defineProps({
show: { type: Boolean, default: false }, show: { type: Boolean, default: false },
title: { type: String, default: 'Ustvari novo' }, title: { type: String, default: "Ustvari novo" },
maxWidth: { type: String, default: '2xl' }, maxWidth: { type: String, default: "2xl" },
confirmText: { type: String, default: 'Ustvari' }, confirmText: { type: String, default: "Ustvari" },
cancelText: { type: String, default: 'Prekliči' }, cancelText: { type: String, default: "Prekliči" },
processing: { type: Boolean, default: false }, processing: { type: Boolean, default: false },
disabled: { type: Boolean, default: false }, disabled: { type: Boolean, default: false },
}); });
const emit = defineEmits(['update:show', 'close', 'confirm']); const emit = defineEmits(["update:show", "close", "confirm"]);
const open = ref(props.show); const open = ref(props.show);
watch(() => props.show, (newVal) => { watch(
() => props.show,
(newVal) => {
open.value = newVal; open.value = newVal;
if (newVal) { if (newVal) {
// Emit custom event when dialog opens // Emit custom event when dialog opens
nextTick(() => { nextTick(() => {
window.dispatchEvent(new CustomEvent('dialog:open')); window.dispatchEvent(new CustomEvent("dialog:open"));
}); });
} }
}); }
);
watch(open, (newVal) => { watch(open, (newVal) => {
emit('update:show', newVal); emit("update:show", newVal);
if (!newVal) { if (!newVal) {
emit('close'); emit("close");
} }
}); });
@ -48,19 +51,19 @@ const onClose = () => {
}; };
const onConfirm = () => { const onConfirm = () => {
emit('confirm'); emit("confirm");
}; };
const maxWidthClass = computed(() => { const maxWidthClass = computed(() => {
const maxWidthMap = { const maxWidthMap = {
sm: 'sm:max-w-sm', sm: "sm:max-w-sm",
md: 'sm:max-w-md', md: "sm:max-w-md",
lg: 'sm:max-w-lg', lg: "sm:max-w-lg",
xl: 'sm:max-w-xl', xl: "sm:max-w-xl",
'2xl': 'sm:max-w-2xl', "2xl": "sm:max-w-2xl",
wide: 'sm:max-w-[1200px]', wide: "sm:max-w-[1200px]",
}; };
return maxWidthMap[props.maxWidth] || 'sm:max-w-2xl'; return maxWidthMap[props.maxWidth] || "sm:max-w-2xl";
}); });
</script> </script>
@ -70,7 +73,7 @@ const maxWidthClass = computed(() => {
<DialogHeader> <DialogHeader>
<DialogTitle> <DialogTitle>
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<FontAwesomeIcon :icon="faPlusCircle" class="h-5 w-5 text-primary-600" /> <FontAwesomeIcon :icon="faPlusCircle" class="h-5 w-5 text-primary" />
<span>{{ title }}</span> <span>{{ title }}</span>
</div> </div>
</DialogTitle> </DialogTitle>
@ -87,14 +90,10 @@ const maxWidthClass = computed(() => {
<Button variant="outline" @click="onClose" :disabled="processing"> <Button variant="outline" @click="onClose" :disabled="processing">
{{ cancelText }} {{ cancelText }}
</Button> </Button>
<Button <Button @click="onConfirm" :disabled="processing || disabled">
@click="onConfirm"
:disabled="processing || disabled"
>
{{ confirmText }} {{ confirmText }}
</Button> </Button>
</DialogFooter> </DialogFooter>
</DialogContent> </DialogContent>
</Dialog> </Dialog>
</template> </template>

57
resources/js/Components/Dialogs/UpdateDialog.vue
View File

@ -6,40 +6,43 @@ import {
DialogFooter, DialogFooter,
DialogHeader, DialogHeader,
DialogTitle, DialogTitle,
} from '@/Components/ui/dialog'; } from "@/Components/ui/dialog";
import { Button } from '@/Components/ui/button'; import { Button } from "@/Components/ui/button";
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'; import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
import { faPenToSquare } from '@fortawesome/free-solid-svg-icons'; import { faPenToSquare } from "@fortawesome/free-solid-svg-icons";
import { computed, ref, watch, nextTick } from 'vue'; import { computed, ref, watch, nextTick } from "vue";
const props = defineProps({ const props = defineProps({
show: { type: Boolean, default: false }, show: { type: Boolean, default: false },
title: { type: String, default: 'Uredi' }, title: { type: String, default: "Uredi" },
maxWidth: { type: String, default: '2xl' }, maxWidth: { type: String, default: "2xl" },
confirmText: { type: String, default: 'Shrani' }, confirmText: { type: String, default: "Shrani" },
cancelText: { type: String, default: 'Prekliči' }, cancelText: { type: String, default: "Prekliči" },
processing: { type: Boolean, default: false }, processing: { type: Boolean, default: false },
disabled: { type: Boolean, default: false }, disabled: { type: Boolean, default: false },
}); });
const emit = defineEmits(['update:show', 'close', 'confirm']); const emit = defineEmits(["update:show", "close", "confirm"]);
const open = ref(props.show); const open = ref(props.show);
watch(() => props.show, (newVal) => { watch(
() => props.show,
(newVal) => {
open.value = newVal; open.value = newVal;
if (newVal) { if (newVal) {
// Emit custom event when dialog opens // Emit custom event when dialog opens
nextTick(() => { nextTick(() => {
window.dispatchEvent(new CustomEvent('dialog:open')); window.dispatchEvent(new CustomEvent("dialog:open"));
}); });
} }
}); }
);
watch(open, (newVal) => { watch(open, (newVal) => {
emit('update:show', newVal); emit("update:show", newVal);
if (!newVal) { if (!newVal) {
emit('close'); emit("close");
} }
}); });
@ -48,19 +51,19 @@ const onClose = () => {
}; };
const onConfirm = () => { const onConfirm = () => {
emit('confirm'); emit("confirm");
}; };
const maxWidthClass = computed(() => { const maxWidthClass = computed(() => {
const maxWidthMap = { const maxWidthMap = {
sm: 'sm:max-w-sm', sm: "sm:max-w-sm",
md: 'sm:max-w-md', md: "sm:max-w-md",
lg: 'sm:max-w-lg', lg: "sm:max-w-lg",
xl: 'sm:max-w-xl', xl: "sm:max-w-xl",
'2xl': 'sm:max-w-2xl', "2xl": "sm:max-w-2xl",
wide: 'sm:max-w-[1200px]', wide: "sm:max-w-[1200px]",
}; };
return maxWidthMap[props.maxWidth] || 'sm:max-w-2xl'; return maxWidthMap[props.maxWidth] || "sm:max-w-2xl";
}); });
</script> </script>
@ -70,7 +73,7 @@ const maxWidthClass = computed(() => {
<DialogHeader> <DialogHeader>
<DialogTitle> <DialogTitle>
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<FontAwesomeIcon :icon="faPenToSquare" class="h-5 w-5 text-primary-600" /> <FontAwesomeIcon :icon="faPenToSquare" class="h-5 w-5 text-primary" />
<span>{{ title }}</span> <span>{{ title }}</span>
</div> </div>
</DialogTitle> </DialogTitle>
@ -87,14 +90,10 @@ const maxWidthClass = computed(() => {
<Button variant="outline" @click="onClose" :disabled="processing"> <Button variant="outline" @click="onClose" :disabled="processing">
{{ cancelText }} {{ cancelText }}
</Button> </Button>
<Button <Button @click="onConfirm" :disabled="processing || disabled">
@click="onConfirm"
:disabled="processing || disabled"
>
{{ confirmText }} {{ confirmText }}
</Button> </Button>
</DialogFooter> </DialogFooter>
</DialogContent> </DialogContent>
</Dialog> </Dialog>
</template> </template>

26
resources/js/Pages/Cases/Index.vue
View File

@ -7,6 +7,9 @@ import DataTable from "@/Components/DataTable/DataTableNew2.vue";
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
import { faFolderOpen } from "@fortawesome/free-solid-svg-icons"; import { faFolderOpen } from "@fortawesome/free-solid-svg-icons";
import Pagination from "@/Components/Pagination.vue"; import Pagination from "@/Components/Pagination.vue";
import AppCard from "@/Components/app/ui/card/AppCard.vue";
import { FolderOpenIcon } from "lucide-vue-next";
import CardTitle from "@/Components/ui/card/CardTitle.vue";
const props = defineProps({ const props = defineProps({
client_cases: Object, client_cases: Object,
@ -41,15 +44,21 @@ const fmtDateDMY = (v) => {
<template> <template>
<AppLayout title="Client cases"> <AppLayout title="Client cases">
<template #header> </template> <template #header> </template>
<div class="py-12"> <div class="py-6">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8"> <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg"> <AppCard
<div class="mx-auto max-w-4x1 py-3"> title=""
<div class="pb-3 px-3"> padding="none"
<SectionTitle> class="p-0! gap-0"
<template #title>Primeri</template> header-class="py-3! px-4 gap-0 text-muted-foreground"
</SectionTitle> body-class=""
>
<template #header>
<div class="flex items-center gap-2">
<FolderOpenIcon size="18" />
<CardTitle class="uppercase">Primeri</CardTitle>
</div> </div>
</template>
<DataTable <DataTable
:columns="[ :columns="[
{ key: 'nu', label: 'Št.', sortable: false }, { key: 'nu', label: 'Št.', sortable: false },
@ -132,10 +141,9 @@ const fmtDateDMY = (v) => {
page-param="clientCasesPage" page-param="clientCasesPage"
/> />
</div> </div>
</AppCard>
</div> </div>
<!-- Pagination handled by DataTableServer --> <!-- Pagination handled by DataTableServer -->
</div> </div>
</div>
</div>
</AppLayout> </AppLayout>
</template> </template>

27
resources/js/Pages/Client/Index.vue
View File

@ -28,8 +28,9 @@ import { useForm } from "vee-validate";
import { toTypedSchema } from "@vee-validate/zod"; import { toTypedSchema } from "@vee-validate/zod";
import * as z from "zod"; import * as z from "zod";
import ActionMessage from "@/Components/ActionMessage.vue"; import ActionMessage from "@/Components/ActionMessage.vue";
import { Mail, Plug2Icon, Plus } from "lucide-vue-next"; import { Mail, Plug2Icon, Plus, UsersRoundIcon } from "lucide-vue-next";
import { Separator } from "@/Components/ui/separator"; import { Separator } from "@/Components/ui/separator";
import AppCard from "@/Components/app/ui/card/AppCard.vue";
const props = defineProps({ const props = defineProps({
clients: Object, clients: Object,
@ -161,15 +162,24 @@ const fmtCurrency = (v) => {
</script> </script>
<template> <template>
<AppLayout title="Client"> <AppLayout>
<template #header> </template> <template #header> </template>
<div class="py-6"> <div class="py-6">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8"> <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<Card class="p-0"> <AppCard
<CardHeader> title=""
<CardTitle>Naročniki</CardTitle> padding="none"
</CardHeader> class="p-0! gap-0"
<CardContent class="p-0"> header-class="py-3! px-4 gap-0 text-muted-foreground"
body-class=""
>
<template #header>
<div class="flex items-center gap-2">
<UsersRoundIcon size="18" />
<CardTitle class="uppercase">Naročniki</CardTitle>
</div>
</template>
<DataTable <DataTable
:columns="[ :columns="[
{ key: 'nu', label: 'Št.', sortable: false }, { key: 'nu', label: 'Št.', sortable: false },
@ -236,8 +246,7 @@ const fmtCurrency = (v) => {
</div> </div>
</template> </template>
</DataTable> </DataTable>
</CardContent> </AppCard>
</Card>
</div> </div>
</div> </div>
</AppLayout> </AppLayout>

3
resources/js/Pages/Client/Show.vue
View File

@ -14,6 +14,7 @@ import { Card } from "@/Components/ui/card";
import Badge from "@/Components/ui/badge/Badge.vue"; import Badge from "@/Components/ui/badge/Badge.vue";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { Input } from "@/Components/ui/input"; import { Input } from "@/Components/ui/input";
import { UsersRoundIcon } from "lucide-vue-next";
const props = defineProps({ const props = defineProps({
client: Object, client: Object,
@ -93,7 +94,7 @@ function applySearch() {
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8"> <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg"> <div class="bg-white overflow-hidden shadow-xl sm:rounded-lg">
<div class="mx-auto max-w-4x1"> <div class="mx-auto max-w-4x1">
<div class="px-3 py-4 flex flex-row items-center gap-3"> <div class="p-2 flex flex-row items-center gap-2">
<Link <Link
:class=" :class="
cn( cn(

8
resources/js/Pages/Dashboard/Index.vue
View File

@ -55,15 +55,15 @@ const formatBalance = (amount) => {
label="Skupno stanje" label="Skupno stanje"
:value="formatBalance(kpis?.total_balance)" :value="formatBalance(kpis?.total_balance)"
:icon="Banknote" :icon="Banknote"
icon-bg="bg-chart-3/10" icon-bg="bg-chart-2/10"
icon-color="text-chart-3" icon-color="text-chart-2"
/> />
<SimpleKpiCard <SimpleKpiCard
label="Aktivne obljube" label="Aktivne obljube"
:value="kpis?.active_promises" :value="kpis?.active_promises"
:icon="CalendarCheck" :icon="CalendarCheck"
icon-bg="bg-chart-4/10" icon-bg="bg-chart-2/10"
icon-color="text-chart-4" icon-color="text-chart-2"
/> />
</div> </div>

8
resources/js/Pages/Dashboard/Partials/SmsOverview.vue
View File

@ -71,28 +71,28 @@ const props = defineProps({
<!-- Stats grid --> <!-- Stats grid -->
<ItemDescription> <ItemDescription>
<div class="grid grid-cols-4 divide-x"> <div class="grid grid-cols-4 divide-x">
<div class="flex flex-row items-center justify-between p-2"> <div class="flex flex-row items-center justify-between p-3">
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
<span class="text-muted-foreground text-xs">Skupaj</span> <span class="text-muted-foreground text-xs">Skupaj</span>
<span class="text-xl font-bold">{{ p.today?.total ?? 0 }}</span> <span class="text-xl font-bold">{{ p.today?.total ?? 0 }}</span>
</div> </div>
<MessageSquare class="h-5 w-5 text-gray-500" /> <MessageSquare class="h-5 w-5 text-gray-500" />
</div> </div>
<div class="flex flex-row items-center justify-between p-2"> <div class="flex flex-row items-center justify-between p-3">
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
<span class="text-muted-foreground text-xs">Poslano</span> <span class="text-muted-foreground text-xs">Poslano</span>
<span class="text-xl font-bold">{{ p.today?.sent ?? 0 }}</span> <span class="text-xl font-bold">{{ p.today?.sent ?? 0 }}</span>
</div> </div>
<Send class="h-5 w-5 text-sky-600" /> <Send class="h-5 w-5 text-sky-600" />
</div> </div>
<div class="flex flex-row items-center justify-between p-2"> <div class="flex flex-row items-center justify-between p-3">
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
<span class="text-muted-foreground text-xs">Delivered</span> <span class="text-muted-foreground text-xs">Delivered</span>
<span class="text-xl font-bold">{{ p.today?.delivered ?? 0 }}</span> <span class="text-xl font-bold">{{ p.today?.delivered ?? 0 }}</span>
</div> </div>
<CheckCircle class="h-5 w-5 text-emerald-600" /> <CheckCircle class="h-5 w-5 text-emerald-600" />
</div> </div>
<div class="flex flex-row items-center justify-between p-2"> <div class="flex flex-row items-center justify-between p-3">
<div class="flex flex-col gap-2"> <div class="flex flex-col gap-2">
<span class="text-muted-foreground text-xs">Failed</span> <span class="text-muted-foreground text-xs">Failed</span>
<span class="text-xl font-bold">{{ p.today?.failed ?? 0 }}</span> <span class="text-xl font-bold">{{ p.today?.failed ?? 0 }}</span>