<script setup>
import { computed } from "vue";
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/Components/ui/card";
import { Label } from "@/Components/ui/label";
import { Checkbox } from "@/Components/ui/checkbox";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/Components/ui/select";
import { Badge } from "@/Components/ui/badge";

const props = defineProps({
  form: { type: Object, required: true },
  entities: { type: Array, default: () => [] },
  actions: { type: Array, default: () => [] },
  decisions: { type: Array, default: () => [] },
});

const hasActivities = computed(() => {
  return Array.isArray(props.entities) && props.entities.includes('activities');
});

const decisionsForActivitiesAction = computed(() => {
  const act = (props.actions || []).find((a) => a.id === props.form.meta.activity_action_id);
  return act?.decisions || [];
});
</script>

<template>
  <Card>
    <CardHeader>
      <CardTitle>Nastavitve načina uvoza</CardTitle>
      <CardDescription>
        Konfiguriraj način uvoza za zgodovino ali plačila
      </CardDescription>
    </CardHeader>
    <CardContent class="space-y-4">
      <div class="flex items-center gap-6">
        <label class="inline-flex items-center gap-2 cursor-pointer">
          <Checkbox
            :checked="form.meta.history_import"
            @update:checked="form.meta.history_import = $event"
          />
          <span class="text-sm font-medium">Uvoz zgodovine</span>
        </label>
        <label class="inline-flex items-center gap-2 cursor-pointer">
          <Checkbox
            :checked="form.meta.payments_import"
            @update:checked="form.meta.payments_import = $event"
          />
          <span class="text-sm font-medium">Uvoz plačil</span>
        </label>
      </div>
      
      <p class="text-xs text-muted-foreground">
        Zgodovina dovoljuje oseba/naslov/telefon/pogodbe/aktivnosti/primeri strank; računi so
        samodejno dodani s pogodbami. Plačila zaklene entitete na Pogodbe → Računi → Plačila.
      </p>

      <div v-if="form.meta.payments_import" class="space-y-2 pt-2">
        <Label for="contract_key">Ključ ujemanja pogodb</Label>
        <Select v-model="form.meta.contract_key_mode">
          <SelectTrigger id="contract_key">
            <SelectValue />
          </SelectTrigger>
          <SelectContent>
            <SelectItem value="reference">
              Referenca (uporabi samo contract.reference za iskanje zapisov)
            </SelectItem>
          </SelectContent>
        </Select>
        <p class="text-xs text-muted-foreground">
          Preslika stolpec CSV na contract.reference za reševanje pogodb za tega naročnika.
        </p>
      </div>

      <!-- Entities locked info for payments mode -->
      <div v-if="form.meta.payments_import" class="p-3 bg-emerald-50 rounded-lg border border-emerald-200">
        <div class="text-sm text-emerald-900 mb-2 font-medium">Entitete so zaklenjene:</div>
        <div class="flex flex-wrap gap-2">
          <Badge variant="secondary" class="bg-emerald-100 text-emerald-800">Pogodbe</Badge>
          <Badge variant="secondary" class="bg-emerald-100 text-emerald-800">Računi</Badge>
          <Badge variant="secondary" class="bg-emerald-100 text-emerald-800">Plačila</Badge>
        </div>
      </div>

      <!-- Activities Settings -->
      <div v-if="hasActivities" class="space-y-4 pt-4 border-t">
        <div class="text-sm font-medium">Nastavitve aktivnosti</div>
        <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
          <div class="space-y-2">
            <Label for="activity_action">Dejanje za aktivnosti</Label>
            <Select v-model="form.meta.activity_action_id">
              <SelectTrigger id="activity_action">
                <SelectValue placeholder="Izberi dejanje" />
              </SelectTrigger>
              <SelectContent>
                <SelectItem :value="null">(brez)</SelectItem>
                <SelectItem v-for="a in actions || []" :key="a.id" :value="a.id">
                  {{ a.name }}
                </SelectItem>
              </SelectContent>
            </Select>
          </div>
          <div class="space-y-2">
            <Label for="activity_decision">Odločitev za aktivnosti</Label>
            <Select v-model="form.meta.activity_decision_id" :disabled="!form.meta.activity_action_id">
              <SelectTrigger id="activity_decision">
                <SelectValue placeholder="Izberi odločitev" />
              </SelectTrigger>
              <SelectContent>
                <SelectItem :value="null">(brez)</SelectItem>
                <SelectItem v-for="d in decisionsForActivitiesAction" :key="d.id" :value="d.id">
                  {{ d.name }}
                </SelectItem>
              </SelectContent>
            </Select>
            <p v-if="!form.meta.activity_action_id" class="text-xs text-muted-foreground">
              Najprej izberi dejanje, nato odločitev.
            </p>
          </div>
        </div>
        <p class="text-xs text-muted-foreground">
          Te nastavitve se uporabljajo za aktivnosti, ki so uvožene iz CSV (npr. opombe, zgodovinske aktivnosti).
        </p>
      </div>
    </CardContent>
  </Card>
</template>
