58 lines
1.8 KiB
Vue
58 lines
1.8 KiB
Vue
|
<template>
|
||
|
<MainTemplate>
|
||
|
<template #topBar>
|
||
|
<div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
|
||
|
<h1 class="font-bold text-xl h-8">gespeicherte Abfragen</h1>
|
||
|
</div>
|
||
|
</template>
|
||
|
<template #diffMain>
|
||
|
<div class="flex flex-col gap-4 grow pl-7">
|
||
|
<div class="flex flex-col gap-2 grow overflow-y-scroll pr-7">
|
||
|
<QueryStoreListItem v-for="query in queries" :key="query.id" :queryItem="query" />
|
||
|
</div>
|
||
|
<div class="flex flex-row gap-4">
|
||
|
<RouterLink
|
||
|
v-if="can('create', 'settings', 'query_store')"
|
||
|
:to="{ name: 'admin-club-query_builder' }"
|
||
|
button
|
||
|
primary
|
||
|
class="!w-fit"
|
||
|
>
|
||
|
Abfrage erstellen
|
||
|
</RouterLink>
|
||
|
</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
</MainTemplate>
|
||
|
</template>
|
||
|
|
||
|
<script setup lang="ts">
|
||
|
import { defineComponent } from "vue";
|
||
|
import { mapState, mapActions, mapWritableState } from "pinia";
|
||
|
import MainTemplate from "@/templates/Main.vue";
|
||
|
import { useAbilityStore } from "@/stores/ability";
|
||
|
import { useQueryBuilderStore } from "@/stores/admin/queryBuilder";
|
||
|
import { useQueryStoreStore } from "@/stores/admin/queryStore";
|
||
|
import QueryStoreListItem from "@/components/admin/settings/queryStore/QueryStoreListItem.vue";
|
||
|
</script>
|
||
|
|
||
|
<script lang="ts">
|
||
|
export default defineComponent({
|
||
|
computed: {
|
||
|
...mapState(useQueryStoreStore, ["queries"]),
|
||
|
...mapState(useAbilityStore, ["can"]),
|
||
|
...mapWritableState(useQueryBuilderStore, ["query"]),
|
||
|
},
|
||
|
mounted() {
|
||
|
this.fetchQueries();
|
||
|
},
|
||
|
methods: {
|
||
|
...mapActions(useQueryStoreStore, ["fetchQueries"]),
|
||
|
loadCreate() {
|
||
|
this.query = undefined;
|
||
|
this.$router.push({ name: "admin-club-query_builder" });
|
||
|
},
|
||
|
},
|
||
|
});
|
||
|
</script>
|