Ehrenamt/ff-admin
2
0
Fork 0
Code Issues 12 Pull requests Projects Releases 25 Packages Wiki Activity Actions

select and query send

Browse source
This commit is contained in:
Julian Krauser 2024-12-16 13:56:06 +01:00
parent b611f689b9
commit 03c0ee58f2
7 changed files with 644 additions and 553 deletions
Download patch file Download diff file Expand all files Collapse all files

31
src/components/queryBuilder/BuilderHost.vue
View file

@ -1,17 +1,36 @@
<template>
<div class="flex flex-col border border-gray-300 rounded-md select-none">
<div class="flex flex-row gap-2 border-b border-gray-300 p-2">
<div class="p-1 border border-gray-400 bg-green-200 rounded-md" title="Abfrage starten">
<div
class="p-1 border border-gray-400 bg-green-200 rounded-md"
title="Abfrage starten"
@click="$emit('query:run')"
>
<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">
<div
class="p-1 border border-gray-400 bg-gray-100 rounded-md"
title="Abfrage speichern"
@click="$emit('query:save')"
>
<InboxArrowDownIcon class="text-gray-500 h-6 w-6 cursor-pointer" />
</div>
<div class="p-1 border border-gray-400 bg-red-200 rounded-md" title="Ergebnisse leeren">
<div
class="p-1 border border-gray-400 bg-gray-100 rounded-md"
title="Ergebnisse exportieren"
@click="$emit('results:export')"
>
<ArchiveBoxArrowDownIcon class="text-gray-500 h-6 w-6 cursor-pointer" />
</div>
<div
class="p-1 border border-gray-400 bg-red-200 rounded-md"
title="Ergebnisse leeren"
@click="$emit('results:clear')"
>
<NoSymbolIcon class="text-gray-500 h-6 w-6 cursor-pointer" />
</div>
</div>
<div class="p-2 h-44 md:h-56 w-full overflow-y-scroll">
<div class="p-2 h-44 md:h-60 w-full overflow-y-scroll">
<Table v-model="value" />
</div>
</div>
@ -21,7 +40,7 @@
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 { ArchiveBoxArrowDownIcon, InboxArrowDownIcon, NoSymbolIcon, PlayIcon } from "@heroicons/vue/24/outline";
import { useQueryBuilderStore } from "../../stores/admin/queryBuilder";
import Table from "./Table.vue";
</script>
@ -40,7 +59,7 @@ export default defineComponent({
},
},
},
emits: ["update:model-value"],
emits: ["update:model-value", "query:run", "query:save", "results:export", "results:clear"],
computed: {
...mapState(useQueryBuilderStore, ["tableMetas", "loading"]),
value: {

32
src/components/queryBuilder/ColumnSelect.vue
View file

@ -4,6 +4,8 @@
<div class="flex flex-row flex-wrap gap-2 items-center">
<p
class="rounded-md shadow-sm relative block w-fit px-3 py-2 border border-gray-300 text-gray-900 rounded-b-md sm:text-sm"
:class="value == '*' ? 'border-gray-600 bg-gray-200' : ''"
@click="value = '*'"
>
*
</p>
@ -11,8 +13,10 @@
v-for="col in activeTable?.columns"
:key="col.column"
class="rounded-md shadow-sm relative block w-fit px-3 py-2 border border-gray-300 text-gray-900 rounded-b-md sm:text-sm"
:class="value.includes(col.column) ? 'border-gray-600 bg-gray-200' : ''"
@click="value = [col.column]"
>
{{ col.column }}:{{ col.type }}
{{ foreignColumns?.includes(col.column) ? "FK:" : "" }} {{ col.column }}:{{ col.type }}
</p>
</div>
</div>
@ -45,6 +49,32 @@ export default defineComponent({
activeTable() {
return this.tableMetas.find((tm) => tm.tableName == this.table);
},
foreignColumns() {
return this.activeTable?.relations.map((r) => r.column);
},
value: {
get() {
return this.modelValue;
},
set(val: "*" | Array<string>) {
let tmp = this.modelValue;
if (val == "*") {
tmp = val;
} else {
if (Array.isArray(tmp)) {
let index = tmp.findIndex((t) => t == val[0]);
if (index == -1) tmp.push(val[0]);
else tmp.splice(index, 1);
} else {
tmp = val;
}
}
if (tmp != "*" && tmp.length == 0) {
tmp = "*";
}
this.$emit("update:model-value", tmp);
},
},
},
});
</script>