Changes

2026-01-18 18:21:41 +01:00
parent 28f28be1b8
commit cc4c07717e
33 changed files with 1440 additions and 579 deletions
@@ -0,0 +1,229 @@
+<script setup>
+import { ref, watch } from "vue";
+import { router } from "@inertiajs/vue3";
+import DialogModal from "@/Components/DialogModal.vue";
+import { Button } from "@/Components/ui/button";
+import { Input } from "@/Components/ui/input";
+import { Label } from "@/Components/ui/label";
+import { ScrollArea } from "@/Components/ui/scroll-area";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/Components/ui/select";
+import { Plus, Trash2 } from "lucide-vue-next";
+
+const props = defineProps({
+  show: { type: Boolean, default: false },
+  client_case: { type: Object, required: true },
+  contract: { type: Object, default: null },
+});
+
+const emit = defineEmits(["close"]);
+
+const processing = ref(false);
+const metaEntries = ref([]);
+
+// Extract meta entries from contract
+function extractMetaEntries(contract) {
+  if (!contract?.meta) return [];
+
+  const results = [];
+  const visit = (node, keyName) => {
+    if (node === null || node === undefined) return;
+    if (Array.isArray(node)) {
+      node.forEach((el) => visit(el));
+      return;
+    }
+    if (typeof node === "object") {
+      const hasValue = Object.prototype.hasOwnProperty.call(node, "value");
+      const hasTitle = Object.prototype.hasOwnProperty.call(node, "title");
+      if (hasValue || hasTitle) {
+        const title = (node.title || keyName || "").toString().trim() || keyName || "";
+        results.push({
+          title,
+          value: node.value ?? "",
+          type: node.type || "string",
+        });
+        return;
+      }
+      for (const [k, v] of Object.entries(node)) {
+        visit(v, k);
+      }
+      return;
+    }
+    if (keyName) {
+      results.push({ title: keyName, value: node ?? "", type: "string" });
+    }
+  };
+  visit(contract.meta, undefined);
+  return results;
+}
+
+// Initialize meta entries when dialog opens
+watch(
+  () => props.show,
+  (newVal) => {
+    if (newVal && props.contract) {
+      const entries = extractMetaEntries(props.contract);
+      metaEntries.value =
+        entries.length > 0 ? entries : [{ title: "", value: "", type: "string" }];
+    }
+  }
+);
+
+function addEntry() {
+  metaEntries.value.push({ title: "", value: "", type: "string" });
+}
+
+function removeEntry(index) {
+  metaEntries.value.splice(index, 1);
+  if (metaEntries.value.length === 0) {
+    metaEntries.value.push({ title: "", value: "", type: "string" });
+  }
+}
+
+function close() {
+  emit("close");
+}
+
+function submit() {
+  if (!props.contract?.uuid || processing.value) return;
+
+  // Filter out empty entries and build meta object
+  const validEntries = metaEntries.value.filter((e) => e.title && e.title.trim() !== "");
+
+  const meta = {};
+  validEntries.forEach((entry) => {
+    meta[entry.title] = {
+      title: entry.title,
+      value: entry.value,
+      type: entry.type,
+    };
+  });
+
+  processing.value = true;
+
+  router.patch(
+    route("clientCase.contract.patchMeta", {
+      client_case: props.client_case.uuid,
+      uuid: props.contract.uuid,
+    }),
+    { meta },
+    {
+      preserveScroll: true,
+      only: ["contracts"],
+      onSuccess: () => {
+        close();
+        processing.value = false;
+      },
+      onError: () => {
+        processing.value = false;
+      },
+      onFinish: () => {
+        processing.value = false;
+      },
+    }
+  );
+}
+</script>
+
+<template>
+  <DialogModal :show="show" max-width="3xl" @close="close">
+    <template #title>
+      <h3 class="text-lg font-semibold leading-6 text-foreground">Uredi Meta podatke</h3>
+    </template>
+    <template #description>
+      Posodobi meta podatke za pogodbo {{ contract?.reference }}
+    </template>
+
+    <template #content>
+      <form id="meta-edit-form" @submit.prevent="submit" class="space-y-4">
+        <ScrollArea class="h-[60vh]">
+          <div class="space-y-3 pr-4">
+            <div
+              v-for="(entry, index) in metaEntries"
+              :key="index"
+              class="flex items-start gap-2 p-3 border rounded-lg bg-muted/20"
+            >
+              <div class="flex-1 space-y-3">
+                <div>
+                  <Label :for="`meta-title-${index}`">Naziv</Label>
+                  <Input
+                    :id="`meta-title-${index}`"
+                    v-model="entry.title"
+                    placeholder="Vnesi naziv..."
+                    class="mt-1"
+                  />
+                </div>
+
+                <div class="grid grid-cols-2 gap-2">
+                  <div>
+                    <Label :for="`meta-type-${index}`">Tip</Label>
+                    <Select v-model="entry.type">
+                      <SelectTrigger :id="`meta-type-${index}`" class="mt-1">
+                        <SelectValue />
+                      </SelectTrigger>
+                      <SelectContent>
+                        <SelectItem value="string">Tekst</SelectItem>
+                        <SelectItem value="number">Številka</SelectItem>
+                        <SelectItem value="date">Datum</SelectItem>
+                      </SelectContent>
+                    </Select>
+                  </div>
+
+                  <div>
+                    <Label :for="`meta-value-${index}`">Vrednost</Label>
+                    <Input
+                      :id="`meta-value-${index}`"
+                      v-model="entry.value"
+                      :type="
+                        entry.type === 'date'
+                          ? 'date'
+                          : entry.type === 'number'
+                          ? 'number'
+                          : 'text'
+                      "
+                      :step="entry.type === 'number' ? '0.01' : undefined"
+                      placeholder="Vnesi vrednost..."
+                      class="mt-1"
+                    />
+                  </div>
+                </div>
+              </div>
+
+              <Button
+                type="button"
+                variant="ghost"
+                size="icon"
+                @click="removeEntry(index)"
+                :disabled="metaEntries.length === 1"
+                class="mt-6"
+              >
+                <Trash2 class="h-4 w-4 text-destructive" />
+              </Button>
+            </div>
+          </div>
+        </ScrollArea>
+
+        <Button type="button" variant="outline" @click="addEntry" class="w-full">
+          <Plus class="h-4 w-4 mr-2" />
+          Dodaj vnos
+        </Button>
+      </form>
+    </template>
+
+    <template #footer>
+      <div class="flex flex-row gap-2">
+        <Button type="button" variant="ghost" @click="close" :disabled="processing">
+          Prekliči
+        </Button>
+        <Button type="submit" form="meta-edit-form" :disabled="processing">
+          {{ processing ? "Shranjujem..." : "Shrani" }}
+        </Button>
+      </div>
+    </template>
+  </DialogModal>
+</template>
@@ -15,6 +15,7 @@ import CaseObjectCreateDialog from "./CaseObjectCreateDialog.vue";
 import CaseObjectsDialog from "./CaseObjectsDialog.vue";
 import PaymentDialog from "./PaymentDialog.vue";
 import ViewPaymentsDialog from "./ViewPaymentsDialog.vue";
