56 lines
1.7 KiB
Vue
56 lines
1.7 KiB
Vue
|
<template>
|
||
|
|
<div class="flex flex-col border border-gray-300 rounded-md">
|
||
|
|
<div class="flex flex-row gap-2 border-b border-gray-300 p-2">
|
||
|
|
<div class="p-1 border border-gray-400 bg-gray-100 rounded-md" title="Abfrage starten">
|
||
|
|
<PlayIcon class="text-gray-500 h-6 w-6 cursor-pointer" />
|
||
|
|
</div>
|
||
|
|
<div class="p-1 border border-gray-400 bg-gray-100 rounded-md" title="Abfrage speichern">
|
||
|
|
<InboxArrowDownIcon class="text-gray-500 h-6 w-6 cursor-pointer" />
|
||
|
|
</div>
|
||
|
|
<div class="p-1 border border-gray-400 bg-gray-100 rounded-md" title="Ergebnisse leeren">
|
||
|
|
<NoSymbolIcon class="text-gray-500 h-6 w-6 cursor-pointer" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="p-2 h-44 md:h-56 overflow-y-scroll">
|
||
|
|
{{ tableMetas }}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
import { defineComponent, type PropType } from "vue";
|
||
|
|
import { mapActions, mapState } from "pinia";
|
||
|
|
import type { DynamicQueryStructure } from "../../types/dynamicQueries";
|
||
|
|
import { InboxArrowDownIcon, NoSymbolIcon, PlayIcon } from "@heroicons/vue/24/outline";
|
||
|
|
import { useQueryBuilderStore } from "../../stores/admin/queryBuilder";
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<script lang="ts">
|
||
|
|
export default defineComponent({
|
||
|
|
props: {
|
||
|
|
query: {
|
||
|
|
type: Object as PropType<DynamicQueryStructure>,
|
||
|
|
default: {
|
||
|
|
select: "*",
|
||
|
|
table: "",
|
||
|
|
where: [],
|
||
|
|
join: [],
|
||
|
|
orderBy: [],
|
||
|
|
},
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {};
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
...mapState(useQueryBuilderStore, ["tableMetas", "loading"]),
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.fetchTableMetas();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
...mapActions(useQueryBuilderStore, ["fetchTableMetas"]),
|
||
|
|
},
|
||
|
|
});
|
||
|
|
</script>
|