Teren-app/resources/js/Pages/Imports/Partials/ActionsBar.vue
Simon Pocrnjič dea7432deb changes
2025-12-26 22:39:58 +01:00

70 lines
2.0 KiB
Vue

<script setup>
import {
EyeIcon,
ArrowPathIcon,
BeakerIcon,
ArrowDownOnSquareIcon,
} from "@heroicons/vue/24/outline";
import { Button } from '@/Components/ui/button';
import { Badge } from '@/Components/ui/badge';
const props = defineProps({
importId: [Number, String],
isCompleted: Boolean,
processing: Boolean,
savingMappings: Boolean,
canProcess: Boolean,
selectedMappingsCount: Number,
});
const emits = defineEmits(["preview", "save-mappings", "process-import", "simulate"]);
</script>
<template>
<div class="flex flex-wrap gap-2 items-center" v-if="!isCompleted">
<Button
variant="secondary"
@click.prevent="$emit('preview')"
:disabled="!importId"
>
<EyeIcon class="h-4 w-4 mr-2" />
Predogled vrstic
</Button>
<Button
variant="default"
class="bg-orange-600 hover:bg-orange-700"
@click.prevent="$emit('save-mappings')"
:disabled="!importId || processing || savingMappings || isCompleted"
title="Shrani preslikave za ta uvoz"
>
<span
v-if="savingMappings"
class="inline-block h-4 w-4 mr-2 border-2 border-white/70 border-t-transparent rounded-full animate-spin"
></span>
<ArrowPathIcon v-else class="h-4 w-4 mr-2" />
<span>Shrani preslikave</span>
<Badge
v-if="selectedMappingsCount"
variant="secondary"
class="ml-2 text-xs"
>{{ selectedMappingsCount }}</Badge>
</Button>
<Button
variant="default"
class="bg-purple-600 hover:bg-purple-700"
@click.prevent="$emit('process-import')"
:disabled="!canProcess"
>
<BeakerIcon class="h-4 w-4 mr-2" />
{{ processing ? "Obdelava…" : "Obdelaj uvoz" }}
</Button>
<Button
variant="default"
class="bg-blue-600 hover:bg-blue-700"
@click.prevent="$emit('simulate')"
:disabled="!importId || processing"
>
<ArrowDownOnSquareIcon class="h-4 w-4 mr-2" />
Simulacija vnosa
</Button>
</div>
</template>