+import ContractMetaEditDialog from "./ContractMetaEditDialog.vue";
 import CreateDialog from "@/Components/Dialogs/CreateDialog.vue";
 import ConfirmationDialog from "@/Components/Dialogs/ConfirmationDialog.vue";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
@@ -33,6 +34,16 @@ import {
 } from "@fortawesome/free-solid-svg-icons";
 import EmptyState from "@/Components/EmptyState.vue";
 import { Button } from "@/Components/ui/button";
+import { Label } from "@/Components/ui/label";
+import { Input } from "@/Components/ui/input";
+import { Textarea } from "@/Components/ui/textarea";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/Components/ui/select";

 const props = defineProps({
  client: { type: Object, default: null },
@@ -433,6 +444,19 @@ const closePaymentsDialog = () => {
  selectedContract.value = null;
 };

+// Meta edit dialog
+const showMetaEditDialog = ref(false);
+
+const openMetaEditDialog = (c) => {
+  selectedContract.value = c;
+  showMetaEditDialog.value = true;
+};
+
+const closeMetaEditDialog = () => {
+  showMetaEditDialog.value = false;
+  selectedContract.value = null;
+};
+
 // Columns configuration
 const columns = computed(() => [
  { key: "reference", label: "Ref.", sortable: false, align: "center" },
@@ -638,6 +662,19 @@ const availableSegmentsCount = computed(() => {
                  <div class="text-gray-500">Ni meta podatkov.</div>
                </template>
              </div>
+              <div v-if="edit && row.active" class="border-t border-gray-200 mt-2 pt-2">
+                <button
+                  type="button"
+                  @click="openMetaEditDialog(row)"
+                  class="w-full flex items-center gap-2 px-3 py-2 text-left text-sm hover:bg-gray-100 rounded transition-colors"
+                >
+                  <FontAwesomeIcon
+                    :icon="faPenToSquare"
+                    class="h-3.5 w-3.5 text-gray-600"
+                  />
+                  <span>Uredi meta podatke</span>
+                </button>
+              </div>
            </DropdownMenuContent>
          </DropdownMenu>

@@ -901,6 +938,13 @@ const availableSegmentsCount = computed(() => {
      :edit="edit"
    />

+    <ContractMetaEditDialog
+      :show="showMetaEditDialog"
+      :client_case="client_case"
+      :contract="selectedContract"
+      @close="closeMetaEditDialog"
+    />
+
    <!-- Generate Document Dialog -->
    <CreateDialog
      :show="showGenerateDialog"
@@ -913,18 +957,18 @@ const availableSegmentsCount = computed(() => {
      @confirm="submitGenerate"
    >
      <div class="space-y-4">
-        <div>
-          <label class="block text-sm font-medium text-gray-700">Predloga</label>
-          <select
-            v-model="selectedTemplateSlug"
-            @change="onTemplateChange"
-            class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500"
-          >
-            <option :value="null">Izberi predlogo...</option>
-            <option v-for="t in templates" :key="t.slug" :value="t.slug">
-              {{ t.name }} (v{{ t.version }})
-            </option>
-          </select>
+        <div class="space-y-2">
+          <Label>Predloga</Label>
+          <Select v-model="selectedTemplateSlug" @update:model-value="onTemplateChange">
+            <SelectTrigger>
+              <SelectValue placeholder="Izberi predlogo..." />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem v-for="t in templates" :key="t.slug" :value="t.slug">
+                {{ t.name }} (v{{ t.version }})
+              </SelectItem>
+            </SelectContent>
+          </Select>
        </div>

        <!-- Custom inputs -->
@@ -932,14 +976,30 @@ const availableSegmentsCount = computed(() => {
          <div class="border-t border-gray-200 pt-4">
            <h3 class="text-sm font-medium text-gray-700 mb-3">Prilagojene vrednosti</h3>
            <div class="space-y-3">
-              <div v-for="token in customTokenList" :key="token">
-                <label class="block text-sm font-medium text-gray-700">
+              <div v-for="token in customTokenList" :key="token" class="space-y-2">
+                <Label>
                  {{ token.replace(/^custom\./, "") }}
-                </label>
-                <input
+                </Label>
+                <Textarea
+                  v-if="templateCustomTypes[token.replace(/^custom\./, '')] === 'text'"
                  v-model="customInputs[token.replace(/^custom\./, '')]"
-                  type="text"
-                  class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500"
+                  rows="3"
+                />
+                <Input
+                  v-else
+                  v-model="customInputs[token.replace(/^custom\./, '')]"
+                  :type="
+                    templateCustomTypes[token.replace(/^custom\./, '')] === 'date'
+                      ? 'date'
+                      : templateCustomTypes[token.replace(/^custom\./, '')] === 'number'
+                      ? 'number'
+                      : 'text'
+                  "
+                  :step="
+                    templateCustomTypes[token.replace(/^custom\./, '')] === 'number'
+                      ? '0.01'
+                      : undefined
+                  "
                />
              </div>
            </div>
@@ -948,26 +1008,30 @@ const availableSegmentsCount = computed(() => {

        <!-- Address overrides -->
        <div class="border-t border-gray-200 pt-4 space-y-3">
-          <h3 class="text-sm font-medium text-gray-700">Naslovi</h3>
-          <div>
-            <label class="block text-sm font-medium text-gray-700">Naslov stranke</label>
-            <select
-              v-model="clientAddressSource"
-              class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500"
-            >
-              <option value="client">Stranka</option>
-              <option value="case_person">Oseba primera</option>
-            </select>
+          <h3 class="text-sm font-medium text-gray-700 mb-2">Naslovi</h3>
+          <div class="space-y-2">
+            <Label>Naslov stranke</Label>
+            <Select v-model="clientAddressSource">
+              <SelectTrigger>
+                <SelectValue />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value="client">Stranka</SelectItem>
+                <SelectItem value="case_person">Oseba primera</SelectItem>
+              </SelectContent>
+            </Select>
          </div>
-          <div>
-            <label class="block text-sm font-medium text-gray-700">Naslov osebe</label>
-            <select
-              v-model="personAddressSource"
-              class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500"
-            >
-              <option value="case_person">Oseba primera</option>
-              <option value="client">Stranka</option>
-            </select>
+          <div class="space-y-2">
+            <Label>Naslov osebe</Label>
+            <Select v-model="personAddressSource">
+              <SelectTrigger>
+                <SelectValue />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value="case_person">Oseba primera</SelectItem>
+                <SelectItem value="client">Stranka</SelectItem>
+              </SelectContent>
+            </Select>
          </div>
        </div>