aspirecloud/resources/js/Components/FormSection.vue
Enrique Chavez 135c6802a6 User Management and API Keys (#84)
* feat: Changes required on existing files to setup Jetstream

* feat: add the Inertia Home and Dashboard

* feat: Add all required files and migrations to setup Jetstream

* feat: Add the Sanctum middleware to the API endpoints

- Added Sanctum to the API endpoints to requiere an API Key
- Added a setting to control if the app should use authenticated API or not (see .env.example)
- Fix redirection on API routes to the login page when a request was unauthenticated

* feat: Users Management and Authication API Keys

- Refactor existing tests to make authenticated request is enable
- Hide the permissions setting on the UI, for now we only have a read-only API
- Add tests to test authenticated and unauthenticated calls
2024-11-01 18:30:03 -06:00

38 lines
1.2 KiB
Vue

<script setup>
import { computed, useSlots } from 'vue';
import SectionTitle from './SectionTitle.vue';
defineEmits(['submitted']);
const hasActions = computed(() => !! useSlots().actions);
</script>
<template>
<div class="md:grid md:grid-cols-3 md:gap-6">
<SectionTitle>
<template #title>
<slot name="title" />
</template>
<template #description>
<slot name="description" />
</template>
</SectionTitle>
<div class="mt-5 md:mt-0 md:col-span-2">
<form @submit.prevent="$emit('submitted')">
<div
class="px-4 py-5 bg-white dark:bg-gray-800 sm:p-6 shadow"
:class="hasActions ? 'sm:rounded-tl-md sm:rounded-tr-md' : 'sm:rounded-md'"
>
<div class="grid grid-cols-6 gap-6">
<slot name="form" />
</div>
</div>
<div v-if="hasActions" class="flex items-center justify-end px-4 py-3 bg-gray-50 dark:bg-gray-800 text-end sm:px-6 shadow sm:rounded-bl-md sm:rounded-br-md">
<slot name="actions" />
</div>
</form>
</div>
</div>
</template>