Changes to dev branch
This commit is contained in:
Simon Pocrnjič
parent
f5530edcea
commit
70dc0b893f
18
package-lock.json
generated
18
package-lock.json
generated
|
|
@ -3627,9 +3627,9 @@
|
|||
"license": "ISC"
|
||||
},
|
||||
"node_modules/electron-to-chromium": {
|
||||
"version": "1.5.262",
|
||||
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.262.tgz",
|
||||
"integrity": "sha512-NlAsMteRHek05jRUxUR0a5jpjYq9ykk6+kO0yRaMi5moe7u0fVIOeQ3Y30A8dIiWFBNUoQGi1ljb1i5VtS9WQQ==",
|
||||
"version": "1.5.263",
|
||||
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.263.tgz",
|
||||
"integrity": "sha512-DrqJ11Knd+lo+dv+lltvfMDLU27g14LMdH2b0O3Pio4uk0x+z7OR+JrmyacTPN2M8w3BrZ7/RTwG3R9B7irPlg==",
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
|
|
@ -5056,9 +5056,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/reka-ui": {
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/reka-ui/-/reka-ui-2.6.0.tgz",
|
||||
"integrity": "sha512-NrGMKrABD97l890mFS3TNUzB0BLUfbL3hh0NjcJRIUSUljb288bx3Mzo31nOyUcdiiW0HqFGXJwyCBh9cWgb0w==",
|
||||
"version": "2.6.1",
|
||||
"resolved": "https://registry.npmjs.org/reka-ui/-/reka-ui-2.6.1.tgz",
|
||||
"integrity": "sha512-XK7cJDQoNuGXfCNzBBo/81Yg/OgjPwvbabnlzXG2VsdSgNsT6iIkuPBPr+C0Shs+3bb0x0lbPvgQAhMSCKm5Ww==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@floating-ui/dom": "^1.6.13",
|
||||
|
|
@ -5655,9 +5655,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "7.2.4",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-7.2.4.tgz",
|
||||
"integrity": "sha512-NL8jTlbo0Tn4dUEXEsUg8KeyG/Lkmc4Fnzb8JXN/Ykm9G4HNImjtABMJgkQoVjOBN/j2WAwDTRytdqJbZsah7w==",
|
||||
"version": "7.2.6",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-7.2.6.tgz",
|
||||
"integrity": "sha512-tI2l/nFHC5rLh7+5+o7QjKjSR04ivXDF4jcgV0f/bTQ+OJiITy5S6gaynVsEM+7RqzufMnVbIon6Sr5x1SDYaQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
|
|
|
|||
|
|
@ -187,74 +187,74 @@ @theme inline {
|
|||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
}
|
||||
|
||||
:root {
|
||||
--radius: 0.65rem;
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.648 0.2 131.684);
|
||||
--primary-foreground: oklch(0.986 0.031 120.757);
|
||||
--secondary: oklch(0.967 0.001 286.375);
|
||||
--secondary-foreground: oklch(0.21 0.006 285.885);
|
||||
--muted: oklch(0.967 0.001 286.375);
|
||||
--muted-foreground: oklch(0.552 0.016 285.938);
|
||||
--accent: oklch(0.967 0.001 286.375);
|
||||
--accent-foreground: oklch(0.21 0.006 285.885);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.841 0.238 128.85);
|
||||
--chart-1: oklch(0.871 0.15 154.449);
|
||||
--chart-2: oklch(0.723 0.219 149.579);
|
||||
--chart-3: oklch(0.627 0.194 149.214);
|
||||
--chart-4: oklch(0.527 0.154 150.069);
|
||||
--chart-5: oklch(0.448 0.119 151.328);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.648 0.2 131.684);
|
||||
--sidebar-primary-foreground: oklch(0.986 0.031 120.757);
|
||||
--sidebar-accent: oklch(0.967 0.001 286.375);
|
||||
--sidebar-accent-foreground: oklch(0.21 0.006 285.885);
|
||||
--sidebar-border: oklch(0.92 0.004 286.32);
|
||||
--sidebar-ring: oklch(0.841 0.238 128.85);
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.648 0.2 131.684);
|
||||
--primary-foreground: oklch(0.986 0.031 120.757);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--secondary-foreground: oklch(0.985 0 0);
|
||||
--muted: oklch(0.274 0.006 286.033);
|
||||
--muted-foreground: oklch(0.705 0.015 286.067);
|
||||
--accent: oklch(0.274 0.006 286.033);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.405 0.101 131.063);
|
||||
--chart-1: oklch(0.871 0.15 154.449);
|
||||
--chart-2: oklch(0.723 0.219 149.579);
|
||||
--chart-3: oklch(0.627 0.194 149.214);
|
||||
--chart-4: oklch(0.527 0.154 150.069);
|
||||
--chart-5: oklch(0.448 0.119 151.328);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.768 0.233 130.85);
|
||||
--sidebar-primary-foreground: oklch(0.986 0.031 120.757);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.405 0.101 131.063);
|
||||
}
|
||||
:root {
|
||||
--radius: 0.65rem;
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.488 0.243 264.376);
|
||||
--primary-foreground: oklch(0.97 0.014 254.604);
|
||||
--secondary: oklch(0.967 0.001 286.375);
|
||||
--secondary-foreground: oklch(0.21 0.006 285.885);
|
||||
--muted: oklch(0.967 0.001 286.375);
|
||||
--muted-foreground: oklch(0.552 0.016 285.938);
|
||||
--accent: oklch(0.967 0.001 286.375);
|
||||
--accent-foreground: oklch(0.21 0.006 285.885);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.708 0 0);
|
||||
--chart-1: oklch(0.809 0.105 251.813);
|
||||
--chart-2: oklch(0.623 0.214 259.815);
|
||||
--chart-3: oklch(0.546 0.245 262.881);
|
||||
--chart-4: oklch(0.488 0.243 264.376);
|
||||
--chart-5: oklch(0.424 0.199 265.638);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.546 0.245 262.881);
|
||||
--sidebar-primary-foreground: oklch(0.97 0.014 254.604);
|
||||
--sidebar-accent: oklch(0.967 0.001 286.375);
|
||||
--sidebar-accent-foreground: oklch(0.21 0.006 285.885);
|
||||
--sidebar-border: oklch(0.92 0.004 286.32);
|
||||
--sidebar-ring: oklch(0.708 0 0);
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.488 0.243 264.376);
|
||||
--primary-foreground: oklch(0.97 0.014 254.604);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--secondary-foreground: oklch(0.985 0 0);
|
||||
--muted: oklch(0.274 0.006 286.033);
|
||||
--muted-foreground: oklch(0.705 0.015 286.067);
|
||||
--accent: oklch(0.274 0.006 286.033);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.556 0 0);
|
||||
--chart-1: oklch(0.809 0.105 251.813);
|
||||
--chart-2: oklch(0.623 0.214 259.815);
|
||||
--chart-3: oklch(0.546 0.245 262.881);
|
||||
--chart-4: oklch(0.488 0.243 264.376);
|
||||
--chart-5: oklch(0.424 0.199 265.638);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.623 0.214 259.815);
|
||||
--sidebar-primary-foreground: oklch(0.97 0.014 254.604);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.439 0 0);
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
|
|
|
|||
|
|
@ -6,40 +6,43 @@ import {
|
|||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from '@/Components/ui/dialog';
|
||||
import { Button } from '@/Components/ui/button';
|
||||
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
|
||||
import { faPlusCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import { computed, ref, watch, nextTick } from 'vue';
|
||||
} from "@/Components/ui/dialog";
|
||||
import { Button } from "@/Components/ui/button";
|
||||
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
|
||||
import { faPlusCircle } from "@fortawesome/free-solid-svg-icons";
|
||||
import { computed, ref, watch, nextTick } from "vue";
|
||||
|
||||
const props = defineProps({
|
||||
show: { type: Boolean, default: false },
|
||||
title: { type: String, default: 'Ustvari novo' },
|
||||
maxWidth: { type: String, default: '2xl' },
|
||||
confirmText: { type: String, default: 'Ustvari' },
|
||||
cancelText: { type: String, default: 'Prekliči' },
|
||||
title: { type: String, default: "Ustvari novo" },
|
||||
maxWidth: { type: String, default: "2xl" },
|
||||
confirmText: { type: String, default: "Ustvari" },
|
||||
cancelText: { type: String, default: "Prekliči" },
|
||||
processing: { 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);
|
||||
|
||||
watch(() => props.show, (newVal) => {
|
||||
open.value = newVal;
|
||||
if (newVal) {
|
||||
// Emit custom event when dialog opens
|
||||
nextTick(() => {
|
||||
window.dispatchEvent(new CustomEvent('dialog:open'));
|
||||
});
|
||||
watch(
|
||||
() => props.show,
|
||||
(newVal) => {
|
||||
open.value = newVal;
|
||||
if (newVal) {
|
||||
// Emit custom event when dialog opens
|
||||
nextTick(() => {
|
||||
window.dispatchEvent(new CustomEvent("dialog:open"));
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
);
|
||||
|
||||
watch(open, (newVal) => {
|
||||
emit('update:show', newVal);
|
||||
emit("update:show", newVal);
|
||||
if (!newVal) {
|
||||
emit('close');
|
||||
emit("close");
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -48,19 +51,19 @@ const onClose = () => {
|
|||
};
|
||||
|
||||
const onConfirm = () => {
|
||||
emit('confirm');
|
||||
emit("confirm");
|
||||
};
|
||||
|
||||
const maxWidthClass = computed(() => {
|
||||
const maxWidthMap = {
|
||||
sm: 'sm:max-w-sm',
|
||||
md: 'sm:max-w-md',
|
||||
lg: 'sm:max-w-lg',
|
||||
xl: 'sm:max-w-xl',
|
||||
'2xl': 'sm:max-w-2xl',
|
||||
wide: 'sm:max-w-[1200px]',
|
||||
sm: "sm:max-w-sm",
|
||||
md: "sm:max-w-md",
|
||||
lg: "sm:max-w-lg",
|
||||
xl: "sm:max-w-xl",
|
||||
"2xl": "sm:max-w-2xl",
|
||||
wide: "sm:max-w-[1200px]",
|
||||
};
|
||||
return maxWidthMap[props.maxWidth] || 'sm:max-w-2xl';
|
||||
return maxWidthMap[props.maxWidth] || "sm:max-w-2xl";
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
@ -70,7 +73,7 @@ const maxWidthClass = computed(() => {
|
|||
<DialogHeader>
|
||||
<DialogTitle>
|
||||
<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>
|
||||
</div>
|
||||
</DialogTitle>
|
||||
|
|
@ -87,14 +90,10 @@ const maxWidthClass = computed(() => {
|
|||
<Button variant="outline" @click="onClose" :disabled="processing">
|
||||
{{ cancelText }}
|
||||
</Button>
|
||||
<Button
|
||||
@click="onConfirm"
|
||||
:disabled="processing || disabled"
|
||||
>
|
||||
<Button @click="onConfirm" :disabled="processing || disabled">
|
||||
{{ confirmText }}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -6,40 +6,43 @@ import {
|
|||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from '@/Components/ui/dialog';
|
||||
import { Button } from '@/Components/ui/button';
|
||||
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
|
||||
import { faPenToSquare } from '@fortawesome/free-solid-svg-icons';
|
||||
import { computed, ref, watch, nextTick } from 'vue';
|
||||
} from "@/Components/ui/dialog";
|
||||
import { Button } from "@/Components/ui/button";
|
||||
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
|
||||
import { faPenToSquare } from "@fortawesome/free-solid-svg-icons";
|
||||
import { computed, ref, watch, nextTick } from "vue";
|
||||
|
||||
const props = defineProps({
|
||||
show: { type: Boolean, default: false },
|
||||
title: { type: String, default: 'Uredi' },
|
||||
maxWidth: { type: String, default: '2xl' },
|
||||
confirmText: { type: String, default: 'Shrani' },
|
||||
cancelText: { type: String, default: 'Prekliči' },
|
||||
title: { type: String, default: "Uredi" },
|
||||
maxWidth: { type: String, default: "2xl" },
|
||||
confirmText: { type: String, default: "Shrani" },
|
||||
cancelText: { type: String, default: "Prekliči" },
|
||||
processing: { 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);
|
||||
|
||||
watch(() => props.show, (newVal) => {
|
||||
open.value = newVal;
|
||||
if (newVal) {
|
||||
// Emit custom event when dialog opens
|
||||
nextTick(() => {
|
||||
window.dispatchEvent(new CustomEvent('dialog:open'));
|
||||
});
|
||||
watch(
|
||||
() => props.show,
|
||||
(newVal) => {
|
||||
open.value = newVal;
|
||||
if (newVal) {
|
||||
// Emit custom event when dialog opens
|
||||
nextTick(() => {
|
||||
window.dispatchEvent(new CustomEvent("dialog:open"));
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
);
|
||||
|
||||
watch(open, (newVal) => {
|
||||
emit('update:show', newVal);
|
||||
emit("update:show", newVal);
|
||||
if (!newVal) {
|
||||
emit('close');
|
||||
emit("close");
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -48,19 +51,19 @@ const onClose = () => {
|
|||
};
|
||||
|
||||
const onConfirm = () => {
|
||||
emit('confirm');
|
||||
emit("confirm");
|
||||
};
|
||||
|
||||
const maxWidthClass = computed(() => {
|
||||
const maxWidthMap = {
|
||||
sm: 'sm:max-w-sm',
|
||||
md: 'sm:max-w-md',
|
||||
lg: 'sm:max-w-lg',
|
||||
xl: 'sm:max-w-xl',
|
||||
'2xl': 'sm:max-w-2xl',
|
||||
wide: 'sm:max-w-[1200px]',
|
||||
sm: "sm:max-w-sm",
|
||||
md: "sm:max-w-md",
|
||||
lg: "sm:max-w-lg",
|
||||
xl: "sm:max-w-xl",
|
||||
"2xl": "sm:max-w-2xl",
|
||||
wide: "sm:max-w-[1200px]",
|
||||
};
|
||||
return maxWidthMap[props.maxWidth] || 'sm:max-w-2xl';
|
||||
return maxWidthMap[props.maxWidth] || "sm:max-w-2xl";
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
@ -70,7 +73,7 @@ const maxWidthClass = computed(() => {
|
|||
<DialogHeader>
|
||||
<DialogTitle>
|
||||
<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>
|
||||
</div>
|
||||
</DialogTitle>
|
||||
|
|
@ -87,14 +90,10 @@ const maxWidthClass = computed(() => {
|
|||
<Button variant="outline" @click="onClose" :disabled="processing">
|
||||
{{ cancelText }}
|
||||
</Button>
|
||||
<Button
|
||||
@click="onConfirm"
|
||||
:disabled="processing || disabled"
|
||||
>
|
||||
<Button @click="onConfirm" :disabled="processing || disabled">
|
||||
{{ confirmText }}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -7,6 +7,9 @@ import DataTable from "@/Components/DataTable/DataTableNew2.vue";
|
|||
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
|
||||
import { faFolderOpen } from "@fortawesome/free-solid-svg-icons";
|
||||
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({
|
||||
client_cases: Object,
|
||||
|
|
@ -41,101 +44,106 @@ const fmtDateDMY = (v) => {
|
|||
<template>
|
||||
<AppLayout title="Client cases">
|
||||
<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="bg-white overflow-hidden shadow-xl sm:rounded-lg">
|
||||
<div class="mx-auto max-w-4x1 py-3">
|
||||
<div class="pb-3 px-3">
|
||||
<SectionTitle>
|
||||
<template #title>Primeri</template>
|
||||
</SectionTitle>
|
||||
</div>
|
||||
<DataTable
|
||||
:columns="[
|
||||
{ key: 'nu', label: 'Št.', sortable: false },
|
||||
{ key: 'case', label: 'Primer', sortable: false },
|
||||
{ key: 'client', label: 'Stranka', sortable: false },
|
||||
{ key: 'tax', label: 'Davčna', sortable: false },
|
||||
{ key: 'created_at', label: 'Ustvarjeno', sortable: false },
|
||||
{
|
||||
key: 'active_contracts',
|
||||
label: 'Aktivne pogodbe',
|
||||
sortable: false,
|
||||
align: 'right',
|
||||
},
|
||||
{
|
||||
key: 'balance',
|
||||
label: 'Skupaj stanje',
|
||||
sortable: false,
|
||||
align: 'right',
|
||||
},
|
||||
]"
|
||||
:data="client_cases.data || []"
|
||||
:page-size="client_cases.per_page"
|
||||
:show-pagination="false"
|
||||
:show-toolbar="true"
|
||||
:hoverable="true"
|
||||
row-key="uuid"
|
||||
empty-text="Ni najdenih primerov."
|
||||
>
|
||||
<template #cell-nu="{ row }">
|
||||
{{ row.person?.nu || "-" }}
|
||||
</template>
|
||||
<template #cell-case="{ row }">
|
||||
<Link
|
||||
:href="route('clientCase.show', { client_case: row.uuid })"
|
||||
class="text-indigo-600 hover:underline"
|
||||
>
|
||||
{{ row.person?.full_name || "-" }}
|
||||
</Link>
|
||||
<button
|
||||
v-if="!row.person"
|
||||
@click.prevent="
|
||||
router.post(
|
||||
route('clientCase.emergencyPerson', { client_case: row.uuid })
|
||||
)
|
||||
"
|
||||
class="ml-2 inline-flex items-center rounded bg-red-50 px-2 py-0.5 text-xs font-semibold text-red-600 hover:bg-red-100 border border-red-200"
|
||||
title="Emergency: recreate missing person"
|
||||
>
|
||||
Add Person
|
||||
</button>
|
||||
</template>
|
||||
<template #cell-client="{ row }">
|
||||
{{ row.client?.person?.full_name || "-" }}
|
||||
</template>
|
||||
<template #cell-tax="{ row }">
|
||||
{{ row.person?.tax_number || "-" }}
|
||||
</template>
|
||||
<template #cell-created_at="{ row }">
|
||||
{{ fmtDateDMY(row.created_at) }}
|
||||
</template>
|
||||
<template #cell-active_contracts="{ row }">
|
||||
<div class="text-right">{{ row.active_contracts_count ?? 0 }}</div>
|
||||
</template>
|
||||
<template #cell-balance="{ row }">
|
||||
<div class="text-right">
|
||||
{{ fmtCurrency(row.active_contracts_balance_sum) }}
|
||||
</div>
|
||||
</template>
|
||||
</DataTable>
|
||||
<div class="border-t border-gray-200 p-4">
|
||||
<Pagination
|
||||
:links="client_cases.links"
|
||||
:from="client_cases.from"
|
||||
:to="client_cases.to"
|
||||
:total="client_cases.total"
|
||||
:per-page="client_cases.per_page || 20"
|
||||
:last-page="client_cases.last_page"
|
||||
:current-page="client_cases.current_page"
|
||||
per-page-param="perPage"
|
||||
page-param="clientCasesPage"
|
||||
/>
|
||||
<AppCard
|
||||
title=""
|
||||
padding="none"
|
||||
class="p-0! gap-0"
|
||||
header-class="py-3! px-4 gap-0 text-muted-foreground"
|
||||
body-class=""
|
||||
>
|
||||
<template #header>
|
||||
<div class="flex items-center gap-2">
|
||||
<FolderOpenIcon size="18" />
|
||||
<CardTitle class="uppercase">Primeri</CardTitle>
|
||||
</div>
|
||||
</template>
|
||||
<DataTable
|
||||
:columns="[
|
||||
{ key: 'nu', label: 'Št.', sortable: false },
|
||||
{ key: 'case', label: 'Primer', sortable: false },
|
||||
{ key: 'client', label: 'Stranka', sortable: false },
|
||||
{ key: 'tax', label: 'Davčna', sortable: false },
|
||||
{ key: 'created_at', label: 'Ustvarjeno', sortable: false },
|
||||
{
|
||||
key: 'active_contracts',
|
||||
label: 'Aktivne pogodbe',
|
||||
sortable: false,
|
||||
align: 'right',
|
||||
},
|
||||
{
|
||||
key: 'balance',
|
||||
label: 'Skupaj stanje',
|
||||
sortable: false,
|
||||
align: 'right',
|
||||
},
|
||||
]"
|
||||
:data="client_cases.data || []"
|
||||
:page-size="client_cases.per_page"
|
||||
:show-pagination="false"
|
||||
:show-toolbar="true"
|
||||
:hoverable="true"
|
||||
row-key="uuid"
|
||||
empty-text="Ni najdenih primerov."
|
||||
>
|
||||
<template #cell-nu="{ row }">
|
||||
{{ row.person?.nu || "-" }}
|
||||
</template>
|
||||
<template #cell-case="{ row }">
|
||||
<Link
|
||||
:href="route('clientCase.show', { client_case: row.uuid })"
|
||||
class="text-indigo-600 hover:underline"
|
||||
>
|
||||
{{ row.person?.full_name || "-" }}
|
||||
</Link>
|
||||
<button
|
||||
v-if="!row.person"
|
||||
@click.prevent="
|
||||
router.post(
|
||||
route('clientCase.emergencyPerson', { client_case: row.uuid })
|
||||
)
|
||||
"
|
||||
class="ml-2 inline-flex items-center rounded bg-red-50 px-2 py-0.5 text-xs font-semibold text-red-600 hover:bg-red-100 border border-red-200"
|
||||
title="Emergency: recreate missing person"
|
||||
>
|
||||
Add Person
|
||||
</button>
|
||||
</template>
|
||||
<template #cell-client="{ row }">
|
||||
{{ row.client?.person?.full_name || "-" }}
|
||||
</template>
|
||||
<template #cell-tax="{ row }">
|
||||
{{ row.person?.tax_number || "-" }}
|
||||
</template>
|
||||
<template #cell-created_at="{ row }">
|
||||
{{ fmtDateDMY(row.created_at) }}
|
||||
</template>
|
||||
<template #cell-active_contracts="{ row }">
|
||||
<div class="text-right">{{ row.active_contracts_count ?? 0 }}</div>
|
||||
</template>
|
||||
<template #cell-balance="{ row }">
|
||||
<div class="text-right">
|
||||
{{ fmtCurrency(row.active_contracts_balance_sum) }}
|
||||
</div>
|
||||
</template>
|
||||
</DataTable>
|
||||
<div class="border-t border-gray-200 p-4">
|
||||
<Pagination
|
||||
:links="client_cases.links"
|
||||
:from="client_cases.from"
|
||||
:to="client_cases.to"
|
||||
:total="client_cases.total"
|
||||
:per-page="client_cases.per_page || 20"
|
||||
:last-page="client_cases.last_page"
|
||||
:current-page="client_cases.current_page"
|
||||
per-page-param="perPage"
|
||||
page-param="clientCasesPage"
|
||||
/>
|
||||
</div>
|
||||
<!-- Pagination handled by DataTableServer -->
|
||||
</div>
|
||||
</AppCard>
|
||||
</div>
|
||||
<!-- Pagination handled by DataTableServer -->
|
||||
</div>
|
||||
</AppLayout>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -28,8 +28,9 @@ import { useForm } from "vee-validate";
|
|||
import { toTypedSchema } from "@vee-validate/zod";
|
||||
import * as z from "zod";
|
||||
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 AppCard from "@/Components/app/ui/card/AppCard.vue";
|
||||
|
||||
const props = defineProps({
|
||||
clients: Object,
|
||||
|
|
@ -161,83 +162,91 @@ const fmtCurrency = (v) => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<AppLayout title="Client">
|
||||
<AppLayout>
|
||||
<template #header> </template>
|
||||
<div class="py-6">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
<Card class="p-0">
|
||||
<CardHeader>
|
||||
<CardTitle>Naročniki</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent class="p-0">
|
||||
<DataTable
|
||||
:columns="[
|
||||
{ key: 'nu', label: 'Št.', sortable: false },
|
||||
{ key: 'name', label: 'Naročnik', sortable: false },
|
||||
{
|
||||
key: 'cases',
|
||||
label: 'Primeri z aktivnimi pogodbami',
|
||||
sortable: false,
|
||||
align: 'right',
|
||||
},
|
||||
{
|
||||
key: 'balance',
|
||||
label: 'Skupaj stanje',
|
||||
sortable: false,
|
||||
align: 'right',
|
||||
},
|
||||
]"
|
||||
:data="clients.data || []"
|
||||
:show-pagination="false"
|
||||
:show-toolbar="true"
|
||||
:hoverable="true"
|
||||
row-key="uuid"
|
||||
:striped="true"
|
||||
empty-text="Ni najdenih naročnikov."
|
||||
>
|
||||
<template #toolbar-actions>
|
||||
<AppCard
|
||||
title=""
|
||||
padding="none"
|
||||
class="p-0! gap-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
|
||||
:columns="[
|
||||
{ key: 'nu', label: 'Št.', sortable: false },
|
||||
{ key: 'name', label: 'Naročnik', sortable: false },
|
||||
{
|
||||
key: 'cases',
|
||||
label: 'Primeri z aktivnimi pogodbami',
|
||||
sortable: false,
|
||||
align: 'right',
|
||||
},
|
||||
{
|
||||
key: 'balance',
|
||||
label: 'Skupaj stanje',
|
||||
sortable: false,
|
||||
align: 'right',
|
||||
},
|
||||
]"
|
||||
:data="clients.data || []"
|
||||
:show-pagination="false"
|
||||
:show-toolbar="true"
|
||||
:hoverable="true"
|
||||
row-key="uuid"
|
||||
:striped="true"
|
||||
empty-text="Ni najdenih naročnikov."
|
||||
>
|
||||
<template #toolbar-actions>
|
||||
<Button
|
||||
variant="outline"
|
||||
v-if="hasPerm('client-edit')"
|
||||
@click="openDrawerCreateClient"
|
||||
>
|
||||
<Plus class="w-4 h-4" /> Novi naročnik
|
||||
</Button>
|
||||
</template>
|
||||
<template #cell-nu="{ row }">
|
||||
{{ row.person?.nu || "-" }}
|
||||
</template>
|
||||
<template #cell-name="{ row }">
|
||||
<Link
|
||||
:href="route('client.show', { uuid: row.uuid })"
|
||||
class="font-semibold hover:underline text-primary-700"
|
||||
>
|
||||
{{ row.person?.full_name || "-" }}
|
||||
</Link>
|
||||
<div v-if="!row.person" class="mt-1">
|
||||
<Button
|
||||
variant="outline"
|
||||
v-if="hasPerm('client-edit')"
|
||||
@click="openDrawerCreateClient"
|
||||
variant="destructive"
|
||||
size="sm"
|
||||
@click.prevent="
|
||||
router.post(route('client.emergencyPerson', { uuid: row.uuid }))
|
||||
"
|
||||
>Add Person</Button
|
||||
>
|
||||
<Plus class="w-4 h-4" /> Novi naročnik
|
||||
</Button>
|
||||
</template>
|
||||
<template #cell-nu="{ row }">
|
||||
{{ row.person?.nu || "-" }}
|
||||
</template>
|
||||
<template #cell-name="{ row }">
|
||||
<Link
|
||||
:href="route('client.show', { uuid: row.uuid })"
|
||||
class="font-semibold hover:underline text-primary-700"
|
||||
>
|
||||
{{ row.person?.full_name || "-" }}
|
||||
</Link>
|
||||
<div v-if="!row.person" class="mt-1">
|
||||
<Button
|
||||
variant="destructive"
|
||||
size="sm"
|
||||
@click.prevent="
|
||||
router.post(route('client.emergencyPerson', { uuid: row.uuid }))
|
||||
"
|
||||
>Add Person</Button
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
<template #cell-cases="{ row }">
|
||||
<div class="text-right">
|
||||
{{ row.cases_with_active_contracts_count ?? 0 }}
|
||||
</div>
|
||||
</template>
|
||||
<template #cell-balance="{ row }">
|
||||
<div class="text-right">
|
||||
{{ fmtCurrency(row.active_contracts_balance_sum) }}
|
||||
</div>
|
||||
</template>
|
||||
</DataTable>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</template>
|
||||
<template #cell-cases="{ row }">
|
||||
<div class="text-right">
|
||||
{{ row.cases_with_active_contracts_count ?? 0 }}
|
||||
</div>
|
||||
</template>
|
||||
<template #cell-balance="{ row }">
|
||||
<div class="text-right">
|
||||
{{ fmtCurrency(row.active_contracts_balance_sum) }}
|
||||
</div>
|
||||
</template>
|
||||
</DataTable>
|
||||
</AppCard>
|
||||
</div>
|
||||
</div>
|
||||
</AppLayout>
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ import { Card } from "@/Components/ui/card";
|
|||
import Badge from "@/Components/ui/badge/Badge.vue";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { Input } from "@/Components/ui/input";
|
||||
import { UsersRoundIcon } from "lucide-vue-next";
|
||||
|
||||
const props = defineProps({
|
||||
client: Object,
|
||||
|
|
@ -60,7 +61,7 @@ function applySearch() {
|
|||
|
||||
<template>
|
||||
<AppLayout title="Client">
|
||||
<template #header></template>
|
||||
<template #header> </template>
|
||||
<div class="pt-6">
|
||||
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
||||
<Card class="border-l-4 border-blue-400 p-0!">
|
||||
|
|
@ -93,7 +94,7 @@ function applySearch() {
|
|||
<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="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
|
||||
:class="
|
||||
cn(
|
||||
|
|
|
|||
|
|
@ -55,15 +55,15 @@ const formatBalance = (amount) => {
|
|||
label="Skupno stanje"
|
||||
:value="formatBalance(kpis?.total_balance)"
|
||||
:icon="Banknote"
|
||||
icon-bg="bg-chart-3/10"
|
||||
icon-color="text-chart-3"
|
||||
icon-bg="bg-chart-2/10"
|
||||
icon-color="text-chart-2"
|
||||
/>
|
||||
<SimpleKpiCard
|
||||
label="Aktivne obljube"
|
||||
:value="kpis?.active_promises"
|
||||
:icon="CalendarCheck"
|
||||
icon-bg="bg-chart-4/10"
|
||||
icon-color="text-chart-4"
|
||||
icon-bg="bg-chart-2/10"
|
||||
icon-color="text-chart-2"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -71,28 +71,28 @@ const props = defineProps({
|
|||
<!-- Stats grid -->
|
||||
<ItemDescription>
|
||||
<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">
|
||||
<span class="text-muted-foreground text-xs">Skupaj</span>
|
||||
<span class="text-xl font-bold">{{ p.today?.total ?? 0 }}</span>
|
||||
</div>
|
||||
<MessageSquare class="h-5 w-5 text-gray-500" />
|
||||
</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">
|
||||
<span class="text-muted-foreground text-xs">Poslano</span>
|
||||
<span class="text-xl font-bold">{{ p.today?.sent ?? 0 }}</span>
|
||||
</div>
|
||||
<Send class="h-5 w-5 text-sky-600" />
|
||||
</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">
|
||||
<span class="text-muted-foreground text-xs">Delivered</span>
|
||||
<span class="text-xl font-bold">{{ p.today?.delivered ?? 0 }}</span>
|
||||
</div>
|
||||
<CheckCircle class="h-5 w-5 text-emerald-600" />
|
||||
</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">
|
||||
<span class="text-muted-foreground text-xs">Failed</span>
|
||||
<span class="text-xl font-bold">{{ p.today?.failed ?? 0 }}</span>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user