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

Added condition options for events to trigger decisions

Browse Source
This commit is contained in:
Simon Pocrnjič
2026-04-12 21:35:16 +02:00
parent 342d9d0700
commit a5257df2b7
5 changed files with 463 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/Pages/Settings/Workflow/Partials/DecisionTable.vue
+289 -25
View File
@@ -33,7 +33,16 @@ import DataTableNew2 from "@/Components/DataTable/DataTableNew2.vue";
import InlineColorPicker from "@/Components/InlineColorPicker.vue";
import Dropdown from "@/Components/Dropdown.vue";
import AppPopover from "@/Components/app/ui/AppPopover.vue";
import { FilterIcon, MoreHorizontal, Pencil, Trash } from "lucide-vue-next";
import {
FilterIcon,
MoreHorizontal,
Pencil,
Plus,
Trash,
Trash2,
X,
} from "lucide-vue-next";
import { Switch } from "@/Components/ui/switch";
import {
DropdownMenu,
DropdownMenuContent,
@@ -48,6 +57,8 @@ const props = defineProps({
availableEvents: { type: Array, default: () => [] },
segments: { type: Array, default: () => [] },
archiveSettings: { type: Array, default: () => [] },
conditionFields: { type: Array, default: () => [] },
conditionOperators: { type: Object, default: () => ({}) },
});
const drawerEdit = ref(false);
@@ -223,6 +234,39 @@ function defaultEventPayload() {
};
}
function operatorsForField(fieldKey) {
const field = (props.conditionFields || []).find((f) => f.key === fieldKey);
if (!field) {
return props.conditionOperators?.numeric ?? [];
}
return props.conditionOperators?.[field.type] ?? [];
}
function addCondition(ev) {
if (!Array.isArray(ev.config.conditions)) {
ev.config.conditions = [];
}
const firstField = (props.conditionFields || [])[0];
const firstOperator = firstField
? operatorsForField(firstField.key)[0]?.key ?? "="
: "=";
ev.config.conditions.push({
field: firstField?.key ?? "",
operator: firstOperator,
value: "",
});
}
function removeCondition(ev, idx) {
ev.config.conditions.splice(idx, 1);
}
function onConditionFieldChange(condition) {
const ops = operatorsForField(condition.field);
condition.operator = ops[0]?.key ?? "=";
condition.value = "";
}
function tryAdoptRaw(ev) {
try {
const obj = JSON.parse(ev.__rawJson || "{}");
@@ -532,7 +576,7 @@ const destroyDecision = () => {
<template #cell-auto_mail="{ row }">
<div class="flex flex-col text-sm">
<span :class="row.auto_mail ? 'text-green-700' : 'text-gray-500'">{{
row.auto_mail ? "Enabled" : "Disabled"
row.auto_mail ? "Vključeno" : "Izključeno"
}}</span>
<span v-if="row.auto_mail && row.email_template_id" class="text-gray-600">
Template:
@@ -568,7 +612,7 @@ const destroyDecision = () => {
<Dialog v-model:open="drawerEdit">
<DialogContent class="max-w-2xl max-h-[90vh] overflow-y-auto">
<DialogHeader>
<DialogTitle>Spremeni odločitev</DialogTitle>
<DialogTitle>Uredi odločitev</DialogTitle>
</DialogHeader>
<div class="space-y-4">
<div>
@@ -659,9 +703,16 @@ const destroyDecision = () => {
/>
</div>
<div class="flex items-center gap-2 self-end">
<label class="flex items-center gap-2 text-sm">
<Checkbox v-model="ev.active" />
Aktivno
<label
class="flex items-center gap-2 text-sm cursor-pointer select-none"
>
<Switch v-model="ev.active" />
<span
:class="
ev.active ? 'text-green-700 font-medium' : 'text-muted-foreground'
"
>{{ ev.active ? "Aktivno" : "Neaktivno" }}</span
>
</label>
<Button
variant="ghost"
@@ -707,7 +758,7 @@ const destroyDecision = () => {
<template v-else-if="eventKey(ev) === 'archive_contract'">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
<div>
<InputLabel :for="`as-${idx}`" value="Archive setting" />
<InputLabel :for="`as-${idx}`" value="Nastavitev arhiva" />
<Select v-model="ev.config.archive_setting_id">
<SelectTrigger :id="`as-${idx}`" class="w-full">
<SelectValue placeholder="— Izberi nastavitev —" />
@@ -731,9 +782,14 @@ const destroyDecision = () => {
</p>
</div>
<div class="flex items-end">
<label class="flex items-center gap-2 text-sm mt-6">
<Checkbox v-model:checked="ev.config.reactivate" />
Reactivate namesto arhiva
<label
class="flex items-center gap-2 text-sm mt-6 cursor-pointer select-none"
>
<Switch
:model-value="ev.config.reactivate"
v-model:checked="ev.config.reactivate"
/>
Reaktiviraj namesto arhiviranja
</label>
</div>
</div>
@@ -749,7 +805,7 @@ const destroyDecision = () => {
</p>
</template>
<template v-else>
<!-- Fallback advanced editor for unknown event keys -->
<!-- Rezervni urejevalnik za neznane ključe dogodkov -->
<InputLabel :for="`cfg-${idx}`" value="Napredna nastavitev (JSON)" />
<textarea
:id="`cfg-${idx}`"
@@ -765,6 +821,104 @@ const destroyDecision = () => {
></textarea>
</template>
</div>
<!-- Conditions -->
<div v-if="conditionFields.length" class="mt-3 border-t pt-3">
<div class="flex items-center justify-between mb-2">
<span
class="text-xs font-semibold text-muted-foreground uppercase tracking-wide"
>Pogoji za izvajanje</span
>
<Button
type="button"
variant="ghost"
size="sm"
class="h-7 gap-1 text-xs"
@click="addCondition(ev)"
>
<Plus class="w-3 h-3" />
Dodaj pogoj
</Button>
</div>
<p
v-if="!ev.config.conditions?.length"
class="text-xs text-muted-foreground italic"
>
Brez pogojev — dogodek se vedno izvede.
</p>
<div
v-for="(cond, cidx) in ev.config.conditions"
:key="cidx"
class="flex items-center gap-2 mt-1"
>
<Select
v-model="cond.field"
@update:model-value="onConditionFieldChange(cond)"
class="w-48"
>
<SelectTrigger class="h-8 text-xs">
<SelectValue placeholder="Polje" />
</SelectTrigger>
<SelectContent>
<SelectItem
v-for="f in conditionFields"
:key="f.key"
:value="f.key"
class="text-xs"
>
{{ f.label }}
</SelectItem>
</SelectContent>
</Select>
<Select v-model="cond.operator" class="w-36">
<SelectTrigger class="h-8 text-xs">
<SelectValue placeholder="Operator" />
</SelectTrigger>
<SelectContent>
<SelectItem
v-for="op in operatorsForField(cond.field)"
:key="op.key"
:value="op.key"
class="text-xs"
>
{{ op.label }}
</SelectItem>
</SelectContent>
</Select>
<template
v-if="
conditionFields.find((f) => f.key === cond.field)?.type ===
'boolean'
"
>
<Select v-model="cond.value" class="w-24">
<SelectTrigger class="h-8 text-xs">
<SelectValue placeholder="Vrednost" />
</SelectTrigger>
<SelectContent>
<SelectItem value="1" class="text-xs">Da</SelectItem>
<SelectItem value="0" class="text-xs">Ne</SelectItem>
</SelectContent>
</Select>
</template>
<template v-else>
<Input
v-model="cond.value"
class="h-8 text-xs w-28"
placeholder="Vrednost"
/>
</template>
<Button
type="button"
variant="ghost"
size="icon"
class="h-7 w-7 text-red-500 hover:text-red-700"
@click="removeCondition(ev, cidx)"
>
<X class="w-3 h-3" />
</Button>
</div>
</div>
</div>
<div>
<Button
@@ -782,7 +936,7 @@ const destroyDecision = () => {
</div>
</div>
<DialogFooter>
<Button variant="outline" @click="closeEditDrawer">Cancel</Button>
<Button variant="outline" @click="closeEditDrawer">Prekliči</Button>
<Button @click="update" :disabled="form.processing || !eventsValidEdit"
>Shrani</Button
>
@@ -891,9 +1045,16 @@ const destroyDecision = () => {
/>
</div>
<div class="flex items-center gap-2 self-end">
<label class="flex items-center gap-2 text-sm">
<Checkbox v-model:checked="ev.active" />
Aktivno
<label
class="flex items-center gap-2 text-sm cursor-pointer select-none"
>
<Switch v-model="ev.active" />
<span
:class="
ev.active ? 'text-green-700 font-medium' : 'text-muted-foreground'
"
>{{ ev.active ? "Aktivno" : "Neaktivno" }}</span
>
</label>
<Button
variant="ghost"
@@ -939,7 +1100,7 @@ const destroyDecision = () => {
<template v-else-if="eventKey(ev) === 'archive_contract'">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
<div>
<InputLabel :for="`cas-${idx}`" value="Archive setting" />
<InputLabel :for="`cas-${idx}`" value="Nastavitev arhiva" />
<Select v-model="ev.config.archive_setting_id">
<SelectTrigger :id="`cas-${idx}`" class="w-full">
<SelectValue placeholder="— Izberi nastavitev —" />
@@ -965,9 +1126,14 @@ const destroyDecision = () => {
</p>
</div>
<div class="flex items-end">
<label class="flex items-center gap-2 text-sm mt-6">
<Checkbox v-model:checked="ev.config.reactivate" />
Reactivate namesto arhiva
<label
class="flex items-center gap-2 text-sm mt-6 cursor-pointer select-none"
>
<Switch
:model-value="ev.config.reactivate"
v-model:checked="ev.config.reactivate"
/>
Reaktiviraj namesto arhiviranja
</label>
</div>
</div>
@@ -998,6 +1164,104 @@ const destroyDecision = () => {
></textarea>
</template>
</div>
<!-- Conditions -->
<div v-if="conditionFields.length" class="mt-3 border-t pt-3">
<div class="flex items-center justify-between mb-2">
<span
class="text-xs font-semibold text-muted-foreground uppercase tracking-wide"
>Pogoji za izvajanje</span
>
<Button
type="button"
variant="ghost"
size="sm"
class="h-7 gap-1 text-xs"
@click="addCondition(ev)"
>
<Plus class="w-3 h-3" />
Dodaj pogoj
</Button>
</div>
<p
v-if="!ev.config.conditions?.length"
class="text-xs text-muted-foreground italic"
>
Brez pogojev — dogodek se vedno izvede.
</p>
<div
v-for="(cond, cidx) in ev.config.conditions"
:key="cidx"
class="flex items-center gap-2 mt-1"
>
<Select
v-model="cond.field"
@update:model-value="onConditionFieldChange(cond)"
class="w-48"
>
<SelectTrigger class="h-8 text-xs">
<SelectValue placeholder="Polje" />
</SelectTrigger>
<SelectContent>
<SelectItem
v-for="f in conditionFields"
:key="f.key"
:value="f.key"
class="text-xs"
>
{{ f.label }}
</SelectItem>
</SelectContent>
</Select>
<Select v-model="cond.operator" class="w-36">
<SelectTrigger class="h-8 text-xs">
<SelectValue placeholder="Operator" />
</SelectTrigger>
<SelectContent>
<SelectItem
v-for="op in operatorsForField(cond.field)"
:key="op.key"
:value="op.key"
class="text-xs"
>
{{ op.label }}
</SelectItem>
</SelectContent>
</Select>
<template
v-if="
conditionFields.find((f) => f.key === cond.field)?.type ===
'boolean'
"
>
<Select v-model="cond.value" class="w-24">
<SelectTrigger class="h-8 text-xs">
<SelectValue placeholder="Vrednost" />
</SelectTrigger>
<SelectContent>
<SelectItem value="1" class="text-xs">Da</SelectItem>
<SelectItem value="0" class="text-xs">Ne</SelectItem>
</SelectContent>
</Select>
</template>
<template v-else>
<Input
v-model="cond.value"
class="h-8 text-xs w-28"
placeholder="Vrednost"
/>
</template>
<Button
type="button"
variant="ghost"
size="icon"
class="h-7 w-7 text-red-500 hover:text-red-700"
@click="removeCondition(ev, cidx)"
>
<X class="w-3 h-3" />
</Button>
</div>
</div>
</div>
<div>
<Button
@@ -1015,7 +1279,7 @@ const destroyDecision = () => {
</div>
</div>
<DialogFooter>
<Button variant="outline" @click="closeCreateDrawer">Cancel</Button>
<Button variant="outline" @click="closeCreateDrawer">Prekliči</Button>
<Button @click="store" :disabled="createForm.processing || !eventsValidCreate"
>Dodaj</Button
>
@@ -1026,15 +1290,15 @@ const destroyDecision = () => {
<AlertDialog v-model:open="showDelete">
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Delete decision</AlertDialogTitle>
<AlertDialogTitle>Zbriši odločitev</AlertDialogTitle>
</AlertDialogHeader>
<div class="text-sm text-muted-foreground">
Are you sure you want to delete decision "{{ toDelete?.name }}"? This cannot be
undone.
Ali ste prepričani, da želite zbrisati odločitev "{{ toDelete?.name }}"? Tega
dejanja ni mogoče razveljaviti.
</div>
<AlertDialogFooter>
<Button variant="outline" @click="cancelDelete">Cancel</Button>
<Button variant="destructive" @click="destroyDecision">Delete</Button>
<Button variant="outline" @click="cancelDelete">Prekliči</Button>
<Button variant="destructive" @click="destroyDecision">Zbriši</Button>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>