<script setup>
import AdminAppLayout from "../../../../resources/js/layouts/AdminAppLayout.vue";
import ShadowedBox from "../../../Views/Components/ShadowedBox.vue";
import TabbedPage from "../../../Views/Components/TabbedPage.vue";
import TenantGeneral from "./Partials/TenantGeneral.vue";
import TenantContact from "./Partials/TenantContact.vue";
import TenantPayment from "./Partials/TenantPayment.vue";
import TenantImpress from "./Partials/TenantImpress.vue";
import TenantGdpr from "./Partials/TenantGdpr.vue";
import TenantTaxInfo from "./Partials/TenantTaxInfo.vue";

const props = defineProps({
    tenant: Object,
})

const slug = props.tenant.slug

const tabs = [
    {
        title: 'Allgemeines',
        component: TenantGeneral,
        endpoint: '/api/v1/admin/tenants/' + slug + '/general',
    },
    {
        title: 'Kontaktdaten',
        component: TenantContact,
        endpoint: '/api/v1/admin/tenants/' + slug + '/contact',
    },
    {
        title: 'IBAN-Informationen',
        component: TenantPayment,
        endpoint: '/api/v1/admin/tenants/' + slug + '/payment',
    },
    {
        title: 'Steuerinformationen',
        component: TenantTaxInfo,
        endpoint: '/api/v1/admin/tenants/' + slug + '/tax',
    },
    {
        title: 'Impressum',
        component: TenantImpress,
        endpoint: '/api/v1/admin/tenants/' + slug + '/impress',
    },
    {
        title: 'Datenschutzerklärung',
        component: TenantGdpr,
        endpoint: '/api/v1/admin/tenants/' + slug + '/gdpr',
    },
]
</script>

<template>
    <AdminAppLayout :title="props.tenant.name">
        <shadowed-box style="width: 95%; margin: 20px auto; padding: 20px; overflow-x: hidden;">
            <tabbed-page :tabs="tabs" />
        </shadowed-box>
    </AdminAppLayout>
</template>
