<template>
  <SidebarLayout>
    <template #sidebar>
      <SidebarTemplate mainTitle="Mein Account" topTitle="Mitgliederverwaltung" :showTopList="true">
        <template #topList>
          <RoutingLink title="Administration" :link="{ name: 'account' }" :active="activeRouteName == 'account'" />
        </template>
        <template #list>
          <RoutingLink title="Mein Account" :link="{ name: 'account' }" :active="activeRouteName == 'account'" />
          <RoutingLink title="Anmeldedaten" :link="{ name: 'account' }" :active="activeRouteName == 'account'" />
        </template>
      </SidebarTemplate>
    </template>
    <template #main>
      <RouterView />
    </template>
  </SidebarLayout>
</template>

<script setup lang="ts">
import { defineComponent } from "vue";
import { mapState, mapActions } from "pinia";
import SidebarLayout from "@/layouts/Sidebar.vue";
import SidebarTemplate from "@/templates/Sidebar.vue";
import RoutingLink from "@/components/admin/RoutingLink.vue";
import { RouterView } from "vue-router";
</script>

<script lang="ts">
export default defineComponent({
  computed: {
    activeRouteName() {
      return this.$route.name;
    },
  },
});
</script>
