45 lines
1.2 KiB
Vue
45 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import { router } from '@inertiajs/vue3';
|
|
import { ref } from 'vue';
|
|
import Button from '@/components/ui/Button.vue';
|
|
import { useTranslations } from '@/composables/useVanguard';
|
|
|
|
const props = defineProps<{
|
|
title: string;
|
|
description: string;
|
|
enabled: boolean;
|
|
enableUrl: string;
|
|
disableUrl: string;
|
|
}>();
|
|
|
|
const { __ } = useTranslations();
|
|
const processing = ref(false);
|
|
|
|
function toggle() {
|
|
processing.value = true;
|
|
|
|
router.post(
|
|
props.enabled ? props.disableUrl : props.enableUrl,
|
|
{},
|
|
{ preserveScroll: true, onFinish: () => (processing.value = false) },
|
|
);
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="rounded-lg border border-slate-200 bg-white p-6 shadow-sm">
|
|
<h5 class="mb-1 text-base font-medium text-slate-800">{{ title }}</h5>
|
|
|
|
<small class="mb-4 block text-slate-500">{{ description }}</small>
|
|
|
|
<slot name="notice">
|
|
<Button
|
|
:label="enabled ? __('Disable') : __('Enable')"
|
|
:severity="enabled ? 'danger' : 'primary'"
|
|
:loading="processing"
|
|
@click="toggle"
|
|
/>
|
|
</slot>
|
|
</div>
|
|
</template>
|